/* Hallmark · shape: app screen · genre: editorial · theme: Loom (deal 2/3, seed fontbox-e90b·d682b69c·2026-11-06·r0)
 * nav: top bar · signature: live mixed-language type specimens · states: empty full error disabled busy success · loom: ecru
 * axes: light/system-sans/cool · posture: restrained · contrast: inspected, measured separately · v2.0.0 */
/* Hallmark · pre-emit critique: P4 H4 E3 S4 R5 V3 · weakest: E, verify long mixed-script text and selection on mobile */
@import url('./tokens.css');
@import url('./base.css');
.shell{max-width:1164px;margin-inline:auto;padding-inline:var(--gap-columns)}
.site-header{border-bottom:1px solid var(--color-rule)}
.header-inner{min-height:84px;display:flex;align-items:center;justify-content:space-between;gap:var(--space-lg)}
.brand{display:inline-flex;align-items:center;gap:var(--space-sm);font-size:24px;font-weight:600;text-decoration:none;letter-spacing:-.03em}
.brand svg{width:32px;height:32px;flex-shrink:0}
nav{display:flex;gap:var(--space-lg)}nav a{display:flex;align-items:center;min-height:44px;text-decoration:none;font-size:14px;color:var(--color-muted)}nav a[aria-current]{color:var(--color-ink);text-decoration:underline;text-underline-offset:8px}
.intro{padding-block:var(--space-xl) var(--gap-columns)}.intro h1{font-size:32px;line-height:1.4;margin-bottom:var(--space-xs);max-width:none;letter-spacing:-.02em}.intro p{color:var(--color-muted);font-size:16px}
.workspace{display:grid;grid-template-columns:minmax(0,360px) minmax(0,1fr);gap:48px;align-items:start}
.editor{position:sticky;top:24px;min-width:0}.section-head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-sm);margin-bottom:var(--space-md)}.section-head h2{font-size:18px;line-height:1.5}.small{font-size:14px;line-height:1.6;color:var(--color-muted)}#counter{font-variant-numeric:tabular-nums;white-space:nowrap}
button{border:1px solid var(--color-muted);background:var(--color-paper);color:var(--color-ink);min-height:44px;padding:var(--space-xs) var(--space-md);border-radius:4px;cursor:pointer;font-size:14px;line-height:1.5;font-weight:500}
button:disabled{opacity:.5;cursor:not-allowed}button:active:not(:disabled){transform:translateY(1px)}button[aria-busy=true]{cursor:progress}.primary{background:var(--color-accent);border-color:var(--color-accent);color:var(--color-accent-ink)}
@media(hover:hover){button:hover:not(:disabled){background:var(--color-paper-2)}.primary:hover:not(:disabled){background:var(--color-accent-2);border-color:var(--color-accent-2)}a:hover{color:var(--color-accent)}summary:hover{color:var(--color-accent)}}
textarea,input{width:100%;min-width:0;padding:var(--space-md);border:1px solid var(--color-muted);border-radius:4px;background:var(--color-paper);color:var(--color-ink);font-size:16px;line-height:1.7;caret-color:var(--color-accent)}textarea{display:block;resize:vertical;min-height:170px}textarea::placeholder,input::placeholder{color:var(--color-muted);opacity:1}input{min-height:44px;padding:var(--space-xs) var(--space-sm)}textarea:focus-visible,input:focus-visible{outline-offset:-3px}textarea[aria-invalid=true]{border-color:var(--color-error)}
#input-hint{margin-top:var(--space-xs)}.error{color:var(--color-error);font-size:14px;margin-top:var(--space-xs)}.editor-actions{display:flex;flex-wrap:wrap;gap:var(--space-xs);margin-top:var(--space-md)}.editor-actions button{padding-inline:var(--space-sm)}.scope-controls{margin-top:var(--space-lg);padding-top:20px;border-top:1px solid var(--color-rule)}#scope{overflow-wrap:anywhere;white-space:pre-wrap;max-height:96px;overflow:auto}#whole{margin-top:var(--space-xs)}details{border-bottom:1px solid var(--color-rule)}summary{cursor:pointer;min-height:48px;padding-block:var(--space-sm);list-style-position:inside;font-size:14px;font-weight:500}details p{margin-bottom:var(--space-sm)}#use-selection{margin-bottom:var(--space-md)}#piece-form label{display:block;font-size:14px;margin-bottom:var(--space-xs)}.piece-row{display:flex;align-items:center;gap:var(--space-xs)}.piece-row button{flex-shrink:0;padding-inline:var(--space-sm)}#piece-status{margin-top:var(--space-xs)}.original-actions{margin-top:var(--space-lg)}.original-actions p{margin-top:var(--space-sm)}#copy-original{border-color:var(--color-rule)}.copy-status{font-size:14px;color:var(--color-accent);min-height:24px;margin-top:var(--space-sm)}
.filters{display:flex;flex-wrap:wrap;gap:var(--space-2xs);border-bottom:1px solid var(--color-rule);padding-bottom:var(--space-sm)}.filters button{border-color:var(--color-paper);padding-inline:var(--space-md)}.filters button[aria-pressed=true]{background:var(--color-ink);color:var(--color-paper);border-color:var(--color-ink)}.sample-note{margin-top:var(--space-md)}.style-row{padding-block:20px;border-bottom:1px solid var(--color-rule)}.style-label{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-xs)}.style-label h3{font-size:14px;line-height:1.6;font-weight:500}.style-label .small{font-size:12px}.preview-text{font-family:var(--font-result);font-size:29px;line-height:1.6;margin-block:var(--space-sm);overflow-wrap:anywhere;white-space:pre-wrap;max-height:192px;overflow:auto;unicode-bidi:plaintext}.result-bottom{display:flex;justify-content:space-between;align-items:center;gap:var(--space-sm)}.copy{min-width:80px}.result-hint{font-size:12px}.back-input{display:inline-flex;min-height:44px;align-items:center;margin-top:var(--space-md);font-size:14px}
.manual{margin-top:var(--space-md);padding-top:var(--space-md);border-top:1px solid var(--color-muted)}.manual h3{margin-bottom:var(--space-xs)}.manual textarea{min-height:100px;margin-top:var(--space-sm)}
.guide{display:grid;grid-template-columns:minmax(0,360px) minmax(0,1fr);gap:48px;border-top:1px solid var(--color-muted);padding-top:var(--gap-columns);margin-block:var(--space-xl) var(--space-2xl)}.guide h2{font-size:22px;line-height:1.5}.guide-content>p{margin-bottom:var(--space-md)}.guide-content> a{display:inline-flex;min-height:44px;align-items:center;margin-top:var(--space-md)}.guide-content summary{font-size:16px}.guide-content details p{color:var(--color-muted);font-size:15px}
.ad-wrap{margin-block:var(--space-lg)}.ad-wrap:has([hidden]){display:none}[data-tool-ad-slot]{max-width:728px;margin-inline:auto;min-height:120px;padding:20px;background:var(--color-paper-2)}.th-ad-label{font-size:12px;color:var(--color-muted);margin-bottom:var(--space-xs)}.th-ad-content{overflow-wrap:anywhere}.th-ad-content a{color:var(--color-ink)}
.prose{max-width:760px;margin-bottom:var(--space-2xl)}.prose h2{margin-block:var(--gap-columns) var(--space-sm);line-height:1.5}.prose p{margin-bottom:var(--space-md);line-height:1.8}.support-list>div{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:var(--space-2xs) var(--space-lg);padding-block:var(--space-md);border-bottom:1px solid var(--color-rule)}.support-list h3{line-height:1.6}.support-list p{font-size:14px;margin:0}.support-example{font-family:var(--font-result);font-size:22px;grid-column:1/-1;overflow-wrap:anywhere}footer{border-top:1px solid var(--color-rule)}.footer-inner{display:flex;justify-content:space-between;align-items:center;gap:var(--space-lg);min-height:100px;font-size:14px}.footer-inner>div{display:flex;gap:var(--space-lg)}.footer-inner a{min-height:44px;display:inline-flex;align-items:center}.skip{position:fixed;left:16px;top:-100px;padding:var(--space-sm);background:var(--color-ink);color:var(--color-paper);z-index:var(--z-sticky-nav)}.skip:focus{top:12px}.notice{padding:var(--space-md);background:var(--color-paper-2);margin-bottom:var(--space-lg)}
@media(max-width:800px){.shell{padding-inline:var(--space-lg)}.workspace,.guide{grid-template-columns:minmax(0,1fr);gap:var(--gap-columns)}.editor{position:static}.intro{padding-block:var(--gap-columns) var(--space-lg)}.original-actions{display:flex;align-items:center;gap:var(--space-md)}.original-actions p{margin:0}.copy-status{margin-top:var(--space-xs)}.guide{margin-top:var(--gap-columns)}.support-list>div{grid-template-columns:minmax(0,1fr)}.support-example{grid-column:auto}}
@media(max-width:400px){.shell{padding-inline:var(--space-md)}.header-inner{min-height:72px;gap:var(--space-sm)}.brand{font-size:22px;gap:var(--space-xs)}.brand svg{width:28px;height:28px}nav{gap:var(--space-md)}nav a{font-size:13px}.intro h1{font-size:27px}.section-head{gap:var(--space-xs)}.section-head h2{font-size:17px}.section-head .small{font-size:12px}.preview-text{font-size:25px}.filters button{padding-inline:var(--space-sm)}.footer-inner{flex-wrap:wrap;gap:0;padding-block:20px}.original-actions{align-items:flex-start}.original-actions button{flex-shrink:0}.style-label{align-items:flex-start}.style-label .small{text-align:right}}
@media(max-width:800px){#source{height:128px;min-height:112px}.intro{padding-block:var(--space-lg)}.scope-controls{margin-top:var(--space-md);padding-top:var(--space-sm)}.original-actions{margin-top:var(--space-md)}.workspace{gap:var(--space-lg)}}
.editor:has(#partial[open]),.editor:has(#manual:not([hidden])){position:static}