:root{--hue:60;--hue-accent:32;--bg:oklch(.985 .006 var(--hue));--bg-sunk:oklch(.965 .007 var(--hue));--surface:oklch(.99 .005 var(--hue));--border:oklch(.905 .009 var(--hue));--border-strong:oklch(.82 .011 var(--hue));--ink:oklch(.22 .012 var(--hue));--ink-2:oklch(.42 .01 var(--hue));--ink-3:oklch(.6 .008 var(--hue));--accent:oklch(.55 .16 var(--hue-accent));--accent-soft:oklch(.55 .16 var(--hue-accent) / .12);--accent-ink:oklch(.42 .14 var(--hue-accent));--focus:oklch(.62 .18 var(--hue-accent) / .45);--shadow-sm:0 1px 2px oklch(.22 .012 var(--hue) / .05);--shadow-md:0 6px 24px -10px oklch(.22 .012 var(--hue) / .18);--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.5rem;--space-6:2rem;--space-7:3rem;--space-8:4.5rem;--radius-sm:6px;--radius-md:10px;--radius-lg:14px;--measure:68ch;--font-ui:-apple-system, BlinkMacSystemFont, "Inter", "Segoe UI", system-ui, sans-serif;--font-serif:"Iowan Old Style", "Charter", "Source Serif 4", "Source Serif Pro", "Cambria", Georgia, serif;--font-mono:ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;--transition-fast:.12s cubic-bezier(.2, 0, 0, 1);--transition-med:.22s cubic-bezier(.2, 0, 0, 1)}[data-theme=dark]{--bg:oklch(.185 .009 var(--hue));--bg-sunk:oklch(.155 .008 var(--hue));--surface:oklch(.22 .01 var(--hue));--border:oklch(.3 .011 var(--hue));--border-strong:oklch(.42 .012 var(--hue));--ink:oklch(.93 .006 var(--hue));--ink-2:oklch(.74 .008 var(--hue));--ink-3:oklch(.55 .01 var(--hue));--accent:oklch(.74 .14 var(--hue-accent));--accent-soft:oklch(.74 .14 var(--hue-accent) / .16);--accent-ink:oklch(.82 .14 var(--hue-accent));--focus:oklch(.74 .16 var(--hue-accent) / .5);--shadow-sm:0 1px 2px oklch(0% 0 0/.35);--shadow-md:0 8px 28px -12px oklch(0% 0 0/.55)}*,:before,:after{box-sizing:border-box}html,body,#root{height:100%}html{-webkit-text-size-adjust:100%}body{background:var(--bg);color:var(--ink);font-family:var(--font-ui);font-kerning:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;transition:background var(--transition-med), color var(--transition-med);margin:0;font-size:16px;line-height:1.5}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0;padding:0}textarea,input{font:inherit;color:inherit}::selection{background:var(--accent-soft);color:var(--accent-ink)}:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:4px}*{scrollbar-width:thin;scrollbar-color:var(--border-strong) transparent}.app{background:var(--bg);flex-direction:column;min-height:100%;display:flex}.header{z-index:10;align-items:center;gap:var(--space-4);padding:var(--space-3) var(--space-5);background:color-mix(in oklch, var(--bg) 88%, transparent);-webkit-backdrop-filter:saturate(140%)blur(10px);border-bottom:1px solid var(--border);grid-template-columns:1fr auto 1fr;display:grid;position:sticky;top:0}.brand{align-items:center;gap:var(--space-2);color:var(--ink-2);letter-spacing:.01em;display:flex}.brand-mark{width:22px;height:22px;font-family:var(--font-serif);color:var(--accent-ink);letter-spacing:-.03em;place-items:center;margin-right:2px;font-size:1.05rem;font-style:italic;font-weight:600;display:grid}.brand-name{color:var(--ink-2);font-size:.875rem;font-weight:500}.brand-name em{color:var(--ink-3);font-style:normal;font-weight:400}.segmented{background:var(--bg-sunk);border:1px solid var(--border);border-radius:999px;padding:3px;display:inline-flex;position:relative}.segmented button{z-index:1;letter-spacing:.005em;color:var(--ink-2);transition:color var(--transition-fast);white-space:nowrap;border-radius:999px;align-items:center;gap:.4em;padding:.4rem .95rem;font-size:.8125rem;font-weight:500;display:inline-flex;position:relative}.segmented button svg{stroke-width:2px;opacity:.7;width:14px;height:14px}.segmented button[data-active=true],.segmented button:hover:not([data-active=true]){color:var(--ink)}.segmented .thumb{z-index:0;background:var(--surface);box-shadow:var(--shadow-sm), 0 0 0 1px var(--border) inset;transition:transform var(--transition-med), width var(--transition-med);pointer-events:none;border-radius:999px;position:absolute;top:3px;bottom:3px}.actions{justify-self:end;align-items:center;gap:var(--space-1);display:flex}.icon-btn{border-radius:var(--radius-sm);width:36px;height:36px;color:var(--ink-2);transition:background var(--transition-fast), color var(--transition-fast);place-items:center;display:inline-grid}.icon-btn:hover{background:var(--bg-sunk);color:var(--ink)}.icon-btn:disabled{color:var(--ink-3);cursor:not-allowed;background:0 0}.icon-btn svg{stroke-width:1.75px;width:18px;height:18px}.composer{padding:var(--space-5) var(--space-5) 0;justify-content:center;display:flex}.composer-inner{width:100%;max-width:calc(var(--measure) + 4rem);gap:var(--space-3);flex-direction:column;display:flex}.composer-label{letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);justify-content:space-between;align-items:baseline;font-size:.75rem;font-weight:500;display:flex}.composer-label .filename{color:var(--ink-2);text-transform:none;letter-spacing:0;font-family:var(--font-mono);font-size:.8125rem}.textarea{width:100%;min-height:160px;max-height:50vh;padding:var(--space-4) var(--space-5);background:var(--surface);color:var(--ink);border:1px solid var(--border);border-radius:var(--radius-md);font-family:var(--font-mono);resize:vertical;transition:border-color var(--transition-fast), box-shadow var(--transition-fast);font-size:.875rem;line-height:1.6}.textarea::placeholder{color:var(--ink-3);font-family:var(--font-serif);font-size:.95rem;font-style:italic}.textarea:focus{border-color:var(--border-strong);box-shadow:0 0 0 4px var(--accent-soft);outline:none}.file-drop{border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--space-7) var(--space-5);background:var(--bg-sunk);text-align:center;transition:background var(--transition-fast), border-color var(--transition-fast)}.file-drop[data-drag=true]{background:var(--accent-soft);border-color:var(--accent)}.file-drop-title{font-family:var(--font-serif);color:var(--ink);margin:0 0 var(--space-2);font-size:1.15rem}.file-drop-sub{color:var(--ink-3);margin:0 0 var(--space-4);font-size:.875rem}.file-button{background:var(--ink);color:var(--bg);border-radius:var(--radius-sm);white-space:nowrap;transition:transform var(--transition-fast), filter var(--transition-fast);align-items:center;gap:.5rem;padding:.6rem 1.1rem;font-size:.875rem;font-weight:500;display:inline-flex}.file-button svg{stroke-width:2px;width:14px;height:14px}.file-button:hover{filter:brightness(1.05)}.file-button:active{transform:translateY(1px)}.drop-overlay{pointer-events:none;z-index:50;background:var(--accent-soft);opacity:0;transition:opacity var(--transition-fast);border:2px solid var(--accent);place-items:center;display:grid;position:fixed;inset:0}.drop-overlay[data-active=true]{opacity:1}.drop-overlay-text{font-family:var(--font-serif);color:var(--accent-ink);padding:var(--space-4) var(--space-6);background:var(--bg);border-radius:var(--radius-md);box-shadow:var(--shadow-md);font-size:1.4rem}.divider{align-items:center;gap:var(--space-3);padding:var(--space-6) var(--space-5) var(--space-4);max-width:calc(var(--measure) + 4rem);width:100%;color:var(--ink-3);letter-spacing:.14em;text-transform:uppercase;margin:0 auto;font-size:.7rem;display:flex}.divider:before,.divider:after{content:"";background:var(--border);flex:1;height:1px}.divider-mark{font-family:var(--font-serif);text-transform:lowercase;letter-spacing:0;color:var(--ink-2);font-size:.85rem;font-style:italic}.viewer{padding:var(--space-4) var(--space-5) var(--space-8);flex:1;justify-content:center;display:flex}.viewer-empty{max-width:var(--measure);width:100%;padding:var(--space-7) var(--space-4);text-align:center;color:var(--ink-3)}.viewer-empty p{font-family:var(--font-serif);margin:0 0 var(--space-3);font-size:1.05rem;font-style:italic}.viewer-empty button{color:var(--accent-ink);text-underline-offset:3px;text-decoration:underline;-webkit-text-decoration-color:var(--accent-soft);text-decoration-color:var(--accent-soft);font-size:.875rem}.viewer-empty button:hover{-webkit-text-decoration-color:var(--accent);text-decoration-color:var(--accent)}.toast{bottom:var(--space-5);background:var(--ink);color:var(--bg);opacity:0;transition:opacity var(--transition-med), transform var(--transition-med);pointer-events:none;z-index:100;box-shadow:var(--shadow-md);border-radius:999px;padding:.55rem .95rem;font-size:.8125rem;font-weight:500;position:fixed;left:50%;transform:translate(-50%)translateY(8px)}.toast[data-visible=true]{opacity:1;transform:translate(-50%)translateY(0)}@media (width<=640px){.header{padding:var(--space-2) var(--space-4);grid-template-columns:auto 1fr auto}.brand-name{display:none}.composer,.viewer{padding-left:var(--space-4);padding-right:var(--space-4)}.composer-inner{gap:var(--space-2)}.textarea{padding:var(--space-3)}}.md{max-width:var(--measure);width:100%;font-family:var(--font-serif);color:var(--ink);font-feature-settings:"kern", "liga", "onum";font-size:1.0625rem;line-height:1.65}.md>*+*{margin-top:1.1em}.md h1,.md h2,.md h3,.md h4,.md h5,.md h6{font-family:var(--font-ui);color:var(--ink);letter-spacing:-.015em;text-wrap:balance;font-weight:600;line-height:1.25}.md h1{letter-spacing:-.025em;border-bottom:1px solid var(--border);margin-top:0;padding-bottom:.4em;font-size:2.25rem}.md h2{margin-top:1.8em;font-size:1.6rem}.md h3{margin-top:1.6em;font-size:1.25rem}.md h4{color:var(--ink-2);margin-top:1.4em;font-size:1.05rem}.md h5,.md h6{text-transform:uppercase;letter-spacing:.06em;color:var(--ink-2);margin-top:1.4em;font-size:.95rem}.md p{text-wrap:pretty}.md a{color:var(--accent-ink);text-decoration:underline;-webkit-text-decoration-color:var(--accent-soft);text-decoration-color:var(--accent-soft);text-underline-offset:3px;transition:text-decoration-color var(--transition-fast);text-decoration-thickness:1.5px}.md a:hover{-webkit-text-decoration-color:var(--accent);text-decoration-color:var(--accent)}.md strong{color:var(--ink);font-weight:600}.md em{font-style:italic}.md del{color:var(--ink-3);-webkit-text-decoration-color:var(--ink-3);text-decoration-color:var(--ink-3)}.md ul,.md ol{padding-left:1.4em}.md li+li{margin-top:.35em}.md ul{padding-left:0;list-style:none}.md ul>li{padding-left:1.4em;position:relative}.md ul>li:before{content:"";background:var(--ink-3);border-radius:50%;width:4px;height:4px;position:absolute;top:.7em;left:.3em}.md ol{font-variant-numeric:tabular-nums}.md ol>li::marker{color:var(--ink-3);font-family:var(--font-ui);font-size:.875em}.md li.task-list-item{padding-left:0;list-style:none}.md li.task-list-item:before{content:none}.md input[type=checkbox]{accent-color:var(--accent);margin-right:.5em;transform:translateY(1px)}.md blockquote{padding:.1em 0 .1em var(--space-5);color:var(--ink-2);margin:1.4em 0;font-style:italic;position:relative}.md blockquote:before{content:"";background:var(--border-strong);width:2px;position:absolute;top:.3em;bottom:.3em;left:0}.md blockquote p{margin:0}.md blockquote p+p{margin-top:.8em}.md code{font-family:var(--font-mono);background:var(--bg-sunk);color:var(--ink);border:1px solid var(--border);font-variant-ligatures:none;border-radius:4px;padding:.15em .4em;font-size:.86em}.md pre{padding:var(--space-4) var(--space-5);background:var(--bg-sunk);border:1px solid var(--border);border-radius:var(--radius-md);margin:1.4em 0;font-size:.875rem;line-height:1.55;overflow-x:auto}.md pre code{font-size:inherit;color:inherit;background:0 0;border:0;border-radius:0;padding:0}.md table{border-collapse:collapse;width:100%;font-family:var(--font-ui);font-variant-numeric:tabular-nums;margin:1.4em 0;font-size:.9375rem}.md thead th{text-align:left;color:var(--ink);padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--border-strong);font-weight:600}.md tbody td{padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--border);color:var(--ink-2)}.md tbody tr:last-child td{border-bottom:0}.md hr{background:var(--border);border:0;height:1px;margin:2.2em 0}.md img{border-radius:var(--radius-md);border:1px solid var(--border);max-width:100%;height:auto}.md kbd{font-family:var(--font-mono);background:var(--surface);border:1px solid var(--border-strong);color:var(--ink);border-bottom-width:2px;border-radius:4px;padding:.1em .4em;font-size:.78em}.md .hljs-comment,.md .hljs-quote{color:var(--ink-3);font-style:italic}.md .hljs-keyword,.md .hljs-selector-tag,.md .hljs-subst{color:oklch(50% .16 290);font-weight:500}[data-theme=dark] .md .hljs-keyword,[data-theme=dark] .md .hljs-selector-tag,[data-theme=dark] .md .hljs-subst{color:oklch(78% .13 290)}.md .hljs-number,.md .hljs-literal,.md .hljs-variable,.md .hljs-template-variable,.md .hljs-tag .hljs-attr{color:oklch(55% .16 32)}[data-theme=dark] .md .hljs-number,[data-theme=dark] .md .hljs-literal,[data-theme=dark] .md .hljs-variable,[data-theme=dark] .md .hljs-template-variable,[data-theme=dark] .md .hljs-tag .hljs-attr{color:oklch(78% .14 38)}.md .hljs-string,.md .hljs-doctag{color:oklch(50% .13 145)}[data-theme=dark] .md .hljs-string,[data-theme=dark] .md .hljs-doctag{color:oklch(78% .12 145)}.md .hljs-title,.md .hljs-section,.md .hljs-selector-id,.md .hljs-name{color:oklch(45% .16 250);font-weight:600}[data-theme=dark] .md .hljs-title,[data-theme=dark] .md .hljs-section,[data-theme=dark] .md .hljs-selector-id,[data-theme=dark] .md .hljs-name{color:oklch(76% .13 250)}.md .hljs-type,.md .hljs-class .hljs-title,.md .hljs-built_in{color:oklch(50% .13 200)}[data-theme=dark] .md .hljs-type,[data-theme=dark] .md .hljs-class .hljs-title,[data-theme=dark] .md .hljs-built_in{color:oklch(78% .12 200)}.md .hljs-symbol,.md .hljs-bullet,.md .hljs-link,.md .hljs-meta,.md .hljs-attribute{color:var(--ink-2)}.md .hljs-emphasis{font-style:italic}.md .hljs-strong{font-weight:600}
