/* Ishtar bureau design system — 1980s engineering-datasheet register (US Graphics dialect),
   black + white base, red primary (state/signal) + pink secondary (soft accent).
   One source of truth for the marketing surfaces (one-pager, /talk, /dashboard). */
/* Aligned to the one-pager design system (marketing/index.html): WHITE light / dimmed dark,
   strictly black + white + red (no pink, no beige), Archivo body + Geist Mono labels. */
:root{ /* light is the default — white base */
  --bg:#fff; --fg:#0a0a0a; --mut:#6a6a6a; --line:#0a0a0a; --soft:rgba(10,10,10,.16); --card:#fff;
  --red:#e10600; --pink:#e10600; --on-red:#fff; --bg-dim:#fff;
}
:root[data-theme="dark"]{
  --bg:#161616; --fg:#ececec; --mut:#9a9a9a; --line:#ececec; --soft:rgba(236,236,236,.15); --card:#1c1c1c;
  --red:#ff3636; --pink:#ff3636; --on-red:#fff; --bg-dim:#161616;
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){
  --bg:#161616; --fg:#ececec; --mut:#9a9a9a; --line:#ececec; --soft:rgba(236,236,236,.15); --card:#1c1c1c;
  --red:#ff3636; --pink:#ff3636; --on-red:#fff; --bg-dim:#161616;
}}
*{ box-sizing:border-box; }
html,body{ margin:0; background:var(--bg-dim); color:var(--fg);
  font-family:"Archivo",system-ui,-apple-system,sans-serif; font-size:14px; line-height:1.5; -webkit-font-smoothing:antialiased; }
/* Geist Mono datasheet voice for labels, marks, codes, numbers, controls */
.docstrip,.reg,.partno,.mark,.toggle,.live-tag,.pill,.demoflag,.who,.k,.btn,.act,.modes button,.livebar .lbl,.stat .v,.bar{ font-family:"Geist Mono",ui-monospace,"SF Mono",Menlo,monospace; }
a{ color:var(--fg); text-decoration:none; }
a:hover{ color:var(--red); }
b{ font-weight:600; }
/* Central body column floats lighter on a dimmed page (margins darker than the column). */
.wrap{ max-width:880px; margin:0 auto; padding:0 1.6rem; background:var(--bg); border-left:1.5px solid var(--line); border-right:1.5px solid var(--line); min-height:100vh; }
/* Scroll indicator — hints there is more below the fold. */
.scrollhint{ display:flex; align-items:center; justify-content:center; gap:.6rem; margin:1.6rem 0 .2rem; color:var(--mut); font-size:11px; letter-spacing:.2em; text-transform:uppercase; }
.scrollhint .ar{ color:var(--red); animation:bob 1.5s ease-in-out infinite; }
@keyframes bob{ 0%,100%{transform:translateY(0)} 50%{transform:translateY(5px)} }
hr{ border:0; border-top:1px solid var(--line); margin:2.2rem 0; }

/* document strip — the bureau header */
.docstrip{ display:flex; justify-content:space-between; align-items:center; gap:1rem; flex-wrap:wrap;
  border-bottom:1px solid var(--line); padding:.6rem 0; font-size:11px; letter-spacing:.14em; color:var(--mut); text-transform:uppercase; }
.docstrip .tick{ color:var(--red); }
.live-tag{ display:inline-flex; align-items:center; gap:7px; color:var(--pink); }
.dot{ width:7px; height:7px; border-radius:50%; background:var(--red); display:inline-block; flex:0 0 auto; animation:pulse 2s infinite; }
@keyframes pulse{ 0%{box-shadow:0 0 0 0 rgba(255,46,78,.5)} 70%{box-shadow:0 0 0 7px rgba(255,46,78,0)} 100%{box-shadow:0 0 0 0 rgba(255,46,78,0)} }

.topbar{ display:flex; justify-content:space-between; align-items:center; padding:1rem 0 0; }
.toggle{ border:1px solid var(--line); background:transparent; color:var(--mut); font:inherit; font-size:12px; padding:.3rem .65rem; cursor:pointer; letter-spacing:.08em; }
.toggle:hover{ color:var(--fg); border-color:var(--red); }

.reg{ color:var(--mut); font-size:11px; letter-spacing:.18em; text-transform:uppercase; }
.partno{ color:var(--mut); font-size:11px; letter-spacing:.2em; text-transform:uppercase; }
.mark{ font-size:clamp(2.6rem,9vw,4.2rem); font-weight:700; letter-spacing:.03em; margin:.4rem 0 0; line-height:1; }
.mark .hx{ color:var(--red); }
.tag{ font-size:clamp(1rem,2.4vw,1.2rem); margin:.9rem 0 0; max-width:40ch; }
.sub{ margin:1rem 0 0; color:var(--mut); max-width:62ch; }
.sub b{ color:var(--fg); font-weight:600; }

.pills{ margin-top:1.3rem; display:flex; gap:.5rem; flex-wrap:wrap; }
.pill{ border:1px solid var(--line); padding:.25rem .6rem; font-size:10.5px; color:var(--mut); text-transform:uppercase; letter-spacing:.12em; }
.pill.hot{ border-color:var(--red); color:var(--pink); }

/* specifications datasheet block */
.spec{ border:1px solid var(--line); margin-top:1.4rem; }
.spec .head{ font-size:10.5px; letter-spacing:.16em; color:var(--mut); border-bottom:1px solid var(--line); padding:.5rem .85rem; text-transform:uppercase; }
.spec table{ width:100%; border-collapse:collapse; font-size:12.5px; }
.spec td{ padding:.5rem .85rem; border-bottom:1px solid var(--soft); }
.spec tr:last-child td{ border-bottom:0; }
.spec td:first-child{ color:var(--mut); text-transform:uppercase; letter-spacing:.08em; font-size:11px; }
.spec td:last-child{ text-align:right; }
.spec .state{ color:var(--red); }

/* live metrics bar */
.livebar{ display:inline-flex; align-items:center; gap:.65rem; margin-top:1.4rem; border:1px solid var(--line); background:var(--card); padding:.5rem .9rem; font-size:13px; }
.livebar:hover{ border-color:var(--red); }
.livebar .lbl{ letter-spacing:.16em; font-size:11px; color:var(--mut); }
.livebar #lv{ color:var(--mut); } .livebar #lv b{ color:var(--fg); }

/* entry cards */
.fork{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-top:.5rem; }
@media(max-width:560px){ .fork{ grid-template-columns:1fr; } }
.card{ border:1px solid var(--line); background:var(--card); padding:1.3rem; display:block; }
.card.h{ border-top:2px solid var(--red); }
.card.a{ border-top:2px solid var(--pink); }
.card:hover{ border-color:var(--fg); }
.card .doc{ font-size:10px; letter-spacing:.18em; color:var(--mut); text-transform:uppercase; }
.card h3{ margin:.45rem 0 .35rem; font-size:1.05rem; }
.card p{ margin:0; color:var(--mut); font-size:13px; }
.card .go{ margin-top:.8rem; color:var(--pink); }

/* actions */
.actions{ display:flex; gap:1rem; flex-wrap:wrap; align-items:center; margin-top:1.5rem; }
.btn{ border:1px solid var(--fg); padding:.55rem 1rem; display:inline-block; }
.btn:hover{ background:var(--fg); color:var(--bg); }
.btn.primary{ background:var(--red); border-color:var(--red); color:var(--on-red); font-weight:600; }
.btn.primary:hover{ background:var(--pink); border-color:var(--pink); color:var(--on-red); }
.link-pink{ color:var(--pink); }

/* caution stripe + imprint footer */
.stripe{ height:6px; margin-top:2.2rem; background-image:repeating-linear-gradient(135deg,var(--red) 0 9px,transparent 9px 18px); }
.imprint{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:.6rem; padding:1rem 0 3.5rem; font-size:10.5px; letter-spacing:.1em; color:var(--mut); text-transform:uppercase; }

/* generic section heading + steps + priv grid (one-pager) */
.steps{ counter-reset:s; margin:0; padding:0; list-style:none; }
.steps li{ counter-increment:s; padding:.55rem 0 .55rem 2.4rem; position:relative; border-top:1px solid var(--line); }
.steps li:before{ content:counter(s,decimal-leading-zero); position:absolute; left:0; top:.55rem; color:var(--red); }
.priv{ display:grid; grid-template-columns:1fr 1fr; gap:.3rem 1.6rem; margin-top:1rem; }
@media(max-width:560px){ .priv{ grid-template-columns:1fr; } }
.priv div{ padding:.5rem 0; border-top:1px solid var(--line); font-size:13px; color:var(--mut); }
.priv b{ color:var(--fg); font-weight:600; }
.frow{ display:flex; gap:2.2rem; flex-wrap:wrap; }
.frow h4{ margin:0 0 .55rem; font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--fg); font-weight:600; }
.frow a{ display:block; color:var(--mut); font-size:12.5px; padding:.14rem 0; }
.frow a:hover{ color:var(--pink); }

/* Site-wide link popups (popups.js). Hover a link -> annotation card. */
.lp{ position:absolute; z-index:9999; max-width:340px; width:max-content; border:1.5px solid var(--line); background:var(--card); color:var(--fg); box-shadow:5px 5px 0 var(--red); padding:.7rem .85rem; font-family:"Archivo",system-ui,-apple-system,sans-serif; opacity:0; transform:translateY(4px); transition:opacity .12s,transform .12s; pointer-events:none; }
.lp.show{ opacity:1; transform:translateY(0); pointer-events:auto; }
.lp .lp-k{ font-family:"Geist Mono",ui-monospace,monospace; font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--red); }
.lp .lp-t{ font-weight:700; font-size:14px; line-height:1.25; margin:.15rem 0 .3rem; color:var(--fg); }
.lp .lp-d{ font-size:12.5px; line-height:1.5; color:var(--mut); }
.lp a.lp-o{ display:inline-block; margin-top:.5rem; font-family:"Geist Mono",ui-monospace,monospace; font-size:11px; letter-spacing:.04em; color:var(--red); border:0; }
.lp a.lp-o:hover{ text-decoration:underline; }
@media (prefers-reduced-motion:reduce){ .lp{ transition:none; } }