:root{--paper:#ece7dc;--paper-edge:#e2dcce;--ink:#2b2a28;--ink-soft:#6b6256;--rule:#2b2a2817;--margin-red:#b0482e;--grammar-blue:#3c6e8f;--gold:#93782f;--focus:#3c6e8f;--body-bg:#dad4c5;--body-bg-grad:radial-gradient(ellipse at top, #e4decf, #d2cbb9)}body.dark{--paper:#1e1e1a;--paper-edge:#2a2a25;--ink:#ddd8cc;--ink-soft:#8a8378;--rule:#ddd8cc12;--margin-red:#c96b50;--grammar-blue:#5b9dbf;--gold:#b89a50;--focus:#5b9dbf;--body-bg:#151512;--body-bg-grad:radial-gradient(ellipse at top, #1c1c18, #111110)}*{box-sizing:border-box}html,body{height:100%}body{background:var(--body-bg);background-image:var(--body-bg-grad);min-height:100vh;color:var(--ink);background-attachment:fixed;justify-content:center;align-items:flex-start;margin:0;padding:40px 20px 0;font-family:IBM Plex Mono,monospace;transition:background .25s,color .25s;display:flex}.app{flex-direction:column;width:100%;max-width:760px;min-height:calc(100vh - 40px);padding-bottom:40px;display:flex}header{margin-bottom:8px;padding:0 6px}header h1{letter-spacing:.01em;caret-color:var(--ink);outline:none;min-width:2ch;margin:0 0 4px;font-family:Newsreader,serif;font-size:2.1rem;font-style:italic;font-weight:500}header h1:empty:before{content:attr(data-placeholder);color:#2b2a2852}body.dark .btn{color:#a09890;background:#ffffff12;border-color:#ddd8cc29}body.dark .btn:hover{color:var(--ink);background:#ffffff1f;border-color:#ddd8cc42}body.dark header h1:empty:before{color:#ddd8cc7a}header h1:focus-visible{outline:2px solid var(--focus);outline-offset:4px;border-radius:2px}header p{color:var(--ink-soft);letter-spacing:.02em;margin:0;font-size:.78rem;line-height:1.5}.legend{color:var(--ink-soft);flex-wrap:wrap;align-items:center;gap:10px 18px;margin:14px 6px 0;font-size:.72rem;display:flex}.legend-left{flex-wrap:wrap;flex:1;align-items:center;gap:18px;min-width:0;display:flex}.legend-item{align-items:center;gap:6px;display:flex}.swatch{border-bottom:2px solid;width:18px;height:0;display:inline-block}.swatch.spelling{border-bottom-style:wavy;border-color:var(--margin-red)}.swatch.grammar{border-bottom-style:dotted;border-color:var(--grammar-blue);border-bottom-width:3px}.byline{color:var(--ink-soft);opacity:.85;white-space:nowrap;caret-color:var(--ink);outline:none;min-width:1ch;font-family:Newsreader,serif;font-size:.9rem;font-style:italic}.byline:empty:before{content:attr(data-placeholder);color:#2b2a2852}.byline:focus-visible{outline:2px solid var(--focus);outline-offset:3px;border-radius:2px}.page-wrap{background:var(--paper);border:1px solid var(--paper-edge);border-radius:3px;flex-direction:column;flex:1;padding:28px 26px 28px 56px;display:flex;position:relative;overflow:hidden;box-shadow:0 1px 2px #0000000a,0 10px 30px -12px #2b2a2840}.page-wrap:before{content:"";background:#b0482e59;width:1px;position:absolute;top:0;bottom:0;left:38px}.editor-wrap{flex:1;min-height:320px;position:relative}.editor-wrap:before,.editor-wrap:after{content:"";pointer-events:none;z-index:10;height:52px;transition:opacity .2s;position:absolute;left:0;right:0}.editor-wrap:before{background:linear-gradient(to bottom, var(--paper) 0%, transparent 100%);opacity:0;top:0}.editor-wrap:after{background:linear-gradient(to top, var(--paper) 0%, transparent 100%);opacity:1;bottom:0}.editor-wrap.at-top:before,.editor-wrap.at-bottom:after{opacity:0}.editor-wrap:not(.at-top):before,.editor-wrap:not(.at-bottom):after{opacity:1}#editor{white-space:pre;color:var(--ink);caret-color:var(--ink);z-index:1;border:none;outline:none;margin:0;padding:0 4px;font-family:Newsreader,serif;font-size:1.18rem;line-height:31px;position:absolute;inset:0;overflow:auto}#editor::-webkit-scrollbar{display:none}#editor{scrollbar-width:none}#editor.wrap-mode{white-space:pre-wrap;word-break:break-word;overflow-x:hidden}#editor.align-center{text-align:center}#editor.align-right{text-align:right}#editor:empty:before{content:attr(data-placeholder);color:#2b2a2852;pointer-events:none;font-style:italic}#editor:focus-visible{outline:2px solid var(--focus);outline-offset:2px}mark{color:inherit;font:inherit;line-height:inherit;text-underline-offset:4px;cursor:help;background:0 0;border:0;margin:0;padding:0;text-decoration-line:underline;display:inline}mark.spelling{text-decoration-style:wavy;-webkit-text-decoration-color:var(--margin-red);text-decoration-color:var(--margin-red)}mark.grammar{text-decoration-style:dotted;text-decoration-thickness:2px;-webkit-text-decoration-color:var(--grammar-blue);text-decoration-color:var(--grammar-blue)}.badge-group{white-space:nowrap;display:inline-block;position:relative;top:-7px}#editor.badges-hidden .badge-group{display:none}.wc-badge{color:var(--gold);opacity:.8;-webkit-user-select:none;user-select:none;margin-left:.6ch;font-family:IBM Plex Mono,monospace;font-size:.62rem;display:inline}.sc-badge{color:var(--grammar-blue);opacity:.8;-webkit-user-select:none;user-select:none;margin-left:.4ch;font-family:IBM Plex Mono,monospace;font-size:.62rem;display:inline}.vis-line{background:var(--ink);opacity:.18;vertical-align:middle;border-radius:6px;height:11px;transition:width .22s,opacity .22s;display:inline-block;position:relative;top:-2px}.vis-line.vis-longest{opacity:.38;background:var(--gold)}#editor.vis-mode .badge-group{top:-4px}#editor.vis-mode{cursor:default;-webkit-user-select:none;user-select:none;caret-color:#0000}.resize-handle{cursor:ns-resize;touch-action:none;flex-shrink:0;justify-content:center;align-self:center;align-items:center;width:64px;height:20px;margin-top:2px;display:flex}.resize-grip{background:var(--ink-soft);opacity:.22;border-radius:2px;width:43px;height:4px;transition:opacity .15s,background .15s,width .15s}.resize-handle:hover .resize-grip{opacity:.5}.resize-handle.dragging .resize-grip{opacity:.7;width:55px}.resize-handle:focus-visible{outline:none}.resize-handle:focus-visible .resize-grip{opacity:.7;outline:2px solid var(--focus);outline-offset:3px}@media (prefers-reduced-motion:reduce){.resize-grip{transition:none}}.resize-handle-h{cursor:ew-resize;touch-action:none;z-index:2;justify-content:center;align-items:center;width:26px;display:flex;position:absolute;top:0;bottom:0;right:0}.resize-grip-h{background:var(--ink-soft);opacity:.22;border-radius:2px;width:4px;height:43px;transition:opacity .15s,background .15s,height .15s}.resize-handle-h:hover .resize-grip-h{opacity:.5}.resize-handle-h.dragging .resize-grip-h{opacity:.7;height:55px}.resize-handle-h:focus-visible{outline:none}.resize-handle-h:focus-visible .resize-grip-h{opacity:.7;outline:2px solid var(--focus);outline-offset:3px}@media (prefers-reduced-motion:reduce){.resize-grip-h{transition:none}}@media (width<=900px){.resize-handle-h{display:none}}.statusbar-right{flex-shrink:0;justify-content:flex-end;align-items:center;gap:10px;display:flex}.btn{width:26px;height:26px;color:var(--ink-soft);cursor:pointer;background:#ffffff59;border:1px solid #2b2a2824;border-radius:6px;justify-content:center;align-items:center;padding:0;transition:background .15s,color .15s,border-color .15s;display:inline-flex}.btn svg{pointer-events:none;width:14px;height:14px}.btn:hover{color:var(--ink);background:#fff9;border-color:#2b2a2838}.btn:active{transform:translateY(1px)}.btn.copied{color:#4c7a4f;border-color:#4c7a4f59}.btn:disabled{opacity:.35;cursor:not-allowed;pointer-events:none}.btn:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.btn.vis-active,body.dark .btn.vis-active{background:var(--ink-soft);color:var(--paper);border-color:var(--ink-soft)}.settings-wrap{position:relative}.settings-popup{z-index:200;opacity:0;pointer-events:none;transition:opacity .18s,transform .18s;position:absolute;bottom:calc(100% + 8px);right:0;transform:translateY(4px)}.settings-popup.open{opacity:1;pointer-events:auto;transform:translateY(0)}.settings-popup-inner{background:var(--paper);border:1px solid var(--paper-edge);white-space:nowrap;border-radius:10px;gap:6px;padding:7px 8px;display:flex;box-shadow:0 8px 24px -6px #0003}body.dark .settings-popup-inner{box-shadow:0 8px 24px -6px #00000080}.copy-toast{background:var(--ink);color:var(--paper);opacity:0;pointer-events:none;z-index:10;white-space:nowrap;border-radius:6px;max-width:calc(100vw - 32px);padding:8px 16px;font-family:IBM Plex Mono,monospace;font-size:.74rem;transition:opacity .18s,transform .18s;position:fixed;bottom:32px;left:50%;transform:translate(-50%,12px);box-shadow:0 6px 18px -6px #00000059}@media (width<=400px){.copy-toast{padding:8px 12px;font-size:.68rem}}.copy-toast.visible{opacity:.94;transform:translate(-50%)}.copy-toast.error{background:var(--margin-red)}@media (prefers-reduced-motion:reduce){.copy-toast{transition:none}}.statusbar{color:var(--ink-soft);justify-content:space-between;align-items:center;margin:8px 6px 10px;font-size:.72rem;display:flex}.statusbar #status b{font-weight:600}.statusbar #status{flex:auto;min-width:0}.statusbar .checking{display:none}@media (width<=560px){.page-wrap{padding:14px 12px 14px 14px}.page-wrap:before{display:none}#editor{font-size:.95rem}header h1{font-size:1.7rem}.legend{flex-wrap:wrap;gap:8px 18px}}.legend-right{flex-shrink:0;align-items:center;gap:6px;margin-left:auto;display:flex}.dl-wrap{position:relative}.dl-dropdown{background:var(--paper);z-index:10;border:1px solid #2b2a2824;border-radius:6px;display:none;position:absolute;bottom:calc(100% + 6px);right:0;overflow:hidden;box-shadow:0 4px 14px -4px #0000002e}.dl-dropdown.open{display:block}.dl-option{text-align:left;width:100%;color:var(--ink-soft);cursor:pointer;white-space:nowrap;background:0 0;border:none;padding:7px 16px;font-family:IBM Plex Mono,monospace;font-size:.7rem;display:block}.dl-option+.dl-option{border-top:1px solid #2b2a2814}.dl-option:hover{color:var(--ink);background:#2b2a280f}.about{color:var(--ink-soft);opacity:.75;border-top:1px solid #2b2a2824;margin:20px 6px 0;padding-top:20px;font-family:Newsreader,serif;font-size:.8rem;line-height:1.7}body.dark .about{border-top-color:#ddd8cc2e}.about p{margin:0 0 6px;font-family:Newsreader,serif}.about .about-coffee{align-items:center;gap:5px;margin:10px 0 0;font-size:.8rem;line-height:1;display:flex}.coffee-btn{width:28px;height:28px;color:var(--ink-soft);background:#ffffff59;border:1px solid #2b2a282e;border-radius:7px;flex-shrink:0;justify-content:center;align-items:center;text-decoration:none;transition:background .15s,color .15s,border-color .15s;display:inline-flex}.coffee-btn svg{pointer-events:none;width:14px;height:14px}.coffee-btn:hover{background:var(--gold);border-color:var(--gold);color:#fff;opacity:1}body.dark .coffee-btn{background:#ffffff14;border-color:#ddd8cc33}body.dark .coffee-btn:hover{background:var(--gold);border-color:var(--gold);color:#fff}.about .about-credit .credit-link{color:inherit;text-underline-offset:3px;-webkit-text-decoration:underline #6b625666;text-decoration:underline #6b625666;transition:text-decoration-color .15s}.about .about-credit .credit-link:hover{-webkit-text-decoration-color:var(--ink-soft);text-decoration-color:var(--ink-soft)}.about .about-credit{margin-top:10px;font-family:Newsreader,serif;font-style:italic}@media (width<=560px){.about-break:before{content:"\a ";white-space:pre}}@media (prefers-reduced-motion:reduce){.statusbar .checking{transition:none}}