:root{--bg: #000;--fg: #fff;--muted: #888;--dim: #555;--line: #1a1a1a;--line-strong: #2a2a2a;--panel: #0a0a0a;--ok: #c8c8c8;--err: #ff6b6b;--font: "IBM Plex Sans", system-ui, sans-serif;--mono: "IBM Plex Mono", ui-monospace, monospace;color-scheme:dark}*,*:before,*:after{box-sizing:border-box}html,body,#root{min-height:100%}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--font);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased}a{color:var(--fg);text-decoration:none}a:hover{color:var(--muted)}code{font-family:var(--mono);font-size:.92em}button,input,textarea{font:inherit;color:inherit}.page{width:min(960px,calc(100% - 2.5rem));margin:0 auto;padding-bottom:4rem}.nav{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.25rem 0;border-bottom:1px solid var(--line);animation:fade .5s ease both}.nav-brand{display:flex;align-items:center;gap:.55rem;font-family:var(--mono);font-weight:500;font-size:.95rem;flex-shrink:0}.mark{width:0;height:0;border-left:7px solid var(--fg);border-top:5px solid transparent;border-bottom:5px solid transparent}.gh-link{display:inline-flex;align-items:center;gap:.45rem;font-family:var(--mono);font-size:.8rem;color:var(--muted)}.gh-link:hover{color:var(--fg)}.gh-icon{display:block}.hero{padding:2.75rem 0 2.25rem;border-bottom:1px solid var(--line)}.ascii{margin:0 0 1.25rem;overflow-x:auto;color:var(--fg);font-family:var(--mono);font-size:clamp(5px,1.15vw,11px);line-height:1.15;animation:fade .7s ease both}.eyebrow{margin:0 0 1.25rem;font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;color:var(--muted);text-transform:uppercase;animation:fade .75s 40ms ease both}.hero-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:2rem;align-items:start;animation:fade .8s 80ms ease both}.lede{margin:0;max-width:38ch;color:var(--muted);font-size:.98rem}.lede code{color:var(--fg)}.cta-block .label{margin-bottom:.55rem;font-family:var(--mono);font-size:.68rem;letter-spacing:.12em;color:var(--muted)}.cmd{display:flex;align-items:center;gap:.65rem;width:100%;padding:.7rem .85rem;border:1px solid var(--line-strong);background:var(--panel)}.cmd-prompt{color:var(--dim);font-family:var(--mono)}.cmd code{flex:1;font-size:.85rem}.copy-btn{appearance:none;border:none;background:none;padding:0;font-family:var(--mono);font-size:.7rem;color:var(--dim);text-transform:uppercase;letter-spacing:.06em;cursor:pointer}.copy-btn:hover{color:var(--fg)}.example{display:grid;grid-template-columns:1fr 1fr;gap:1.75rem;align-items:start;padding:2.5rem 0;border-bottom:1px solid var(--line);animation:fade .7s ease both}.demo-pane,.code-pane{min-width:0}.playground-head{padding:2.5rem 0 .5rem;border-bottom:1px solid var(--line);animation:fade .7s ease both}.playground-title{margin:0 0 .75rem;font-family:var(--mono);font-size:clamp(1.25rem,3vw,1.65rem);font-weight:500;letter-spacing:-.02em}.playground-head .lede{margin-bottom:1.5rem}.status-board{margin:0 0 .5rem;border:1px solid var(--line-strong);background:var(--panel);font-family:var(--mono);font-size:.78rem;overflow:hidden}.status-board-head,.status-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr) minmax(0,1.4fr) auto;gap:.75rem;align-items:center;padding:.65rem .85rem}.status-board-head{border-bottom:1px solid var(--line);color:var(--dim);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase}.status-board-list{list-style:none;margin:0;padding:0}.status-row{border-bottom:1px solid var(--line)}.status-row:last-child{border-bottom:none}.status-id{color:var(--fg);font-weight:500}.status-id:hover,.status-state{color:var(--muted)}.tone-loading .status-state{color:var(--fg)}.tone-ready .status-state{color:var(--ok)}.tone-error .status-state{color:var(--err)}.status-progress{display:flex;align-items:center;gap:.65rem;min-width:0}.status-track{flex:1;height:2px;background:#1f1f1f;overflow:hidden}.status-fill{display:block;height:100%;width:0;background:var(--fg);transition:width .18s ease}.tone-ready .status-fill{background:var(--ok)}.status-pct{flex-shrink:0;min-width:3.5rem;text-align:right;color:var(--dim)}.status-try{appearance:none;border:1px solid var(--line-strong);background:transparent;color:var(--fg);padding:.3rem .65rem;font-family:var(--mono);font-size:.72rem;cursor:pointer;justify-self:end;white-space:nowrap}.status-try:hover{border-color:var(--fg)}.example-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1.25rem;margin-bottom:1.15rem}.example-head h2{margin:0 0 .35rem;font-family:var(--mono);font-size:1.05rem;font-weight:500;letter-spacing:-.01em}.blurb{margin:0;color:var(--muted);font-size:.92rem}.example-actions{flex-shrink:0}.code{border:1px solid var(--line-strong);background:var(--panel);height:100%}.code-bar{display:flex;justify-content:space-between;align-items:center;padding:.45rem .75rem;border-bottom:1px solid var(--line);font-family:var(--mono);font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--dim)}.code pre,.code .code-pre{margin:0;padding:.85rem .7rem 1.05rem;overflow-x:auto;font-family:var(--mono);font-size:.72rem;line-height:1.55;background:transparent!important;color:#d6deeb}.code code{display:block;font-family:inherit;font-size:inherit;color:inherit}.code .token.comment,.code .token.prolog{color:#637777}.code .token.string,.code .token.attr-value{color:#addb67}.code .token.keyword,.code .token.boolean,.code .token.operator{color:#c792ea}.code .token.function,.code .token.class-name{color:#82aaff}.code .token.number,.code .token.constant,.code .token.builtin{color:#f78c6c}.code .token.punctuation{color:#c792ea}.code .token.property,.code .token.attr-name{color:#80cbc4}.line-no{display:inline-block;width:2rem;margin-right:.75rem;color:var(--dim);text-align:right;user-select:none}.meter{display:flex;flex-direction:column;gap:.45rem}.meter-row,.meter-meta{display:flex;justify-content:space-between;gap:1rem;font-family:var(--mono);font-size:.72rem}.meter-row{color:var(--muted)}.meter-meta{color:var(--dim)}.status-ready{color:var(--ok)}.status-loading{color:var(--fg)}.status-error{color:var(--err)}.track{height:2px;background:#1f1f1f;overflow:hidden}.fill{height:100%;width:0;background:var(--fg);transition:width .18s ease}.fill.indeterminate{width:30%!important;animation:slide 1s ease-in-out infinite}.try{display:flex;flex-direction:column;gap:.85rem;margin-top:1.15rem;padding-top:1.15rem;border-top:1px solid var(--line)}.field{display:flex;flex-direction:column;gap:.35rem}.field>span{font-family:var(--mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}.field textarea,.field input{width:100%;padding:.7rem .8rem;border:1px solid var(--line-strong);border-radius:0;background:var(--panel);outline:none;font-family:var(--mono);font-size:16px;resize:vertical}.field textarea:focus,.field input:focus{border-color:#555}.hint{margin:0;color:var(--muted);font-family:var(--mono);font-size:.82rem}.try-row{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}.thumbs{display:flex;gap:.5rem;flex-wrap:wrap}.thumb{appearance:none;padding:0;border:1px solid var(--line-strong);background:transparent;width:4.25rem;height:4.25rem;overflow:hidden;cursor:pointer}.thumb.is-active{border-color:var(--fg)}.thumb img,.preview img{display:block;width:100%;height:100%;object-fit:cover}.preview{margin-top:.55rem;width:min(100%,16rem);aspect-ratio:4 / 3;border:1px solid var(--line-strong);overflow:hidden;background:#111}.upload{margin-top:.55rem;font-family:var(--mono);font-size:.75rem;color:var(--muted);text-decoration:underline;text-underline-offset:3px;cursor:pointer;width:fit-content}.upload input{display:none}.upload:hover{color:var(--fg)}.ranked{list-style:none;margin:.35rem 0 0;padding:0;width:min(100%,22rem);font-family:var(--mono);font-size:.8rem}.ranked li{display:flex;justify-content:space-between;gap:1rem;padding:.4rem 0;border-bottom:1px solid var(--line)}.result-stack{display:flex;flex-direction:column;gap:.35rem}.primary,.ghost{appearance:none;padding:.55rem .95rem;font-family:var(--mono);font-size:.78rem;cursor:pointer;transition:opacity .12s ease}.primary{border:1px solid var(--fg);background:var(--fg);color:var(--bg)}.ghost{border:1px solid var(--line-strong);background:transparent;color:var(--fg)}.primary:hover:not(:disabled),.ghost:hover:not(:disabled){opacity:.85}.primary:disabled,.ghost:disabled{opacity:.5;cursor:default}.out{font-family:var(--mono);font-size:.9rem}.muted{color:var(--muted)}.err{color:var(--err)}.footer{display:flex;justify-content:space-between;margin-top:3rem;padding-top:1.25rem;border-top:1px solid var(--line);font-family:var(--mono);font-size:.72rem;color:var(--dim)}.footer a{color:var(--muted)}@keyframes fade{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@keyframes slide{0%{transform:translate(-120%)}to{transform:translate(320%)}}@media(max-width:820px){.hero-grid,.example{grid-template-columns:1fr;gap:1.5rem}.example.code-first .code-pane{order:2}.example.code-first .demo-pane{order:1}.example-head{flex-direction:column}.ascii{font-size:4.5px}.status-board-head{display:none}.status-row{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"id try" "state try" "progress progress";gap:.45rem .75rem;padding:.75rem .85rem}.status-id{grid-area:id}.status-state{grid-area:state}.status-progress{grid-area:progress}.status-try{grid-area:try;align-self:start}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero,.nav,.example,.ascii,.eyebrow,.hero-grid,.fill{animation:none!important;transition:none!important}}
