/* THE STUDIO ROOM — the .studio's new scheme in one file (Oct 25 2026).
   Lifted from the New Business List pages (api/newbiz-page.mjs, "the Studio's dark room", built Oct 25 2026), which
   Anthony named as the look every .studio page should wear: "everything should be that style or match as well with
   proper headings logos etc...all in the new scheme."
   Made by the Studio Room machine (machines/studio-room/). A page wears it with:
     <body class="room"> + this file + /studio-bar.css + /studio-dock.css + /studio-dock.js
   Pieces: lockup · crumbs · kick · h1 (red em) · sub (gold italic) · lede · jg (plain/geek switch) · stats ·
   caps (the floating tic tacs) · sheet (the cream list sheet) · player · cards · btn.a / btn.b · sign · foot.
   Always the same dark room on phone and laptop. Phone first (390). */
:root{--black:#0a0a0d;--raise:#1b1613;--raise-2:#120e0c;--paper:#f4efe2;--paper-2:rgba(244,239,226,.78);--paper-3:rgba(244,239,226,.55);
--red:#c8102e;--red-deep:#5a0517;--line:rgba(214,178,96,.22);--line-2:rgba(214,178,96,.42);--gold:#d8b968;--gold2:#f3cf62;--rim:#c9a24a;
--serif:'Instrument Serif',Georgia,'Times New Roman',serif;--sans:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif;--ease:cubic-bezier(.22,1,.36,1);--nav:64px;--gut:18px;
--card:#fffcf6;--band:#efe6d0;--ink:#241417;--ink2:rgba(36,20,23,.74);--ink3:rgba(36,20,23,.56);--cl:rgba(90,5,23,.14);--cl2:rgba(90,5,23,.3)}
@media(min-width:760px){:root{--gut:32px}}
body.room *{box-sizing:border-box}
html:has(body.room){background:var(--black);-webkit-text-size-adjust:100%}
body.room{margin:0;font-family:var(--sans);font-size:16px;line-height:1.55;color:var(--paper);background:var(--black);overflow-x:hidden}
body.room :where(a:not(.tabbar a):not(.dk-sheet a)){color:inherit;text-decoration:none}   /* the dock keeps its own ink (Anthony, Oct 29 2026: 'my nav bar has nothing on it'); :where keeps this rule as weak as the old one, so every page's own link colors still win (his 7:25 AM report: the three cream jump buttons went blank) */
body.room img{max-width:100%}
body.room :focus-visible{outline:3px solid var(--red);outline-offset:3px;border-radius:4px}
.room .wrap{max-width:1240px;margin:0 auto;padding:0 var(--gut)}
.room .nav{position:fixed;inset:0 0 auto 0;z-index:60;height:var(--nav);display:flex;align-items:center;background:rgba(10,10,13,.86);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.room .nav .wrap{display:flex;align-items:center;gap:12px;width:100%}
.room .brand{display:flex;align-items:center;gap:9px}
@media(min-width:900px){.room .nav nav{display:flex}}
.room main.rm{max-width:1080px;margin:0 auto;padding:calc(var(--nav) + 22px) var(--gut) 56px}
/* the product's own sign up top (a lockup image, or an icon + two-line name) */
.room .lockup{display:block;width:min(440px,88%);height:auto;margin:6px 0 18px}
.room .lk{display:flex;align-items:center;gap:16px;margin:6px 0 18px}
.room .lk img{width:clamp(64px,12vw,92px);height:auto;border-radius:22%;box-shadow:0 0 0 2px var(--rim),0 18px 30px -14px rgba(0,0,0,.8)}
.room .lk b{display:block;font:400 clamp(30px,5vw,46px)/1 var(--serif);color:var(--paper)}
.room .lk i{display:block;font:italic 400 clamp(22px,3.6vw,32px)/1.05 var(--serif);color:var(--gold2)}
.room .lk h1.lkh{margin:0;font:400 16px/1 var(--serif);letter-spacing:0}
.room .lk>div,.room .lk>span{min-width:0}
.room .lk small{display:block;margin-top:6px;font:700 10.5px/1.3 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.room .crumbs{font-size:13px;color:var(--paper-3);margin:0 0 4px}
.room .crumbs a{color:var(--paper-2);text-decoration:underline;text-underline-offset:3px}.room .crumbs a:hover{color:var(--gold2)}
.room .kick{font:700 12px/1.3 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin:14px 0 10px}
.room h1{font:400 clamp(38px,6.5vw,72px)/1.02 var(--serif);margin:0 0 10px;letter-spacing:-.01em;text-wrap:balance;color:var(--paper)}
.room h1 em{color:var(--red);font-style:italic}
.room h2{font:400 clamp(28px,4vw,40px)/1.08 var(--serif);margin:34px 0 12px;color:var(--paper)}
.room h2 em{color:var(--gold2);font-style:italic}
.room h3{font:400 24px/1.15 var(--serif);margin:0 0 8px;color:var(--paper)}
.room .sub{font:italic 400 clamp(19px,2.6vw,26px)/1.25 var(--serif);color:var(--gold2);margin:0 0 14px;max-width:52ch}
.room .lede,.room .rm p.tx{max-width:70ch;color:var(--paper-2);margin:0 0 18px}
.room .fine{font-size:13.5px;color:var(--paper-3);max-width:76ch;margin:10px 0}
.room .fine a,.room .lede a,.room .tx a{color:var(--gold2);text-decoration:underline;text-underline-offset:3px}
/* the plain / geek switch (Anthony, Oct 3 2026: "it defaults to plain, but it can change to geek in a click") */
.room .jg{display:inline-flex;flex-direction:column;align-items:flex-start;gap:2px;margin:0 0 22px;padding:10px 16px;border:1px solid var(--line-2);border-radius:14px;background:var(--raise);cursor:pointer;font:inherit;color:inherit;text-align:left}
.room .jg b{font-weight:700;font-size:14px;color:var(--paper)}.room .jg span{font-size:12.5px;color:var(--paper-3)}
.room .stats{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 20px}
.room .stat{background:var(--raise);border:1px solid var(--line);border-radius:16px;padding:12px 16px;min-width:140px}
.room .stat b{display:block;font:400 32px/1 var(--serif);color:var(--gold2)}.room .stat span{font-size:12.5px;color:var(--paper-3)}
/* THE CAPSULES — the New Business List's floating tic tacs, for any set of choices (states, systems, plans, links) */
.room .caps{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:20px 18px;margin:6px 0 10px;padding:8px 2px 14px;list-style:none}
.room .cap{position:relative;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:64px;padding:0 26px;border-radius:999px;
 background:linear-gradient(180deg,#fffdf8 0%,#f4ead3 62%,#e6d6b2 100%);color:#241417;border:0;font:inherit;cursor:pointer;text-align:left;
 box-shadow:0 0 0 2px var(--rim),0 0 0 6px rgba(201,162,74,.18),inset 0 2px 0 rgba(255,255,255,.9),inset 0 -6px 12px rgba(150,110,40,.18),0 18px 26px -12px rgba(0,0,0,.7);
 animation:rmf 4.2s ease-in-out infinite alternate;animation-delay:var(--d,0s);transition:transform .3s var(--ease),box-shadow .25s,filter .25s}
.room .cap::after{content:"";position:absolute;left:18%;right:18%;bottom:-20px;height:8px;border-radius:50%;background:radial-gradient(closest-side,rgba(243,207,98,.28),transparent);animation:rms 4.2s ease-in-out infinite alternate;animation-delay:var(--d,0s)}
.room .cap b{font:400 24px/1.05 var(--serif);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.room .cap span{font:800 16px/1 var(--sans);color:var(--red);font-variant-numeric:tabular-nums;white-space:nowrap}
.room .cap img{width:34px;height:34px;border-radius:9px;flex:0 0 auto;box-shadow:0 0 0 1.5px var(--rim)}
.room .cap:hover,.room .cap:focus-visible,.room .cap.on{animation:none;transform:translateY(-12px) scale(1.04);filter:brightness(1.04);box-shadow:0 0 0 2px var(--gold2),0 0 0 8px rgba(243,207,98,.28),inset 0 2px 0 rgba(255,255,255,.9),inset 0 -6px 12px rgba(150,110,40,.18),0 28px 34px -14px rgba(0,0,0,.75)}
.room .cap.on{background:linear-gradient(180deg,#fff4f0 0%,#f6dccf 62%,#e9bfae 100%)}
@keyframes rmf{from{transform:translateY(0)}to{transform:translateY(-8px)}}
@keyframes rms{from{opacity:1;transform:scaleX(1)}to{opacity:.55;transform:scaleX(.82)}}
.room .caph{font-size:13.5px;color:var(--paper-3);margin:0 0 6px}
@media(max-width:560px){.room .caps{grid-template-columns:1fr 1fr;gap:16px 12px}.room .cap{min-height:56px;padding:0 16px;flex-direction:column;justify-content:center;gap:3px;text-align:center}.room .cap b{font-size:20px;max-width:100%}.room .cap span{font-size:14px}.room .cap img{display:none}}
@media(prefers-reduced-motion:reduce){.room .cap,.room .cap::after{animation:none}}
/* THE SHEET — the cream list sheet (lists, tables, plans, forms) */
.room .sheet{background:var(--card);color:var(--ink);border-radius:6px;overflow:hidden;box-shadow:0 0 0 1px rgba(201,162,74,.5),0 24px 60px rgba(0,0,0,.45);margin:0 0 18px}
.room .sheet .shd{display:flex;align-items:center;gap:12px;padding:14px 16px 12px;border-bottom:1px solid var(--cl)}
.room .sheet .shd img{width:38px;height:38px;border-radius:9px;box-shadow:0 0 0 1.5px var(--rim)}
.room .sheet .shd b{display:block;font:400 21px/1.1 var(--serif);color:var(--ink)}.room .sheet .shd span{font-size:12px;color:var(--ink3)}
.room .sheet .sbd{padding:16px}
.room .sheet p{color:var(--ink2)}.room .sheet a{color:var(--red);font-weight:700}
.room .sheet table{width:100%;border-collapse:collapse}
.room .sheet thead th{font:700 11px/1.3 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--red);text-align:left;padding:14px 14px 12px;border-bottom:2px solid var(--ink)}
.room .sheet td{padding:11px 14px;border-bottom:1px solid var(--cl);vertical-align:middle}
.room .sheet td.r{text-align:right;white-space:nowrap;font-weight:600}
.room .sheet tr.sec td{background:var(--band);font:700 11px/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--red-deep);padding:10px 14px}
.room .sheet input,.room .sheet select,.room .sheet textarea{width:100%;min-height:48px;border-radius:12px;border:1px solid var(--cl2);background:#fff;padding:0 14px;font:500 16px/1 var(--sans);color:var(--ink)}
.room .sheet label{display:block;font:700 11px/1.3 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--red-deep);margin:12px 0 6px}
/* dark cards (a grid of things that are not choices) */
.room .cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;margin:6px 0 18px}
.room .card{background:var(--raise);border:1px solid var(--line);border-radius:18px;padding:18px;color:var(--paper-2)}
.room .card h3{margin:0 0 6px}.room .card p{margin:0;font-size:14.5px}
.room a.card:hover{border-color:var(--line-2);transform:translateY(-3px);transition:transform .25s var(--ease)}
/* video */
.room .player{background:#120c0d;border-radius:18px;overflow:hidden;box-shadow:0 0 0 2px var(--rim),0 30px 60px -30px rgba(0,0,0,.8)}
.room .player video{display:block;width:100%;height:auto;aspect-ratio:16/9;background:#120c0d}
.room .meta{color:var(--paper-3);font-size:14px;margin:10px 2px 0}.room .meta a{color:var(--gold2);text-decoration:underline;text-underline-offset:3px}
/* buttons */
.room .cta{display:flex;flex-wrap:wrap;gap:12px;margin:26px 0 10px}
.room .btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border-radius:999px;font-weight:600;font-size:15px;border:0;cursor:pointer;font-family:var(--sans);transition:transform .25s var(--ease),background .25s}
.room .btn.a{background:var(--red);color:#fffcf6}.room .btn.a:hover{background:#a80d26;transform:translateY(-2px)}
.room .btn.b{border:1px solid var(--line-2);color:var(--paper);background:none}.room .btn.b:hover{border-color:var(--paper)}
.room .btn.g{background:linear-gradient(180deg,#f3cf62,#d8b968);color:#241417}
/* email sign-up */
.room .sign{margin:0 0 22px}
.room .sign h2{font:700 12px/1.3 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin:0 0 6px}.room .sign p{margin:0 0 12px;color:var(--paper-2);font-size:14.5px}
.room .sign form{display:flex;flex-wrap:wrap;gap:10px;max-width:640px}
.room .sign input[type=email]{flex:1 1 240px;min-width:0;min-height:50px;border-radius:999px;border:1px solid var(--line-2);background:var(--card);padding:0 20px;font:500 16px/1 var(--sans);color:var(--ink)}
/* footer: the AE mark with the lowercase name */
.room footer.ft{border-top:1px solid var(--line);padding:30px 0 120px;color:var(--paper-3);font-size:13.5px;text-align:center}
.room footer.ft .fm{display:flex;align-items:center;justify-content:center;gap:9px;font:800 14px/1 'Outfit',var(--sans);text-transform:lowercase;color:var(--paper);margin:0 0 10px}
.room footer.ft .fm img{width:30px;height:30px}
.room footer.ft nav{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 18px;margin:0 0 10px}.room footer.ft nav a{color:var(--paper-2)}.room footer.ft nav a:hover{color:var(--gold2)}
@media(min-width:900px){.room footer.ft{padding-bottom:40px}}
.room [hidden]{display:none !important}
/* THE LETTER — long words from Anthony (the text-link pages, notes): paragraphs, lists, pictures, his signature */
.room .letter{max-width:72ch}
.room .letter p,.room .letter li{color:var(--paper-2);margin:0 0 14px}
.room .letter b,.room .letter strong{color:var(--paper)}
.room .letter ul{padding-left:20px;margin:0 0 18px}.room .letter li::marker{color:var(--gold)}
.room .letter a{color:var(--gold2);text-decoration:underline;text-underline-offset:3px}
.room .letter a.pic{display:block;margin:18px 0 22px;border-radius:14px;overflow:hidden;box-shadow:0 0 0 2px var(--rim),0 24px 50px -24px rgba(0,0,0,.8)}
.room .letter a.pic img{display:block;width:100%;height:auto}
.room .letter .btn{text-decoration:none;margin:6px 0 18px}
.room .sig{display:inline-flex;flex-direction:column;gap:2px;margin:18px 0 8px;padding:16px 20px;border-radius:14px;background:var(--card);color:var(--ink);font-weight:700;line-height:1.35}
.room .sig img{width:200px;height:auto;margin:0 0 6px}.room .sig small{font-weight:600;color:var(--ink3);font-size:13px}.room .sig a{color:var(--red)}