/* RS1 module register - generated by build.py, do not hand-edit.
   Palette and type are lifted straight from the 1 ZULU pages so the register
   reads as part of the same site rather than a bolt-on. */
:root{
  --bg:#08111a; --raised:#0f1c28; --raised-2:#132433; --line:#1e3243;
  --ink:#d5dde4; --dim:#8ea0af; --faint:#4a5b6b;
  --brass:#c9862b; --brass-dim:#8a5d1d; --brass-lift:#e0a34d;
  --steel:#7fa8c9;
  --bg-rgb:8,17,26; --brass-rgb:201,134,43;
  --f-disp:"Barlow Condensed","Oswald",Impact,sans-serif;
  --f-body:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--f-body);
  font-size:1rem;line-height:1.7;-webkit-font-smoothing:antialiased}
img{max-width:100%}
a{color:var(--brass-lift)}
:focus-visible{outline:2px solid var(--brass-lift);outline-offset:3px}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto}}

.bar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:1.5rem;
  padding:.85rem 1.6rem;background:rgba(var(--bg-rgb),.9);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line)}
.bar .mk{font-family:var(--f-disp);font-weight:700;font-size:1.15rem;
  letter-spacing:.22em;text-transform:uppercase;color:var(--ink);text-decoration:none}
.bar .mk b{color:var(--brass);font-weight:700}
.bar nav{display:flex;gap:1.5rem;margin-left:auto;flex-wrap:wrap}
.bar nav a{font-family:var(--f-mono);font-size:.7rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--dim);text-decoration:none;
  padding-bottom:2px;border-bottom:1px solid transparent;transition:.15s}
.bar nav a:hover{color:var(--brass-lift);border-bottom-color:var(--brass)}
@media(max-width:40rem){.bar nav{gap:.9rem}.bar nav a{font-size:.62rem}}

.wrap{max-width:74rem;margin:0 auto;padding:0 1.6rem}
.pagehead{position:relative;border-bottom:1px solid var(--line);overflow:hidden;
  padding:3.4rem 0 2.8rem}
.pagehead::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(60% 80% at 18% 50%,rgba(201,134,43,.09),transparent 68%)}
.pagehead .wrap{position:relative}
.crumb{font-family:var(--f-mono);font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--faint);margin-bottom:1rem}
.crumb a{color:var(--dim);text-decoration:none}
.crumb a:hover{color:var(--brass-lift)}
h1.ph{font-family:var(--f-disp);font-weight:700;font-size:clamp(2.4rem,6.4vw,4.2rem);
  line-height:.95;letter-spacing:.02em;text-transform:uppercase;margin:0;color:#fff;
  overflow-wrap:anywhere}
h1.ph span{color:var(--brass)}
.phln{font-family:var(--f-mono);font-size:.72rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--dim);margin:.95rem 0 0}
.ph-lede{font-size:1.16rem;line-height:1.6;color:var(--ink);max-width:54ch;margin:1.2rem 0 0;
  text-wrap:balance}
section.band{padding:3.6rem 0;border-bottom:1px solid var(--line)}
section.band:last-of-type{border-bottom:0}
.eyebrow{font-family:var(--f-mono);font-size:.68rem;letter-spacing:.26em;
  text-transform:uppercase;color:var(--brass);margin-bottom:.8rem}
h2.sec{font-family:var(--f-disp);font-weight:600;font-size:clamp(1.7rem,3.6vw,2.3rem);
  letter-spacing:.03em;text-transform:uppercase;margin:0 0 1rem;color:#fff;text-wrap:balance}
.sec-lede{color:var(--dim);max-width:58ch;margin:0 0 2rem;font-size:1.02rem}
footer.end{border-top:1px solid var(--line);padding:1.6rem;text-align:center;
  font-family:var(--f-mono);font-size:.66rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--faint)}

/* ---------- badges and tags ---------- */
.badge{font-family:var(--f-mono);font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;
  padding:.22rem .55rem;border:1px solid;border-radius:2px;white-space:nowrap}
.badge.live{color:#7fd6a0;border-color:#2f6c45;background:rgba(87,173,116,.10)}
.badge.design{color:#e0a34d;border-color:#8a5d1d;background:rgba(201,134,43,.10)}
.badge.idea{color:#7fb2d8;border-color:#33556f;background:rgba(90,162,224,.10)}
.tags{display:flex;flex-wrap:wrap;gap:.3rem;margin:.85rem 0 0}
.tag{font-family:var(--f-mono);font-size:.62rem;letter-spacing:.1em;
  color:var(--steel);background:rgba(127,168,201,.07);
  border:1px solid #2a4559;border-radius:2px;padding:.2rem .5rem;text-decoration:none;
  white-space:nowrap;transition:.15s}
a.tag:hover,a.tag:focus-visible{color:#fff;border-color:var(--steel);
  background:rgba(127,168,201,.16)}

/* ---------- the core module, up top and deliberately larger ---------- */
.core{display:block;text-decoration:none;background:var(--raised);
  border:1px solid var(--line);border-left:3px solid var(--brass);border-radius:3px;
  padding:2.2rem 2.2rem 2rem;transition:border-color .15s,transform .15s}
.core:hover,.core:focus-visible{border-color:var(--brass);transform:translateY(-2px)}
.core:hover{border-left-color:var(--brass-lift)}
.core .top{display:flex;align-items:center;gap:.9rem;flex-wrap:wrap;margin-bottom:.9rem}
.core .num{font-family:var(--f-mono);font-size:.66rem;letter-spacing:.22em;color:var(--brass)}
.core h2{font-family:var(--f-disp);font-weight:700;font-size:clamp(2rem,5.6vw,3.1rem);
  letter-spacing:.02em;text-transform:uppercase;color:#fff;margin:0;line-height:1;
  overflow-wrap:anywhere}
.core h2 b{color:var(--brass);font-weight:700}
.core .ln{font-family:var(--f-mono);font-size:.72rem;letter-spacing:.1em;color:var(--dim);
  margin:.75rem 0 0;text-transform:uppercase}
.core p{margin:1.1rem 0 0;color:var(--ink);font-size:1.08rem;line-height:1.65;max-width:62ch}
.core .go{display:inline-block;margin-top:1.3rem;font-family:var(--f-mono);font-size:.72rem;
  letter-spacing:.16em;text-transform:uppercase;color:var(--brass-lift)}
.core:hover .go{color:#fff}

/* ---------- the gap, made deliberate ---------- */
.divider{display:flex;align-items:center;gap:1.1rem;margin:3.4rem 0 2rem}
.divider span{font-family:var(--f-mono);font-size:.66rem;letter-spacing:.26em;
  text-transform:uppercase;color:var(--faint);white-space:nowrap}
.divider i{flex:1;height:1px;background:var(--line);display:block}

/* ---------- tag filter ---------- */
.filters{display:flex;flex-wrap:wrap;gap:.35rem;align-items:center;margin:0 0 1.6rem}
.filters .lab{font-family:var(--f-mono);font-size:.62rem;letter-spacing:.2em;
  text-transform:uppercase;color:var(--faint);margin-right:.5rem}
button.tg{font-family:var(--f-mono);font-size:.62rem;letter-spacing:.1em;cursor:pointer;
  color:var(--dim);background:transparent;border:1px solid var(--line);border-radius:2px;
  padding:.24rem .55rem;transition:.15s}
button.tg:hover{color:#fff;border-color:var(--steel)}
button.tg[aria-pressed="true"]{color:#1a1206;background:var(--brass);border-color:var(--brass);
  font-weight:500}
.count{font-family:var(--f-mono);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--faint);margin:0 0 1.2rem}

/* ---------- module grid ---------- */
.grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(19rem,1fr))}
.card{display:flex;flex-direction:column;gap:.15rem;text-decoration:none;
  background:var(--raised);border:1px solid var(--line);border-radius:3px;
  padding:1.3rem 1.4rem 1.4rem;transition:border-color .15s,transform .15s}
.card:hover,.card:focus-visible{border-color:var(--brass);transform:translateY(-2px)}
.card[hidden]{display:none}
.card .top{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;margin-bottom:.6rem}
.card .num{font-family:var(--f-mono);font-size:.62rem;letter-spacing:.2em;color:var(--brass-dim)}
.card h3{font-family:var(--f-disp);font-weight:600;font-size:1.32rem;letter-spacing:.04em;
  text-transform:uppercase;color:#fff;margin:0;line-height:1.1;overflow-wrap:anywhere}
.card h3 b{color:var(--brass);font-weight:600}
.card .ln{font-size:.88rem;color:var(--dim);line-height:1.55;margin:.35rem 0 0}
.card .tags{margin-top:auto;padding-top:.9rem}
.card .tag,.core .tag{pointer-events:none}

/* ---------- module page ---------- */
.mod-top{display:flex;align-items:center;gap:.8rem;flex-wrap:wrap;margin-bottom:1rem}
.mod-top .num{font-family:var(--f-mono);font-size:.68rem;letter-spacing:.22em;color:var(--brass)}
.prose{max-width:64ch}
.prose p{margin:0 0 1.15rem;color:var(--ink);font-size:1.03rem;line-height:1.75}
.prose p:last-child{margin-bottom:0}
.prose em{color:#fff;font-style:italic}
.prose strong{color:#fff;font-weight:600}
.cols{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:3rem;
  align-items:start}
@media(max-width:54rem){.cols{grid-template-columns:1fr;gap:2.2rem}}
.spec{width:100%;border-collapse:collapse;font-size:.88rem}
.spec th,.spec td{text-align:left;padding:.6rem 0;border-bottom:1px solid var(--line);
  vertical-align:top}
.spec tr:last-child th,.spec tr:last-child td{border-bottom:0}
.spec th{font-family:var(--f-mono);font-size:.64rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--faint);font-weight:400;width:8.5rem;
  padding-right:1rem}
.spec td{color:var(--ink)}
.panel{background:var(--raised);border:1px solid var(--line);border-radius:3px;
  padding:1.4rem 1.5rem}
.panel h3{font-family:var(--f-mono);font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--brass);margin:0 0 1rem;font-weight:400}
.panel + .panel{margin-top:1rem}
.kit{list-style:none;margin:0;padding:0}
.kit li{padding:.45rem 0 .45rem 1.2rem;position:relative;color:var(--ink);font-size:.92rem;
  line-height:1.6}
.kit li::before{content:"";position:absolute;left:0;top:.95rem;width:6px;height:6px;
  background:var(--brass-dim);border-radius:1px}
.kit li a{color:var(--brass-lift);text-decoration:none}
.kit li a:hover{color:#fff;text-decoration:underline}
.kit code{font-family:var(--f-mono);font-size:.86em;color:var(--steel)}
.mono{font-family:var(--f-mono);font-size:.82rem;color:var(--steel);letter-spacing:.04em}

/* ---------- media ---------- */
.media{display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(17rem,1fr))}
.media figure{margin:0;background:var(--raised);border:1px solid var(--line);border-radius:3px;
  overflow:hidden}
.media img,.media video{display:block;width:100%;height:auto;background:#000}
.media figcaption{font-size:.85rem;color:var(--dim);padding:.75rem .9rem;line-height:1.5}
.empty{border:1px dashed var(--line);border-radius:3px;padding:1.5rem 1.6rem;
  color:var(--dim);font-size:.94rem;max-width:62rem}
.empty code{font-family:var(--f-mono);font-size:.86em;color:var(--brass-lift);
  background:var(--raised-2);padding:.12em .45em;border-radius:2px;word-break:break-all}

/* ---------- prev / next ---------- */
.pager{display:flex;gap:1rem;flex-wrap:wrap;justify-content:space-between;
  border-top:1px solid var(--line);padding:1.6rem 0 0;margin-top:.5rem}
.pager a{font-family:var(--f-mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--dim);text-decoration:none;max-width:22rem}
.pager a:hover{color:var(--brass-lift)}
.pager a.next{text-align:right;margin-left:auto}