/* singular hacker — green/amber phosphor; strictly relative; no JS */
:root{
  --bg:#0a0d0a; --panel:#0f120f; --ink:#b9ffbf; --muted:#84a88a; --line:rgba(127,255,127,.18);
  --brand:#7cffd3;
  --mono: ui-monospace, "Liberation Mono", Menlo, Consolas, monospace;
}
html,body{margin:0; height:100%}
html{color-scheme: dark}
body{background:var(--bg); color:var(--ink); font:16px/1.55 var(--mono); text-rendering:optimizeLegibility;}
*{box-sizing:border-box}
.wrap{max-width: 78ch; margin-inline:auto; padding: .9rem}
.head{display:flex; align-items:center; justify-content:space-between; gap:1rem; position:relative}
.brand{display:flex; align-items:center; gap:.6rem; text-decoration:none; color:var(--ink); font-weight:700}
.nav a{color:var(--ink); text-decoration:none; padding:.2rem .5rem; border:1px solid transparent; border-radius:8px}
.nav a:hover{border-color:var(--line)}
.card{background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:1rem; position:relative; box-shadow:0 0 0 1px rgba(0,0,0,.2) inset}
.term{position:relative; overflow:hidden}
.term::after{content:""; position:absolute; inset:0; background:repeating-linear-gradient(to bottom, rgba(0,0,0,.0) 0, rgba(0,0,0,.05) 2px, rgba(0,0,0,0) 4px); mix-blend-mode: soft-light; opacity:.6; pointer-events:none}
h1,h2{margin:.2rem 0 .6rem}
pre,code{font-family:var(--mono)}
pre{white-space:pre-wrap; word-break:break-word}
pre.code{background:#060; color:#c0ffc0; border:1px solid var(--line); padding:.6rem .8rem; border-radius:8px}
.ps1{color:#7cff7c}
.path{color:#9aff9a}
.cmd{color:#b2ffb2}
.cursor{display:inline-block; width:.6em; height:1em; background:rgba(124,255,124,.65); vertical-align:-.2em; animation: blink 1.1s steps(2, start) infinite}
@keyframes blink{ 50%{opacity:0} }
.grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(220px,1fr)); gap:1rem; margin-block:1rem}
.muted{color:var(--muted)} .tiny{font-size:.9rem; opacity:.9}
.banner-wrap{display:flex; justify-content:center}
.banner{width:100%; max-width:468px; height:62.6px; border:0}
.skip{position:absolute; left:-9999px;} .skip:focus{left:1rem; top:1rem; background:var(--panel); padding:.3rem .5rem; border:1px solid var(--line); border-radius:6px}
a{color:var(--ink); text-underline-offset:.15em} a:hover{text-decoration:underline}

.green :root, .green body{}
.amber{--ink:#ffd7a1; --muted:#bfa383; --line:rgba(255,196,125,.22);}
.amber .ps1{color:#ffde9a} .amber .path{color:#ffd7a1} .amber .cmd{color:#ffe1b8}
