/* Article canvas and editing rail. */
.writing-app{min-height:100dvh;background:#f4f6f8}.writing-header{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:18px;padding:14px 24px;background:#fff;border-bottom:1px solid var(--line)}.writing-brand .brand-logo{width:138px;padding:0}.writing-heading{display:flex;flex-direction:column;gap:3px;min-width:100px}.writing-heading strong{font-size:1rem}.writing-heading .save-state{font-size:.875rem}.writing-top-actions{margin-left:auto;display:flex;align-items:center;gap:10px}.writing-history{display:flex;gap:4px;margin-right:8px}.writing-header .history-button{width:44px;min-width:44px;padding:10px;border-color:transparent;background:transparent}.writing-history .btn:disabled{opacity:.35}.writing-header .preview-trigger{min-width:132px}
.writing-layout{display:grid;grid-template-columns:260px minmax(0,1fr);max-width:1600px;margin:auto;align-items:start}.writing-tools{position:sticky;top:var(--editor-header,80px);height:calc(100dvh - var(--editor-header,80px));overflow:auto;padding:24px 20px 40px;background:#fff;border-right:1px solid var(--line)}.writing-tool-head{display:flex;justify-content:space-between;align-items:center;padding-bottom:20px;border-bottom:1px solid var(--line);font-size:1rem}.writing-tool-head .btn{display:none}.writing-tools h2{font-size:.875rem;color:#536473;letter-spacing:.025em;margin:24px 0 10px}.writing-tools .small{font-size:.875rem;line-height:1.85}.writing-tools>.btn{width:100%;justify-content:flex-start;margin:0 0 8px;padding:12px;background:#f6f8fa;border-color:#e0e6eb;font-size:.875rem}.writing-tools>.btn:hover{background:#eaf1f5}.writing-selection{font-size:.875rem;line-height:1.8;min-height:60px}.writing-selection .field{margin-bottom:12px}.writing-selection .btn{font-size:.875rem;padding:8px 11px}.writing-selection .actions{gap:6px}.writing-tool-footer{border-top:1px solid var(--line);margin-top:26px;padding-top:4px}.writing-tool-footer>.btn{white-space:normal;width:100%;justify-content:flex-start;font-size:.875rem;padding:11px 6px}.writing-tool-footer>.actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0}.writing-tool-footer>.actions .btn{padding:8px 5px}.writing-tool-footer p{margin:12px 4px;color:#536473}
.writing-main{min-width:0;padding:36px 44px 100px}.writing-sheet{max-width:948px;margin:0 auto;background:#fff;padding:46px 54px 60px;border:1px solid var(--line);border-radius:10px;box-shadow:0 3px 16px #0a243805}.writing-label{display:block;font-size:.875rem;font-weight:700;color:#536473;margin:0 0 12px}.writing-sheet .editor-title{font-size:1.875rem;line-height:1.55;border:0;padding:0;min-height:50px;resize:none;margin:0;overflow:hidden;border-radius:0;font-weight:700}.writing-sheet .editor-title:focus{outline:0;box-shadow:0 2px #16729a}.writing-sheet>#counter-title{margin-bottom:30px}.writing-section-heading{margin:0 0 18px}.writing-section-heading h2{font-size:1rem;margin:0 0 5px}.writing-section-heading p{font-size:.875rem;color:#536473;margin:0;line-height:1.8}.writing-photos{padding:26px 0 30px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:32px}.writing-photos>.btn{margin-top:10px}.writing-photos>.small{margin:10px 0 0;line-height:1.85}.writing-photos .photo-controls .btn{padding:8px 9px;font-size:.875rem;background:#fff}.writing-body-label{display:grid;gap:6px;margin-bottom:16px;font-size:1rem}.writing-body-label span{font-size:.875rem;color:#536473;line-height:1.8}
.writing-sheet .block{position:relative;padding:44px 0 8px;border:0;border-radius:0;background:#fff;scroll-margin-top:calc(var(--editor-header,80px) + 20px)}.writing-sheet .block.selected{box-shadow:-3px 0 #16729a;outline-offset:6px}.writing-sheet .block textarea{border:0;padding:4px 0;margin:0;min-height:44px;resize:none;overflow:hidden;font-size:1rem;line-height:1.9;border-radius:0}.writing-sheet .block textarea:focus{outline:none}.writing-sheet .block.heading textarea{font-size:1.375rem;font-weight:700;line-height:1.6}.writing-sheet .block.heading{margin-top:10px}.writing-sheet .caption{font-size:.875rem;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:10px 0;min-height:44px}.writing-sheet .block-tools{position:absolute;top:0;left:0;right:0;height:40px;display:flex;gap:6px;align-items:center;margin:0;opacity:1}.writing-sheet .block-tools .label{font-size:.875rem;color:#536473;margin-right:auto}.writing-sheet .block-tools .btn{min-height:36px;min-width:36px;padding:7px;border:0;background:transparent}.writing-sheet .block-check{width:18px;height:18px;min-height:0;margin:0 3px;accent-color:#082c43}.drag-handle{cursor:grab}
.writing-sheet .insert{justify-content:flex-start;min-height:40px;margin:10px 0 2px}.writing-sheet .insert:before{display:none}.writing-sheet .insert:after{background:#e7edf1}.writing-sheet .insert>button{font-size:.875rem;border:1px solid #d9e1e7;background:#fff;margin:0 14px 0 0;padding:6px 12px;color:#435b6d;border-radius:6px;min-height:36px}.writing-sheet .insert-menu{top:40px;left:0}.writing-sheet .insert-menu button{font-size:.875rem;padding:10px;min-height:44px}
.writing-preview{max-width:1100px;margin:auto}.preview-controls{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:10px}.preview-controls h2{font-size:1.5rem;margin:0 0 5px}.preview-controls p{font-size:.875rem;color:#536473;margin:0}.preview-controls .actions{flex-wrap:nowrap}.segmented{display:flex;padding:4px;border:1px solid #c9d5df;background:#eaf0f4;border-radius:8px}.segmented button{font-size:.875rem;min-height:40px;min-width:66px;padding:8px 14px;border:0;border-radius:5px;background:transparent;color:#405565;font-weight:700}.segmented button.active{background:#082c43;color:#fff}.preview-note{font-size:.875rem;color:#536473;margin:14px 0 24px}.writing-preview .preview-paper{position:relative;width:100%;padding:0;background:transparent;border:0;max-height:none;overflow:hidden;border-radius:0}.preview-stage{position:absolute;top:0;transform-origin:top left;box-sizing:border-box;background:#fff;padding:24px;container-type:inline-size;box-shadow:0 2px 12px #0a24380a}.writing-preview .preview-paper.mobile .preview-stage{padding:20px}.writing-preview .preview-paper .article,.writing-preview .preview-paper.mobile .article{max-width:none;padding:0;margin:0;border:0;min-height:0}.writing-preview .preview-paper .article h1{font-size:30px}.writing-preview .preview-paper.mobile .article h1{font-size:24px}.writing-preview .preview-paper.mobile .article h2{font-size:20px}.writing-preview .preview-paper .article p{font-size:16px}.writing-preview .preview-paper.mobile .article .photo-pair{gap:10px}.writing-preview .preview-paper.mobile .article-meta>div{grid-template-columns:1fr;gap:4px}.preview-mode .writing-layout{display:block}.preview-mode .writing-tools{display:none}.preview-mode .writing-main{padding-top:30px}.writing-mobile-bar{display:none}.writing-app [hidden]{display:none!important}
@media(max-width:1100px){.writing-brand{display:none}.writing-header{gap:12px}.writing-main{padding:26px 24px 80px}.writing-sheet{padding:32px}.writing-layout{grid-template-columns:240px minmax(0,1fr)}.writing-tools{padding:22px 16px}.writing-history{margin-right:0}}
@media(max-width:700px){.writing-header{display:grid;grid-template-columns:42px minmax(0,1fr);padding:10px 16px;gap:6px 12px}.writing-heading{flex-direction:row;align-items:center;justify-content:space-between;gap:10px;font-size:.875rem}.writing-heading strong{font-size:1rem}.writing-heading .save-state{font-size:.875rem;text-align:right}.writing-top-actions{grid-column:1/-1;width:100%;margin:0;gap:8px}.writing-history{gap:0;margin-right:auto}.writing-header .history-button{width:40px;min-width:40px;padding:9px}.writing-header .draft-save{font-size:.875rem;padding:8px 10px}.writing-header .preview-trigger{display:inline-flex;min-width:0;font-size:.875rem;padding:8px 12px}.writing-header .writing-top-actions>.primary{display:none}.writing-header .writing-back{padding:8px}.writing-layout{display:block}.writing-main{padding:26px 20px 120px;background:#fff}.writing-sheet{padding:0;border:0;box-shadow:none;border-radius:0}.writing-sheet .editor-title{font-size:1.5rem;line-height:1.65}.writing-sheet .block.heading textarea{font-size:1.25rem}.writing-photos{padding-top:24px;margin-bottom:26px}.writing-photos .photo-pair{gap:12px}.writing-photos .photo-controls .btn{font-size:.875rem;padding:8px 6px;flex:1 1 100%}.writing-photos .photo-controls .btn svg{display:none}.writing-photos>.small{font-size:.875rem}.writing-sheet .block-tools{opacity:1;gap:4px}.writing-sheet .block-tools .btn{min-width:36px;min-height:36px}.writing-sheet .block-tools .label{font-size:.875rem}.writing-sheet .insert-menu{max-width:calc(100vw - 40px)}.writing-sheet .insert-menu button{padding:10px 8px;white-space:nowrap}.writing-tools{display:none;position:fixed;left:0;right:0;top:var(--editor-header,116px);height:auto;max-height:calc(var(--editor-viewport,100dvh) - var(--editor-header,116px) - 82px);padding:20px 22px 26px;z-index:35;border:1px solid var(--line);border-radius:0 0 16px 16px;box-shadow:0 24px 60px #082c4333;overscroll-behavior:contain;background:#fff}.writing-tools.open{display:block}.writing-tool-head{padding-bottom:12px}.writing-tool-head .btn{display:inline-flex}.writing-tools h2{margin-top:20px}.writing-tools>.btn{display:inline-flex;width:calc(33.333% - 5px);flex-direction:column;font-size:.875rem;padding:12px 2px;vertical-align:top;gap:8px}.writing-tool-footer{margin-top:22px}.writing-tools .small{font-size:.875rem}.writing-mobile-bar{position:fixed;bottom:0;left:0;right:0;z-index:40;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;background:#fff;border-top:1px solid var(--line);padding:8px 10px max(8px,env(safe-area-inset-bottom))}.writing-mobile-bar .btn{display:flex;flex-direction:column;gap:4px;font-size:.875rem;padding:6px 2px;min-height:58px;line-height:1.4}.writing-mobile-bar .btn svg{width:20px;height:20px}.writing-mobile-bar [data-action="editor-preview"]{background:#eaf1f5;color:#082c43}.preview-mode .writing-main{background:#f4f6f8;padding:24px 16px 120px}.preview-controls{align-items:flex-start;flex-direction:column;gap:16px}.preview-controls h2{font-size:1.25rem}.preview-controls .actions{width:100%;justify-content:space-between;gap:10px}.preview-controls .btn{font-size:.875rem;padding:10px 12px}.preview-note{font-size:.875rem;line-height:1.8;margin:16px 0 22px}body:has(.writing-app) #toast{bottom:94px}}

/* One article form follows the published order. Examples never become field values. */
.writing-guidance{font-size:.875rem;color:#536473;margin:0 0 26px;line-height:1.8}.writing-hint,.writing-example{font-size:.875rem;line-height:1.8;color:#536473;margin:8px 0 12px;overflow-wrap:anywhere}.writing-example{color:#405565}.writing-sheet>.writing-example{margin-bottom:30px}.writing-sheet>.writing-label{margin-bottom:6px}.writing-sheet>#counter-title{margin-bottom:0}.writing-meta{border-bottom:1px solid var(--line);padding-bottom:24px;margin-bottom:30px}.writing-meta .field{margin-bottom:20px}.writing-meta .field:last-child{margin-bottom:0}.writing-meta textarea{resize:none;overflow:hidden;min-height:88px}.writing-meta .form-grid{grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:20px}.writing-meta input,.writing-meta textarea,.writing-meta select{scroll-margin-top:calc(var(--editor-header,80px) + 24px)}
@media(max-width:700px){.writing-meta .form-grid{grid-template-columns:1fr;gap:0}.writing-meta .form-grid .field{margin-bottom:20px}.writing-guidance{margin-bottom:22px}.writing-meta{padding-bottom:20px;margin-bottom:26px}}
.writing-meta .field{align-content:start}.writing-nowrap{white-space:nowrap}

.writing-block-example{margin:12px 0 8px;padding:14px 16px;border-left:3px solid #a6b9c7;background:#f4f7f9;color:#405565;font-size:.875rem;line-height:1.85}.writing-block-example strong{display:block;margin-bottom:6px;font-size:inherit}.writing-block-example p{font-size:inherit;margin:0;line-height:inherit;line-break:strict;overflow-wrap:anywhere}

/* Writing comes first; controls remain available in explicit menus. */
.writing-layout{display:block}.writing-tools{display:none;position:fixed;top:calc(var(--editor-header,80px) + 12px);right:24px;left:auto;width:340px;max-width:calc(100vw - 32px);height:auto;max-height:calc(var(--editor-viewport,100dvh) - var(--editor-header,80px) - 28px);z-index:35;border:1px solid var(--line);border-radius:12px;box-shadow:0 16px 50px #082c4333}.writing-tools.open{display:block}.writing-tool-head .btn{display:inline-flex}.writing-main{padding-top:28px}.writing-sheet .writing-label,.writing-input-label{color:#172b3a;font-weight:700;font-size:1rem}.writing-sheet .editor-title,.writing-sheet .block textarea{border:1px solid #8296a5;border-radius:8px;background:#fff;padding:12px 14px}.writing-sheet .editor-title{font-size:1.375rem;min-height:64px}.writing-sheet .block textarea{min-height:150px}.writing-sheet .block.heading textarea{font-size:1.125rem;min-height:56px}.writing-sheet .editor-title:focus,.writing-sheet .block textarea:focus{outline:2px solid #16729a;outline-offset:1px;box-shadow:none}.writing-sheet textarea::placeholder{color:#586a79;opacity:1}.writing-sheet .block{padding:0;margin:0 0 26px}.writing-sheet .block.heading{margin-top:32px;margin-bottom:18px}.writing-sheet .block.selected{box-shadow:none}.writing-field-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}.writing-input-label{margin:0}.block-options{position:relative;font-size:.875rem}.block-options>summary{list-style:none;cursor:pointer;padding:6px 10px;color:#405565;border-radius:6px;line-height:1.5}.block-options>summary::-webkit-details-marker{display:none}.block-options>summary:hover,.block-options>summary:focus-visible,.block-options[open]>summary{background:#eaf1f5;outline:1px solid #8296a5}.block-options-panel{position:absolute;right:0;top:100%;width:256px;max-width:calc(100vw - 40px);padding:12px;background:#fff;border:1px solid #c9d5df;box-shadow:0 8px 22px #082c4320;border-radius:8px;z-index:12}.writing-sheet .block-tools{position:static;height:auto;display:flex;gap:4px}.block-select{display:flex;align-items:center;gap:4px;font-size:.875rem;margin-right:auto;white-space:nowrap}.writing-sheet .block-check{width:18px;min-width:18px}.writing-sheet .block-options .insert{margin:8px 0 0;min-height:36px}.writing-sheet .block-options .insert:after{display:none}.writing-sheet .block-options .insert>button{width:100%;margin:0}.writing-sheet .block-options .insert-menu{left:auto;right:0;top:100%;min-width:210px}.writing-block-example{border-left:0;border-radius:8px;margin:12px 0 0}.writing-sheet .caption{border:1px solid #8296a5;border-radius:8px;padding:10px 12px}.writing-sheet>#blocks>.insert{margin-top:14px}.writing-menu-trigger{font-size:.875rem}
@media(max-width:700px){.writing-header .writing-menu-trigger{display:none}.writing-tools{left:16px;right:16px;top:calc(var(--editor-header,116px) + 8px);width:auto;max-width:none;max-height:calc(var(--editor-viewport,100dvh) - var(--editor-header,116px) - 100px)}.writing-main{padding-top:24px}.writing-sheet .editor-title{font-size:1.25rem}.writing-sheet .block textarea{min-height:170px}.writing-sheet .block.heading textarea{font-size:1rem;min-height:52px}.writing-sheet .block.heading{margin-top:28px}.writing-field-head{gap:8px}}
.writing-field-head{align-items:flex-start}.writing-input-label{padding-top:6px}.block-options>summary{text-align:right}.block-options-panel{position:relative;top:auto;right:auto;margin-top:6px}.block-options[open]{max-width:calc(100% - 44px)}.block-options-panel{max-width:100%}

/* Each existing heading and its content form one writing area. No article data is rebuilt. */
.writing-structure-toggle{margin:0 0 20px;padding:8px 0;font-size:.875rem;color:#405565;text-decoration:underline;text-underline-offset:4px;white-space:normal}
.writing-section{border:1px solid #c9d5df;border-radius:12px;padding:24px;margin:0 0 24px;background:#f8fafb;scroll-margin-top:calc(var(--editor-header,80px) + 20px)}
.writing-section-title{font-size:1.25rem;line-height:1.6;margin:0 0 18px;color:#172b3a;overflow-wrap:anywhere}.writing-section-title label{cursor:text;display:block}
.writing-section .block{background:transparent;margin:0 0 18px}.writing-section .block:last-of-type{margin-bottom:0}.writing-section-add{margin-top:18px;display:flex;gap:10px;flex-wrap:wrap}.writing-section-add>.btn{font-size:.875rem;background:#fff;padding:10px 14px;white-space:normal;text-align:left}.writing-section .writing-block-example{background:#edf2f5}
.writing-app:not(.structure-edit) .block.heading,.writing-app:not(.structure-edit) .writing-field-head{display:none}.writing-app:not(.structure-edit) .block{outline:none}
.structure-edit .writing-section-title,.structure-edit .writing-section-add{display:none}.structure-edit .writing-section .block.heading{margin-top:0}.structure-edit .writing-section{background:#fff}
@media(max-width:700px){.writing-section{padding:18px 14px;margin-bottom:24px}.writing-section-title{font-size:1.125rem;margin-bottom:14px}.writing-section .block textarea{padding:12px;min-height:170px}.writing-section .writing-block-example{padding:12px}.writing-section-add>.btn{width:100%;justify-content:center}.writing-header .writing-menu-trigger{display:inline-flex;padding:8px 12px;margin-right:auto}.writing-header .preview-trigger{display:none}.writing-mobile-bar{grid-template-columns:repeat(2,minmax(0,1fr))}.writing-mobile-bar .btn{flex-direction:row;gap:8px;min-height:44px}.writing-tools{max-height:calc(var(--editor-viewport,100dvh) - var(--editor-header,116px) - 85px)}.writing-app.structure-edit .writing-header .writing-menu-trigger{margin-right:0}.writing-app.structure-edit .writing-history{margin-right:auto}.writing-app.structure-edit .writing-top-actions{gap:4px}.writing-app.structure-edit .writing-header .writing-menu-trigger{padding:8px}
}
/* Keep deletion and recovery available while the structural controls are collapsed. */
.writing-header .history-button{width:auto;min-width:0;gap:6px;padding:8px 10px;white-space:nowrap}.writing-history{flex-shrink:0}.writing-top-actions{flex-wrap:wrap}.writing-sheet .body-image-delete{background:#fff;color:var(--red);border-color:#c9989b}.remove-photo-preview{display:block;width:100%;max-height:180px;object-fit:contain;margin:18px 0 10px;background:#f4f6f8}.remove-photo-caption{overflow-wrap:anywhere}.writing-sheet .photo-controls .body-image-delete{white-space:nowrap}
@media(max-width:700px){.writing-header .history-button{padding:8px 6px;font-size:.875rem}.writing-header .history-button svg{display:none}.writing-history{gap:0;margin-right:0}.writing-header .writing-menu-trigger{padding:8px;margin-right:0;margin-left:auto}.writing-top-actions{gap:4px}.writing-sheet .body-image-delete{min-height:44px}}

/* The same two-column choice is used in the editor, preview and published article. */
.body-image-group{margin:0 0 20px;min-width:0}
.image-layout-controls{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 0 16px;font-size:.875rem;color:#405565}
.image-layout-switch{display:flex;gap:6px}.image-layout-switch .btn{min-height:44px;padding:8px 16px;font-size:.875rem;background:#fff}.image-layout-switch .btn.active{background:#082c43;border-color:#082c43;color:#fff}
.image-layout-help{margin:0 0 16px;color:#405565;font-size:.875rem;line-height:1.8}
.body-image-group.is-horizontal>.body-image-items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:start}
.body-image-items>.block{min-width:0}.body-image-group.is-horizontal .body-photo{border-radius:4px}.body-image-group.is-horizontal .caption{width:100%;min-width:0}
.article .article-image-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:start;margin:28px 0}
.article .article-image-grid>figure{min-width:0;margin:0}.article .article-image-grid figcaption{overflow-wrap:anywhere;line-break:strict}
/* Horizontal photos use the approved crop frame without changing saved photo data. */
.body-image-group.is-horizontal .body-photo:not(.cropped),.article-image-grid .body-photo:not(.cropped){aspect-ratio:1.45;overflow:hidden}
.body-image-group.is-horizontal .body-photo:not(.cropped)>img,.article-image-grid .body-photo:not(.cropped)>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.article-caption-word{display:inline-block;max-width:100%;vertical-align:top;overflow-wrap:anywhere}
.structure-edit .body-image-group.is-horizontal>.body-image-items{display:block}
@media(max-width:700px){.body-image-group.is-horizontal>.body-image-items,.article .article-image-grid{gap:12px}.image-layout-controls{gap:10px}.body-image-group.is-horizontal .photo-controls{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}.body-image-group.is-horizontal .photo-controls>.btn{width:100%;min-width:0;min-height:44px;padding:8px 4px;font-size:.875rem;white-space:nowrap}.body-image-group.is-horizontal .photo-controls>.btn svg{display:none}.body-image-group.is-horizontal .caption{padding:10px 8px}.structure-edit .body-image-group.is-horizontal .photo-controls{display:flex;flex-wrap:wrap}.structure-edit .body-image-group.is-horizontal .photo-controls>.btn{width:auto;padding:8px 12px}}

/* Field instructions remain visible while writing; phrases wrap as readable units. */
.writing-field-guide{font-size:.875rem;line-height:1.8;color:#405565;margin:0 0 12px}.writing-field-guide[hidden]{display:none}.writing-hint,.writing-field-guide,.writing-body-label>span,.writing-example{line-break:strict;overflow-wrap:normal}.template-fields{padding-left:20px}.template-fields .btn{text-align:left;white-space:normal;line-height:1.8;text-decoration:underline;text-underline-offset:3px}