/* 2ndBrain site system. One stylesheet for every 2ndBrain page (Six Sharp keeps its own).
   World: The Marquee (E2). Ink field, violet angled slab with halftone, one gold period, taped prints with
   hard offsets, ticket stubs for doors, Archivo condensed caps, Plex Mono for labels and numbers.
   Borrowed on purpose: the As-Built drawing and the tested-to-fail callout, the Work Order ticket and ledger.
   Components are documented in the build notes; class names here are the contract. */
@font-face{font-family:"Archivo";src:url(/assets/ros/Archivo-100_900-62_125.woff2) format("woff2");font-weight:100 900;font-stretch:62% 125%;font-display:swap}
@font-face{font-family:"Plex Mono";src:url(/assets/ros/IBMPlexMono-600.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Archivo Fallback";src:local("Arial Narrow"),local("Arial");size-adjust:96%;ascent-override:92%}
:root{--ink:#1D1430;--ink-2:#251a3d;--ink-3:#2e2149;--ink-soft:#4A4360;--violet:#7A5FA6;--violet-deep:#563F82;--violet-2:#8E76B6;--tint:#F1ECF8;--line:#D9CFEA;--gold:#FFC933;--lilac:#CDBDF0;--rust:#B4542A;--rust-2:#E07A4E;--plum:#4A1F3D;--white:#fff;--on-ink:#ECE6F8;
--display:"Archivo","Archivo Fallback","Arial Narrow",sans-serif;--mono:"Plex Mono",ui-monospace,Consolas,monospace;--g:clamp(16px,4vw,48px);--max:1240px;--ease:cubic-bezier(.16,1,.3,1);--top:68px}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--top) + 12px)}
body{background:var(--ink);color:var(--white);font-family:var(--display);font-stretch:100%;font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,video,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit}
p a,li a,dd a{text-underline-offset:3px;text-decoration-thickness:1px}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:2px}
::selection{background:var(--gold);color:var(--ink)}
.skip{position:absolute;left:-999px;top:8px;background:var(--gold);color:var(--ink);padding:10px 14px;font-weight:800;z-index:99}.skip:focus{left:8px}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--g)}
.wrap>*,.grid>*{min-width:0}
.mono{font-family:var(--mono);font-weight:600;text-transform:uppercase;letter-spacing:.14em;font-size:.78rem}
.dot{color:var(--gold)}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ── header ─────────────────────────────────────────── */
.top{position:sticky;top:0;z-index:30;background:rgba(29,20,48,.9);backdrop-filter:saturate(1.2) blur(10px);-webkit-backdrop-filter:saturate(1.2) blur(10px);border-bottom:1px solid rgba(205,189,240,.14)}
.top .wrap{display:flex;align-items:center;gap:26px;height:var(--top)}
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-weight:900;font-size:1.32rem;letter-spacing:-.01em;font-stretch:92%;color:#fff;flex:none}
.brand img{width:40px;height:auto}
.nav{display:flex;gap:22px;margin-left:auto;list-style:none}
.nav a{text-decoration:none;font-weight:600;font-size:.95rem;color:var(--lilac);padding:6px 0;border-bottom:2px solid transparent;transition:color .2s,border-color .2s}
.nav a:hover,.nav a[aria-current=page]{color:#fff;border-color:var(--violet-2)}
.menu{display:none;margin-left:auto;position:relative}
.menu summary{list-style:none;cursor:pointer;min-height:42px;min-width:42px;display:grid;place-items:center;border:1px solid rgba(205,189,240,.35);border-radius:6px}
.menu summary::-webkit-details-marker{display:none}
.menu summary span{display:block;width:18px;height:2px;background:#fff;box-shadow:0 -6px 0 #fff,0 6px 0 #fff}
.menu[open] summary span{box-shadow:none;background:var(--gold)}
.menu ul{position:absolute;right:0;top:calc(100% + 12px);list-style:none;background:var(--ink-2);border:1px solid rgba(205,189,240,.2);box-shadow:8px 8px 0 var(--violet);min-width:230px;padding:8px}
.menu li a{display:block;padding:12px 14px;text-decoration:none;font-weight:700;color:#fff}
.menu li a:hover{background:var(--ink-3)}
@media (max-width:960px){.nav{display:none}.menu{display:block}.top .wrap{gap:12px}}
@media (max-width:420px){.top .btn--sm .long{display:none}.brand{font-size:1.15rem}.brand img{width:34px}}

/* ── buttons ────────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:52px;padding:0 24px;background:#fff;color:var(--ink);font-family:var(--display);font-weight:800;font-size:1rem;line-height:1.15;text-align:center;text-decoration:none;border:0;border-radius:6px;box-shadow:5px 5px 0 var(--violet);transition:transform .25s var(--ease),box-shadow .25s var(--ease);cursor:pointer}
.btn:hover{transform:translate(-2px,-2px);box-shadow:7px 7px 0 var(--violet)}
.btn:active{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--violet)}
.btn svg{width:18px;height:18px;flex:none}
.btn--sm{min-height:42px;padding:0 16px;font-size:.92rem;box-shadow:4px 4px 0 var(--violet);flex:none}
.btn--ink{background:var(--ink);color:#fff}
.btn--violet{background:var(--violet);color:#fff;box-shadow:5px 5px 0 var(--ink)}
.btn--violet:hover{box-shadow:7px 7px 0 var(--ink)}
.btn[disabled]{opacity:.45;cursor:not-allowed;transform:none}
.on-violet .btn,.close .btn{box-shadow:6px 6px 0 var(--ink)}
.link{font-weight:800;text-decoration:none;border-bottom:2px solid var(--gold);padding-bottom:2px}
.link:hover{color:var(--gold)}

/* ── type ───────────────────────────────────────────── */
h1,.h1{font-weight:900;font-stretch:72%;font-size:clamp(3rem,7.4vw,6rem);line-height:.9;letter-spacing:-.015em;text-transform:uppercase;text-wrap:balance}
.h1--page{font-size:clamp(2.7rem,6.2vw,5rem)}
.h2{font-weight:900;font-stretch:76%;font-size:clamp(2.2rem,5vw,4.2rem);line-height:.95;text-transform:uppercase;letter-spacing:-.01em;text-wrap:balance;max-width:18ch}
.h3{font-weight:900;font-stretch:80%;font-size:clamp(1.4rem,2.2vw,1.8rem);line-height:1;text-transform:uppercase}
.sub{margin-top:18px;font-weight:800;font-stretch:88%;font-size:clamp(1.45rem,3vw,2.3rem);line-height:1.08;color:var(--lilac);text-wrap:balance}
.lede{margin-top:20px;max-width:48ch;font-size:1.12rem;color:var(--on-ink)}
.intro{margin-top:18px;max-width:60ch;color:#e3dcf2;font-size:1.08rem}
.prose{max-width:66ch}
.prose p{font-size:1.1rem;color:var(--on-ink)}
.prose p+p{margin-top:16px}
.prose h2{margin:44px 0 12px;font-weight:900;font-stretch:80%;font-size:1.7rem;line-height:1.05;text-transform:uppercase}
.light .prose p{color:var(--ink-soft)}

/* ── layout bands ───────────────────────────────────── */
section{position:relative}
.band{padding:clamp(72px,10vw,128px) 0}
.band--tight{padding:clamp(52px,7vw,88px) 0}
.ink2{background:var(--ink-2)}
.light{background:var(--tint);color:var(--ink)}
.light .h2,.light h1{color:var(--ink)}
.light .intro,.light .lede{color:var(--ink-soft)}
.white{background:#fff;color:var(--ink)}
.white .intro{color:var(--ink-soft)}
.on-violet{background:var(--violet)}
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,6vw,80px);align-items:center}
.split--top{align-items:start}
@media (max-width:860px){.split{grid-template-columns:1fr}}
.acts{margin-top:30px;display:flex;flex-wrap:wrap;align-items:center;gap:18px 26px}
.also{margin-top:22px;display:flex;flex-wrap:wrap;gap:8px 18px;font-size:.95rem;color:var(--lilac)}
.also a{text-decoration-color:rgba(205,189,240,.45);text-underline-offset:4px}
.also a:hover{color:#fff;text-decoration-color:var(--gold)}
.light .also{color:var(--ink-soft)}.light .also a:hover{color:var(--ink)}

/* ── the slab, rays and hero ────────────────────────── */
.slab{position:absolute;inset:0 0 0 auto;width:58%;background:var(--violet);clip-path:polygon(22% 0,100% 0,100% 100%,0 100%);z-index:-2}
.slab::after{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(29,20,48,.32) 1.2px,transparent 1.6px);background-size:9px 9px;-webkit-mask-image:linear-gradient(200deg,#000 0,transparent 70%);mask-image:linear-gradient(200deg,#000 0,transparent 70%)}
.rays{position:absolute;left:-18%;top:-30%;width:120%;height:auto;z-index:-3;opacity:.5;pointer-events:none}
.hero{position:relative;overflow:hidden;isolation:isolate;min-height:min(90vh,860px);display:flex;align-items:center;padding:56px 0 72px}
.hero>.wrap{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(24px,5vw,72px);align-items:center;width:100%}
.hero--page{min-height:0;padding:clamp(48px,7vw,96px) 0 clamp(56px,8vw,104px)}
.hero--page .slab{width:40%}
.hero--solo>.wrap{grid-template-columns:minmax(0,1fr)}
@media (max-width:860px){
  .hero{min-height:0;padding:36px 0 56px}
  .hero>.wrap{grid-template-columns:1fr}
  .slab,.hero--page .slab{width:100%;top:auto;height:44%;clip-path:polygon(0 18%,100% 0,100% 100%,0 100%)}
  .hero--solo .slab{height:30%}
  .rays{left:-60%;top:-10%;width:220%}
}

/* ── taped print ────────────────────────────────────── */
.print{width:100%;position:relative;background:#fff;padding:12px 12px 52px;transform:rotate(2.4deg);box-shadow:10px 10px 0 var(--ink);max-width:560px;justify-self:end}
.print .frame{position:relative;aspect-ratio:16/10;overflow:hidden;background:#0d0a18}
.print img,.print video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.print video{opacity:0;transition:opacity 1.2s ease}.print video.on{opacity:1}
.print figcaption{position:absolute;left:16px;right:16px;bottom:14px;color:var(--ink);font-family:var(--mono);font-weight:600;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase}
.tape{position:absolute;top:-14px;left:50%;width:120px;height:28px;margin-left:-60px;background:rgba(255,201,51,.82);transform:rotate(-4deg);mix-blend-mode:multiply;z-index:2}
@media (max-width:860px){.print{justify-self:center;transform:rotate(1.6deg);max-width:100%}}

/* ── As-Built annotations on a print (from C) ──────── */
.anno{position:absolute;inset:0;pointer-events:none}
.anno svg{position:absolute;inset:0;width:100%;height:100%}
.anno line{stroke:#fff;stroke-width:1.3;vector-effect:non-scaling-stroke}
.pin{position:absolute;width:12px;height:12px;margin:-6px 0 0 -6px;border:2px solid var(--gold);border-radius:50%;background:var(--ink)}
.tag{position:absolute;font-family:var(--mono);font-weight:600;font-size:.64rem;letter-spacing:.1em;text-transform:uppercase;background:var(--ink);color:#fff;padding:5px 8px;white-space:nowrap}
.js .anno line{stroke-dasharray:120;stroke-dashoffset:120;animation:draw 1.1s var(--ease) .5s forwards}
.js .anno .tag,.js .anno .pin{opacity:0;animation:fade .6s ease 1.2s forwards}
@keyframes draw{to{stroke-dashoffset:0}}@keyframes fade{to{opacity:1}}
@media (max-width:640px){.tag{font-size:.54rem;padding:4px 6px;letter-spacing:.06em}.anno .wide-only{display:none}}

/* ── marquee strip ──────────────────────────────────── */
.marquee{background:var(--gold);color:var(--ink);overflow:hidden;border-block:3px solid var(--ink);position:relative}
.marquee::before,.marquee::after{content:"";position:absolute;left:0;right:0;height:6px;background-image:radial-gradient(var(--ink) 2px,transparent 2.5px);background-size:16px 6px}
.marquee::before{top:4px}.marquee::after{bottom:4px}
.track{display:flex;width:max-content;animation:run 38s linear infinite;padding:20px 0}
.track span{font-weight:900;font-stretch:70%;font-size:clamp(1.25rem,2.6vw,1.9rem);text-transform:uppercase;white-space:nowrap;padding-right:1.4em}
.track span::after{content:"";display:inline-block;width:.42em;height:.42em;background:var(--violet);border-radius:50%;margin-left:1.4em;vertical-align:.18em}
@keyframes run{to{transform:translateX(-50%)}}

/* ── the drawing: how it goes together (from C) ─────── */
.assy{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,64px);align-items:center}
.ax{position:relative;aspect-ratio:1/1;border:1.5px solid rgba(205,189,240,.35);background:linear-gradient(rgba(205,189,240,.07) 1px,transparent 1px) 0 0/24px 24px,linear-gradient(90deg,rgba(205,189,240,.07) 1px,transparent 1px) 0 0/24px 24px,var(--violet-deep)}
.ax svg.static{position:absolute;inset:0;width:100%;height:100%}
.ax.is-live svg.static{display:none}
.ax canvas{position:absolute;inset:0;width:100%!important;height:100%!important}
.ax [data-plate]{position:absolute;left:0;top:0;color:#fff;font-family:var(--mono);font-weight:600;font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;background:var(--ink);padding:4px 8px;white-space:nowrap;opacity:0;pointer-events:none;margin:-12px 0 0 14px}
.ax:not(.is-live) [data-plate]{display:none}
.ax .tb{position:absolute;right:10px;bottom:10px;font-family:var(--mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--lilac);border:1px solid rgba(205,189,240,.5);padding:6px 8px;background:var(--ink)}
.steps{margin-top:28px;list-style:none;counter-reset:n}
.steps li{counter-increment:n;display:grid;grid-template-columns:46px 1fr;gap:8px;padding:18px 0;border-top:1px solid rgba(205,189,240,.25)}
.steps li::before{content:counter(n);width:32px;height:32px;border:1.5px solid var(--gold);color:var(--gold);border-radius:50%;display:grid;place-items:center;font-family:var(--mono);font-size:.8rem}
.steps b{display:block;font-weight:900;font-stretch:78%;text-transform:uppercase;font-size:1.4rem;line-height:1.05}
.steps p{color:#e3dcf2;margin-top:4px}
@media (max-width:900px){.assy{grid-template-columns:1fr}.ax{max-width:520px}}

/* ── tested to fail (from C) ────────────────────────── */
.fail{position:relative;margin-top:64px;max-width:1000px;padding:clamp(26px,4vw,44px);border:2px solid var(--rust-2);background:rgba(180,84,42,.08)}
.fail .mono{color:var(--rust-2);display:block;margin-bottom:12px}
.fail p{font-weight:800;font-stretch:86%;font-size:clamp(1.45rem,3vw,2.3rem);line-height:1.1}
.fail cite{display:block;margin-top:14px;font-style:normal;color:var(--lilac)}
.fail::before{content:"";position:absolute;right:-16px;top:-16px;width:32px;height:32px;background:var(--rust-2);clip-path:polygon(50% 0,100% 100%,0 100%)}

/* ── proof prints wall ──────────────────────────────── */
.prints{margin-top:56px;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,40px);align-items:start}
.prints figure{background:#fff;color:var(--ink);padding:10px 10px 0;box-shadow:8px 8px 0 var(--ink);position:relative}
.prints figure:nth-child(3n+1){transform:rotate(-1.6deg)}.prints figure:nth-child(3n+2){transform:rotate(1.2deg);margin-top:28px}.prints figure:nth-child(3n){transform:rotate(-.6deg)}
.prints img{aspect-ratio:16/10;object-fit:cover;object-position:top;width:100%;border:1px solid var(--line)}
.prints figcaption{padding:16px 6px 20px}
.prints h3{font-weight:900;font-stretch:84%;font-size:1.5rem;line-height:1;text-transform:uppercase}
.prints p{margin-top:8px;font-size:.98rem;color:var(--ink-soft)}
.prints .tape{width:90px;margin-left:-45px}
@media (max-width:860px){.prints{grid-template-columns:1fr;max-width:520px;margin-inline:auto}.prints figure:nth-child(3n+2){margin-top:0}}

/* ── quote slab ─────────────────────────────────────── */
.quote{margin-top:64px;background:var(--violet);padding:clamp(28px,4vw,48px);box-shadow:10px 10px 0 var(--plum);position:relative;max-width:980px}
.quote p{font-weight:800;font-stretch:90%;font-size:clamp(1.4rem,2.8vw,2.2rem);line-height:1.12}
.quote cite{display:block;margin-top:16px;font-style:normal}

/* ── origin / sticker ───────────────────────────────── */
.origin{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(28px,6vw,90px);align-items:end}
.sticker{position:relative;align-self:stretch;display:flex;align-items:flex-end;justify-content:center;min-height:420px}
.sticker::before{content:"";position:absolute;inset:12% 0 0;background:var(--violet);clip-path:polygon(0 12%,100% 0,100% 100%,0 100%)}
.sticker img{position:relative;width:min(100%,420px);filter:drop-shadow(5px 0 0 #fff) drop-shadow(-5px 0 0 #fff) drop-shadow(0 -5px 0 #fff) drop-shadow(10px 10px 0 rgba(0,0,0,.35))}
.words p{font-size:clamp(1.12rem,1.7vw,1.38rem);line-height:1.5;color:#efe9fa;max-width:42ch}
.words p+p{margin-top:16px}
.words .sign{margin-top:26px;color:var(--lilac)}
@media (max-width:860px){.origin{grid-template-columns:1fr}.sticker{min-height:340px;order:2}}

/* ── door strip: ticket stubs ───────────────────────── */
.tickets{margin-top:52px;display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.ticket{position:relative;color:var(--ink);background:#fff;padding:28px 26px 26px;text-decoration:none;display:flex;flex-direction:column;min-height:300px;
  -webkit-mask:radial-gradient(circle at 0 70%,transparent 13px,#000 14px) left/51% 100% no-repeat,radial-gradient(circle at 100% 70%,transparent 13px,#000 14px) right/51% 100% no-repeat;
  mask:radial-gradient(circle at 0 70%,transparent 13px,#000 14px) left/51% 100% no-repeat,radial-gradient(circle at 100% 70%,transparent 13px,#000 14px) right/51% 100% no-repeat;transition:transform .3s var(--ease)}
.ticket:hover{transform:translateY(-4px) rotate(-.6deg)}
.ticket .mono{color:var(--violet-deep)}
.ticket h3{margin-top:12px;font-weight:900;font-stretch:76%;font-size:2.05rem;line-height:.95;text-transform:uppercase}
.ticket p{margin-top:10px;color:var(--ink-soft);font-size:1rem}
.ticket .stub{margin-top:auto;padding-top:22px;border-top:2px dashed var(--line);display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-weight:800}
.ticket .stub span{font-family:var(--mono);font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;color:var(--violet-deep)}
.ticket--violet{background:var(--violet);color:#fff}.ticket--violet .mono,.ticket--violet p,.ticket--violet .stub span{color:#fff}.ticket--violet .stub{border-color:rgba(255,255,255,.45)}
.ticket--gold{background:var(--gold)}
@media (max-width:860px){.tickets{grid-template-columns:1fr}.ticket{min-height:0}}

/* ── the work order ticket (from B) ─────────────────── */
.wo{background:#fff;color:var(--ink);border:1.5px solid var(--ink);box-shadow:12px 12px 0 var(--ink);position:relative}
.wo::before{content:"";position:absolute;left:0;right:0;top:-1.5px;height:8px;background:radial-gradient(circle at 6px -2px,var(--ink) 4px,transparent 4.5px) 0 0/14px 8px repeat-x}
.wo-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:20px 22px 14px;border-bottom:1.5px solid var(--ink)}
.wo-head h2{font-weight:900;font-stretch:76%;text-transform:uppercase;font-size:1.7rem;line-height:1}
.wo-head .mono{color:var(--violet-deep);font-size:.68rem}
.wo-sec{padding:18px 22px;border-bottom:1px solid var(--line)}
.wo-sec:last-child{border-bottom:0}
.wo-row{display:grid;grid-template-columns:150px 1fr;border-bottom:1px solid var(--line)}
.wo-row>label,.wo-row>.lbl{padding:16px 14px 12px 22px;border-right:1px solid var(--line);font-family:var(--mono);font-weight:600;font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--violet-deep);line-height:1.35}
.wo-row>div{padding:8px 14px;display:flex;align-items:center}
.wo-row input,.wo-row select,.wo-row textarea{width:100%;min-height:46px;padding:10px 8px;border:0;border-bottom:2px solid transparent;font:inherit;font-weight:600;color:var(--ink);background:transparent;border-radius:0}
.wo-row textarea{min-height:84px;resize:vertical;line-height:1.45}
.wo-row input:focus,.wo-row select:focus,.wo-row textarea:focus{outline:none;border-bottom-color:var(--violet);background:var(--tint)}
.wo-row--job{background:#FFF8E1}
.wo-row--job>label{color:var(--ink)}
.wo-row[hidden]{display:none}
.wo-foot{display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px;justify-content:space-between;padding:18px 22px;background:var(--tint)}
.wo-foot .fine{font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);max-width:30ch}
.wo .btn{background:var(--ink);color:#fff;box-shadow:5px 5px 0 var(--violet)}
@media (max-width:560px){.wo-row{grid-template-columns:1fr}.wo-row>label,.wo-row>.lbl{border-right:0;padding:12px 16px 0}.wo-row>div{padding:4px 10px 8px}.wo-head,.wo-sec,.wo-foot{padding-left:16px;padding-right:16px}}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.msg{min-height:1.4em;font-weight:700;padding:0 22px 16px}.msg.err{color:var(--rust)}.msg.ok{color:var(--violet-deep)}
.done{padding:26px 22px;background:var(--gold);color:var(--ink)}
.done h3{font-weight:900;font-stretch:78%;text-transform:uppercase;font-size:1.8rem;line-height:1}
.done p{margin-top:8px}

/* slot picker */
.days{display:flex;gap:8px;overflow-x:auto;padding:4px 0 10px;scrollbar-width:thin}
.day{flex:0 0 auto;min-width:88px;padding:10px 12px;border:2px solid var(--line);background:#fff;border-radius:4px;text-align:left;font:inherit;cursor:pointer;color:var(--ink)}
.day b{display:block;font-weight:900;font-stretch:80%;font-size:1.3rem;text-transform:uppercase;line-height:1}
.day small{font-family:var(--mono);font-size:.7rem;color:var(--ink-soft)}
.day[aria-pressed=true]{border-color:var(--ink);box-shadow:4px 4px 0 var(--violet)}
.times{display:grid;grid-template-columns:repeat(auto-fill,minmax(98px,1fr));gap:8px;margin-top:8px}
.t{min-height:46px;border:2px solid var(--line);border-radius:4px;background:#fff;color:var(--ink);font:inherit;font-weight:800;cursor:pointer}
.t:hover{border-color:var(--violet)}
.t[aria-pressed=true]{background:var(--ink);color:#fff;border-color:var(--ink)}
.slotnote{font-family:var(--mono);font-size:.68rem;letter-spacing:.06em;color:var(--ink-soft);margin-top:10px}
.picked{margin-top:14px;padding:10px 12px;background:var(--tint);font-weight:800}
.picked[data-on]{background:var(--gold)}
.skel{display:flex;gap:8px}.skel i{flex:0 0 88px;height:58px;border-radius:4px;background:linear-gradient(90deg,var(--tint),#fff,var(--tint));background-size:200% 100%;animation:sh 1.2s linear infinite}
@keyframes sh{to{background-position:-200% 0}}

/* ── ledger (from B's job log) ──────────────────────── */
.ledger{width:100%;border-collapse:collapse;margin-top:40px}
.ledger th{text-align:left;font-family:var(--mono);font-weight:600;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--violet-deep);padding:0 14px 12px 0;border-bottom:2px solid var(--ink)}
.ledger td{padding:16px 14px 16px 0;border-bottom:1px solid var(--line);vertical-align:top;color:var(--ink-soft)}
.ledger td:first-child{color:var(--ink);font-weight:900;font-stretch:84%;text-transform:uppercase;font-size:1.1rem;line-height:1.1;width:30%}
.ledger .st{font-family:var(--mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);background:var(--tint);padding:3px 8px;white-space:nowrap}
.ledger .st--on{background:#E4F4E4}
@media (max-width:640px){.ledger thead{display:none}.ledger tr{display:block;padding:14px 0;border-bottom:1px solid var(--line)}.ledger td{display:block;border:0;padding:2px 0;width:auto!important}}

/* ── list with gold dots ────────────────────────────── */
.dots{list-style:none;display:grid;gap:14px;margin-top:26px}
.dots li{display:grid;grid-template-columns:22px 1fr;gap:12px}
.dots li::before{content:"";width:12px;height:12px;margin-top:.5em;background:var(--gold);border-radius:50%}
.light .dots li::before,.white .dots li::before{background:var(--violet)}

/* ── card pair / plan panels ────────────────────────── */
.panels{margin-top:48px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:24px}
.panel{background:#fff;color:var(--ink);padding:clamp(22px,3vw,34px);box-shadow:10px 10px 0 var(--ink);position:relative}
.panel h3{font-weight:900;font-stretch:78%;text-transform:uppercase;font-size:1.7rem;line-height:1}
.panel p{margin-top:10px;color:var(--ink-soft)}
.panel .price{margin-top:18px;font-weight:900;font-stretch:76%;font-size:3rem;line-height:.9}
.panel .price small{font-family:var(--mono);font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);font-weight:600;margin-left:6px}
.panel .btn{margin-top:22px}
.panel--violet{background:var(--violet);color:#fff}.panel--violet p,.panel--violet .price small{color:#f1ecf8}
.panel--violet .btn{box-shadow:5px 5px 0 var(--ink)}

/* ── FAQ ────────────────────────────────────────────── */
.faq{margin-top:36px;max-width:820px;border-top:2px solid currentColor}
.faq details{border-bottom:1px solid rgba(205,189,240,.3)}
.light .faq details,.white .faq details{border-color:var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:20px 40px 20px 0;font-weight:800;font-size:1.15rem;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:6px;top:50%;width:14px;height:14px;margin-top:-9px;border-right:2.5px solid currentColor;border-bottom:2.5px solid currentColor;transform:rotate(45deg);transition:transform .25s var(--ease)}
.faq details[open] summary::after{transform:rotate(225deg);margin-top:-2px}
.faq details p{padding:0 0 20px;max-width:64ch;color:inherit;opacity:.88}

/* ── channels grid (live) ───────────────────────────── */
.chans{margin-top:44px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:2px;background:rgba(205,189,240,.25);border:2px solid rgba(205,189,240,.25)}
.chan{background:var(--ink);padding:24px;text-decoration:none;display:flex;flex-direction:column;gap:8px;min-height:170px;transition:background .25s}
.chan:hover{background:var(--ink-3)}
.chan svg{width:28px;height:28px;color:var(--gold)}
.chan b{font-weight:900;font-stretch:80%;font-size:1.45rem;text-transform:uppercase;line-height:1}
.chan span{color:var(--lilac);font-size:.95rem}
.chan .mono{margin-top:auto;color:var(--gold);font-size:.7rem}

/* ── close band ─────────────────────────────────────── */
.close{background:var(--violet);overflow:hidden;isolation:isolate}
.close .rays{opacity:.35;left:20%;top:-60%}
.close .h2{font-size:clamp(2.7rem,7vw,5.6rem);max-width:none}
.close .intro{color:#fff}
.close .also{color:#f1ecf8}.close .also a:hover{color:#fff}

/* ── footer with a title block (from C) ─────────────── */
.foot{padding:64px 0 40px;color:var(--lilac);font-size:.94rem;border-top:1px solid rgba(205,189,240,.14)}
.foot-grid{display:grid;grid-template-columns:1.3fr repeat(3,1fr);gap:32px}
.foot h2{font-family:var(--mono);font-weight:600;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:#fff;margin-bottom:12px}
.foot ul{list-style:none;display:grid;gap:8px}
.foot a{text-decoration:none}.foot a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.foot .brand{margin-bottom:14px}
.foot .tagline{max-width:32ch}
.tblock{margin-top:44px;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;border:1.5px solid rgba(205,189,240,.45);font-size:.88rem}
.tblock>div{padding:10px 12px;border-right:1px solid rgba(205,189,240,.3)}
.tblock>div:last-child{border-right:0}
.tblock .mono{display:block;font-size:.58rem;color:var(--lilac);margin-bottom:2px;opacity:.8}
.tblock b{color:#fff;font-weight:800}
@media (max-width:860px){.foot-grid{grid-template-columns:1fr 1fr}.foot-grid>div:first-child{grid-column:1/-1}.tblock{grid-template-columns:1fr 1fr}.tblock>div:nth-child(2){border-right:0}.tblock>div:nth-child(-n+2){border-bottom:1px solid rgba(205,189,240,.3)}}

/* ── reveals and motion ─────────────────────────────── */
.js .pre{opacity:0;transform:translateY(26px)}
[data-reveal]{transition:opacity .9s var(--ease),transform .9s var(--ease)}
@media (prefers-reduced-motion:reduce){.track{animation:none}.js .anno line{animation:none;stroke-dashoffset:0}.js .anno .tag,.js .anno .pin{animation:none;opacity:1}*{transition:none!important;scroll-behavior:auto!important}}

/* ── form extras: SMS consent, reveal ───────────────── */
.consent{display:flex;gap:10px;align-items:flex-start;padding:14px 22px;font-size:.85rem;line-height:1.5;color:var(--ink-soft);border-bottom:1px solid var(--line)}
.consent[hidden]{display:none}
.consent input{width:18px;height:18px;margin-top:2px;flex:none;accent-color:var(--ink)}
.wo .fine-row{padding:12px 22px;font-size:.85rem;color:var(--ink-soft);border-bottom:1px solid var(--line)}
.when{display:inline-block;margin-top:22px;background:#fff;color:var(--ink);padding:10px 14px;font-weight:800;box-shadow:5px 5px 0 var(--gold)}