/* techboy.co.uk: "Terminal" design (from mockup/a-terminal.html + a-inner.html) */
*{box-sizing:border-box}
html{scroll-padding-top:20px}
body{margin:0;background:#0b0f17;color:#e5e7eb;font-family:Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
a{color:#a3e635;text-decoration:none}a:hover{text-decoration:underline}
img{max-width:100%;height:auto}
.m{font-family:'JetBrains Mono',ui-monospace,monospace}
.w{max-width:1120px;margin:0 auto;padding:0 24px}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;background:#a3e635;color:#0b0f17;padding:6px 10px;border-radius:6px;z-index:10}

/* header + nav */
.top .w{display:flex;justify-content:space-between;align-items:center;height:70px;position:relative}
.logo{font-weight:800;font-size:18px;color:#a3e635}.logo:hover{text-decoration:none}
#site-nav{display:flex;gap:24px;font-size:14px}
#site-nav a{color:#9ca3af}#site-nav a:hover{color:#e5e7eb;text-decoration:none}
#site-nav a[aria-current]{color:#a3e635}
.menu-btn{display:none;background:#111827;color:#a3e635;border:1px solid #1f2937;border-radius:8px;padding:8px 12px;font-size:13px;cursor:pointer}

/* home */
.hero{display:grid;grid-template-columns:1.2fr .8fr;gap:48px;padding:60px 0 70px;align-items:center}
.kicker{margin:0 0 14px}
.term{background:#111827;border:1px solid #1f2937;border-radius:14px;overflow:hidden;box-shadow:0 30px 80px -30px #a3e63555}
.bar{display:flex;gap:7px;padding:12px 14px;background:#0f172a;border-bottom:1px solid #1f2937}
.bar i{width:11px;height:11px;border-radius:50%;background:#ef4444}.bar i:nth-child(2){background:#f59e0b}.bar i:nth-child(3){background:#22c55e}
.tb{padding:22px 24px;font-size:15px;line-height:1.9;overflow-wrap:anywhere}
.p{color:#a3e635}.c{color:#7dd3fc}.d{color:#6b7280}
h1{font-size:58px;line-height:1.02;margin:0 0 18px;letter-spacing:-.03em}h1 em{font-style:normal;color:#a3e635}
.lead{color:#9ca3af;font-size:18px;line-height:1.6;margin:0 0 26px}
.cur{display:inline-block;width:10px;height:18px;background:#a3e635;vertical-align:-3px;animation:blink 1.1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
@media (prefers-reduced-motion:reduce){.cur{animation:none}}
.ph{position:relative}
.ph img{width:100%;aspect-ratio:1;object-fit:cover;object-position:57% 30%;border-radius:20px;filter:grayscale(.2) contrast(1.05);border:2px solid #a3e635;display:block}
.ph .t{position:absolute;bottom:-14px;left:20px;background:#a3e635;color:#0b0f17;font-weight:800;padding:6px 12px;border-radius:8px;font-size:13px}
.sec{font-size:14px;color:#a3e635;letter-spacing:.1em;margin:0 0 18px}
.g{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:60px}
.k{display:block;border:1px solid #1f2937;background:#111827;border-radius:14px;padding:22px;color:#e5e7eb;transition:border-color .15s,transform .15s}
.k:hover{text-decoration:none;border-color:#a3e635;transform:translateY(-2px)}
.k h3{margin:8px 0 6px;font-size:20px}.k p{margin:0;color:#9ca3af;font-size:14px;line-height:1.55}.k .m{font-size:12px;color:#6b7280}
.k.big{grid-column:span 2;background:linear-gradient(135deg,#1a2e05,#111827);border-color:#3f6212}
.h{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:60px}
.h a{display:block;border:1px dashed #374151;border-radius:12px;padding:16px;font-size:14px;color:#e5e7eb}
.h a:hover{border-color:#a3e635;text-decoration:none}
.h b{display:block;color:#fff;margin-bottom:2px}.h span{color:#6b7280;font-size:12px}
.elsewhere{font-size:14px;color:#6b7280;margin:0 0 24px;line-height:2}.elsewhere a{white-space:nowrap}
.closing{color:#6b7280;font-style:italic}
.home-closing{margin:0 0 70px}

/* inner pages */
.crumb{padding:40px 0 10px;font-size:14px;color:#6b7280}.crumb a{color:#6b7280}.crumb b{color:#a3e635;font-weight:400}
.ih{font-size:48px;margin:0 0 10px;letter-spacing:-.03em}
.il{color:#9ca3af;font-size:18px;line-height:1.6;max-width:640px;margin:0 0 40px}
.lay{display:grid;grid-template-columns:220px minmax(0,1fr);gap:48px;padding-bottom:70px}
.toc{font-size:13px;line-height:2.2;color:#6b7280;border-left:1px solid #1f2937;padding-left:16px;align-self:start;position:sticky;top:20px}
.toc a{color:#6b7280;display:block}.toc a:hover{color:#a3e635;text-decoration:none}
.toc .lbl{color:#374151;display:block;margin-top:6px}
.toc a.on{color:#a3e635}
.body{max-width:720px}
.body h2{color:#fff;font-size:24px;letter-spacing:0;margin:34px 0 10px;font-family:Inter,system-ui,sans-serif}
.body h2:first-child{margin-top:0}
.body h2:before{content:"## ";color:#a3e635;font-family:'JetBrains Mono',ui-monospace,monospace}
.body h3{color:#fff;font-size:18px;margin:26px 0 8px}
.body p,.body li{color:#cbd5e1;line-height:1.75;font-size:16px}
.body ul{padding-left:20px}.body li{margin:4px 0}.body li::marker{color:#a3e635}
.body strong{color:#fff}
.body a{text-decoration:underline;text-decoration-color:#3f6212;text-underline-offset:3px}
.body .cta a{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:15px;text-decoration:none;display:inline-block;border:1px solid #3f6212;background:#1a2e05;border-radius:10px;padding:10px 14px}
.body .cta a:hover{border-color:#a3e635}
.body img.logo{width:72px;height:72px;margin:0 0 6px}
.fig{border:1px solid #1f2937;border-radius:14px;overflow:hidden;margin:24px 0;background:#111827}
.fig img{width:100%;display:block;max-height:420px;object-fit:cover}
.fig figcaption{display:block;padding:10px 14px;font-size:12px;color:#6b7280}
.fig.tall img{max-height:520px;object-fit:contain;background:#0b0f17}
.gal{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;margin:24px 0}
.gal .fig{margin:0}.gal .fig img{height:170px;object-fit:cover}
.nx{display:flex;justify-content:space-between;gap:16px;border-top:1px solid #1f2937;padding-top:24px;margin-top:40px;font-size:14px}
.nx a{color:#a3e635}.nx .next{margin-left:auto;text-align:right}
.foot{border-top:1px solid #1f2937;padding:24px 0;color:#6b7280;font-size:13px}

/* 404 */
.nf{max-width:640px;margin:20px 0 80px}

/* phones */
@media (max-width:760px){
  .menu-btn{display:block}
  #site-nav{display:none;position:absolute;top:62px;right:24px;left:24px;flex-direction:column;gap:0;background:#111827;border:1px solid #1f2937;border-radius:12px;padding:8px;z-index:5;box-shadow:0 20px 40px -20px #000}
  #site-nav.open{display:flex}
  #site-nav a{padding:10px 12px;border-radius:8px;font-size:15px}
  #site-nav a[aria-current]{background:#1a2e05}
  .no-js #site-nav{display:flex;position:static;flex-direction:row;flex-wrap:wrap;background:none;border:0;padding:0}
  .hero{grid-template-columns:1fr;padding:30px 0 50px;gap:32px}
  .ph{max-width:240px;order:-1}
  h1{font-size:40px}
  .g{grid-template-columns:1fr}.k.big{grid-column:auto}
  .h{grid-template-columns:1fr 1fr}
  .lay{grid-template-columns:1fr;gap:0}
  .toc{display:none}
  .ih{font-size:34px}
  .tb{font-size:13px;padding:18px}
}