/* Page-based Write. Legacy one-draft and shared styles stay untouched. */
:root { color-scheme:light; --paper:#f4f0ec; --ink:#111; --write2-notice-gap:0px; color:var(--ink); background:var(--paper); font-family:"neue-haas-grotesk-text",sans-serif; font-weight:400; }
* { box-sizing:border-box; }
body { margin:0; display:grid; grid-template-rows:minmax(min-content,1fr) auto; min-height:100dvh; row-gap:24px; padding-top:max(56px,calc(env(safe-area-inset-top) + 48px)); padding-bottom:max(8px,env(safe-area-inset-bottom)); }
.write2-page .site-home { grid-template-columns:minmax(0,1fr); }
[hidden] { display:none!important; }
button,input,textarea,a { font:inherit; color:inherit; }
button,.write2-actions a { border:0; border-radius:0; background:transparent; text-decoration:none; cursor:pointer; -webkit-tap-highlight-color:transparent; touch-action:manipulation; }
button { min-height:44px; padding:10px; font-weight:400; }
button:disabled { opacity:.3; cursor:default; }
::selection { background:var(--ink); color:var(--paper); }
.write2-area { position:relative; width:min(100%,42rem); min-height:0; margin:0 auto; padding:max(24svh,160px) 24px 24px; }
.write2-prompt { position:absolute; top:24px; left:24px; right:24px; margin:0; font-size:22px; font-weight:400; line-height:1.45; text-align:center; overflow-wrap:break-word; opacity:1; transition:opacity 450ms ease; }
.write2-prompt[data-fading] { opacity:0; }
.write2-surface { position:relative; min-height:44svh; }
.write2-editor { display:block; width:100%; min-height:44svh; margin:0; padding:0; border:0; outline:0; resize:none; overflow:hidden; background:transparent; font-size:18px; line-height:1.65; border-radius:0; }
.write2-empty { display:block; width:100%; min-height:44svh; padding:0; }
.write2-hint-text { position:absolute; top:0; left:0; width:100%; font-size:18px; line-height:1.65; white-space:pre-wrap; overflow-wrap:break-word; opacity:.35; pointer-events:none; transition:opacity 450ms ease; }
.write2-hint-text[data-fading] { opacity:0; }
.write2-name-control,.write2-switcher { position:absolute; z-index:12; top:max(8px,env(safe-area-inset-top)); min-height:44px; }
.write2-name-control { left:max(16px,env(safe-area-inset-left)); width:clamp(44px,var(--write2-name-width,96px),min(240px,calc(50vw - 64px))); overflow:hidden; }
#writing-name { display:block; width:100%; height:44px; padding:0; border:0; border-radius:0; background:transparent; font-size:12px; font-weight:400; color:var(--ink); opacity:.55; text-overflow:ellipsis; }
#writing-name:focus { opacity:1; }
#writing-name-measure { position:absolute; visibility:hidden; pointer-events:none; white-space:pre; font-size:12px; }
.write2-switcher { right:calc(max(16px,env(safe-area-inset-right)) - 16px); display:flex; align-items:center; width:max-content; }
.write2-switcher button { display:flex; align-items:center; justify-content:center; width:44px; min-width:44px; height:44px; padding:0; opacity:.55; }
.write2-switcher button:disabled { opacity:.2; }
#writing-toggle { width:calc(var(--page-digits,2)*1ch + 2ch + 4px); padding:0 2px; font-size:12px; font-variant-numeric:tabular-nums; }
.write2-switcher svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.3; stroke-linecap:round; stroke-linejoin:round; }
#page-previous svg { transform:translateX(12px); }
#page-next svg { transform:translateX(-12px); }
.write2-switcher button:is(:active,:focus-visible),#writing-toggle[aria-expanded="true"] { opacity:1; }
.write2-panel { position:fixed; z-index:15; max-width:calc(100vw - 24px); max-height:var(--write2-panel-height,70dvh); overflow:auto; overscroll-behavior:contain; padding:6px; background:var(--paper); border:1px solid color-mix(in srgb,var(--ink) 7%,transparent); border-radius:4px; box-shadow:0 4px 24px #11111108; font-size:12px; }
.write2-panel button { display:flex; align-items:center; gap:16px; width:100%; min-height:44px; padding:0 12px; text-align:left; font-size:12px; line-height:1.5; opacity:.6; }
.write2-panel button:is(:active,:focus-visible),.write2-panel button[data-confirm],#writing-toggle:is(:active,:focus-visible) { opacity:1; }
.write2-panel svg,.write2-actions svg { display:block; flex:none; width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.3; stroke-linecap:round; stroke-linejoin:round; pointer-events:none; }
.write2-picker { display:flex; flex-direction:column; top:calc(max(8px,env(safe-area-inset-top)) + 48px); right:max(16px,env(safe-area-inset-right)); width:max-content; overflow:hidden; }
#writing-list { min-height:0; overflow:auto; overscroll-behavior:contain; }
.write2-picker > .write2-new { flex:none; }
.write2-menu { bottom:var(--write2-menu-bottom,64px); left:50%; transform:translateX(-50%); width:212px; max-height:min(var(--write2-panel-height,70dvh),var(--write2-menu-height,70dvh)); }
.write2-collection { width:240px; }
.write2-list button { gap:10px; align-items:baseline; padding-block:10px; }
.write2-list .write2-number { flex:none; width:18px; opacity:.5; font-variant-numeric:tabular-nums; }
.write2-list .write2-name { min-width:0; overflow-wrap:anywhere; }
.write2-list [aria-current="page"] { opacity:1; }
.write2-list .write2-restore { margin-left:auto; font-size:11px; opacity:.45; }
.write2-entry { display:flex; align-items:center; }
.write2-entry > .write2-open { flex:1; min-width:0; width:auto; padding-left:0; }
.write2-entry > .write2-grip { flex:none; width:44px; min-width:44px; height:44px; padding:0; justify-content:center; align-items:center; touch-action:none; cursor:grab; }
.write2-grip svg { width:18px; height:18px; }
.write2-entry > .write2-grip:active { cursor:grabbing; }
.write2-entry[data-dragging] { opacity:.35; }
.write2-entry[data-drop="before"] { box-shadow:0 -1px color-mix(in srgb,var(--ink) 40%,transparent); }
.write2-entry[data-drop="after"] { box-shadow:0 1px color-mix(in srgb,var(--ink) 40%,transparent); }
.write2-entry > .write2-row-action { flex:none; width:44px; min-width:44px; height:44px; padding:0; justify-content:center; align-items:center; opacity:.35; }
.write2-entry > .write2-row-action svg { width:14px; height:14px; }
.write2-group,.write2-picker:has(.write2-list:not(:empty)) .write2-new { border-top:1px solid color-mix(in srgb,var(--ink) 7%,transparent); margin-top:4px; padding-top:4px; }
.write2-picker:has(.write2-list:not(:empty)) .write2-new { min-height:48px; }
.write2-panel .write2-back { gap:8px; border-bottom:1px solid color-mix(in srgb,var(--ink) 7%,transparent); margin-bottom:4px; opacity:.55; }
.write2-collection-row { display:flex; align-items:center; }
.write2-collection-row > #show-deleted { min-width:0; flex:1; }
.write2-collection-row > #show-deleted span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.write2-collection-row > .write2-clear { width:44px; min-width:44px; flex:none; justify-content:center; padding:0; opacity:.4; }
.write2-hint { margin:10px 12px; font-size:12px; line-height:1.6; opacity:.5; }
.write2-storage-note { display:grid; grid-template-columns:minmax(0,1fr) 44px; align-items:start; margin-top:2px; }
.write2-storage-note .write2-hint { margin:8px 0 10px 12px; }
.write2-storage-note > .write2-dismiss { width:44px; min-width:44px; padding:0; justify-content:center; opacity:.4; }
.write2-storage-note > .write2-dismiss:is(:active,:focus-visible) { opacity:1; }
.write2-dismiss svg { width:14px; height:14px; }
.write2-inline { display:flex; align-items:center; flex-wrap:wrap; column-gap:12px; }
.write2-inline button { width:auto; padding-inline:0; }
.write2-actions { display:flex; align-items:center; justify-content:center; width:max-content; max-width:calc(100% - 16px); margin:0 auto; white-space:nowrap; background:var(--paper); font-size:12px; line-height:1.4; }
.write2-actions :is(button,a) { display:inline-flex; align-items:center; justify-content:center; min-width:44px; min-height:44px; padding:10px; font-size:12px; }
#writing-actions-toggle,#shuffle-prompt { width:44px; padding:0; justify-content:center; opacity:.5; }
.write2-prompt-controls { position:relative; display:flex; flex:none; width:44px; height:44px; }
.write2-actions #remove-prompt { position:absolute; top:0; right:100%; display:grid; place-items:center; width:44px; min-width:44px; height:44px; padding:0; opacity:.5; }
#remove-prompt svg { display:block; width:14px; height:14px; transform:translateX(12px); fill:none; stroke:currentColor; stroke-width:1.3; stroke-linecap:round; stroke-linejoin:round; pointer-events:none; }
#remove-prompt:is(:active,:focus-visible) { opacity:1; }
#writing-actions-toggle[aria-expanded="true"] { opacity:1; }
#writing-actions-toggle:disabled,#shuffle-prompt:disabled { opacity:.2; }
:root[data-atmosphere] .write2-actions { background:transparent; }
.write2-feedback,.write2-issue { width:min(40rem,calc(100% - 32px)); margin:8px auto 0; font-size:12px; line-height:1.5; text-align:center; }
.write2-feedback { opacity:.55; }
.write2-issue { padding:0 16px; }
.write2-issue p { margin:0; }
.write2-issue .write2-inline { justify-content:center; }
.write2-issue button { font-size:12px; }
#fresh-dialog { width:420px; max-width:calc(100% - 40px); max-height:calc(100dvh - 48px); padding:24px 24px 12px; font:inherit; border:1px solid color-mix(in srgb,var(--ink) 7%,transparent); background:var(--paper); color:var(--ink); box-shadow:0 8px 40px #11111110; }
#fresh-dialog::backdrop { background:#11111124; }
#fresh-dialog h2 { margin:0 0 16px; font-size:20px; line-height:1.3; font-weight:400; }
#fresh-dialog p { margin:0; font-size:14px; line-height:1.65; }
#fresh-dialog form { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:20px; padding-top:8px; border-top:1px solid color-mix(in srgb,var(--ink) 7%,transparent); }
#fresh-dialog button { padding:0; min-width:44px; opacity:.6; font-size:12px; }
#fresh-dialog button[value="confirm"] { opacity:1; }
#fresh-dialog button:is(:hover,:focus-visible) { opacity:1; }
@media(max-width:480px) { .write2-editor,.write2-hint-text { font-size:16px; } .write2-prompt { font-size:18px; } .write2-actions :is(button,a) { padding-inline:7px; } }
@media(max-height:420px) { .write2-area { padding-top:max(24svh,128px); } .write2-prompt { font-size:18px; } }
@media(hover:hover) { .write2-panel button:not(:disabled):hover,.write2-switcher button:not(:disabled):hover,#writing-actions-toggle:hover,#shuffle-prompt:hover,.write2-storage-note > .write2-dismiss:hover { opacity:1; } }
@media(hover:hover) { #remove-prompt:hover { opacity:1; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none!important; transition:none!important; } }
