:root{
  --bg:#0b0f1a; --fg:#e8ecf6; --muted:#8b95b0; --a:#7c9cff; --b:#b07cff; --ok:#5ee6a8; --warn:#ffcf6e;
  --panel:#10162a; --line:rgba(255,255,255,.1); --grid:rgba(255,255,255,.045);
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
}
[data-theme=light]{--bg:#f5f6fb;--fg:#161b2e;--muted:#5d6785;--a:#3a5bdc;--b:#7b3fd1;--ok:#0c8f5c;--warn:#a86a00;--panel:#fff;--line:rgba(0,0,0,.12);--grid:rgba(0,0,0,.05)}
[data-theme=matrix]{--bg:#030a05;--fg:#b8ffcf;--muted:#4f9c68;--a:#2dff7a;--b:#9dff2d;--ok:#2dff7a;--warn:#e6ff5e;--panel:#07140b;--line:rgba(45,255,122,.2);--grid:rgba(45,255,122,.05)}
[data-theme=amber]{--bg:#140c00;--fg:#ffd48a;--muted:#b0813a;--a:#ffb000;--b:#ff7a00;--ok:#ffd24d;--warn:#fff0a8;--panel:#1d1100;--line:rgba(255,176,0,.2);--grid:rgba(255,176,0,.05)}
*{box-sizing:border-box;margin:0}
html,body{height:100%}
body{background:var(--bg);color:var(--fg);font-family:var(--mono);font-size:14px;line-height:1.55;
  background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:40px 40px;
  padding:.6rem .6rem 0;display:flex;flex-direction:column;align-items:center;transition:background-color .3s,color .3s;-webkit-font-smoothing:antialiased}
a{color:var(--a);text-underline-offset:3px}
.win{flex:1;min-height:0;width:100%;max-width:960px;display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:12px;
  box-shadow:0 20px 60px rgba(0,0,0,.35);overflow:hidden}
#screen{flex:1;overflow-y:auto;padding:.9rem .9rem .4rem;cursor:text;scroll-behavior:smooth}
.line{white-space:pre-wrap;word-break:break-word;overflow-wrap:anywhere}
.cmdline .p{color:var(--ok)}.cmdline .d{color:var(--a)}
.h{color:var(--a);font-weight:700}.m{color:var(--muted)}.w{color:var(--warn)}.g{color:var(--ok)}
.out{margin:.15rem 0 .8rem}
h1.line{font-size:1em}
.card{border-left:2px solid var(--a);padding:.1rem 0 .1rem .75rem;margin:.45rem 0}
.card b{color:var(--fg)}
.tags{}
.tags span{display:inline-block;border:1px solid var(--line);border-radius:999px;padding:0 .55rem;font-size:.72rem;color:var(--muted);margin:.15rem .25rem 0 0}
.badge{font-size:.68rem;border:1px solid var(--line);border-radius:4px;padding:0 .35rem;color:var(--muted)}
.st-active,.st-shipped{color:var(--ok)}.st-wip{color:var(--warn)}
progress.meter{-webkit-appearance:none;appearance:none;width:100%;height:.5rem;border:0;border-radius:99px;background:var(--line);overflow:hidden}
progress.meter::-webkit-progress-bar{background:var(--line)}
progress.meter::-webkit-progress-value{background:linear-gradient(90deg,var(--a),var(--b));border-radius:99px}
progress.meter::-moz-progress-bar{background:linear-gradient(90deg,var(--a),var(--b));border-radius:99px}
.ascii{color:var(--a);font-size:clamp(7px,2.4vw,13px);line-height:1.15;white-space:pre;overflow:hidden;margin:0 0 .5rem}
.cmdcol{display:inline-block;min-width:11ch}
.helprow{display:grid;grid-template-columns:12ch 1fr;gap:.5rem}
.helprow .cmdcol{min-width:0}
code{background:var(--line);border-radius:4px;padding:0 .3em}
pre{font-family:inherit}
.post h2,.post h3,.post h4{color:var(--a);font-size:1em;margin:.5rem 0 .1rem}.post ul{padding-left:1.4rem}.post p{margin:.3rem 0}
.promptrow{display:flex;align-items:center;gap:.5ch;padding:.1rem .9rem calc(.6rem + env(safe-area-inset-bottom));flex:none}
.gap{margin-top:.5rem}
.hints{flex:none;width:100%;max-width:960px;padding:.55rem .9rem calc(.7rem + env(safe-area-inset-bottom));color:var(--muted);font-size:.8rem}
.hints p{margin:0}
.plabel{white-space:nowrap}
.promptrow .p{color:var(--ok)}.promptrow .d{color:var(--a)}
#in{flex:1;min-width:0;background:transparent;border:0;outline:0;color:var(--fg);font:inherit;caret-color:var(--a);padding:.3rem 0}
:focus-visible{outline:2px solid var(--a);outline-offset:2px}
@media(min-width:900px){
  body{font-size:15px}
  body{padding:1.5rem 1.5rem 0}
}
@media(prefers-reduced-motion:reduce){#screen{scroll-behavior:auto}body{transition:none}}
