:root{
  --bg:#b9b9b9;
  --desktop:#b9b9b9;
  --window:#f3efdc;
  --window-2:#ece7d3;
  --ink:#111111;
  --muted:#4f4f4f;
  --line:#1f1f1f;
  --accent:#56d8c9;
  --accent-2:#2c736b;
  --shadow:rgba(0,0,0,.12);
  --maxw:1120px;
  --font-ui:"Verdana","Geneva",system-ui,sans-serif;
  --font-body:"Courier New","Liberation Mono",monospace;
  --font-display:"Times New Roman","Iowan Old Style",serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--desktop);color:var(--ink);
  font-family:var(--font-body);line-height:1.5;
}
img{max-width:100%;display:block}
a{color:inherit}
::selection{background:var(--accent);color:#000}
.shell{max-width:var(--maxw);margin:0 auto;padding:20px 16px 48px}
.window{position:relative;background:var(--window);border:1px solid var(--line);box-shadow:8px 8px 0 var(--shadow);margin:0 0 20px}
.window__bar{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  min-height:32px;padding:6px 10px;border-bottom:1px solid var(--line);
  background:linear-gradient(to bottom, color-mix(in srgb, var(--accent) 22%, white), color-mix(in srgb, var(--accent) 10%, white));
  font-family:var(--font-ui);font-size:.92rem;letter-spacing:.02em;
}
.window__title{display:flex;align-items:center;gap:10px;font-weight:700}
.window__glyph{width:12px;height:12px;border:1px solid var(--line);background:var(--window)}
.window__meta{font-size:.77rem;color:var(--muted)}
.window__body{padding:14px}
.grid-2{display:grid;grid-template-columns:1.35fr .95fr;gap:20px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.stack > * + *{margin-top:16px}
.site-footer{border-top:1px solid var(--line);padding-top:14px;margin-top:28px;font-size:.88rem;color:var(--muted)}
.hero-title{margin:0 0 10px;font-family:var(--font-display);font-weight:700;font-size:clamp(2rem, 5vw, 3.8rem);line-height:1.05}
.hero-text{max-width:64ch;margin:0;color:#222}
.kicker{margin:0 0 10px;font-family:var(--font-ui);text-transform:uppercase;letter-spacing:.12em;font-size:.75rem;color:var(--muted)}
.listing{list-style:none;padding:0;margin:0}
.listing li{border-top:1px solid rgba(0,0,0,.18);padding:10px 0}
.listing li:first-child{border-top:none;padding-top:0}
.badge{display:inline-block;border:1px solid var(--line);background:var(--window-2);padding:2px 8px;font-family:var(--font-ui);font-size:.78rem;text-transform:uppercase;letter-spacing:.05em}
.buttonlike{display:inline-block;padding:8px 12px;border:1px solid var(--line);background:var(--window-2);text-decoration:none;box-shadow:3px 3px 0 var(--shadow)}
.buttonlike:hover{transform:translate(1px,1px);box-shadow:2px 2px 0 var(--shadow)}
.panel-note{background:rgba(255,255,255,.35);border:1px dashed rgba(0,0,0,.35);padding:10px 12px;font-size:.94rem}
.pullquote{margin:0;padding:14px;border-left:4px solid var(--accent);background:rgba(255,255,255,.35);font-family:var(--font-display);font-size:1.1rem}
.tableish{width:100%;border-collapse:collapse}
.tableish th,.tableish td{border:1px solid rgba(0,0,0,.25);padding:8px 10px;text-align:left}
.tableish th{background:rgba(255,255,255,.45);font-family:var(--font-ui);font-size:.85rem}
@media (max-width: 900px){.grid-2,.grid-3{grid-template-columns:1fr}.shell{padding-top:14px}}
@media (max-width: 560px){.window__meta{display:none}.window__body{padding:12px}}