:root{
  --lacquer:#151E1A; --shell:#1D2925; --shell-2:#243230; --rim:#3A4A43; --rim-soft:#2B3833;
  --roe:#CFD2C5; --roe-dim:#8E9A90; --brass:#B08D46; --amber:#E0AC4B; --flag:#C2705A;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
  color-scheme:dark light;
}
@media (prefers-color-scheme: light){
  :root:not([data-theme="dark"]){
    --lacquer:#E9EAE3; --shell:#F3F3ED; --shell-2:#E2E4DA; --rim:#BFC4B8; --rim-soft:#D6D9CE;
    --roe:#1A241F; --roe-dim:#5D6A60; --brass:#8A6C2C; --amber:#8A6C2C; --flag:#9A4B36;
  }
}
:root[data-theme="light"]{
  --lacquer:#E9EAE3; --shell:#F3F3ED; --shell-2:#E2E4DA; --rim:#BFC4B8; --rim-soft:#D6D9CE;
  --roe:#1A241F; --roe-dim:#5D6A60; --brass:#8A6C2C; --amber:#8A6C2C; --flag:#9A4B36;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-padding-top:env(safe-area-inset-top,0px);-webkit-text-size-adjust:100%}
body{margin:0;background:var(--lacquer);color:var(--roe);
  font-family:Archivo,"Helvetica Neue",Arial,sans-serif;font-size:17px;line-height:1.6;
  -webkit-font-smoothing:antialiased}
.mono{font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
a{color:inherit}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:2px solid var(--amber);outline-offset:3px;border-radius:2px}
img{max-width:100%}

/* masthead */
header{border-bottom:1px solid var(--rim);padding:26px 0 0}
.mast{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:14px}
.wordmark{font-family:Fraunces,Georgia,serif;font-variation-settings:"SOFT" 0,"WONK" 1,"opsz" 120;
  font-weight:800;font-size:clamp(2.6rem,9vw,4.6rem);line-height:.86;letter-spacing:-.035em;margin:0}
.wordmark a{text-decoration:none}
.wordmark em{font-style:normal;color:var(--brass)}
.issue{font-size:.8rem;color:var(--roe-dim);text-align:right;line-height:1.45;padding-bottom:6px}
.clock{border-top:1px solid var(--rim-soft);margin-top:20px;padding:11px 0;font-size:.83rem;
  color:var(--roe-dim);display:flex;flex-wrap:wrap;gap:6px 26px;align-items:center}
.clock b{color:var(--roe);font-weight:600}
.spacer{margin-left:auto}
.pill{background:none;border:1px solid var(--rim);color:var(--roe-dim);font:inherit;
  font-size:.74rem;padding:4px 11px;border-radius:999px;cursor:pointer}
.pill:hover{color:var(--roe);border-color:var(--brass)}

nav.main{border-bottom:1px solid var(--rim);padding:12px 0;display:flex;flex-wrap:wrap;gap:22px;
  font-size:.9rem}
nav.main a{text-decoration:none;color:var(--roe-dim);padding-bottom:2px;border-bottom:2px solid transparent}
nav.main a:hover{color:var(--roe)}
nav.main a[aria-current="page"]{color:var(--roe);border-bottom-color:var(--brass)}

h2.sh{font-family:Fraunces,Georgia,serif;font-variation-settings:"opsz" 40;font-weight:600;
  font-size:1.9rem;letter-spacing:-.02em;margin:34px 0 6px}
.lede{color:var(--roe-dim);margin:0 0 22px;max-width:64ch;font-size:.95rem}
.sec{margin:52px 0;padding-top:30px;border-top:1px solid var(--rim)}
.page{margin:0 0 56px}

/* front page */
#front{margin:36px 0 0}
.issuegrid{display:grid;grid-template-columns:minmax(0,1.85fr) minmax(0,1fr);gap:44px}
@media(max-width:800px){.issuegrid{grid-template-columns:1fr;gap:34px}}
article{margin-bottom:36px}
article h3{font-family:Fraunces,Georgia,serif;font-variation-settings:"opsz" 80,"SOFT" 0;
  font-weight:600;font-size:1.34rem;letter-spacing:-.02em;line-height:1.16;margin:0 0 9px}
article.lead h3{font-size:clamp(1.85rem,4.5vw,2.75rem);font-weight:800;line-height:1.05}
.stand{font-size:1.02rem;color:var(--roe-dim);margin:0 0 12px;max-width:62ch}
article.lead .stand{font-size:1.15rem}
.byline{font-size:.76rem;color:var(--roe-dim);margin:0 0 13px}
.byline a{color:var(--brass);text-decoration:none;border-bottom:1px solid var(--rim)}
.byline a:hover{color:var(--amber)}
p.body{margin:0 0 11px;max-width:66ch}
.wire{border-left:1px solid var(--rim);padding-left:26px}
@media(max-width:800px){.wire{border-left:none;padding-left:0;border-top:1px solid var(--rim);padding-top:26px}}
.wire h4{font-family:Fraunces,Georgia,serif;font-weight:600;font-size:1.1rem;margin:0 0 14px;letter-spacing:-.01em}
.wire ul{list-style:none;margin:0;padding:0}
.wire li{padding:12px 0;border-bottom:1px solid var(--rim-soft);font-size:.9rem;line-height:1.45}
.wire li:last-child{border-bottom:none}
.wire .w-k{display:block;font-size:.72rem;color:var(--roe-dim);margin-bottom:3px}
.empty{color:var(--roe-dim);font-size:.92rem;padding:22px 0}

/* decoder */
.lid{background:var(--shell);border:1px solid var(--rim);border-radius:16px;padding:20px;
  box-shadow:inset 0 1px 0 var(--rim-soft)}
.entry{display:flex;flex-wrap:wrap;gap:10px}
.entry input{flex:1 1 300px;min-width:0;background:var(--lacquer);border:1px solid var(--rim);
  color:var(--roe);font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;font-size:1.02rem;
  padding:13px 14px;border-radius:9px;letter-spacing:.02em}
.entry input::placeholder{color:var(--roe-dim);opacity:.7}
.entry button{background:var(--brass);color:var(--lacquer);border:none;font:inherit;font-weight:600;
  padding:13px 24px;border-radius:9px;cursor:pointer}
.entry button:hover{filter:brightness(1.1)}
.samples{margin-top:11px;font-size:.8rem;color:var(--roe-dim);display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.samples button{background:none;border:1px solid var(--rim-soft);color:var(--roe-dim);
  font-family:ui-monospace,Menlo,monospace;font-size:.76rem;padding:3px 9px;border-radius:5px;cursor:pointer}
.samples button:hover{color:var(--amber);border-color:var(--brass)}
#out{margin-top:20px}
.parsed{display:grid;grid-template-columns:repeat(auto-fit,minmax(132px,1fr));gap:1px;
  background:var(--rim-soft);border:1px solid var(--rim-soft);border-radius:10px;overflow:hidden}
.cell{background:var(--shell-2);padding:11px 13px}
.cell .k{font-size:.7rem;color:var(--roe-dim);letter-spacing:.04em;margin-bottom:3px}
.cell .v{font-family:ui-monospace,Menlo,monospace;font-size:.95rem;color:var(--amber);word-break:break-all}
.cell .n{font-size:.82rem;color:var(--roe);margin-top:2px;line-height:1.35}
.notes{margin:16px 0 0;padding:0;list-style:none}
.notes li{padding:9px 0 9px 15px;border-left:2px solid var(--rim);font-size:.9rem;color:var(--roe-dim)}
.notes li.warn{border-left-color:var(--flag);color:var(--roe)}
.notes li.link{border-left-color:var(--brass)}
.notes li strong{color:var(--roe);font-weight:600}
.reveal{animation:lift .34s cubic-bezier(.2,.7,.3,1) both}
@keyframes lift{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.reveal{animation:none}}
.err{color:var(--flag);font-size:.9rem;margin-top:16px}

/* register */
.tools{display:flex;flex-wrap:wrap;gap:9px;margin:16px 0 18px;align-items:center}
.tools input{flex:1 1 230px;background:var(--shell);border:1px solid var(--rim);color:var(--roe);
  font:inherit;font-size:.92rem;padding:10px 13px;border-radius:8px}
.chip{background:none;border:1px solid var(--rim);color:var(--roe-dim);font:inherit;font-size:.82rem;
  padding:8px 14px;border-radius:999px;cursor:pointer}
.chip[aria-pressed="true"]{background:var(--brass);border-color:var(--brass);color:var(--lacquer);font-weight:600}
table{width:100%;border-collapse:collapse;font-size:.9rem}
.tablewrap{overflow-x:auto;border:1px solid var(--rim-soft);border-radius:10px}
th{text-align:left;font-weight:600;font-size:.76rem;color:var(--roe-dim);padding:11px 14px;
  border-bottom:1px solid var(--rim);background:var(--shell);position:sticky;top:0}
td{padding:11px 14px;border-bottom:1px solid var(--rim-soft);vertical-align:top}
tr:last-child td{border-bottom:none}
tbody tr:hover td{background:var(--shell)}
.iso{font-family:ui-monospace,Menlo,monospace;color:var(--brass);font-size:.86rem}
.role{font-size:.78rem;color:var(--roe-dim);white-space:nowrap}
td a{color:var(--amber);text-decoration:none;border-bottom:1px solid var(--rim);white-space:nowrap}
td a:hover{border-bottom-color:var(--amber)}
.note{font-size:.84rem;color:var(--roe-dim)}
.count{font-size:.82rem;color:var(--roe-dim);margin-top:12px}

/* codes */
.codes{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:34px}
.codes h4{font-family:Fraunces,Georgia,serif;font-weight:600;font-size:1.05rem;margin:0 0 10px}
.codes dl{margin:0;font-size:.88rem}
.codes dt{font-family:ui-monospace,Menlo,monospace;color:var(--brass);float:left;clear:left;width:62px;padding:5px 0}
.codes dd{margin:0 0 0 62px;padding:5px 0;border-bottom:1px solid var(--rim-soft);color:var(--roe-dim)}
.codes dd b{color:var(--roe);font-weight:500;font-style:italic}

/* prose (about) */
.prose{max-width:66ch}
.prose h3{font-family:Fraunces,Georgia,serif;font-weight:600;font-size:1.25rem;
  letter-spacing:-.015em;margin:30px 0 8px}
.prose p{margin:0 0 13px}
.prose ul{margin:0 0 13px;padding-left:20px}
.prose li{margin-bottom:6px}
.prose a{color:var(--brass)}
.callout{background:var(--shell);border:1px solid var(--rim);border-left:3px solid var(--brass);
  border-radius:8px;padding:16px 18px;margin:20px 0}
.callout p:last-child{margin-bottom:0}

footer{border-top:1px solid var(--rim);margin-top:56px;padding:26px 0 44px;font-size:.82rem;color:var(--roe-dim)}
footer p{max-width:70ch;margin:0 0 9px}
footer a{color:var(--brass)}
footer nav{margin-bottom:14px;display:flex;flex-wrap:wrap;gap:18px}
footer nav a{text-decoration:none}
footer nav a:hover{color:var(--roe)}