:root{
  --bg:#070b07; --bg2:#0d150d; --fg:#8dff9e; --dim:#3f8f4f;
  --acc:#2bff62; --line:#1b3a1f; --panel:#0b120b;
}
body.amber{
  --bg:#0d0803; --bg2:#171006; --fg:#ffc06a; --dim:#8a5a20;
  --acc:#ffae2b; --line:#4a3111; --panel:#130d05;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:radial-gradient(1100px 550px at 50% -10%,var(--bg2),transparent 70%),var(--bg);
  color:var(--fg); font-family:"Courier New",Courier,ui-monospace,monospace;
  font-size:16px; line-height:1.6; min-height:100vh;
  -webkit-font-smoothing:antialiased; transition:background .25s,color .25s;
}
body::after{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:9999;
  background:repeating-linear-gradient(to bottom,rgba(0,0,0,0) 0 2px,rgba(0,0,0,.16) 2px 4px);
  opacity:.35;
}
::selection{background:var(--acc);color:#000}
a{color:var(--acc);text-decoration:none;border-bottom:1px dashed var(--dim)}
a:hover{border-bottom-style:solid}
.wrap{max-width:920px;margin:0 auto;padding:0 20px}
h1,h2,h3{margin:0 0 12px;line-height:1.25;font-weight:700;letter-spacing:.5px}
h1{font-size:clamp(22px,4.2vw,34px);text-shadow:0 0 12px rgba(43,255,98,.25)}
h2{font-size:clamp(16px,2.6vw,20px);color:var(--acc)}
h2::before{content:"▍ "}
p{margin:0 0 12px}
.muted{color:var(--dim)}

header{
  position:sticky;top:0;z-index:50;background:rgba(0,0,0,.72);
  backdrop-filter:blur(6px);border-bottom:1px solid var(--line);
}
.top-in{display:flex;align-items:center;gap:16px;padding:12px 20px;flex-wrap:wrap}
.logo{
  display:flex;align-items:center;gap:8px;font-weight:700;letter-spacing:2px;font-size:15px;
  color:var(--fg);text-decoration:none;border-bottom:none;transition:color .15s;
  margin-right:auto;
}
.logo:hover{color:var(--acc);border-bottom:none}
.logo-mark{color:var(--acc);animation:blink 1.6s steps(1) infinite}
@keyframes blink{50%{opacity:.15}}
nav{display:flex;gap:14px;flex-wrap:wrap;font-size:13px;align-items:center}
nav a{color:var(--fg);border:none;opacity:.8}
nav a:hover{opacity:1;color:var(--acc)}
nav a.active{color:var(--acc);opacity:1}

.btn{
  font-family:inherit;font-size:14px;letter-spacing:.6px;background:transparent;color:var(--fg);
  border:1px solid var(--line);border-radius:4px;padding:9px 16px;cursor:pointer;
  transition:.15s;text-transform:uppercase;text-decoration:none;display:inline-block;
}
.btn:hover{border-color:var(--acc);color:var(--acc);box-shadow:0 0 12px rgba(43,255,98,.18)}
.btn:active{transform:translateY(1px)}
.btn.solid{background:var(--acc);color:#04120a;border-color:var(--acc);font-weight:700}
.btn.solid:hover{filter:brightness(1.12);color:#04120a}
.btn.small{padding:6px 10px;font-size:11px}
body.amber .btn.solid{color:#1a0f00}

section{padding:44px 0;border-bottom:1px solid var(--line)}
.hero{padding:64px 0 52px}
.hero p{max-width:620px;color:var(--dim)}
.btns{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}

.card{
  background:var(--panel);border:1px solid var(--line);border-radius:6px;
  padding:22px;position:relative;overflow:hidden;
}
.card::before{
  content:"";position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,transparent,var(--acc),transparent);opacity:.5;
}
.tags{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.tag{font-size:11px;letter-spacing:1px;text-transform:uppercase;border:1px solid var(--line);border-radius:3px;padding:2px 8px;color:var(--dim)}
.card h3{font-size:clamp(18px,3vw,24px);color:var(--fg);margin-bottom:14px}
.specs{display:grid;grid-template-columns:130px 1fr;gap:6px 14px;font-size:14px;margin:0 0 16px}
.specs dt{color:var(--dim);text-transform:uppercase;font-size:12px;letter-spacing:1px}
.specs dd{margin:0}
.fact{border-left:2px solid var(--acc);padding-left:14px;color:var(--dim);font-size:14px;margin:0}

.qnum{font-size:12px;letter-spacing:2px;color:var(--dim);text-transform:uppercase;margin-bottom:8px}
.qtext{font-size:16px;margin-bottom:16px}
.opts{display:grid;gap:8px}
.opt{
  text-align:left;font-family:inherit;font-size:14px;background:transparent;color:var(--fg);
  border:1px solid var(--line);border-radius:4px;padding:11px 14px;cursor:pointer;transition:.15s;
}
.opt:hover:not(:disabled){border-color:var(--acc);color:var(--acc)}
.opt:disabled{cursor:default;opacity:.75}
.opt.ok{border-color:var(--acc);background:rgba(43,255,98,.1);color:var(--acc);opacity:1}
.opt.bad{border-color:#ff4d4d;color:#ff6b6b;background:rgba(255,77,77,.08);opacity:1}
.qres{margin-top:16px;font-size:14px;min-height:22px}

.term{background:rgba(0,0,0,.55);border:1px solid var(--line);border-radius:6px;padding:14px;height:280px;overflow-y:auto;font-size:13.5px;line-height:1.55}
.term::-webkit-scrollbar{width:8px}
.term::-webkit-scrollbar-thumb{background:var(--line);border-radius:4px}
.term .echo{color:var(--acc)}
.term .err{color:#ff6b6b}
.term-line{display:flex;gap:8px;align-items:center;margin-top:12px;font-size:13.5px}
.term-line span{color:var(--acc);white-space:nowrap}
.term-line input{flex:1;background:transparent;border:none;outline:none;color:var(--fg);font-family:inherit;font-size:13.5px;padding:2px 0}

footer{padding:32px 0 48px;font-size:13px;color:var(--dim)}
footer a{color:var(--dim);border-bottom:1px dashed var(--line)}
footer a:hover{color:var(--acc);border-bottom-color:var(--acc)}
.stats{display:flex;gap:28px;flex-wrap:wrap;margin:18px 0 0}
.stat b{display:block;font-size:22px;color:var(--acc);line-height:1.2}
.stat span{font-size:11px;letter-spacing:1px;text-transform:uppercase}

.prose h2{margin-top:32px}
.prose p{margin-bottom:16px}
.prose ul{margin:0 0 16px;padding-left:20px}
.prose li{margin-bottom:6px}

.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:6px}
table.archive{width:100%;border-collapse:collapse;font-size:14px}
table.archive th,table.archive td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
table.archive th{font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--dim);font-weight:400;white-space:nowrap}
table.archive tr:last-child td{border-bottom:none}
table.archive tr:hover td{background:rgba(43,255,98,.04)}
table.archive td:first-child{color:var(--dim);width:40px}

.big404{font-size:clamp(80px,18vw,160px);line-height:1;color:var(--acc);text-shadow:0 0 30px rgba(43,255,98,.35);letter-spacing:8px;margin:20px 0 10px}

@media (max-width: 560px) {
  .top-in {
    display: grid;
    grid-template-columns: 1fr auto;
    padding: 12px 16px;
    gap: 12px;
  }
  .logo {
    margin-right: 0;
    grid-column: 1;
  }
  #themeBtn {
    grid-column: 2;
    justify-self: end;
  }
  nav {
    grid-column: 1 / -1;
    justify-content: flex-start;
    gap: 10px 16px;
    order: 3;
    margin-top: 4px;
    padding-top: 12px;
    border-top: 1px solid var(--line);
    width: 100%;
  }
  .specs { grid-template-columns: 1fr; gap: 2px; }
  .specs dt { margin-top: 8px; }
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
}