/* OnlineNote.app: the folded writing desk. Shared tokens own every tool and theme. */
@font-face{font-family:Manrope;src:url('/fonts/manrope-latin.woff2') format('woff2');font-style:normal;font-weight:400 800;font-display:optional}
@font-face{font-family:'EB Garamond';src:url('/fonts/eb-garamond-latin.woff2') format('woff2');font-style:normal;font-weight:400;font-display:optional}
:root{--bg:#F6F7FB;--bg-2:#EDF0F8;--bg-3:#E2E7F4;--surface:#FFFFFF;--line:#DCE2EF;--ink:#17213A;--ink-2:#56617A;--accent:#3155E7;--accent-bright:#3155E7;--accent-hover:#2443C4;--accent-ink:#FFFFFF;--danger:#B02E3B;--shadow:0 16px 42px rgb(36 58 110 / .08);--radius:10px;--sans:Manrope,system-ui,-apple-system,'Segoe UI',sans-serif;--mono:ui-monospace,SFMono-Regular,Consolas,monospace;--writing:'EB Garamond',Georgia,'Times New Roman',serif;--display:var(--sans);--editor-font:var(--writing);--editor-size:1.25rem;--ease-out:cubic-bezier(.23,1,.32,1);color-scheme:light}
:root[data-theme=dark]{--bg:#101521;--bg-2:#1B2334;--bg-3:#28344B;--surface:#161D2C;--line:#354159;--ink:#EDF1FF;--ink-2:#AAB6CE;--accent:#A2B4FF;--accent-bright:#B9C6FF;--accent-hover:#B9C6FF;--accent-ink:#101A3D;--danger:#FF9BA4;--shadow:0 16px 42px rgb(0 0 0 / .18);color-scheme:dark}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scrollbar-color:var(--bg-3) var(--bg);scroll-padding-top:2rem}
body{margin:0;background:var(--bg);color:var(--ink);font:400 1rem/1.65 var(--sans);caret-color:var(--accent);min-height:100vh;display:flex;flex-direction:column}
::selection{background:var(--accent);color:var(--accent-ink)}
::placeholder{color:var(--ink-2);opacity:1}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
a{color:var(--accent);text-underline-offset:.2em;text-decoration-thickness:1px}
a:hover{color:var(--accent-hover)}
h1,h2,h3{line-height:1.2;margin:0;letter-spacing:-.035em}
h1{font-size:2.5rem;font-weight:800}h2{font-size:1.4rem;font-weight:750;margin:2rem 0 .7rem}h3{font-size:1.05rem;font-weight:700;margin:1.5rem 0 .4rem}
p,ul,ol{margin:0 0 1rem}code,pre{font-family:var(--mono);font-size:.9em}code{background:var(--bg-2);padding:.1em .35em;border-radius:4px}pre{background:var(--bg-2);padding:1rem;border-radius:var(--radius);overflow-x:auto}pre code{background:none;padding:0}kbd{font:500 .8rem var(--mono);background:var(--surface);border:1px solid var(--line);border-bottom-width:2px;border-radius:5px;padding:.15em .35em;white-space:nowrap}hr{border:0;border-top:1px solid var(--line);margin:2rem 0}
svg.i{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
[hidden]{display:none!important}.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.num{font-variant-numeric:tabular-nums}
.wrap{width:100%;max-width:104rem;margin:0 auto;padding:0 1.5rem}main{flex:1;min-width:0}.spacer{flex:1}.skip-link{position:fixed;top:.75rem;left:1rem;z-index:60;padding:.7rem 1rem;background:var(--surface);transform:translateY(-200%)}.skip-link:focus{transform:none}
.site-header{border-bottom:1px solid var(--line);background:var(--surface)}.site-header .wrap{display:flex;align-items:center;gap:1.5rem;min-height:64px}.brand{display:inline-flex;align-items:center;gap:.7rem;font-size:1.22rem;font-weight:800;letter-spacing:-.04em;color:var(--ink);text-decoration:none;margin-right:auto;white-space:nowrap}.brand-mark{display:grid;place-items:center;width:34px;height:34px;flex:none;border-radius:10px;background:var(--accent);color:var(--accent-ink);font-size:1.45rem;font-weight:800;line-height:1}.brand:hover{color:var(--ink)}.site-nav{display:flex;align-items:center;gap:.25rem}.site-nav a{color:var(--ink-2);text-decoration:none;padding:.6rem .85rem;border-radius:8px;font-size:.875rem;font-weight:650;min-height:44px;display:inline-flex;align-items:center;white-space:nowrap}.site-nav a:hover{background:var(--bg)}.site-nav a[aria-current=page]{color:var(--accent);background:var(--bg-2)}
.btn{appearance:none;-webkit-appearance:none;font:650 .8125rem/1.35 var(--sans);color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:8px;min-height:44px;min-width:44px;padding:.65rem .9rem;display:inline-flex;align-items:center;justify-content:center;gap:.45rem;cursor:pointer;text-decoration:none;touch-action:manipulation;user-select:none;white-space:nowrap;transition:background-color 150ms ease,border-color 150ms ease,color 150ms ease,transform 150ms var(--ease-out)}
.btn:hover{background:var(--bg-2);color:var(--ink)}.btn:active{transform:translateY(1px)}.btn[aria-pressed=true]{background:var(--bg-3);color:var(--accent);border-color:var(--accent)}.btn.primary,[data-action=share]{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}.btn.primary:hover,[data-action=share]:hover{background:var(--accent-hover);color:var(--accent-ink);border-color:var(--accent-hover)}.btn.quiet{background:transparent;border-color:transparent}.btn.quiet:hover{background:var(--bg-2)}.btn.danger:hover{color:var(--danger)}.btn:disabled{opacity:.55;cursor:wait;transform:none}.btn-icon{padding:.6rem}.btn .lbl{white-space:nowrap}.btn-icon .lbl{display:none}[data-action=share] .lbl,[data-action=download] .lbl{display:inline}
.analytics-choice{display:none;background:var(--bg-2);border-bottom:1px solid var(--line);padding:.9rem 0}html[data-analytics-choice=ask] .analytics-choice{display:block}.analytics-choice .wrap{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}.analytics-choice p{flex:1 1 30rem;font-size:.8125rem;margin:0;max-width:78ch}.analytics-choice strong{color:var(--ink)}.analytics-actions{display:flex;gap:.5rem;flex-wrap:wrap}.analytics-preferences{font:inherit;color:var(--accent);background:none;border:0;padding:.5rem 0;text-decoration:underline;text-underline-offset:.2em;cursor:pointer}
.np-head,.tool-head{padding:2.5rem 0 1.75rem}.np-head h1,.tool-head h1{margin-bottom:.75rem}.np-head p,.tool-head p{color:var(--ink-2);margin:0;max-width:64ch;font-size:1rem}.home-intro{display:grid;grid-template-columns:1fr 280px;align-items:center;gap:2rem;padding-top:2rem;padding-bottom:1.5rem}.home-intro h1{font-size:3.1rem;max-width:19ch;line-height:1.12;letter-spacing:-.04em}.home-intro h1 span{color:var(--accent)}.home-intro p{max-width:47ch}.hero-art{display:block;width:280px;height:187px;object-fit:contain}.tool-head{max-width:70ch}.tool-head h1{font-size:2.6rem}
.np-app{display:block;background:var(--surface);border-radius:16px;box-shadow:var(--shadow);overflow:hidden}.np-side{background:var(--bg-2);border-right:1px solid var(--line);padding:1rem;display:flex;flex-direction:column;gap:1rem;min-width:0}.np-side-head{display:flex;align-items:center;justify-content:space-between;gap:.5rem}.np-side h2{margin:0;font-size:.875rem;font-weight:750;letter-spacing:0}.np-list{list-style:none;margin:0;padding:0;overflow-y:auto;max-height:27rem;display:flex;flex-direction:column;gap:.35rem}.np-list li{display:flex;align-items:center;gap:0;min-width:0}.np-list .pick{flex:1;min-width:0;text-align:left;font:inherit;color:var(--ink);background:transparent;border:1px solid transparent;border-radius:8px;padding:.65rem .55rem;cursor:pointer;min-height:54px}.np-list .pick:hover{background:var(--bg-3)}.np-list .pick[aria-current=true]{background:var(--surface);border-color:var(--line)}.np-list .pick .t{display:block;font-size:.8125rem;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.np-list .pick .d{display:block;font-size:.75rem;color:var(--ink-2);font-variant-numeric:tabular-nums;margin-top:.2rem}.np-list .del{flex:none;min-width:36px;padding:.45rem}.np-list .del .i{width:16px;height:16px}.np-empty{color:var(--ink-2);font-size:.875rem;padding:.5rem;margin:0}.sidebar-hint{color:var(--ink-2);font-size:.75rem;line-height:1.6;margin:auto 0 0;padding-top:2rem}.np-drawer-toggle,.np-scrim{display:none}
.np-main{min-width:0;display:flex;flex-direction:column}.document-heading{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.1rem 1.25rem .7rem}.document-heading h2{font-size:1rem;letter-spacing:-.02em;margin:0}.document-heading>span{font-size:.75rem;color:var(--ink-2)}.toolbar{display:flex;flex-wrap:wrap;gap:.35rem;margin:0 0 .7rem;align-items:center}.toolbar .sep{width:1px;height:24px;background:var(--line);margin:0 .25rem}.np-toolbar{padding:.55rem 1rem .8rem;margin:0;border-bottom:1px solid var(--line)}.np-toolbar .btn:not([data-action=share]){background:transparent;border-color:transparent}.np-toolbar .btn:not([data-action=share]):hover{background:var(--bg-2)}.np-toolbar .btn[aria-pressed=true]{background:var(--bg-2);color:var(--accent)}.np-toolbar [data-action=focus] .lbl{display:none}.np-toolbar .btn{min-height:38px}
textarea.editor{width:100%;display:block;font-family:var(--editor-font);font-size:var(--editor-size);line-height:1.65;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:1.2rem 1.4rem;resize:vertical;tab-size:2;min-height:14rem}textarea.editor:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}textarea.editor.nowrap{white-space:pre;overflow-x:auto}.np-main textarea.np-editor{flex:none;height:25rem;min-height:22rem;resize:vertical;border:0;border-radius:0;padding:1.5rem}.np-status{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem 1rem;font-size:.75rem;color:var(--ink-2);padding:.75rem 1.25rem;border-top:1px solid var(--line);font-variant-numeric:tabular-nums}.np-status .saved{display:inline-flex;align-items:center;gap:.3rem;color:var(--ink-2);opacity:0;transition:opacity 160ms ease}.np-status .saved.on{opacity:1}.np-status .saved svg.i{width:15px;height:15px;color:var(--accent)}.np-status .local{flex-basis:100%;font-size:.75rem}.np-status .esc{display:none}.msg{font-size:.8125rem;color:var(--ink-2);min-height:1.4em;margin:.4rem 0 0}.np-main>.msg{padding:0 1.25rem .6rem}.msg.error{color:var(--danger)}.msg:empty{min-height:0;margin:0;padding-bottom:0}.np-banner{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1rem;padding:1rem;border:1px solid var(--accent);border-radius:var(--radius);margin:0 0 1rem;background:var(--bg-2)}.np-banner p{margin:0;flex:1;min-width:12rem}
.workspace-note{display:flex;align-items:center;justify-content:space-between;gap:1rem;color:var(--ink-2);font-size:.75rem;padding:1rem .25rem;margin:0}.workspace-note a{font-weight:650}.tool{margin-bottom:1rem}.tool.workspace{padding:1.25rem;background:var(--surface);border-radius:16px;box-shadow:var(--shadow)}.field-label{display:block;font-weight:700;font-size:.875rem;margin:0 0 .7rem}.field-heading{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:.6rem}.field-heading .field-label{margin:0}.field-heading span{color:var(--ink-2);font-size:.75rem}
.prose{max-width:70ch}.prose table{border-collapse:collapse;width:100%;margin:0 0 1rem;font-size:.875rem}.prose th,.prose td{text-align:left;padding:.65rem .75rem;border-bottom:1px solid var(--line);vertical-align:top}.prose th{font-weight:700}.prose td:first-child{white-space:nowrap}.tbl-wrap{overflow-x:auto}.steps{padding-left:1.25rem}.steps li{margin-bottom:.65rem}.np-below{margin-top:4rem}.guide-area{display:grid;grid-template-columns:14rem minmax(0,1fr);gap:3rem;margin-top:4rem}.guide-intro h2{font-size:1.65rem;max-width:10ch;margin:0 0 .8rem}.guide-intro p{color:var(--ink-2);font-size:.875rem;max-width:24ch}.guide-area>.prose{max-width:none;min-width:0}.guide-section{padding:1.1rem 0;border-top:1px solid var(--line)}.guide-section>summary{display:flex;align-items:center;justify-content:space-between;gap:1rem;cursor:pointer;list-style:none;min-height:44px;font-weight:700}.guide-section>summary::-webkit-details-marker{display:none}.guide-section>summary::after{content:'';width:9px;height:9px;flex:none;border-right:1.5px solid var(--accent);border-bottom:1.5px solid var(--accent);transform:rotate(45deg);margin-right:.3rem}.guide-section[open]>summary::after{transform:rotate(225deg)}.guide-section>summary h2{font:inherit;letter-spacing:-.02em;margin:0}.guide-section>.guide-content{color:var(--ink-2);padding-top:1rem;max-width:70ch}.guide-content>:last-child{margin-bottom:0}.faq summary{cursor:pointer;font-weight:650;padding:1rem 0;list-style:none;display:flex;justify-content:space-between;gap:1rem;align-items:center;min-height:44px}.faq summary::-webkit-details-marker{display:none}.faq summary::after{content:'';width:9px;height:9px;flex:none;border-right:1.5px solid var(--accent);border-bottom:1.5px solid var(--accent);transform:rotate(45deg);margin-right:.3rem}.faq details{border-top:1px solid var(--line)}.faq details[open] summary::after{transform:rotate(225deg)}.faq details p{margin:0 0 1rem;color:var(--ink-2)}
.related{margin-top:4rem;padding-top:2rem;border-top:1px solid var(--line)}.related h2{font-size:1.8rem;margin:0 0 1.2rem}.related ul,.grid{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.related li a,.grid li a{display:block;min-height:104px;padding:1.2rem;background:var(--surface);border-radius:12px;text-decoration:none;color:var(--ink);transition:background-color 160ms ease,transform 180ms var(--ease-out)}.related li a strong,.grid li a strong{display:block;font-size:1rem;font-weight:750;margin-bottom:.35rem}.related li a span,.grid li a span{display:block;font-size:.8125rem;color:var(--ink-2)}.site-footer{border-top:1px solid var(--line);margin-top:4rem;padding:2rem 0;color:var(--ink-2);font-size:.8125rem}.site-footer nav{display:flex;flex-wrap:wrap;gap:.5rem 1.25rem;margin-bottom:.8rem}.site-footer a{color:var(--ink-2)}.site-footer p{margin:0}.site-footer .wrap{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;flex-wrap:wrap}
/* Native dialog keeps focus, Escape handling and browser accessibility. */
.share-dialog{width:min(36rem,calc(100% - 2rem));max-height:calc(100dvh - 2rem);overflow-y:auto;padding:1.75rem;border:0;border-radius:16px;background:var(--surface);color:var(--ink);box-shadow:0 24px 70px rgb(15 25 55 / .22)}.share-dialog::backdrop{background:rgb(17 27 49 / .55)}.share-heading{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:.75rem}.share-heading h2{margin:0;font-size:1.65rem}.share-fields{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1.5rem}.share-dialog label{display:block;font-size:.875rem;font-weight:700}.share-dialog input{width:100%;min-width:0;min-height:46px;margin-top:.45rem;padding:.7rem .8rem;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);font:400 1rem var(--sans)}.share-dialog input[readonly]{background:var(--bg)}.share-hint,.share-manage{font-size:.8125rem;color:var(--ink-2)}.share-hint{margin:.7rem 0 1.25rem}.share-preview{padding:1rem;background:var(--bg);border-radius:10px}.share-preview span{display:block;font-size:.75rem;color:var(--ink-2);margin-bottom:.4rem}.share-preview output{display:block;font-family:var(--mono);font-size:.875rem;overflow-wrap:anywhere}.share-disclosure{font-size:.875rem;margin:1rem 0}.share-actions{display:flex;gap:.5rem;flex-wrap:wrap}.share-status{margin:0 0 1rem;font-size:.875rem;font-weight:650}.share-status:empty{display:none}.share-status.error{color:var(--danger)}.share-result{margin:1.25rem 0}.share-result .share-actions{margin-top:.75rem}.share-dialog.is-published .share-fields,.share-dialog.is-published .share-hint,.share-dialog.is-published .share-preview,.share-dialog.is-published .share-disclosure{display:none}.share-manage{margin:1.25rem 0 0}
.shared-page{max-width:56rem;padding-top:3rem;padding-bottom:3rem}.shared-heading{padding-bottom:1.5rem;margin-bottom:2rem;border-bottom:1px solid var(--line)}.shared-heading h1{font-size:2.5rem;overflow-wrap:anywhere}.shared-heading p{color:var(--ink-2);margin:.75rem 0 1rem}.shared-content{overflow-wrap:anywhere}.shared-content.md-preview{border:0;padding:0;background:none;min-height:0;height:auto}.shared-text{font:inherit;white-space:pre-wrap;overflow-wrap:anywhere;background:none;padding:0;margin:0}
/* Markdown writing and preview use the same surface. */
.md-shell{background:var(--surface);border-radius:16px;box-shadow:var(--shadow);padding:0;overflow:hidden}.md-app{display:grid;grid-template-columns:1fr 1fr;align-items:stretch}.md-app .np-main{min-width:0}.md-app .np-main textarea.np-editor{height:28rem;min-height:25rem}.md-preview{border:0;border-left:1px solid var(--line);padding:1.5rem;overflow-y:auto;height:34rem;min-height:25rem;background:var(--surface);overflow-wrap:anywhere;max-width:none}.md-preview>:first-child{margin-top:0}.md-preview h1,.md-preview h2,.md-preview h3{margin:1.5rem 0 .6rem}.md-preview h1{font-size:1.7rem}.md-preview h2{font-size:1.35rem}.md-preview h3{font-size:1.1rem}.md-preview h4,.md-preview h5,.md-preview h6{font-size:1rem;margin:1.2rem 0 .4rem}.md-preview blockquote{margin:0 0 1rem;padding:.2rem 0 .2rem 1rem;color:var(--ink-2);border-left:1px solid var(--line)}.md-preview .empty{color:var(--ink-2)}.md-tabs{display:none;gap:.35rem;padding:.75rem 1rem;border-bottom:1px solid var(--line)}.np-side-drawer{display:none;position:fixed;inset:0 auto 0 0;width:min(22rem,88vw);z-index:40;box-shadow:var(--shadow)}.np-side-drawer.open{display:flex}.np-side-drawer .np-close{display:inline-flex}.np-scrim.open{display:block;position:fixed;inset:0;background:rgb(17 27 49 / .45);z-index:39}
/* Word counter: writing column alongside the live report. */
.counter-layout{display:grid;grid-template-columns:minmax(0,1fr) 22rem;gap:1.5rem}.counter-input{min-width:0}.counter-input textarea{min-height:26rem}.counter-input .toolbar{margin-top:.8rem}.counter-report{border-left:1px solid var(--line);padding-left:1.5rem;min-width:0}.stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem;margin:0;padding:0;list-style:none}.stats li{padding:.8rem;background:var(--bg);border-radius:10px}.stats li:first-child{background:var(--accent);color:var(--accent-ink)}.stats .v{display:block;font-size:1.8rem;font-weight:750;font-variant-numeric:tabular-nums;line-height:1.25;letter-spacing:-.04em}.stats .k{display:block;font-size:.75rem;color:var(--ink-2);margin-top:.25rem}.stats li:first-child .k{color:inherit}.kw-head{font-size:.9375rem;letter-spacing:-.015em;margin:1.5rem 0 .5rem}.kw{display:flex;flex-wrap:wrap;gap:.35rem;list-style:none;padding:0;margin:.75rem 0 0}.kw li{background:var(--bg-2);border-radius:6px;padding:.35rem .6rem;font-size:.8125rem}.kw li .num{color:var(--ink-2);margin-left:.4em}
/* Conversion keeps input and result visible together. */
.converter-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem}.converter-grid>div{min-width:0}.converter-grid textarea{min-height:20rem}.cases{display:flex;flex-wrap:wrap;gap:.5rem;padding:1rem 0}.cases .btn{font-weight:600}.case-help{color:var(--ink-2);font-size:.8125rem;margin:0 0 .75rem}.result-wrap{position:relative}.counter-report .msg{font-size:.75rem}
/* Focus retains the same draft and provides an explicit exit. */
body.focus .site-header,body.focus .analytics-choice,body.focus .np-head,body.focus .np-side,body.focus .np-toolbar,body.focus .document-heading,body.focus .np-banner,body.focus .np-below,body.focus .guide-area,body.focus .site-footer,body.focus .related,body.focus .workspace-note{display:none}body.focus .np-app,body.focus .md-shell{display:block;background:transparent;box-shadow:none;margin-top:1rem}body.focus .wrap{max-width:84ch}body.focus .np-main textarea.np-editor{height:calc(100dvh - 8rem);min-height:0;border:0;border-radius:12px}body.focus .np-status .esc{display:inline}body.focus .md-app{display:block}body.focus #preview,body.focus .md-tabs{display:none}.focus-exit{display:none}body.focus .focus-exit{display:inline-flex;position:fixed;right:1rem;top:1rem;z-index:30}
@media(hover:hover) and (pointer:fine){.related li a:hover,.grid li a:hover{background:var(--bg-2);transform:translateY(-3px)}}
@media(prefers-reduced-motion:no-preference){.hero-art{animation:paper-arrive 700ms var(--ease-out) both}.share-dialog[open]{animation:dialog-arrive 220ms var(--ease-out)}.np-side.open{animation:drawer-arrive 220ms var(--ease-out)}}
@keyframes paper-arrive{from{transform:translateY(12px) rotate(-4deg)}to{transform:translateY(0) rotate(0)}}@keyframes dialog-arrive{from{opacity:.8;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}@keyframes drawer-arrive{from{transform:translateX(-12px);opacity:.8}to{transform:none;opacity:1}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;scroll-behavior:auto!important;transition-duration:0ms!important}}
@media(min-width:1180px){.np-toolbar [data-action=copy] .lbl{display:inline}}

@media(max-width:1050px){.counter-layout{grid-template-columns:minmax(0,1fr) 19rem}.site-header .wrap{gap:.65rem}.site-nav a{padding:.6rem .6rem}.home-intro h1{font-size:2.75rem}}
@media(max-width:899px){.np-app{display:block}.np-drawer-toggle{display:inline-flex}.np-side{display:none;position:fixed;inset:0 auto 0 0;width:min(22rem,88vw);max-height:none;z-index:40;border-radius:0;box-shadow:var(--shadow);padding-top:1rem}.np-side.open{display:flex}.np-list{max-height:none}.md-app{display:block}.md-tabs{display:flex}.md-app .np-main textarea.np-editor{height:28rem;min-height:22rem}.md-preview{height:auto;min-height:28rem;border:0}.md-app[data-tab=write] #preview{display:none}.md-app[data-tab=preview] .np-main{display:none}.counter-layout{grid-template-columns:1fr}.counter-input textarea{min-height:20rem}.counter-report{padding:1rem 0 0;border-left:0;border-top:1px solid var(--line)}.stats{grid-template-columns:repeat(4,minmax(0,1fr))}.guide-area{grid-template-columns:1fr;gap:1.5rem}.guide-intro h2{max-width:none}.guide-intro p{max-width:60ch}.guide-area{margin-top:3rem}.np-below{margin-top:3rem}}
@media(max-width:720px){.wrap{padding-left:1rem;padding-right:1rem}.site-header .wrap{flex-wrap:wrap;gap:.25rem .5rem;padding-top:.65rem}.site-header .brand{font-size:1.12rem}.site-nav{flex:1 0 100%;order:3;justify-content:space-between;margin-top:.4rem;padding-bottom:.45rem}.site-nav a{font-size:.75rem;padding:.55rem .5rem;min-height:42px}.brand-mark{width:30px;height:30px;border-radius:8px}.home-intro{grid-template-columns:minmax(0,1fr) 110px;gap:.5rem;padding:1.5rem 0}.home-intro h1{font-size:2rem;line-height:1.14;max-width:15ch}.home-intro p{font-size:.8125rem;max-width:40ch}.hero-art{width:110px;height:90px}.np-head:not(.home-intro),.tool-head{padding:1.5rem 0 1.25rem}.np-head h1,.tool-head h1{font-size:2rem}.np-head p,.tool-head p{font-size:.875rem}.np-toolbar{padding:.55rem;gap:.2rem}.np-toolbar .sep{display:none}.np-toolbar .btn{min-width:40px;min-height:44px;padding:.5rem}.np-toolbar [data-action=download] .lbl{display:none}.document-heading{padding:1rem 1rem .5rem}.document-heading>span{font-size:.75rem}.np-main textarea.np-editor{min-height:22rem;height:25rem;padding:1rem}.np-status{padding:.75rem 1rem;gap:.35rem .8rem}.np-status>span:nth-child(3),.np-status>span:nth-child(4),.np-status>span:nth-child(5){display:none}.np-status .local{display:block}.workspace-note{font-size:.75rem;align-items:flex-start}.tool.workspace{padding:1rem}.related ul,.grid{grid-template-columns:1fr}.related li a,.grid li a{min-height:88px}.related{margin-top:2.5rem}.related h2{font-size:1.5rem}.converter-grid{grid-template-columns:1fr;gap:1.2rem}.converter-grid textarea{min-height:13rem}.cases .btn{flex:1 1 30%;font-size:.75rem;padding:.6rem .4rem}.site-footer{margin-top:3rem;padding:1.5rem 0}.site-footer .wrap{display:block}.site-footer nav{gap:.35rem 1rem}.shared-page{padding-top:2rem}.shared-heading h1{font-size:2rem}.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.share-dialog{padding:1.25rem}.share-heading h2{font-size:1.4rem}.share-fields{grid-template-columns:1fr;gap:.8rem;margin-top:1rem}.share-actions .btn{flex:1}.prose{font-size:.9375rem}.guide-intro h2{font-size:1.5rem}.analytics-choice .wrap{gap:.65rem}.analytics-actions .btn{font-size:.75rem}.analytics-choice p{font-size:.75rem}}
@media print{.site-header,.site-footer,.np-toolbar,.np-side,.np-below,.guide-area,.related,.analytics-choice,.share-dialog,.focus-exit{display:none}body{background:white;color:black}.np-app,.md-shell{display:block;box-shadow:none}.np-main textarea.np-editor{height:auto;min-height:80vh}.np-status{display:none}}

.read-page{max-width:74ch;padding-bottom:2rem}.read-page .tool-head{padding-bottom:2.5rem}.converter-grid+.toolbar{margin-top:1rem}.counter-report>.field-label{margin-top:0}

/* Writing takes the first viewport; notes remain one click away. */
body[data-notepad] .np-head{padding:1rem 0}
.home-intro{grid-template-columns:1fr 120px;gap:1rem}
.home-intro h1{font-size:2rem;max-width:none;margin-bottom:.35rem}
.home-intro p{max-width:none;font-size:.875rem}
.hero-art{width:120px;height:80px}
.np-side{display:none;position:fixed;inset:0 auto 0 0;width:min(22rem,88vw);max-height:none;z-index:40;border-radius:0;box-shadow:var(--shadow);padding-top:1rem}
.np-side.open{display:flex}.np-side .np-close,.np-drawer-toggle{display:inline-flex}.np-list{max-height:none}
[data-action=drawer] .lbl{display:inline}
.np-main textarea.np-editor{height:max(28rem,calc(100dvh - 21rem));min-height:24rem;padding:1.25rem 1.5rem}
.md-app .np-main textarea.np-editor{height:max(28rem,calc(100dvh - 21rem));min-height:24rem}
.md-preview{height:max(33rem,calc(100dvh - 16rem))}
.np-toolbar{padding:.6rem .8rem}.np-toolbar .btn{min-height:44px}
@media(max-width:720px){
 .home-intro{grid-template-columns:minmax(0,1fr) 76px;gap:.5rem}
 .home-intro h1{font-size:1.5rem;max-width:none;line-height:1.18}
 .home-intro h1 span{display:block}
 .home-intro p{font-size:.8125rem}
 .hero-art{width:76px;height:60px}
 .np-toolbar{padding:.4rem;gap:.1rem}
 .np-main textarea.np-editor,.md-app .np-main textarea.np-editor{height:max(25rem,calc(100dvh - 22rem));min-height:23rem;padding:1rem}
 .md-preview{height:auto;min-height:25rem}
}

@media(max-width:360px){.site-nav{display:grid;grid-template-columns:1fr 1fr;width:100%}.site-nav a{justify-content:center}.home-intro{grid-template-columns:1fr}.hero-art{display:none}}

.nf{padding-top:2rem}.nf h1{margin-bottom:.75rem}

/* Visible action names and native writing controls. */
.np-toolbar .btn{padding:.55rem .6rem}.np-toolbar .btn .lbl,.np-toolbar [data-action=focus] .lbl,.np-toolbar [data-action=download] .lbl{display:inline}
.size-controls{display:inline-flex;align-items:center;gap:.1rem;flex:none}.size-controls output{min-width:3.25rem;text-align:center;font:650 .8125rem/1.35 var(--sans);font-variant-numeric:tabular-nums}
.editor-color{display:inline-flex;align-items:center;gap:.4rem;min-height:44px;padding:.5rem .6rem;border-radius:8px;cursor:pointer;white-space:nowrap;font:650 .8125rem/1.35 var(--sans)}.editor-color:hover{background:var(--bg-2)}.editor-color:focus-within{outline:2px solid var(--accent);outline-offset:-2px}
.editor-color input{width:1.6rem;height:1.6rem;padding:0;cursor:pointer;border:1px solid var(--line);border-radius:5px;background:transparent}.editor-color input::-webkit-color-swatch-wrapper{padding:2px}.editor-color input::-webkit-color-swatch{border:0;border-radius:3px}.editor-color input::-moz-color-swatch{border:0;border-radius:3px}
.more-tools{display:flex;flex-wrap:wrap;gap:.25rem;align-items:center;flex-basis:100%;padding-top:.5rem;border-top:1px solid var(--line)}.appearance-note{flex-basis:100%;margin:.25rem .6rem;font-size:.75rem;color:var(--ink-2)}
textarea.np-editor{color:var(--editor-ink,var(--ink));background:var(--editor-paper,var(--surface));caret-color:currentColor}textarea.np-editor::placeholder{color:inherit;opacity:.7}
.editor-tooltip{position:fixed;z-index:70;width:max-content;max-width:min(20rem,calc(100vw - 24px));padding:.85rem 1rem;border-radius:10px;background:var(--ink);color:var(--surface);font:500 .875rem/1.55 var(--sans);pointer-events:auto}
@media(max-width:720px){.np-toolbar .btn{padding:.5rem .45rem;font-size:.75rem}.np-toolbar svg.i{width:18px;height:18px}.editor-color{padding:.5rem .4rem;font-size:.75rem}.size-controls output{min-width:2.75rem}.appearance-note{margin:.35rem}}
@media print{.editor-tooltip{display:none}}
