:root{
  color-scheme:dark;
  --bg:#09080B; --ink:#E6E3EC; --muted:#8C8796; --dim:#57535F; --line:#1E1C22; --accent:#9C82F5;
  --mono:"JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;background:var(--bg);color:var(--ink);font:14px/1.75 var(--mono);-webkit-font-smoothing:antialiased;display:flex;flex-direction:column}
a{color:inherit}
:focus-visible{outline:1px solid var(--accent);outline-offset:3px}

.shell{flex:1;width:100%;max-width:1200px;margin:0 auto;padding:clamp(28px,7vh,72px) clamp(20px,4vw,48px) 40px}
.cmdline{color:var(--muted);min-height:1.75em}
.ps{color:var(--accent)}
#typed{color:var(--ink)}
.caret{display:inline-block;width:.6em;height:1.15em;margin-left:2px;vertical-align:-.2em;background:var(--accent);animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}

.out{margin-top:22px}
.out > *{margin:0 0 10px}
.out .ln-in{animation:ln .3s ease both}
@keyframes ln{from{opacity:0;transform:translateX(-4px)}}
h1{font-size:clamp(20px,2.2vw,30px);font-weight:700;letter-spacing:-.01em;margin-bottom:4px!important}
.dim{color:var(--dim)}
.out p{color:var(--muted);max-width:76ch}
.cols{color:var(--ink)!important;max-width:none}
.item{display:grid;grid-template-columns:clamp(150px,22vw,280px) minmax(0,1fr);gap:clamp(16px,3vw,40px);padding-block:9px;border-bottom:1px dashed var(--line);margin:0!important}
.item a{text-decoration:none;overflow-wrap:anywhere}
.item a:hover{color:var(--accent)}

.keys{position:sticky;bottom:0;display:flex;align-items:center;gap:22px;flex-wrap:wrap;width:100%;max-width:1200px;margin:0 auto;padding:18px clamp(20px,4vw,48px) calc(22px + env(safe-area-inset-bottom,0px));background:linear-gradient(transparent,var(--bg) 40%);font-size:12.5px}
.keys a{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--muted)}
.keys a:hover{color:var(--ink)}
.keys a[aria-current="page"]{color:var(--ink)}
kbd{font:500 11px/1 var(--mono);border:1px solid var(--line);border-bottom-width:2px;border-radius:4px;padding:3px 6px;color:var(--muted)}
.keys a[aria-current="page"] kbd{border-color:var(--accent);color:var(--accent)}
.sig{margin-left:auto;color:var(--dim)}

@media (max-width:600px){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .shell{padding-top:48px}
  .item{grid-template-columns:minmax(0,1fr);gap:0}
  .keys{gap:14px}
  .sig{margin-left:0;width:100%}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}