:root{color-scheme:dark;--screen:#0a0a08;--panel:#11110d;--text:#d8d6cc;--muted:#a4a196;--rule:#4a4944;--ghost:#26251f;--viewport-height:100dvh;font-family:"Cascadia Mono","Cascadia Code",Consolas,"Liberation Mono",monospace;font-size:16px;font-weight:400;line-height:1.45}
*{box-sizing:border-box}
html{min-height:100%;background:var(--screen)}
body{margin:0;min-height:100vh;min-height:var(--viewport-height);padding:24px max(20px,env(safe-area-inset-right)) 24px max(20px,env(safe-area-inset-left));display:grid;place-items:center;color:var(--text);background:var(--screen);isolation:isolate}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:url("noise-bg.png") center/cover;opacity:.12}
button,input{font:inherit;color:inherit;border-radius:0}
button,a,input{touch-action:manipulation}
button{background:transparent;cursor:pointer}
button:hover{color:var(--screen);background:var(--text)}
button:focus-visible,a:focus-visible,.transcript:focus-visible{outline:2px solid var(--text);outline-offset:3px}
::selection{background:var(--text);color:var(--screen)}
.terminal{width:min(100%,520px);height:min(840px,calc(var(--viewport-height) - 48px));min-height:300px;display:flex;flex-direction:column;border:1px solid var(--rule);background:rgba(10,10,8,.87);position:relative}
.titlebar{min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding-left:12px;background:var(--panel);border-bottom:1px solid var(--rule);font-size:.75rem;color:var(--muted);flex-shrink:0}
.identity{display:flex;align-items:center;gap:8px;white-space:nowrap;letter-spacing:.035em}
.square{width:8px;height:8px;background:var(--muted);flex-shrink:0}
.help{align-self:stretch;min-width:88px;min-height:44px;border:0;border-left:1px solid var(--ghost);padding:0 10px;font-size:.75rem}
.masthead{padding:26px 14px 24px;border-bottom:1px solid var(--rule);flex-shrink:0;position:relative}
.ascii{position:relative;width:max-content;max-width:100%;margin:0 auto;color:var(--text);font:14px/1.05 "Cascadia Mono",Consolas,"Liberation Mono",monospace;letter-spacing:0;white-space:pre;-webkit-text-size-adjust:none;text-size-adjust:none;font-variant-ligatures:none}
.ascii::after{content:"";position:absolute;left:0;right:0;top:42%;height:1px;background:var(--screen);box-shadow:1px 1px 0 rgba(216,214,204,.08);pointer-events:none}

.transcript{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:18px 16px;scrollbar-width:thin;scrollbar-color:var(--rule) transparent;overflow-wrap:anywhere}
.transcript p{margin:0 0 16px}
.command-echo{color:var(--muted);font-size:.875rem}
.choices{display:grid;gap:8px;align-content:start}
.choice{display:flex;text-align:left;align-items:center;min-height:44px;padding:8px 12px;border:1px solid var(--rule);width:100%;gap:12px}
.choice-key{color:var(--muted)}
.choice:hover .choice-key{color:inherit}
.prompt{display:flex;align-items:center;gap:10px;border-top:1px solid var(--rule);padding:10px 12px;flex-shrink:0;min-height:68px;background:var(--panel)}
.prompt:focus-within{box-shadow:inset 0 -2px var(--text)}
.prompt-label{white-space:nowrap;color:var(--muted);font-size:.875rem}
.input-wrap{position:relative;flex:1;min-width:0;overflow:hidden}
#command{display:block;background:transparent;border:0;outline:0;line-height:24px;padding:4px 0;width:100%;min-width:0;caret-color:transparent;font-size:1rem;letter-spacing:0}
.block-caret{position:absolute;left:0;top:5px;width:1ch;height:22px;line-height:22px;background:var(--text);color:var(--screen);pointer-events:none;white-space:pre;text-align:center;opacity:.65}
.input-wrap:focus-within .block-caret{opacity:1;animation:caret-blink 1.1s steps(1,end) infinite}
.block-caret[hidden]{display:none}
.measure{position:absolute;visibility:hidden;white-space:pre;font:inherit;letter-spacing:0}
.submit{min-width:44px;min-height:44px;flex-shrink:0;border:1px solid var(--rule);font-size:1.25rem;padding:0}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.no-script{padding:12px;margin:0;font-size:.875rem}
a{color:var(--text)}
@keyframes caret-blink{0%,49%{opacity:1}50%,100%{opacity:0}}
@media(max-width:767px){
  body{padding:max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));align-items:start}
  body::before{opacity:.065}
  .terminal{width:100%;height:calc(var(--viewport-height) - max(12px,env(safe-area-inset-top)) - max(12px,env(safe-area-inset-bottom)));min-height:260px}
  .masthead{padding:24px 10px;container-type:inline-size}
  .ascii-full{font-size:clamp(9px,3.2vw,14px);font-size:min(14px,calc(100cqw / 27));line-height:1.05}

  .prompt-name{display:none}
  .prompt{padding:8px 10px;gap:8px;min-height:62px}
  .transcript{padding:16px 12px}
}
@media(max-height:520px){.masthead{padding-top:10px;padding-bottom:10px}.terminal{min-height:240px}.titlebar,.help{min-height:40px}.transcript{padding-top:10px;padding-bottom:10px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;scroll-behavior:auto!important}.block-caret{opacity:1}}
@media(forced-colors:active){body::before,.ascii::after{display:none}#command{caret-color:auto}.block-caret{display:none}.prompt:focus-within{outline:1px solid CanvasText}}
