@font-face{font-family:"Archivo";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/archivo-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Archivo";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/archivo-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Archivo";font-style:normal;font-weight:700;font-display:swap;src:url(fonts/archivo-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Archivo";font-style:normal;font-weight:900;font-display:swap;src:url(fonts/archivo-latin-900-normal.woff2) format("woff2")}
@font-face{font-family:"VT323";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/vt323-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Pinyon Script";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/pinyon-script-latin-400-normal.woff2) format("woff2")}



:root{
  --ink:#0a0a0a; --panel:#141213; --char:#1f1c1d; --line:#2e2a2b; --lime:#c4d82f; --lime-glow:rgba(196,216,47,.45);
  --white:#f3f1ec; --text:#d9d5cc; --mute:#9b978f; --orange:#f07a2a; --red:#ff4636;
  --f-body:"Archivo",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-osd:"VT323",ui-monospace,Menlo,monospace;
  --f-script:"Pinyon Script","Snell Roundhand",cursive;
  --wrap:1320px; --gut:max(16px,env(safe-area-inset-left,0px));
  color-scheme:dark;
}
*{box-sizing:border-box}
html{background:var(--ink);scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:var(--ink);color:var(--white);font-family:var(--f-body);font-size:17px;line-height:1.55;overflow-x:clip;-webkit-font-smoothing:antialiased}
img,video,canvas{display:block;max-width:100%}
a{color:inherit}
button{font:inherit;color:inherit;cursor:pointer;background:none;border:0;padding:0}
:focus-visible{outline:2px solid var(--lime);outline-offset:3px;border-radius:4px}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;left:12px;top:-60px;z-index:200;background:var(--lime);color:#000;padding:10px 14px;font-weight:700;text-decoration:none;border-radius:6px}
.skip:focus{top:12px}
.wrap{max-width:var(--wrap);margin:0 auto;padding-inline:var(--gut)}
section{position:relative}
.eyebrow{font-family:var(--f-osd);font-size:20px;letter-spacing:.14em;color:var(--mute);text-transform:uppercase}
.h2{font-weight:900;font-size:clamp(36px,5.6vw,84px);line-height:.95;letter-spacing:-.025em;margin:.15em 0 .3em}
.lede{font-size:clamp(17px,1.4vw,20px);color:var(--text);max-width:58ch;margin:0}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;min-height:48px;padding:.6em 1.25em;border-radius:999px;font-weight:700;font-size:16px;text-decoration:none;border:2px solid var(--lime);color:var(--lime);transition:background .15s,color .15s,transform .15s}
.btn:hover{background:var(--lime);color:#000}
.btn.solid{background:var(--lime);color:#000}
.btn.solid:hover{background:#d6ea45}
.btn.ghost{border-color:#4a4546;color:var(--white)}
.btn.ghost:hover{border-color:var(--white);background:transparent}
.btn:active{transform:translateY(1px)}
.reveal{opacity:0;transform:translateY(14px);transition:opacity .4s ease,transform .4s ease}
.reveal.in{opacity:1;transform:none}

/* grain: one static tile, drifted with steps only when motion is OK */
.grain{position:fixed;inset:-50%;z-index:90;pointer-events:none;background:url(../media/noise.png);opacity:.045;animation:grain 1s steps(6) infinite}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-4%,3%)}40%{transform:translate(3%,-2%)}60%{transform:translate(-2%,-4%)}80%{transform:translate(4%,2%)}}

/* ===== header ===== */
.hdr{position:sticky;top:0;z-index:80;background:rgba(10,10,10,.78);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid rgba(255,255,255,.06)}
.hdr .wrap{display:flex;align-items:center;gap:24px;height:72px}
.logo{display:inline-flex;align-items:center;gap:10px;text-decoration:none;position:relative}
.logo .wm{position:relative;display:grid;place-items:center}
.logo .wm img{width:124px;height:auto;display:block}
.logo .cyc{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;font-size:30px;line-height:1;opacity:0;white-space:nowrap}
.logo.cycling .wm img{opacity:0}.logo.cycling .cyc{opacity:1}
.logo .sub{width:58px;height:auto;margin-top:3px}
.nav{display:flex;gap:4px;margin-left:auto}
.nav a{font-weight:500;font-size:15px;text-decoration:none;padding:10px 12px;border-radius:8px;color:var(--text)}
.nav a:hover{color:var(--lime)}
.hdr .btn{min-height:42px;padding:.45em 1.1em;font-size:15px}
.menu-btn{display:none;margin-left:auto;width:44px;height:44px;border-radius:10px;border:1px solid var(--line)}
.menu-btn span{display:block;width:20px;height:2px;background:var(--white);margin:4px auto}
@media (max-width:900px){
  .menu-btn{display:block}
  .nav{position:absolute;left:0;right:0;top:72px;flex-direction:column;background:#0d0c0c;border-bottom:1px solid var(--line);padding:8px var(--gut) 16px;display:none}
  .nav.open{display:flex}
  .nav a{font-size:18px;padding:12px 4px}
  .hdr .book{display:none}
  .nav .book-m{display:inline-flex;margin-top:8px}
}
@media (min-width:901px){.nav .book-m{display:none}}

/* ===== hero ===== */
.hero{padding-block:clamp(28px,5vw,64px) clamp(40px,6vw,80px);background:radial-gradient(ellipse 70% 60% at 70% 40%,rgba(196,216,47,.07),transparent 70%),radial-gradient(ellipse 50% 50% at 15% 30%,rgba(255,255,255,.03),transparent 70%);overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(24px,4vw,64px);align-items:center}
.hero .script{font-family:var(--f-script);color:var(--lime);font-size:clamp(30px,3.4vw,52px);line-height:1;margin:0 0 .25em}
.hero h1{font-weight:900;font-size:clamp(36px,3.7vw,56px);line-height:.98;letter-spacing:-.03em;margin:0 0 .3em}
.verticals{font-family:var(--f-osd);font-size:clamp(18px,1.45vw,21px);letter-spacing:.02em;color:var(--lime);margin:0 0 18px}
.hero h1 em{font-style:normal;color:var(--lime)}
.hero .lede{margin-bottom:28px}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.reel-link{display:inline-flex;align-items:center;gap:10px;margin-top:22px;font-family:var(--f-osd);font-size:21px;letter-spacing:.06em;color:var(--text);text-decoration:none;min-height:44px}
.reel-link i{width:34px;height:34px;border-radius:50%;border:2px solid var(--lime);display:grid;place-items:center;color:var(--lime);font-style:normal;font-size:14px}
.reel-link:hover{color:var(--lime)}
@media (max-width:900px){.hero .wrap{grid-template-columns:minmax(0,1fr)}.tv{order:-1;margin:44px 0 12px}}

/* ===== CRT ===== */
.tv{position:relative;width:100%;max-width:720px;margin-inline:auto}
.crt{position:relative;aspect-ratio:4/3.42}
.crt .shell{position:absolute;inset:0;border-radius:5.5% / 6.5%;background:radial-gradient(ellipse at 30% 0%,rgba(255,255,255,.10),transparent 50%),linear-gradient(180deg,#3d393a 0%,#2a2728 8%,#1e1c1d 55%,#141213 100%);box-shadow:inset 0 2px 0 rgba(255,255,255,.14),inset 0 -3px 0 rgba(0,0,0,.6),inset -6px 0 14px rgba(0,0,0,.5),0 40px 80px rgba(0,0,0,.8),0 0 0 1px #0b0a0a}
.crt .shell::after{content:"";position:absolute;left:4%;right:4%;bottom:-2%;height:4%;border-radius:0 0 30% 30%;background:linear-gradient(#141213,#050505);z-index:-1}
.crt .bezel{position:absolute;left:5.5%;right:5.5%;top:5.5%;height:69%;border-radius:5% / 6.5%;background:linear-gradient(160deg,#151314,#080707);box-shadow:inset 0 3px 8px rgba(0,0,0,.9),0 1px 0 rgba(255,255,255,.06)}
.scr{position:absolute;left:8%;right:8%;top:8%;height:63.5%;border-radius:6% / 8%;overflow:hidden;background:#000;box-shadow:0 0 0 2px #020202,0 0 40px rgba(196,216,47,.10);container-type:inline-size}
.scr .fill{position:absolute;inset:-10%;width:120%;height:120%;object-fit:cover;filter:blur(18px) brightness(.45) saturate(1.2)}
.scr .vbox{position:absolute;inset:0}
.scr .vbox.tall{left:50%;right:auto;width:auto;aspect-ratio:9/16;height:100%;transform:translateX(-50%);box-shadow:0 0 30px rgba(0,0,0,.6)}
.scr video,.scr .poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.scr canvas.audit{position:absolute;inset:0;width:100%;height:100%}
.scr .glass{position:absolute;inset:0;z-index:5;pointer-events:none;background:radial-gradient(ellipse 70% 55% at 30% 15%,rgba(255,255,255,.12),transparent 60%),radial-gradient(ellipse at 50% 50%,transparent 60%,rgba(0,0,0,.6) 100%),repeating-linear-gradient(0deg,rgba(0,0,0,.18) 0 1px,transparent 1px 3px);box-shadow:inset 0 0 40px 6px rgba(0,0,0,.65)}
.scr .static{position:absolute;inset:0;z-index:4;background:url(../media/noise.png);background-size:120px;opacity:0;pointer-events:none}
.scr .static.go{animation:stat .32s steps(4)}
@keyframes stat{0%{opacity:.95;background-position:0 0}50%{opacity:.85;background-position:40px 20px}100%{opacity:0;background-position:-30px 10px}}
.scr.off .vbox,.scr.off .fill,.scr.off .osd,.scr.off .credit,.scr.off .ovl{opacity:0}
.scr.off::after{content:"";position:absolute;left:50%;top:50%;width:6px;height:6px;margin:-3px;border-radius:50%;background:#fff;box-shadow:0 0 18px 6px #fff;animation:dot .6s forwards}
@keyframes dot{to{opacity:0}}
/* OSD: top right, as asked */
.osd{position:absolute;z-index:6;right:5%;top:6%;text-align:right;font-family:var(--f-osd);color:#9dff86;text-shadow:0 0 8px rgba(80,255,60,.6),0 1px 2px #000;line-height:1;max-width:62%}
.osd .ch{font-size:clamp(22px,6.2cqw,46px)}
.osd .nm{display:block;font-size:clamp(16px,4.2cqw,30px);margin-top:.15em;color:#fff;text-shadow:0 0 6px rgba(255,255,255,.4),0 1px 2px #000}
.osd .who{display:block;font-size:clamp(13px,2.9cqw,21px);margin-top:.3em;color:#e6e3dc}
.osd .ok{display:inline-block;font-size:clamp(13px,2.7cqw,19px);margin-top:.5em;background:rgba(0,0,0,.55);padding:.05em .4em;color:var(--lime);border:1px solid rgba(196,216,47,.5)}
.credit{position:absolute;z-index:6;left:5%;bottom:6%;font-family:var(--f-osd);font-size:clamp(13px,2.6cqw,19px);color:#fff;background:rgba(0,0,0,.5);padding:.05em .45em;letter-spacing:.04em}
.ovl{position:absolute;inset:0;z-index:3;pointer-events:none;font-family:var(--f-body)}
.ovl .tag{position:absolute;left:6%;top:5%;font-size:clamp(9px,2.1cqw,14px);font-weight:700;background:rgba(0,0,0,.55);padding:.2em .5em;border-radius:4px}
.ovl .rec{position:absolute;left:6%;top:5%;font-family:var(--f-osd);font-size:clamp(12px,2.8cqw,20px);color:#fff}
.ovl .rec b{color:var(--red);animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.ovl .rail{position:absolute;right:5%;bottom:20%;display:grid;gap:.6em;font-size:clamp(12px,3.2cqw,22px);text-align:center;color:#fff;text-shadow:0 1px 3px #000}
.signal{position:absolute;inset:0;display:grid;place-items:center;text-align:center;font-family:var(--f-osd);color:#cfe;z-index:2;background:url(../media/noise.png);background-size:140px;animation:snow .25s steps(3) infinite}
.signal div{background:rgba(0,0,0,.75);padding:.4em .8em;font-size:clamp(14px,3.6cqw,26px);line-height:1.2}
@keyframes snow{to{background-position:60px 30px}}
.tvpanel{position:absolute;left:5.5%;right:5.5%;bottom:5%;height:16%;display:flex;align-items:center;gap:2.4%}
.grille{flex:1;height:70%;border-radius:6px;background:repeating-linear-gradient(90deg,#070606 0 3px,#262324 3px 6px);box-shadow:inset 0 2px 4px rgba(0,0,0,.8)}
.seg{font-family:var(--f-osd);font-size:clamp(18px,3.4cqw,34px);color:var(--red);text-shadow:0 0 8px #ff2a1a;background:#120404;padding:0 .3em;border-radius:3px;box-shadow:inset 0 2px 4px #000;min-width:2.2em;text-align:center}
.tvbtns{display:grid;grid-template-columns:repeat(2,auto);gap:4px}
.tvbtn{font-family:var(--f-osd);font-size:clamp(14px,1.6vw,18px);min-width:44px;min-height:30px;color:#d6d1c6;background:linear-gradient(#3a3637,#1b191a);border-radius:5px;padding:.05em .55em;box-shadow:0 2px 0 #000,inset 0 1px 0 rgba(255,255,255,.12)}
.tvbtn:hover{color:var(--lime)}
.tvbtn:active{transform:translateY(2px);box-shadow:none}
.tvbtn.ok{grid-column:span 2;color:var(--lime)}
.knob{width:clamp(30px,7%,52px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 30%,#6a6566,#232021 60%,#121011);box-shadow:0 4px 8px rgba(0,0,0,.7);position:relative;transition:transform .25s cubic-bezier(.3,1.6,.5,1)}
.knob::before{content:"";position:absolute;inset:14%;border-radius:50%;background:repeating-conic-gradient(#2c2829 0 6deg,#1c1a1b 6deg 12deg)}
.knob::after{content:"";position:absolute;left:45%;top:6%;width:10%;height:40%;background:#d8d2c4;border-radius:2px}
.pwr{width:clamp(30px,5%,40px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 40% 35%,#4a4546,#151314);box-shadow:0 3px 5px #000;position:relative}
.pwr .led{position:absolute;left:50%;top:-40%;transform:translateX(-50%);width:24%;aspect-ratio:1;border-radius:50%;background:var(--lime);box-shadow:0 0 8px 2px var(--lime-glow)}
.tv.isoff .led{background:#3a1010;box-shadow:none}
.ant{position:absolute;left:50%;bottom:98%;width:50%;transform:translateX(-50%);transform-origin:50% 100%}
.ant.wig{animation:wig .8s}
@keyframes wig{20%{transform:translateX(-50%) rotate(-7deg)}45%{transform:translateX(-50%) rotate(5deg)}70%{transform:translateX(-50%) rotate(-2deg)}}
.guide{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-top:22px}
.guide button{font-family:var(--f-osd);font-size:18px;letter-spacing:.04em;min-height:36px;padding:2px 10px;border:1px solid var(--line);border-radius:6px;color:var(--mute);background:rgba(0,0,0,.4)}
.guide button:hover{color:var(--white);border-color:#555}
.guide button[aria-pressed="true"]{color:#000;background:var(--lime);border-color:var(--lime)}
@media (max-width:900px){.guide{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;scroll-snap-type:x proximity;scroll-padding-inline:16px;scrollbar-width:none;margin-inline:-16px;padding-inline:16px;-webkit-mask:linear-gradient(90deg,transparent,#000 16px,#000 calc(100% - 28px),transparent)}.guide::-webkit-scrollbar{display:none}.guide button{flex:none;scroll-snap-align:start}.tv-help{display:none}}
.tv-help{text-align:center;font-family:var(--f-osd);font-size:17px;color:var(--mute);margin-top:8px;letter-spacing:.06em}

/* ===== proof strip ===== */
.proof{border-block:1px solid var(--line);background:#0d0c0c}
.proof .wrap{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0}
.stat{padding:26px 24px;border-left:1px solid var(--line)}
.stat:first-child{border-left:0;padding-left:0}
.stat b{display:block;font-weight:900;font-size:clamp(34px,3.6vw,52px);line-height:1;color:var(--lime);letter-spacing:-.02em}
.stat span{display:block;color:var(--text);font-size:15px;margin-top:8px;max-width:34ch}
.stat small{display:block;color:var(--mute);font-size:13px;margin-top:4px}
@media (max-width:900px){.proof .wrap{grid-template-columns:minmax(0,1fr)}.stat{border-left:0;border-top:1px solid var(--line);padding-left:0}.stat:first-child{border-top:0}}
.ticker{display:flex;align-items:center;gap:12px;border-top:1px solid var(--line);padding-block:12px}
.tick{flex:1;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.tick ul{display:flex;gap:48px;width:max-content;margin:0;padding:0;list-style:none;animation:crawl 40s linear infinite;font-family:var(--f-osd);font-size:24px;color:#cfcac0;letter-spacing:.06em}
.ticker.paused .tick ul{animation-play-state:paused}
@keyframes crawl{to{transform:translateX(-50%)}}
.pause{font-family:var(--f-osd);font-size:16px;border:1px solid var(--line);border-radius:6px;padding:4px 10px;min-height:36px;color:var(--mute)}
.pause:hover{color:var(--white)}

/* ===== services / studio ===== */
.sec{padding-block:clamp(64px,9vw,120px)}
.sec-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:20px;margin-bottom:32px}
.tabs{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;margin-bottom:20px;scrollbar-width:thin}
.tabs button{flex:none;display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:150px;padding:12px 16px;border:1px solid var(--line);border-radius:12px;text-align:left;background:var(--panel)}
.tabs button .n{font-family:var(--f-osd);font-size:17px;color:var(--mute);letter-spacing:.08em}
.tabs button .t{font-weight:700;font-size:16px}
.tabs button[aria-selected="true"]{border-color:var(--lime);background:#1a1c10}
.tabs button[aria-selected="true"] .n{color:var(--lime)}
.station{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:clamp(20px,3vw,44px);align-items:center}
.station[hidden]{display:none}
@media (max-width:980px){.station{grid-template-columns:minmax(0,1fr)}}
.st-copy h3{font-weight:900;font-size:clamp(30px,3.4vw,48px);line-height:1;letter-spacing:-.02em;margin:.1em 0 .25em}
.st-copy .for{color:var(--lime);font-weight:500;margin:0 0 14px}
.st-copy ul{margin:0 0 20px;padding:0;list-style:none;display:grid;gap:8px}
.st-copy li{display:flex;gap:10px;color:var(--text)}
.st-copy li::before{content:"";flex:none;width:8px;height:8px;margin-top:.6em;background:var(--lime);transform:rotate(45deg)}
.price{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:baseline;margin:0 0 20px}
.price b{font-weight:900;font-size:clamp(26px,2.4vw,34px);letter-spacing:-.02em}
.price span{color:var(--mute);font-size:15px}
.try{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;align-items:center}
.try .lbl{font-family:var(--f-osd);font-size:17px;color:var(--mute);letter-spacing:.08em;margin-right:4px}
.try button{font-size:14px;font-weight:500;min-height:38px;padding:6px 12px;border-radius:999px;border:1px dashed #4a4546;color:var(--text)}
.try button:hover,.try button[aria-pressed="true"]{border-style:solid;border-color:var(--lime);color:var(--lime)}

/* ===== isometric engine (CSS 3D) ===== */
@property --h{syntax:'<number>';inherits:true;initial-value:1}
.iso{position:relative;width:100%;aspect-ratio:4/3;container-type:inline-size;overflow:hidden;border-radius:20px;background:radial-gradient(ellipse 80% 70% at 50% 45%,#1d1b1c,#0b0a0a 75%);box-shadow:inset 0 0 0 1px var(--line)}
.iso{--u:calc(100cqw/31)}
.iso .world{position:absolute;left:50%;top:60%;width:calc(var(--u)*20);height:calc(var(--u)*20);margin:calc(var(--u)*-10) 0 0 calc(var(--u)*-10);transform-style:preserve-3d;transform:rotateX(60deg) rotateZ(-45deg)}
.b{position:absolute;left:calc(var(--x)*var(--u));top:calc(var(--y)*var(--u));width:calc(var(--w)*var(--u));height:calc(var(--d)*var(--u));transform:translateZ(calc(var(--z)*var(--u)));transform-style:preserve-3d;--ct:color-mix(in srgb,var(--c),#fff 14%);--cx:color-mix(in srgb,var(--c),#000 22%);--cy:color-mix(in srgb,var(--c),#000 45%)}
.b>.t{position:absolute;inset:0;transform:translateZ(calc(var(--h)*var(--u)));background:var(--ct);overflow:hidden}
.b>.fy{position:absolute;left:0;width:100%;height:calc(var(--h)*var(--u));top:calc((var(--d) - var(--h))*var(--u));transform-origin:bottom;transform:rotateX(-90deg);background:var(--cy);overflow:hidden}
.b>.fx{position:absolute;top:0;left:0;height:100%;width:calc(var(--h)*var(--u));transform-origin:left;transform:rotateY(-90deg);background:var(--cx);overflow:hidden}
.b>.fx>.up{position:absolute;left:0;top:0;width:calc(var(--d)*var(--u));height:calc(var(--h)*var(--u));transform-origin:0 0;transform:translateX(calc(var(--h)*var(--u))) rotate(90deg)}
.b.r>.t,.b.r>.fy,.b.r>.fx{border-radius:2px}
.bb{position:absolute;left:calc(var(--x)*var(--u));top:calc(var(--y)*var(--u));width:0;height:0;transform-style:preserve-3d;transform:translateZ(calc(var(--z)*var(--u))) rotateZ(45deg) rotateX(-60deg)}
.bb>*{position:absolute;left:0;bottom:0;transform:translateX(-50%)}
.shadow{position:absolute;left:calc(var(--x)*var(--u));top:calc(var(--y)*var(--u));width:calc(var(--w)*var(--u));height:calc(var(--d)*var(--u));transform:translateZ(1px);background:radial-gradient(closest-side,rgba(0,0,0,.55),transparent);filter:blur(2px)}
.glowpool{position:absolute;left:calc(var(--x)*var(--u));top:calc(var(--y)*var(--u));width:calc(var(--w)*var(--u));height:calc(var(--d)*var(--u));transform:translateZ(1px);background:radial-gradient(closest-side,var(--g,rgba(196,216,47,.28)),transparent);transition:opacity .4s}
.iso .scrn{position:absolute;inset:6%;background:#000;overflow:hidden;border-radius:2px;box-shadow:0 0 calc(var(--u)*1) rgba(196,216,47,.25)}
.iso .scrn video,.iso .scrn img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.iso .bframe{padding:0!important}.bframe svg{width:calc(var(--u)*2.8);height:calc(var(--u)*2.8);display:block}
.scrn.tall video{object-fit:contain;background:transparent}.iso .scrn.tall img{filter:blur(6px) brightness(.55);transform:scale(1.1)}
.iso .lit{opacity:0;transition:opacity .4s}
.iso.on .lit{opacity:1}
.iso .cap{position:absolute;left:14px;bottom:12px;font-family:var(--f-osd);font-size:16px;color:var(--mute);letter-spacing:.08em}
/* props */
.ring{width:calc(var(--u)*5.2);aspect-ratio:1;border-radius:50%;border:calc(var(--u)*.45) solid #ddd;box-shadow:inset 0 0 calc(var(--u)*.6) rgba(255,255,255,.4);transition:.3s}
.iso.on .ring{border-color:#fffbe8;box-shadow:0 0 calc(var(--u)*2) calc(var(--u)*.6) rgba(255,248,220,.75),inset 0 0 calc(var(--u)*1) #fff}
.leaf{width:calc(var(--u)*2.6);height:calc(var(--u)*3.2);background:radial-gradient(circle at 30% 30%,#5a7d32,#2d4419 70%);border-radius:50% 50% 45% 45%;box-shadow:inset calc(var(--u)*-.3) calc(var(--u)*-.3) 0 rgba(0,0,0,.25)}
.palm{width:calc(var(--u)*3.4);height:calc(var(--u)*4.6);background:radial-gradient(ellipse 60% 30% at 50% 18%,#4f7a2c 60%,transparent 62%),linear-gradient(90deg,transparent 46%,#7a5a3a 46% 54%,transparent 54%)}
.lens{width:calc(var(--u)*1.3);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 35%,#4a6aa0,#0b0f18 55%);box-shadow:0 0 0 calc(var(--u)*.22) #222,0 0 0 calc(var(--u)*.3) #555}
.cone{width:calc(var(--u)*7);height:calc(var(--u)*12);background:linear-gradient(180deg,rgba(255,244,200,.55),rgba(255,244,200,0));clip-path:polygon(44% 0,56% 0,100% 100%,0 100%);mix-blend-mode:screen;transform-origin:50% 0;transition:opacity .4s}
.iso.sweep .cone{animation:sweep 2.4s ease-in-out infinite alternate}
.iso.sweep .cone.b2{animation-delay:-1.2s}
@keyframes sweep{from{transform:translateX(-50%) rotate(-14deg)}to{transform:translateX(-50%) rotate(14deg)}}
.person{filter:drop-shadow(0 calc(var(--u)*-.08) 0 rgba(196,216,47,.55));width:calc(var(--u)*1.3);height:calc(var(--u)*2.6);background:radial-gradient(circle at 50% 18%,var(--pc,#3a3536) 30%,transparent 31%),radial-gradient(ellipse 50% 45% at 50% 85%,var(--pc,#3a3536) 99%,transparent 100%)}
.tee{width:calc(var(--u)*2.4);height:calc(var(--u)*2.6);background:var(--tc,#e9e6df);clip-path:polygon(28% 0,40% 6%,60% 6%,72% 0,100% 16%,90% 38%,80% 33%,80% 100%,20% 100%,20% 33%,10% 38%,0 16%);transition:background .3s;display:grid;place-items:center}
.tee svg{width:40%;margin-top:-10%}
.drone{position:absolute;left:calc(var(--x)*var(--u));top:calc(var(--y)*var(--u));transform-style:preserve-3d;transform:translateZ(calc(var(--z)*var(--u)));animation:bob 2.6s ease-in-out infinite}
.iso.fly .drone{animation:orbit 5s linear infinite}
@keyframes bob{50%{transform:translateZ(calc((var(--z) + .6)*var(--u)))}}
@keyframes orbit{0%{transform:translateZ(calc(var(--z)*var(--u))) translate(0,0)}25%{transform:translateZ(calc((var(--z) + 1)*var(--u))) translate(calc(var(--u)*6),calc(var(--u)*-2))}50%{transform:translateZ(calc(var(--z)*var(--u))) translate(calc(var(--u)*7),calc(var(--u)*5))}75%{transform:translateZ(calc((var(--z) + 1)*var(--u))) translate(calc(var(--u)*1),calc(var(--u)*6))}100%{transform:translateZ(calc(var(--z)*var(--u))) translate(0,0)}}
.rotor{position:absolute;width:calc(var(--u)*1.4);height:calc(var(--u)*1.4);border-radius:50%;background:radial-gradient(circle,rgba(220,220,220,.5) 20%,rgba(200,200,200,.15) 60%,transparent 70%);transform:translateZ(calc(var(--u)*.55))}
.calgrid{position:absolute;inset:10% 8% 14%;display:grid;grid-template-columns:repeat(7,1fr);gap:5%}
.calgrid i{background:#2a2627;border-radius:2px;transition:background .2s}
.calgrid i.on{background:var(--lime);box-shadow:0 0 6px var(--lime-glow)}
.walltitle{position:absolute;left:8%;top:2%;font-family:var(--f-osd);color:var(--mute);font-size:calc(var(--u)*.75)}
.neon{font-family:var(--f-script);color:var(--lime);text-shadow:0 0 calc(var(--u)*.4) var(--lime),0 0 calc(var(--u)*1.2) var(--lime-glow);white-space:nowrap}
.board{position:absolute;inset:8%;background:#f1efe9;border-radius:3px;padding:6% 8%;color:#222;font-family:var(--f-osd);font-size:calc(var(--u)*.72);line-height:1.25}
.board p{margin:0;display:flex;gap:6%;align-items:center}
.board p i{width:calc(var(--u)*.6);height:calc(var(--u)*.6);border:2px solid #333;display:inline-grid;place-items:center;font-style:normal;color:#2a8a2a;font-weight:700}
.miniweb{position:absolute;inset:0;background:#f3f1ec;color:#111;overflow:hidden;font-family:var(--f-body)}
.miniweb .pg{transition:transform 2.5s ease-in-out}
.miniweb .hd{height:calc(var(--u)*2.4);background:#111;color:var(--lime);font-weight:900;font-size:calc(var(--u)*.7);display:grid;place-items:center}
.miniweb .bl{height:calc(var(--u)*.45);margin:6% 8% 0;background:#d3cfc6;border-radius:2px}
.miniweb .bl.s{width:50%}.miniweb .bl.c{height:calc(var(--u)*1.6);background:#c4d82f}
.iso.deploy .miniweb .pg{transform:translateY(-45%)}
.bar3{transition:--h .9s cubic-bezier(.3,1.3,.5,1)}
.target{width:calc(var(--u)*4.2);aspect-ratio:1;border-radius:50%;background:repeating-radial-gradient(circle,var(--lime) 0 9%,#151314 9% 18%)}
.iso.launch .target{animation:pulse 1s ease-out 3}
@keyframes pulse{50%{transform:translateX(-50%) scale(1.12);filter:brightness(1.5)}}
.heart{position:absolute;color:#ff3b6b;font-size:calc(var(--u)*1.2);pointer-events:none;animation:heart 1.2s forwards}
@keyframes heart{0%{opacity:0;transform:translateY(0) scale(.6)}20%{opacity:1;transform:translateY(-10px) scale(1.2)}100%{opacity:0;transform:translateY(-70px)}}
.recl{width:calc(var(--u)*.5);aspect-ratio:1;border-radius:50%;background:#3a1010}
.iso.rolling .recl{background:var(--red);box-shadow:0 0 calc(var(--u)*.6) var(--red);animation:blink 1s steps(1) infinite}
.score{position:absolute;inset:0;display:grid;place-items:center;color:var(--lime);font-family:var(--f-osd)}

/* ===== packages ===== */
.pk-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
@media (max-width:980px){.pk-grid{grid-template-columns:minmax(0,1fr)}}
.pk{position:relative;display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:22px;padding:28px}
.pk.feat{border-color:var(--lime);background:linear-gradient(180deg,#1a1c10,var(--panel) 40%)}
.pk .badge{position:absolute;top:-13px;left:28px;background:var(--lime);color:#000;font-family:var(--f-osd);font-size:17px;padding:1px 10px;border-radius:4px}
.pk h3{margin:0;font-weight:900;font-size:30px;letter-spacing:-.01em}
.pk .tagl{color:var(--mute);margin:4px 0 18px}
.pk .amt{font-weight:900;font-size:44px;letter-spacing:-.03em;line-height:1}
.pk .amt small{font-size:16px;font-weight:500;color:var(--mute);letter-spacing:0}
.pk ul{margin:20px 0 26px;padding:0;list-style:none;display:grid;gap:9px;color:var(--text);font-size:16px}
.pk li{display:flex;gap:10px}
.pk li::before{content:"✓";color:var(--lime);font-weight:900}
.pk .btn{margin-top:auto}
.pk-sub{margin-top:44px}
.pk-sub h3{font-size:22px;margin:0 0 14px}
.consult{margin-top:30px;display:flex;flex-wrap:wrap;gap:20px;align-items:center;justify-content:space-between;border:1px dashed #4a4546;border-radius:22px;padding:24px 28px}
.consult p{margin:0;max-width:60ch;color:var(--text)}
.consult b{color:var(--white)}

/* ===== work ===== */
.work-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
@media (max-width:900px){.work-grid{grid-template-columns:minmax(0,1fr)}}
.case{position:relative;display:block;text-decoration:none;border-radius:18px;overflow:hidden;background:#000;aspect-ratio:4/5}
.case img,.case video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s}
.case:hover img{transform:scale(1.04)}
.case .meta{position:absolute;left:0;right:0;bottom:0;padding:60px 20px 20px;background:linear-gradient(transparent,rgba(0,0,0,.85))}
.case .meta b{display:block;font-size:20px}
.case .meta span{font-family:var(--f-osd);font-size:18px;color:var(--lime);letter-spacing:.06em}
.sites{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:22px}
@media (max-width:900px){.sites{grid-template-columns:repeat(2,minmax(0,1fr))}}
.site{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--panel)}
.site .shot{aspect-ratio:16/10;background:repeating-linear-gradient(135deg,#1a1819 0 10px,#161415 10px 20px);display:grid;place-items:center;font-family:var(--f-osd);font-size:17px;color:var(--mute);text-align:center;padding:10px;position:relative}
.site .shot::before{content:"";position:absolute;left:0;right:0;top:0;height:16px;background:#232021;border-bottom:1px solid var(--line)}
.site p{margin:0;padding:12px 14px;font-weight:700;font-size:15px}
.cred{display:grid;grid-template-columns:auto minmax(0,1fr);gap:22px;align-items:center;margin-top:48px;padding:26px 28px;border-radius:22px;background:var(--panel);border:1px solid var(--line)}
.cred b.big{font-weight:900;font-size:clamp(46px,5vw,72px);line-height:.9;color:var(--lime)}
.cred p{margin:0;color:var(--text)}
@media (max-width:700px){.cred{grid-template-columns:minmax(0,1fr)}}

/* ===== testimonials ===== */
.quotes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
@media (max-width:900px){.quotes{grid-template-columns:minmax(0,1fr)}}
.quote{border:1px dashed #4a4546;border-radius:18px;padding:26px;color:var(--mute);min-height:170px;display:flex;flex-direction:column;justify-content:space-between}
.quote p{margin:0;font-size:18px}
.quote span{font-family:var(--f-osd);font-size:17px;margin-top:16px}

/* ===== about ===== */
.about-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:clamp(24px,4vw,60px);align-items:start}
@media (max-width:980px){.about-grid{grid-template-columns:minmax(0,1fr)}}
.rbu{display:flex;flex-wrap:wrap;align-items:center;gap:.15em .3em;font-weight:900;font-size:clamp(46px,7vw,110px);line-height:.9;letter-spacing:-.03em;margin:0 0 .3em}
.rbu svg{height:.4em;width:auto}
.rbu .m-smile{height:.22em}
.m-fill{fill:var(--lime)}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
@media (max-width:700px){.cards{grid-template-columns:minmax(0,1fr)}}
.card{position:relative;border-radius:22px;background:var(--panel);border:1px solid var(--line);padding:26px 22px 24px;overflow:hidden}
.card .ico{height:110px;display:grid;place-items:center;margin-bottom:18px}
.card .ico svg{height:80px;width:auto;overflow:visible;transition:transform .6s cubic-bezier(.3,1.5,.4,1)}
.card h3{margin:0;font-family:var(--f-script);font-weight:400;color:var(--lime);font-size:38px;line-height:1}
.card p{margin:8px 0 0;color:var(--text);font-size:15px}
.card .n{font-family:var(--f-osd);color:var(--mute);font-size:16px;letter-spacing:.1em}
.card:hover .c-arrow svg{transform:translateX(18%) rotate(-8deg)}
.card:hover .c-ap svg{transform:rotate(120deg) scale(1.1)}
.card:hover .c-smile svg{transform:scaleY(1.6)}
.verse{margin-top:40px;border-left:3px solid var(--lime);padding:6px 0 6px 22px}
.verse blockquote{margin:0;font-weight:700;font-size:clamp(22px,2.2vw,30px);line-height:1.25}
.verse cite{display:block;margin-top:8px;font-family:var(--f-osd);font-style:normal;color:var(--lime);font-size:19px;letter-spacing:.06em}
.people{display:flex;gap:18px;margin-top:40px;flex-wrap:wrap}
.pol{background:#fafafa;padding:10px 10px 36px;border-radius:4px;box-shadow:0 20px 40px rgba(0,0,0,.6);width:min(30%,200px);min-width:150px;position:relative}
.pol img{aspect-ratio:1;object-fit:cover;width:100%}
.pol span{position:absolute;left:0;right:0;bottom:6px;text-align:center;color:#222;font-family:var(--f-script);font-size:24px}
.pol:nth-child(1){transform:rotate(-5deg)}.pol:nth-child(2){transform:rotate(4deg) translateY(10px)}.pol:nth-child(3){transform:rotate(-2deg)}

/* ===== contact ===== */
.ct{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(24px,4vw,64px);align-items:start}
@media (max-width:900px){.ct{grid-template-columns:minmax(0,1fr)}}
.bigcall{font-weight:900;font-size:clamp(56px,8vw,130px);line-height:.88;letter-spacing:-.04em;margin:0 0 .3em}
.bigcall span{color:var(--lime)}
form{background:var(--panel);border:1px solid var(--line);border-radius:22px;padding:clamp(20px,3vw,32px);display:grid;gap:16px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:600px){.row{grid-template-columns:minmax(0,1fr)}}
.fld{display:grid;gap:6px}
.fld label{font-weight:700;font-size:15px}
.fld label .opt{color:var(--mute);font-weight:400}
.fld input,.fld select,.fld textarea{width:100%;background:#0b0a0a;border:1px solid #47423f;color:var(--white);font:inherit;font-size:16px;padding:12px 14px;border-radius:10px;min-height:48px}
.fld textarea{min-height:120px;resize:vertical}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:2px solid var(--lime);outline-offset:1px;border-color:var(--lime)}
.fld [aria-invalid="true"]{border-color:var(--red)}
.err{color:#ff8a7d;font-size:14px;min-height:0}
.form-note{font-size:14px;color:var(--mute);margin:0}
.result{border-radius:12px;padding:14px 16px;background:#1a1c10;border:1px solid var(--lime);color:var(--white)}
.result[hidden]{display:none}

/* ===== footer ===== */
footer{background:#000;border-top:1px solid var(--line);margin-top:40px}
footer .wrap{padding-block:56px calc(40px + env(safe-area-inset-bottom,0px));display:grid;gap:30px}
.ft-top{display:flex;flex-wrap:wrap;justify-content:space-between;gap:24px;align-items:center}
.ft-logo img{width:min(60vw,360px)}
.ft-logo .sub{width:min(28vw,160px);margin-top:10px}
.socials{display:flex;flex-wrap:wrap;gap:10px}
.socials a{font-family:var(--f-osd);font-size:19px;letter-spacing:.06em;text-decoration:none;border:1px solid var(--line);border-radius:8px;padding:8px 14px;min-height:44px;display:inline-flex;align-items:center}
.socials a:hover{border-color:var(--lime);color:var(--lime)}
.ft-meta{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;color:var(--mute);font-size:14px}
.bars{display:grid;grid-template-columns:repeat(7,1fr);height:8px}
.bars i:nth-child(1){background:#c0c0c0}.bars i:nth-child(2){background:#c0c000}.bars i:nth-child(3){background:#00c0c0}.bars i:nth-child(4){background:#00c000}.bars i:nth-child(5){background:#c000c0}.bars i:nth-child(6){background:#c00000}.bars i:nth-child(7){background:#0000c0}

/* ===== reel dialog ===== */
dialog{border:0;padding:0;background:transparent;max-width:min(94vw,1200px);width:100%;color:var(--white)}
dialog::backdrop{background:rgba(0,0,0,.9)}
dialog video{width:100%;aspect-ratio:16/9;background:#000;border-radius:10px}
.dlg-bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.dlg-bar h2{margin:0;font-size:18px;font-weight:700}
.close{min-width:44px;min-height:44px;border-radius:50%;border:1px solid #555;font-size:20px}
.close:hover{border-color:var(--lime);color:var(--lime)}

/* ---------- iPhone feed ---------- */
.feed{position:relative;height:calc(100vh + var(--n,5) * 75vh + 110vh);background:radial-gradient(ellipse 60% 50% at 70% 45%,rgba(196,216,47,.07),transparent 70%),#0b0a0a;border-block:1px solid var(--line)}
.feed-pin{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;display:flex;align-items:center}
.feed-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,80px);align-items:center;width:100%}
.feed-copy .h2{margin-bottom:.3em}
.feed-now{margin-top:28px;padding:18px 20px;border:1px solid var(--line);border-radius:14px;background:rgba(20,18,19,.8);min-height:132px}
.feed-now .k{font-family:var(--f-osd);font-size:20px;letter-spacing:.08em;color:var(--lime)}
.feed-now .t{font-weight:800;font-size:22px;color:var(--white);margin:.15em 0}
.feed-now .d{color:var(--text);margin:0}
.feed-ctl{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:20px}
.feed-ctl .ib{width:48px;height:48px;border-radius:50%;border:2px solid #4a4546;background:transparent;color:var(--white);display:grid;place-items:center;cursor:pointer;font-size:18px}
.feed-ctl .ib:hover{border-color:var(--white)}
.feed-ctl .ct{font-family:var(--f-osd);font-size:22px;color:var(--mute);min-width:64px;text-align:center}
.stage{--pw:min(300px,64vw,calc((100svh - 120px) / 2.06));display:grid;place-items:center;perspective:1400px;height:100%}
.feed-hint{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);font-family:var(--f-osd);font-size:18px;letter-spacing:.12em;color:var(--mute);transition:opacity .3s}
@media (max-width:900px){
  .feed-pin{padding-top:72px}
  .feed-grid{grid-template-columns:minmax(0,1fr);gap:8px;align-content:center;height:100%}
  .feed-copy{order:2;text-align:center}
  .feed-copy .eyebrow,.feed-copy .h2,.feed-copy .lede{display:none}
  .feed-now{margin-top:0;min-height:0;padding:10px 14px}
  .feed-now .t{font-size:18px}.feed-now .d{font-size:14px}
  .feed-ctl{justify-content:center;margin-top:10px}
  .stage{--pw:min(250px,60vw,calc((100svh - 250px) / 2.06));height:auto}
  .feed-hint{display:none}
}

/* ---------- tutto reels ---------- */
.reels-sec{background:#0d0c0c;border-block:1px solid var(--line)}
.reels-note{font-family:var(--f-osd);font-size:18px;color:var(--mute);letter-spacing:.06em;align-self:center}
.ba-row{display:grid;grid-template-columns:repeat(3,minmax(0,320px));justify-content:center;gap:clamp(14px,2vw,28px);margin-top:36px}
.ba{position:relative;margin:0;aspect-ratio:9/16;border-radius:18px;overflow:hidden;background:#000;--cut:50%;box-shadow:0 30px 60px rgba(0,0,0,.5),inset 0 0 0 1px var(--line)}
.ba video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ba video.a{clip-path:inset(0 0 0 var(--cut))}
.ba .ba-line{position:absolute;top:0;bottom:0;left:var(--cut);width:2px;margin-left:-1px;background:#fff;pointer-events:none}
.ba .ba-line::after{content:"⟷";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:38px;height:38px;border-radius:50%;background:var(--lime);color:#000;display:grid;place-items:center;font-weight:900}
.ba .t{position:absolute;top:12px;font-family:var(--f-osd);font-size:15px;letter-spacing:.06em;background:rgba(0,0,0,.55);padding:1px 7px;color:#fff;pointer-events:none}
.ba .t.l{left:12px}.ba .t.r{right:12px;color:var(--lime)}
.ba figcaption{position:absolute;left:14px;right:14px;bottom:16px;font-weight:900;font-size:clamp(18px,1.8vw,24px);color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.7);pointer-events:none}
.ba figcaption small{display:block;font-family:var(--f-osd);font-weight:400;font-size:16px;color:var(--lime);letter-spacing:.06em}
.ba input[type=range]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0}
.ba input[type=range]:focus-visible+*,.ba:focus-within{outline:2px solid var(--lime);outline-offset:3px}
.reels-steps{list-style:none;margin:28px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.reels-steps li{border-top:1px solid var(--line);padding-top:14px;color:var(--white);font-weight:800}
.reels-steps b{font-family:var(--f-osd);font-weight:400;color:var(--lime);font-size:20px;margin-right:6px}
.reels-steps span{display:block;color:var(--text);font-weight:400;margin-top:4px}
@media (max-width:900px){.ba-row{grid-template-columns:repeat(3,72%);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px}.ba{scroll-snap-align:center}.reels-steps{grid-template-columns:minmax(0,1fr)}}
/* ---------- brand wall ---------- */
.proof .wrap.brands{display:block;padding-block:6px 26px}
.brands-h{font-family:var(--f-osd);font-size:20px;letter-spacing:.12em;color:var(--mute);text-transform:uppercase;margin:0 0 14px}
.brand-wall{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
.brand-wall li{height:86px;border:1px solid var(--line);border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:#bdb8ae;background:linear-gradient(180deg,#141213,#0f0e0e);transition:color .25s,border-color .25s,transform .25s}
.brand-wall li:hover{color:var(--white);border-color:#4a4546;transform:translateY(-2px)}
.brand-wall svg{width:30px;height:30px;fill:currentColor}
.brand-wall svg.cc{width:84px;height:84px;margin:-14px 0}
.brand-wall b{font-weight:800;font-size:15px;letter-spacing:.01em}
.brand-wall .serif{font-family:Georgia,"Times New Roman",serif;font-weight:700;font-size:21px;letter-spacing:.12em}
.brand-wall .serif.it{font-style:italic;letter-spacing:0;font-size:18px}
.brand-wall small{font-size:10px;letter-spacing:.2em;color:var(--mute)}
@media (max-width:900px){.brand-wall{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* ---------- photoreal stations ---------- */
.shot-col{display:grid;gap:12px}
.shot{position:relative;aspect-ratio:16/9;border-radius:18px;overflow:hidden;background:#000;box-shadow:0 30px 60px rgba(0,0,0,.55),inset 0 0 0 1px var(--line);--g:32%;cursor:ew-resize;touch-action:pan-y}
.shot .sp,.shot video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.shot video{animation:kb 16s ease-in-out infinite alternate}
@keyframes kb{from{transform:scale(1.02)}to{transform:scale(1.09) translate(-1%,-1%)}}
.shot .log{position:absolute;inset:0;-webkit-backdrop-filter:saturate(.2) contrast(.6) brightness(1.22);backdrop-filter:saturate(.2) contrast(.6) brightness(1.22);clip-path:inset(0 calc(100% - var(--g)) 0 0);pointer-events:none}
.shot .gline{position:absolute;top:0;bottom:0;left:var(--g);width:2px;margin-left:-1px;background:rgba(255,255,255,.9);box-shadow:0 0 12px rgba(0,0,0,.6);pointer-events:none}
.shot .gline::after{content:"";position:absolute;top:50%;left:50%;width:34px;height:34px;margin:-17px 0 0 -17px;border-radius:50%;background:rgba(10,10,10,.6);border:2px solid #fff;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.shot .gl{position:absolute;top:auto;bottom:16%;font-family:var(--f-osd);font-size:16px;letter-spacing:.1em;color:#fff;background:rgba(0,0,0,.45);padding:1px 8px;pointer-events:none}
.shot .gl.l{right:calc(100% - var(--g) + 10px)}.shot .gl.r{left:calc(var(--g) + 10px);color:var(--lime)}
.vf{position:absolute;inset:5%;pointer-events:none}
.vf i{position:absolute;width:22px;height:22px;border:2px solid rgba(255,255,255,.75)}
.vf i:nth-child(1){left:0;top:0;border-right:0;border-bottom:0}.vf i:nth-child(2){right:0;top:0;border-left:0;border-bottom:0}
.vf i:nth-child(3){left:0;bottom:0;border-right:0;border-top:0}.vf i:nth-child(4){right:0;bottom:0;border-left:0;border-top:0}
.vf b{position:absolute;left:50%;top:50%;width:26px;height:26px;margin:-13px 0 0 -13px;background:linear-gradient(#fff,#fff) center/100% 1px no-repeat,linear-gradient(#fff,#fff) center/1px 100% no-repeat;opacity:.55}
.hud{position:absolute;font-family:var(--f-osd);font-size:clamp(14px,1.3vw,19px);letter-spacing:.06em;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.7);pointer-events:none}
.hud.tl{left:7%;top:7.5%}.hud.tr{right:7%;top:7.5%}.hud.bl{left:7%;bottom:7.5%}.hud.br{right:7%;bottom:7.5%}
.hud .rec{display:inline-block;width:.6em;height:.6em;border-radius:50%;background:var(--red);margin-right:.3em;animation:blink 1s steps(2) infinite}
@keyframes blink{50%{opacity:0}}
.caps{position:absolute;left:10%;right:10%;bottom:20%;text-align:center;font-weight:900;font-size:clamp(18px,2.4vw,34px);line-height:1.1;color:#fff;text-transform:uppercase;letter-spacing:-.01em;-webkit-text-stroke:1.5px #000;paint-order:stroke fill;text-shadow:0 3px 0 #000;pointer-events:none;opacity:0;transition:opacity .2s}
.shot.caps-on .caps{opacity:1}
.caps span{display:inline-block;margin:0 .12em;transition:transform .15s,color .15s}
.caps span.on{color:var(--lime);transform:scale(1.12) rotate(-2deg)}
.fx{position:absolute;pointer-events:none;opacity:0;transform:translateY(10px);transition:opacity .35s,transform .35s}
.shot.fx-on .fx{opacity:1;transform:none}
.fx.ad{left:5%;right:5%;top:5%;bottom:5%}
.fx.ad .top{display:flex;align-items:center;gap:8px;background:rgba(0,0,0,.55);padding:8px 12px;border-radius:12px;width:max-content;color:#fff;font-weight:700;font-size:14px}
.fx.ad .top .av{width:26px;height:26px;border-radius:50%;background:var(--lime);color:#000;display:grid;place-items:center;font-weight:900;font-size:12px}
.fx.ad .top small{font-weight:400;opacity:.8}
.fx.ad .cta{position:absolute;left:0;right:0;bottom:0;background:var(--lime);color:#000;font-weight:800;padding:12px 16px;border-radius:12px;display:flex;justify-content:space-between}
.fx.listing{left:6%;bottom:10%;background:rgba(10,10,10,.75);border-left:4px solid var(--lime);padding:12px 18px;color:#fff;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.fx.listing small{display:block;font-family:var(--f-osd);font-size:18px;letter-spacing:.14em;color:var(--lime)}
.fx.listing b{display:block;font-size:clamp(20px,2.2vw,30px);font-weight:900}
.fx.live{left:7%;top:16%;background:var(--red);color:#fff;font-weight:800;font-size:14px;padding:4px 10px;border-radius:6px;letter-spacing:.06em}
.fx.bug{right:6%;bottom:9%;width:12%;color:var(--lime);filter:drop-shadow(0 2px 6px rgba(0,0,0,.6))}
.fx.bug svg{width:100%;height:auto;display:block;animation:spinb 8s linear infinite}
@keyframes spinb{to{transform:rotate(360deg)}}
.fx.audit{inset:12% 18%;background:rgba(8,9,6,.88);border:1px solid #3a3d22;border-radius:12px;overflow:hidden}
.fx.audit canvas{width:100%;height:100%;display:block}
.fx.hearts{inset:0}
.fx.hearts span{position:absolute;bottom:12%;font-size:30px;color:#ff3040;animation:rise 1.6s ease-out forwards}
@keyframes rise{to{transform:translateY(-260%) scale(1.5);opacity:0}}
.shot-ctl{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px}
.shot-ctl label{font-family:var(--f-osd);font-size:17px;letter-spacing:.06em;color:var(--mute);display:flex;align-items:center;gap:10px;flex:1 1 220px}
.shot-ctl input[type=range]{flex:1;accent-color:var(--lime);min-height:30px}
@media (max-width:900px){.station{grid-template-columns:minmax(0,1fr)}.hud.tr{display:none}}

/* ---------- terminal ---------- */
.term{margin-top:20px;border-radius:16px;overflow:hidden;background:#0a0b08;border:1px solid #2b2e1f;box-shadow:0 40px 90px rgba(0,0,0,.6),0 0 0 1px rgba(196,216,47,.06);transform:perspective(1200px) translateY(40px) scale(.86) rotateX(12deg);opacity:.2;transition:transform 1.1s cubic-bezier(.2,.8,.2,1),opacity .8s}
.term.in{transform:none;opacity:1}
.term-bar{display:flex;align-items:center;gap:8px;padding:12px 16px;background:#16170f;border-bottom:1px solid #2b2e1f}
.term-bar i{width:12px;height:12px;border-radius:50%;background:#ff5f57}.term-bar i:nth-child(2){background:#febc2e}.term-bar i:nth-child(3){background:#28c840}
.term-bar span{margin-left:auto;margin-right:auto;font-family:var(--f-osd);font-size:17px;color:#8f8b83;letter-spacing:.05em}
.term-body{padding:20px clamp(16px,2.4vw,30px) 22px;font-family:var(--f-osd);font-size:clamp(17px,1.5vw,21px);line-height:1.35;color:#d7e3a0;min-height:300px}
.term-out p{margin:0;white-space:pre-wrap;word-break:break-word}
.term-out .c{color:#fff}.term-out .c::before{content:"tutto@studio ~ % ";color:var(--lime)}
.term-out .d{color:#8f8b83}.term-out .ok{color:var(--lime)}
.term-out .bar{color:var(--lime)}
.term-res{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:18px 0}
.proj{background:#121309;border:1px solid #2b2e1f;border-radius:12px;overflow:hidden;opacity:0;transform:translateY(16px) scale(.97);transition:opacity .5s,transform .5s,border-color .2s;font-family:var(--f-body);color:var(--text)}
.proj.in{opacity:1;transform:none}
.proj:hover,.proj:focus-within{border-color:var(--lime)}
.proj .bw{height:12px;background:#22241a;display:flex;gap:4px;align-items:center;padding:0 8px}.proj .bw i{width:5px;height:5px;border-radius:50%;background:#555}
.proj .pv{position:relative;aspect-ratio:16/10;overflow:hidden;background:#000}
.proj .pv img{width:100%;height:auto;display:block;transition:transform 5s ease-in-out}
.proj .pv.cover img{height:100%;object-fit:cover}
.proj:hover .pv.long img,.proj:focus-within .pv.long img{transform:translateY(calc(-100% + 100cqh))}
.proj .pv{container-type:size}
.proj .meta{padding:12px 14px 14px}
.proj .meta b{display:block;color:var(--white);font-size:17px}
.proj .meta span{display:block;font-family:var(--f-osd);font-size:16px;color:var(--lime);letter-spacing:.04em}
.proj .meta p{margin:6px 0 0;font-size:14px}
.term-in{display:flex;align-items:center;gap:10px;border-top:1px dashed #2b2e1f;padding-top:12px}
.term-in label{color:var(--lime);white-space:nowrap}
.term-in input{flex:1;min-width:0;background:transparent;border:0;outline:0;color:#fff;font:inherit;caret-color:var(--lime);min-height:36px}
.term-in input:focus-visible{outline:2px solid var(--lime);outline-offset:4px;border-radius:4px}
@media (max-width:900px){.term-res{grid-template-columns:minmax(0,1fr)}.term-in label{display:none}}

/* ---------- slot game ---------- */
.spin-sec{background:radial-gradient(ellipse 60% 70% at 75% 50%,rgba(196,216,47,.08),transparent 70%),#0b0a0a;border-block:1px solid var(--line)}
.spin-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,80px);align-items:center}
.spin-result{margin:24px 0 18px;padding:18px 20px;border:1px solid var(--line);border-radius:14px;background:var(--panel);min-height:96px}
.spin-result b{display:block;color:var(--white);font-size:20px;font-weight:900}
.spin-result span{color:var(--text)}
.spin-result.win{border-color:var(--lime);box-shadow:0 0 30px rgba(196,216,47,.15)}
.slot{border-radius:26px;padding:20px;background:linear-gradient(180deg,#232022,#121011);border:1px solid #3a3637;box-shadow:0 40px 80px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.08)}
.slot-top{display:flex;align-items:baseline;justify-content:center;gap:10px;margin-bottom:14px}
.slot-top span{font-weight:900;font-size:28px;letter-spacing:.08em;color:var(--lime)}
.slot-top em{font-family:var(--f-script);font-size:30px;color:var(--white);font-style:normal}
.reels{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:10px;border-radius:16px;background:#060606;box-shadow:inset 0 0 30px rgba(0,0,0,.9)}
.reel{height:150px;overflow:hidden;border-radius:10px;background:linear-gradient(180deg,#0d0d0d,#1c1b1a 50%,#0d0d0d);position:relative}
.reel::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.75),transparent 30%,transparent 70%,rgba(0,0,0,.75));pointer-events:none}
.reel ul{list-style:none;margin:0;padding:0;will-change:transform}
.reel li{height:150px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:var(--white)}
.reel li i{font-style:normal;font-size:44px;line-height:1}
.reel li b{font-family:var(--f-osd);font-size:clamp(14px,1.4vw,18px);text-align:center;letter-spacing:.08em;color:var(--lime)}
.payline{position:absolute;left:4px;right:4px;top:50%;height:2px;background:rgba(196,216,47,.35);pointer-events:none}
.slot-bot{display:flex;align-items:center;justify-content:space-between;margin-top:16px}
.credits{font-family:var(--f-osd);font-size:20px;color:var(--mute);letter-spacing:.08em}.credits b{color:var(--lime)}
.spin-btn{min-width:150px;font-size:20px;letter-spacing:.1em}
.slot.go .reels{animation:shake .25s 3}
@keyframes shake{50%{transform:translateX(2px)}}
@media (max-width:900px){.spin-grid{grid-template-columns:minmax(0,1fr)}.reel,.reel li{height:120px}}

/* ---------- polaroids ---------- */
.people{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin-top:30px}
.pol{margin:0;width:min(30%,190px);min-width:130px;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s;cursor:zoom-in}
.pol:nth-child(4){transform:rotate(3deg)}.pol:nth-child(5){transform:rotate(-4deg) translateY(6px)}
.pol:hover{transform:rotate(0) scale(1.08) translateY(-6px)!important;z-index:2;box-shadow:0 30px 60px rgba(0,0,0,.7)}
.pol img{filter:contrast(1.05) saturate(1.05);height:auto;aspect-ratio:1;object-fit:cover}

/* ---------- effects ---------- */
.cursor-rec{position:fixed;left:0;top:0;z-index:90;pointer-events:none;width:74px;height:74px;margin:-37px 0 0 -37px;border-radius:50%;border:1.5px solid var(--lime);display:grid;place-items:center;font-family:var(--f-osd);font-size:16px;letter-spacing:.08em;color:var(--lime);background:rgba(10,10,10,.35);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:0;transform:scale(.4);transition:opacity .2s,transform .2s}
.cursor-rec.on{opacity:1;transform:scale(1)}
.cursor-rec::before{content:"";position:absolute;top:14px;width:7px;height:7px;border-radius:50%;background:var(--red);animation:blink 1s steps(2) infinite}
.case img,.pol img{transform:skewY(calc(var(--sv,0) * 1deg));transition:transform .25s ease-out}
.scr-h{display:inline}
/* ---------- phone: built from parts on scroll ---------- */
.feed{height:calc(100vh + 300vh)}
.stage{perspective:1600px}
.phone{--a:1;--spin:0deg;position:relative;width:var(--pw);height:calc(var(--pw) * 2.06);transform-style:preserve-3d;transform:translateY(calc((1 - var(--a)) * var(--pw) * .25)) scale(calc(.6 + var(--a) * .4)) rotateX(calc((1 - var(--a)) * 54deg)) rotateZ(calc((1 - var(--a)) * -32deg)) rotateY(var(--spin))}
.pp{position:absolute;inset:0;transform-style:preserve-3d;transform:translate3d(calc(var(--dx,0) * (1 - var(--a)) * var(--pw)),calc(var(--dy,0) * (1 - var(--a)) * var(--pw)),calc(var(--z) * var(--pw) * .012 + (var(--k) - 3) * (1 - var(--a)) * var(--pw) * .34)) rotateZ(calc(var(--rz,0) * (1 - var(--a)) * 1deg));opacity:var(--in,1)}
.pp > .f{position:absolute;inset:0;border-radius:calc(var(--pw) * .16);backface-visibility:hidden}
.pp > .f.bk{transform:rotateY(180deg)}
.lab{position:absolute;left:104%;top:var(--ly,40%);white-space:nowrap;font-family:var(--f-osd);font-size:calc(var(--pw) * .065);letter-spacing:.06em;color:var(--lime);opacity:calc((1 - var(--a)) * 1.6 - .2);display:flex;align-items:center;gap:6px;pointer-events:none}
.lab::before{content:"";width:calc(var(--pw) * .25);height:1px;background:linear-gradient(90deg,transparent,var(--lime))}
.pp:nth-child(odd) .lab{left:auto;right:104%;flex-direction:row-reverse}.pp:nth-child(odd) .lab::before{background:linear-gradient(270deg,transparent,var(--lime))}
.lab{font-size:calc(var(--pw) * .085)!important}
.lab em{font-style:normal;color:#e9e6df}
/* back */
.p-back .f.fr{background:radial-gradient(circle at 50% 55%,transparent 21%,#b87333 21.5% 22.5%,transparent 23% 26%,#b87333 26.5% 27.2%,transparent 27.6%),linear-gradient(160deg,#1c1b1b,#0f0f10);box-shadow:inset 0 0 0 calc(var(--pw)*.01) #3b3937}
.p-back .f.bk{background:linear-gradient(150deg,#45423f,#272524 40%,#33302e 75%,#4a4744);box-shadow:inset 0 0 0 calc(var(--pw)*.012) #8b8680,inset 0 0 calc(var(--pw)*.08) rgba(0,0,0,.6)}
.p-back .cam{position:absolute;right:7%;top:3.6%;width:44%;aspect-ratio:1;border-radius:24%;background:linear-gradient(140deg,#56524e,#2a2827);box-shadow:inset 0 0 0 2px #6d6964,0 6px 14px rgba(0,0,0,.6)}
.p-back .cam i{position:absolute;width:40%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 38% 34%,#7d8fb8 0 6%,#1b2440 14%,#05060a 32%,#141416 58%,#8a857e 62%,#2a2826 70%);box-shadow:0 3px 6px rgba(0,0,0,.7)}
.p-back .cam i:nth-child(1){left:6%;top:6%}.p-back .cam i:nth-child(2){left:6%;bottom:6%}.p-back .cam i:nth-child(3){right:6%;top:30%}
.p-back .cam s{position:absolute;right:12%;bottom:12%;width:13%;aspect-ratio:1;border-radius:50%;background:radial-gradient(#fff6d8,#c9b56a 60%,#555)}
.p-back .logo-b{position:absolute;left:50%;top:52%;width:22%;transform:translate(-50%,-50%);color:var(--lime);filter:drop-shadow(0 0 6px rgba(196,216,47,.35))}
/* battery */
.p-bat .f{inset:42% 9% 6% 9%!important;border-radius:calc(var(--pw)*.04)!important;background:linear-gradient(180deg,#2a2d33,#16181c);box-shadow:inset 0 0 0 1px #4b5058,0 4px 18px rgba(0,0,0,.5);display:grid;place-items:center;align-content:center;gap:4%}
.p-bat b{font-family:var(--f-osd);color:#cfd3d8;font-size:calc(var(--pw)*.07);letter-spacing:.1em}
.p-bat small{font-family:var(--f-osd);color:#7c828b;font-size:calc(var(--pw)*.05)}
.p-bat i{width:40%;height:6%;border-radius:4px;background:linear-gradient(90deg,var(--lime) 82%,#333 82%)}
/* logic board */
.p-pcb .f{inset:4% 6% 60% 6%!important;border-radius:calc(var(--pw)*.05)!important;background:radial-gradient(circle at 20% 80%,#c9a227 0 1.2%,transparent 1.4%) 0 0/12% 18%,repeating-linear-gradient(90deg,rgba(201,162,39,.18) 0 1px,transparent 1px 9px),repeating-linear-gradient(0deg,rgba(201,162,39,.12) 0 1px,transparent 1px 11px),linear-gradient(160deg,#0f2a1d,#0a1d14);box-shadow:inset 0 0 0 1px #2d5a3f,0 6px 20px rgba(0,0,0,.6)}
.chip{position:absolute;border-radius:4px;background:linear-gradient(145deg,#2b2b2e,#0e0e10);box-shadow:inset 0 0 0 1px #4a4a4f,0 2px 6px rgba(0,0,0,.6);display:grid;place-items:center;font-family:var(--f-osd);color:#c8c8c8;letter-spacing:.06em}
.chip.soc{left:36%;top:24%;width:30%;aspect-ratio:1;font-size:calc(var(--pw)*.05);background:linear-gradient(145deg,#3a3a3e,#151517)}
.chip.soc::after{content:"";position:absolute;inset:-6%;border-radius:6px;background:repeating-linear-gradient(90deg,#c9a227 0 2px,transparent 2px 6px) top/100% 4% no-repeat,repeating-linear-gradient(90deg,#c9a227 0 2px,transparent 2px 6px) bottom/100% 4% no-repeat;z-index:-1}
.chip.ram{left:70%;top:20%;width:20%;height:34%;font-size:calc(var(--pw)*.035)}
.chip.nfc{left:8%;top:22%;width:22%;height:24%;font-size:calc(var(--pw)*.03)}
.chip.s{width:6%;height:9%;background:#5b4a2a;box-shadow:inset 0 0 0 1px #8a7440}
.p-pcb .gold{position:absolute;left:8%;bottom:10%;width:84%;height:9%;background:repeating-linear-gradient(90deg,#d4af37 0 5px,transparent 5px 9px);opacity:.85}
/* cameras module */
.p-cam .f{background:none!important}
.p-cam .lens{position:absolute;width:17%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 40% 35%,#9fb3e0 0 5%,#2a3a6a 12%,#04050a 34%,#1a1a1c 56%,#a19a90 60%,#3b3835 72%);box-shadow:0 0 0 calc(var(--pw)*.012) #5c5852,0 8px 16px rgba(0,0,0,.7)}
.p-cam .lens:nth-child(1){right:31%;top:5.5%}.p-cam .lens:nth-child(2){right:31%;top:14.5%}.p-cam .lens:nth-child(3){right:10%;top:10%}
/* frame */
.p-frame .f{background:transparent;box-shadow:0 0 0 calc(var(--pw)*.022) #8f8a84,inset 0 0 0 calc(var(--pw)*.008) #c9c4bd,0 0 0 calc(var(--pw)*.03) #4e4b48}
.p-frame .btnl{position:absolute;left:calc(var(--pw)*-.035);width:calc(var(--pw)*.018);border-radius:3px;background:#a29d96}
/* display */
.p-disp .f.fr{background:rgba(2,2,2,calc(.35 + var(--a) * .65));box-shadow:inset 0 0 0 calc(var(--pw)*.03) #050505;overflow:hidden}
.p-disp .f.bk{background:#141414}
.screen{position:absolute;inset:calc(var(--pw) * .032);border-radius:calc(var(--pw) * .13);overflow:hidden;background:#000;opacity:calc(var(--a) * 1.6 - .6)}
.boot{position:absolute;inset:0;display:grid;place-items:center;background:#000;z-index:6;opacity:var(--boot,1);pointer-events:none}
.boot svg{width:28%;color:var(--lime);opacity:var(--bootlogo,0);filter:drop-shadow(0 0 14px rgba(196,216,47,.6))}
.ph-track{position:absolute;inset:0;transform:translateY(calc(var(--f,0) * -100%));will-change:transform}
.post{position:absolute;left:0;right:0;height:100%;overflow:hidden;background:#111}
.post video,.post img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.post::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.35),transparent 18%,transparent 62%,rgba(0,0,0,.65))}
.post .prog{position:absolute;left:0;bottom:9.5%;height:2px;width:calc(var(--pr,0) * 100%);background:rgba(255,255,255,.85);z-index:5}
/* glass */
.p-glass .f.fr{background:linear-gradient(115deg,rgba(255,255,255,.14),transparent 28%,transparent 70%,rgba(255,255,255,.06));box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);pointer-events:none}
.p-glass .f.bk{display:none}
.island{position:absolute;left:50%;top:2.4%;width:30%;height:3.3%;transform:translateX(-50%);background:#000;border-radius:999px}
.ig{position:absolute;inset:0;z-index:4;pointer-events:none;color:#fff;font-size:calc(var(--pw) * .042);font-family:-apple-system,"SF Pro Text",var(--f-body)}
.ig .sb{position:absolute;left:9%;right:7%;top:2.3%;display:flex;justify-content:space-between;font-weight:600;font-size:1.05em}
.ig .top{position:absolute;left:5%;right:5%;top:7%;display:flex;justify-content:space-between;align-items:center;font-weight:800;font-size:1.35em}
.ig .side{position:absolute;right:4%;bottom:15%;display:flex;flex-direction:column;gap:1.3em;align-items:center}
.ig svg{width:1.75em;height:1.75em;display:block;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 1px 2px rgba(0,0,0,.5))}
.ig .who{position:absolute;left:4.5%;right:22%;bottom:15.5%}
.ig .acct{display:flex;align-items:center;gap:.5em;font-weight:700}
.ig .av{width:2.1em;height:2.1em;border-radius:50%;background:var(--lime);color:#000;display:grid;place-items:center;font-weight:900;font-size:.8em;box-shadow:0 0 0 2px #fff}
.ig .fol{border:1px solid rgba(255,255,255,.8);border-radius:7px;padding:.12em .6em;font-size:.9em}
.ig .cap{margin:.55em 0 .35em;line-height:1.3;text-shadow:0 1px 2px rgba(0,0,0,.6)}
.ig .aud{font-size:.88em;opacity:.9}
.ig .nav{position:absolute;left:0;right:0;bottom:0;height:9.5%;background:#000;display:flex;justify-content:space-around;align-items:flex-start;padding-top:2.4%}
.ig .nav svg{width:1.6em;height:1.6em}
.ig .home{position:absolute;left:35%;right:35%;bottom:1.3%;height:.5%;min-height:3px;border-radius:9px;background:#fff}
.ig .heart{position:absolute;left:50%;top:44%;width:24%;transform:translate(-50%,-50%) scale(0);opacity:0}
.ig .heart svg{width:100%;height:auto;fill:#fff;stroke:none}
.post.pop .heart{animation:pop .9s ease .6s}
@keyframes pop{15%{transform:translate(-50%,-50%) scale(1.15);opacity:1}30%{transform:translate(-50%,-50%) scale(.95)}70%{opacity:1}100%{transform:translate(-50%,-90%) scale(1);opacity:0}}
.ph-shadow{position:absolute;left:10%;right:10%;bottom:-16%;height:12%;border-radius:50%;background:radial-gradient(ellipse at center,rgba(0,0,0,.75),transparent 70%);filter:blur(8px);opacity:var(--a)}
.floaty{animation:floaty 6s ease-in-out infinite;transform-style:preserve-3d}
@keyframes floaty{0%,100%{transform:translateY(-8px)}50%{transform:translateY(8px)}}
.feed-phase{font-family:var(--f-osd);font-size:18px;letter-spacing:.12em;color:var(--mute);margin-top:10px}
@media (max-width:900px){.lab{font-size:calc(var(--pw) * .055)}.lab::before{width:calc(var(--pw)*.12)}}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .grain,.tick ul,.drone,.signal,.ovl .rec b,.iso .cone{animation:none!important}
  .reveal{opacity:1;transform:none;transition:none}
  .floaty{animation:none}
  .feed{height:auto}.feed-pin{position:relative;height:auto;padding-block:80px}
  .tick ul{flex-wrap:wrap;width:auto}
}
/* ===== vcr osd ===== */
.vcr{position:fixed;left:max(14px,env(safe-area-inset-left));bottom:calc(14px + env(safe-area-inset-bottom,0px));z-index:80;display:flex;align-items:center;gap:10px;padding:6px 12px;border:1px solid var(--line);border-radius:6px;background:rgba(10,10,10,.72);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);color:var(--lime);font:20px/1 var(--f-osd);letter-spacing:.06em;cursor:pointer;text-shadow:0 0 8px var(--lime-glow);opacity:0;transform:translateY(8px);transition:opacity .3s,transform .3s}
.vcr.on{opacity:1;transform:none}
.vcr .ctr{color:#e8e6e3;opacity:.85}
.vcr:hover .lbl,.vcr:focus-visible .lbl{color:#fff}
.vcr.rw .lbl{animation:blink .5s steps(2) infinite}
@keyframes blink{50%{opacity:.25}}
.track{position:fixed;left:0;right:0;height:14vh;top:-20vh;z-index:89;pointer-events:none;opacity:0;background:linear-gradient(transparent,rgba(255,255,255,.05) 30%,rgba(196,216,47,.08) 50%,rgba(255,255,255,.05) 70%,transparent);mix-blend-mode:screen}
.track.go{animation:track .55s linear}
@keyframes track{0%{top:-20vh;opacity:1}100%{top:110vh;opacity:1}}
@media (prefers-reduced-motion:reduce){.vcr.rw .lbl{animation:none}.track{display:none}}
/* ===== creator's desk: philosophy band ===== */
:root{--f-hand:"Permanent Marker","Marker Felt","Comic Sans MS",cursive}
.desk{position:relative;overflow:hidden;padding-block:clamp(64px,9vw,130px);background:radial-gradient(ellipse 60% 50% at 30% 30%,rgba(255,190,90,.07),transparent 70%),linear-gradient(180deg,var(--ink),rgba(0,0,0,.35) 18%,rgba(0,0,0,.35) 82%,var(--ink))}
.desk.lit{background:radial-gradient(ellipse 60% 50% at 30% 30%,rgba(255,190,90,.07),transparent 70%),linear-gradient(180deg,var(--ink),rgba(0,0,0,.35) 18%,rgba(0,0,0,.35) 82%,var(--ink)),url(../media/bg.jpg) center/cover}
.desk .wrap{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(28px,5vw,72px);align-items:center}
@media (max-width:900px){.desk .wrap{grid-template-columns:minmax(0,1fr)}}
.desk .script{font-family:var(--f-script);color:var(--lime);font-size:clamp(46px,5.4vw,80px);line-height:1;margin:0 0 .2em}
.desk .lede strong{color:var(--lime);font-weight:700}
.ph-cards{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(8px,1.6vw,18px);list-style:none;margin:0;padding:0}
.ph-card{background:#ebe6da;color:#1a1817;padding:10px 10px 0;border-radius:2px;box-shadow:0 14px 30px rgba(0,0,0,.55),0 2px 4px rgba(0,0,0,.4);transform:rotate(var(--r,0deg));transition:transform .25s ease-out,box-shadow .25s ease-out;background-image:radial-gradient(rgba(0,0,0,.06) 1px,transparent 1px);background-size:3px 3px}
.ph-card:nth-child(1){--r:-2.4deg}.ph-card:nth-child(2){--r:1.6deg;margin-top:-14px}.ph-card:nth-child(3){--r:-1deg;margin-top:22px}
.ph-card .ph{aspect-ratio:1;background:#0c0b0b;display:grid;place-items:center;overflow:hidden}
.ph-card svg{width:46%;height:auto;overflow:visible;transition:transform .3s ease-out}
.ph-card p{margin:0;padding:12px 4px 16px;font-family:var(--f-hand);font-size:clamp(14px,1.35vw,19px);line-height:1.15;text-align:center}
.ph-card p b{font-weight:400;font-size:1.25em;letter-spacing:.02em}
.ph-card:hover{transform:rotate(0deg) translateY(-4px);box-shadow:0 22px 40px rgba(0,0,0,.6),0 3px 6px rgba(0,0,0,.4)}
.ph-card:hover .s-arrow{transform:translateX(12%)}
.ph-card:hover .s-ap{transform:rotate(60deg)}
.ph-card:hover .s-smile{transform:scaleY(1.4)}
.desk.js .ph-card{opacity:0;transform:translate(var(--fx,0),-46px) rotate(calc(var(--r) * 5));transition:opacity .3s ease-out,transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .25s}
.desk.js .ph-card:nth-child(1){--fx:-30px}.desk.js .ph-card:nth-child(3){--fx:30px}
.desk.js.in .ph-card{opacity:1;transform:rotate(var(--r))}
.desk.js.in .ph-card:nth-child(2){transition-delay:.12s}.desk.js.in .ph-card:nth-child(3){transition-delay:.24s}
.desk.js.in .ph-card:hover{transform:rotate(0deg) translateY(-4px);transition-delay:0s}
.torn{position:relative;margin:clamp(26px,4vw,44px) 0 0;padding:clamp(18px,2.4vw,26px) clamp(20px,3vw,40px);background-color:#efeae0;background-image:linear-gradient(rgba(70,110,160,.16) 1px,transparent 1px),linear-gradient(90deg,rgba(70,110,160,.16) 1px,transparent 1px);background-size:16px 16px;color:#1a1817;font-weight:700;font-size:clamp(18px,2.1vw,28px);letter-spacing:-.01em;transform:rotate(-1deg);box-shadow:0 12px 26px rgba(0,0,0,.5);clip-path:polygon(0 6%,4% 0,9% 5%,15% 1%,22% 4%,30% 0,38% 5%,47% 1%,55% 4%,63% 0,71% 5%,80% 1%,88% 4%,95% 0,100% 5%,99% 50%,100% 94%,94% 100%,86% 95%,77% 100%,68% 96%,59% 100%,50% 95%,41% 100%,32% 96%,23% 100%,14% 95%,6% 100%,0 95%,1% 50%)}
.torn::before{content:"";position:absolute;top:-6px;left:50%;width:90px;height:24px;margin-left:-45px;background:rgba(220,205,160,.75);transform:rotate(3deg)}
.torn em{font-style:normal;color:#6b7d00}
.desk .wrap.quiet{display:block}
.quiet{text-align:center;margin-top:clamp(56px,8vw,100px)}
.quiet .mk{display:inline-flex;gap:10px;align-items:center;margin-bottom:18px}
.quiet .mk svg{height:30px;width:auto}
.quiet h2{font-family:var(--f-script);font-weight:400;font-size:clamp(38px,5vw,72px);line-height:1.05;margin:0 0 14px;color:var(--white)}
.go{display:inline-flex;align-items:center;gap:.5em;color:var(--lime);font-weight:700;font-size:18px;text-decoration:none;padding:10px 4px}
.go i{display:inline-block;font-style:normal;transition:transform .2s ease-out}
.go:hover i,.go:focus-visible i{transform:translateX(8px) scaleX(1.3)}
/* symbols animate, not the words */
.rbu svg:first-of-type{animation:playhead 1.8s ease-in-out infinite}
.rbu svg:nth-of-type(2),.face .ap{animation:spinb 14s linear infinite;transform-origin:50% 50%}
.rbu .m-smile,.face .smile svg{clip-path:inset(0 100% 0 0);transition:clip-path .9s cubic-bezier(.6,0,.2,1) .3s}
.rbu.drawn .m-smile,.quiet.drawn .face .smile svg{clip-path:inset(0 0 0 0)}
@keyframes playhead{0%,100%{opacity:1;transform:translateX(0)}50%{opacity:.55;transform:translateX(6%)}}
/* brand wall: stamped, projector flicker on entry */
.brand-wall li>*{filter:url(#stamp)}
.brand-wall.js li{opacity:0}
.brand-wall.js.in li{animation:proj .7s steps(1) forwards;animation-delay:calc(var(--i) * 110ms)}
@keyframes proj{0%{opacity:.6}10%{opacity:0}22%{opacity:.85}30%{opacity:.2}42%{opacity:1}55%{opacity:.7}70%,100%{opacity:1}}
/* dust motes */
.mote{position:absolute;width:3px;height:3px;border-radius:50%;background:rgba(255,240,200,.55);filter:blur(.6px);pointer-events:none;animation:mote var(--d) linear infinite;animation-delay:var(--dl)}
@keyframes mote{0%{transform:translate(0,0);opacity:0}15%{opacity:.8}85%{opacity:.6}100%{transform:translate(var(--mx),-120px);opacity:0}}
@media (prefers-reduced-motion:reduce){.rbu svg,.face svg{animation:none!important}.rbu .m-smile,.face .smile svg{clip-path:none}.desk.js .ph-card,.brand-wall.js li{opacity:1;animation:none;transform:rotate(var(--r,0deg))}.mote{display:none}}
/* ===== verse interruptions (Book of Tutto) ===== */
.vint{position:relative;display:grid;place-items:center;min-height:100svh;padding:6vh 16px;background:radial-gradient(ellipse 55% 60% at 50% 50%,rgba(196,216,47,.06),transparent 70%),#050505;overflow:hidden}
.vint::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at center,transparent 45%,rgba(0,0,0,.85) 100%)}
.vint figure{margin:0;position:relative;z-index:1}
.vint img{display:block;height:min(88svh,1280px);width:auto;max-width:min(88vw,720px);object-fit:contain;border-radius:6px}
.vint figcaption{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.vint.js figure{opacity:0;transform:scale(1.04);filter:blur(6px) brightness(.6);transition:opacity .6s ease-out,transform .9s cubic-bezier(.2,.8,.2,1),filter .6s ease-out}
.vint.js.in figure{opacity:1;transform:none;filter:none}
.vint.js.in img{animation:vpulse 1.4s ease-out .5s 1}
@keyframes vpulse{0%{filter:none}35%{filter:drop-shadow(0 0 28px rgba(196,216,47,.55)) brightness(1.12)}100%{filter:none}}
@media (prefers-reduced-motion:reduce){.vint.js figure{opacity:1;transform:none;filter:none;transition:none}.vint.js.in img{animation:none}}
.face{display:grid;grid-template-columns:auto auto;justify-content:center;gap:4px 18px;margin-bottom:6px}
.face .sym{background:none;border:0;padding:8px;cursor:pointer;color:inherit;border-radius:10px;transition:transform .2s ease-out}
.face .sym svg{height:44px;width:auto;display:block}
.face .smile{grid-column:1/-1;justify-self:center;margin-top:-6px}
.face .smile svg{height:24px}
.face .sym:hover,.face .sym:focus-visible,.face .sym.on{transform:translateY(-3px);filter:drop-shadow(0 0 12px var(--lime-glow))}
.face-m{font-family:var(--f-osd);color:var(--mute);font-size:20px;letter-spacing:.06em;min-height:1.3em;margin:0 0 26px}
.face-m.on{color:var(--lime)}

/* =====================================================================
   MULTI-PAGE SYSTEM (round 5): shared components for every page
   ===================================================================== */
:root{--f-black:"UnifrakturMaguntia","Old English Text MT",serif}
.hdr{transition:background .2s}
.hdr.scrolled{background:rgba(6,6,6,.92)}
.nav a[aria-current="page"]{color:var(--lime)}
.nav a[aria-current="page"]::after{content:"";display:block;height:2px;background:var(--lime);margin-top:3px;border-radius:2px}
/* sound toggle */
.snd{display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:0 12px;border-radius:999px;border:1px solid var(--line);color:var(--mute);font:18px/1 var(--f-osd);letter-spacing:.08em;white-space:nowrap}
.snd:hover{color:var(--white);border-color:#4a4546}
.snd i{display:flex;gap:2px;align-items:flex-end;height:14px}
.snd i b{width:3px;height:4px;background:currentColor;border-radius:1px}
.sound-on .snd{color:var(--lime);border-color:rgba(196,216,47,.5)}
.sound-on .snd i b{animation:eq .9s ease-in-out infinite}
.sound-on .snd i b:nth-child(2){animation-delay:-.3s}.sound-on .snd i b:nth-child(3){animation-delay:-.6s}
@keyframes eq{0%,100%{height:4px}50%{height:14px}}
.snd-m{display:none}
@media (max-width:900px){.hdr .snd{display:none}.snd-m{display:inline-flex;margin-top:6px;align-self:flex-start}}
@media (prefers-reduced-motion:reduce){.sound-on .snd i b{animation:none;height:10px}}

/* channel-change transition */
.chan{position:fixed;inset:0;z-index:300;pointer-events:none;background:#050505 url(../media/noise.png);opacity:0}
.chan-in .chan{animation:chanIn .38s ease-out both}
.chan-out .chan{animation:chanOut .23s ease-in both}
.chan-out body>*:not(.chan){animation:crtOff .23s ease-in both}
@keyframes chanIn{0%{opacity:1;filter:contrast(3) brightness(1.6)}100%{opacity:0}}
@keyframes chanOut{0%{opacity:0}60%{opacity:.85}100%{opacity:1}}
@keyframes crtOff{to{transform:scaleY(.02);filter:brightness(3)}}
@media (prefers-reduced-motion:reduce){.chan{display:none}}

/* page hero (inner pages) */
.phero{position:relative;overflow:hidden;padding-block:clamp(36px,6vw,84px) clamp(40px,6vw,80px);background:radial-gradient(ellipse 60% 70% at 85% 30%,rgba(196,216,47,.08),transparent 70%),repeating-linear-gradient(0deg,rgba(255,255,255,.018) 0 1px,transparent 1px 3px);border-bottom:1px solid var(--line)}
.phero .wrap{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(28px,5vw,72px);align-items:center}
.phero.solo .wrap{grid-template-columns:minmax(0,1fr)}
@media (max-width:900px){.phero .wrap{grid-template-columns:minmax(0,1fr)}}
.crumbs{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0 0 18px;padding:0;font:17px/1.2 var(--f-osd);letter-spacing:.08em;color:var(--mute)}
.crumbs li+li::before{content:"▸";margin-right:6px;color:#55514d}
.crumbs a{color:var(--mute);text-decoration:none}.crumbs a:hover{color:var(--lime)}
.onair{display:inline-flex;align-items:center;gap:10px;font:20px/1 var(--f-osd);letter-spacing:.12em;color:var(--lime);margin-bottom:14px}
.onair .dot{width:9px;height:9px;border-radius:50%;background:var(--red);box-shadow:0 0 10px var(--red);animation:blinkRec 1.2s steps(2) infinite}
@keyframes blinkRec{50%{opacity:.2}}
.phero h1{font-weight:900;font-size:clamp(40px,6.4vw,92px);line-height:.92;letter-spacing:-.035em;margin:0 0 .35em;text-wrap:balance}
.phero h1 .script-w{font-family:var(--f-script);font-weight:400;color:var(--lime);letter-spacing:0;font-size:1.05em;text-transform:none}
.phero .lede{font-size:clamp(17px,1.5vw,21px);max-width:62ch}
.phero .cta-row{margin-top:28px}
/* monitor frame for hero media */
.mon{position:relative;border-radius:22px;padding:14px;background:linear-gradient(160deg,#2a2627,#141213);box-shadow:0 30px 60px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.08)}
.mon .m-scr{position:relative;border-radius:12px;overflow:hidden;background:#000;aspect-ratio:16/9}
.mon.tall .m-scr{aspect-ratio:9/16;max-height:70vh;margin-inline:auto}
.mon img,.mon video{width:100%;height:100%;object-fit:cover}
.mon .m-scr::after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(0,0,0,.18) 0 1px,transparent 1px 3px),radial-gradient(ellipse at center,transparent 55%,rgba(0,0,0,.55))}
.mon .m-osd{position:absolute;top:10px;left:12px;right:12px;display:flex;justify-content:space-between;font:18px/1 var(--f-osd);color:var(--lime);text-shadow:0 0 6px rgba(0,0,0,.9);z-index:2;letter-spacing:.06em}
.mon .m-led{position:absolute;right:22px;bottom:4px;width:6px;height:6px;border-radius:50%;background:var(--lime);box-shadow:0 0 8px var(--lime)}
.mon.verse-mon{background:none;box-shadow:none;padding:0;max-width:420px;margin-inline:auto}
.mon.verse-mon .m-scr{aspect-ratio:9/16;border-radius:10px;box-shadow:0 30px 60px rgba(0,0,0,.6)}
.mon.verse-mon .m-scr::after{display:none}

/* prose sections on inner pages */
.blk{padding-block:clamp(48px,7vw,96px);border-bottom:1px solid rgba(255,255,255,.05)}
.blk .wrap{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(20px,5vw,72px);align-items:start}
.blk.one .wrap{grid-template-columns:minmax(0,1fr)}
@media (max-width:900px){.blk .wrap{grid-template-columns:minmax(0,1fr)}}
.blk h2{font-weight:900;font-size:clamp(28px,3.4vw,48px);line-height:1;letter-spacing:-.02em;margin:0;text-wrap:balance}
.blk h2 .n{display:block;font:20px/1 var(--f-osd);color:var(--lime);letter-spacing:.12em;margin-bottom:12px;font-weight:400}
.blk p{margin:0 0 1em;color:var(--text);font-size:clamp(16px,1.25vw,18px);max-width:66ch}
.blk p:last-child{margin-bottom:0}
.chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.chips li{padding:8px 14px;border:1px solid var(--line);border-radius:999px;font-size:15px;color:var(--white);background:rgba(255,255,255,.02)}
.chips li::before{content:"▸ ";color:var(--lime)}
/* TV-guide tables */
.tg{width:100%;border-collapse:collapse;font-size:15px}
.tg caption{text-align:left;font:18px/1 var(--f-osd);color:var(--mute);letter-spacing:.1em;padding-bottom:10px}
.tg th{font:17px/1.1 var(--f-osd);letter-spacing:.1em;color:var(--lime);text-align:left;font-weight:400;padding:10px 12px;border-bottom:1px solid var(--lime)}
.tg td{padding:13px 12px;border-bottom:1px solid var(--line);vertical-align:top;color:var(--text)}
.tg td:first-child{color:var(--white);font-weight:700}
.tg tr{transition:background .15s}
.tg tbody tr:hover{background:rgba(196,216,47,.06)}
@media (max-width:640px){.tg thead{display:none}.tg tr{display:block;padding:12px 0;border-bottom:1px solid var(--line)}.tg td{display:block;border:0;padding:3px 0}
  .tg td::before{content:attr(data-h) " · ";font:15px var(--f-osd);color:var(--mute);letter-spacing:.08em}.tg td:first-child::before{display:none}.tg td:first-child{font-size:17px}}
/* steps */
.steps{list-style:none;margin:0;padding:0;display:grid;gap:10px;counter-reset:st}
.steps li{counter-increment:st;display:grid;grid-template-columns:48px 1fr;gap:14px;align-items:baseline;padding:14px 0;border-bottom:1px solid var(--line);color:var(--text)}
.steps li::before{content:counter(st,decimal-leading-zero);font:26px/1 var(--f-osd);color:var(--lime)}
/* stats */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}
.stat-big{padding:22px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(180deg,#141213,#0e0d0d)}
.stat-big b{display:block;font-weight:900;font-size:clamp(44px,5vw,72px);line-height:.9;color:var(--lime);letter-spacing:-.03em;margin-bottom:10px}
.stat-big span{color:var(--text);font-size:15px}
.src{font-family:var(--f-osd);color:var(--mute);font-size:17px;letter-spacing:.06em;margin-top:14px}
/* verse card (live text, blackletter reference) */
.vcard{position:relative;margin:0 0 28px;padding:26px 28px 24px;border-radius:14px;background:radial-gradient(ellipse at 20% 0%,rgba(196,216,47,.08),transparent 60%),#070707;border:1px solid #222;overflow:hidden}
.vcard::before{content:"";position:absolute;inset:0;background:url(../media/noise.png);opacity:.06;pointer-events:none}
.vcard blockquote{margin:0;font-weight:700;font-size:clamp(20px,2vw,28px);line-height:1.25;color:var(--white)}
.vcard blockquote::before{content:"\201C";color:var(--lime);margin-right:.08em}
.vcard blockquote::after{content:"\201D";color:var(--lime);margin-left:.04em}
.vcard cite{display:block;margin-top:12px;font:400 clamp(20px,1.8vw,26px)/1 var(--f-black);color:#e8e3d6;font-style:normal}
/* verse break (full-width interruption, typed on) */
.vbreak{position:relative;display:grid;place-items:center;min-height:min(78svh,720px);padding:12vh var(--gut);text-align:center;background:#030303;overflow:hidden;border-block:1px solid #111}
.vbreak::before{content:"";position:absolute;inset:-50%;background:url(../media/noise.png);opacity:.08;animation:grain 1s steps(6) infinite;pointer-events:none}
.vbreak::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 35%,rgba(0,0,0,.9) 100%),repeating-linear-gradient(90deg,transparent 0 37%,rgba(255,255,255,.035) 37% 37.15%,transparent 37.15% 71%,rgba(255,255,255,.025) 71% 71.1%,transparent 71.1%);pointer-events:none}
.vbreak figure{position:relative;z-index:1;margin:0;max-width:24ch}
.vbreak blockquote{margin:0;font-weight:700;font-size:clamp(26px,3.6vw,52px);line-height:1.15;color:#f6f2e8;letter-spacing:-.01em;text-wrap:balance}
.vbreak blockquote .q{color:var(--lime)}
.vbreak figcaption{margin-top:22px;font:400 clamp(22px,2.4vw,34px)/1 var(--f-black);color:#d9d3c4}
.vbreak .egg{display:block;margin:16px auto 0;width:42px;height:auto;opacity:.9}
[data-type].typing span.ch{opacity:0}
[data-type].typing span.ch.on{opacity:1;transition:opacity .08s}
[data-type].typing:not(.typed)::after{content:"▌";color:var(--lime);animation:blinkRec .7s steps(2) infinite;margin-left:2px}
@media (max-width:640px){.vbreak{min-height:62svh}}
/* FAQ */
.faq{display:grid;gap:10px}
details.qa{border:1px solid var(--line);border-radius:14px;background:#0f0e0e;overflow:hidden}
details.qa summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:16px;align-items:center;padding:18px 20px;font-weight:700;font-size:clamp(16px,1.3vw,19px);color:var(--white)}
details.qa summary::-webkit-details-marker{display:none}
details.qa summary::after{content:"CH ▸";font:400 18px/1 var(--f-osd);color:var(--lime);letter-spacing:.08em;white-space:nowrap;transition:transform .2s}
details.qa[open] summary::after{content:"PLAYING";color:var(--red)}
details.qa[open]{border-color:rgba(196,216,47,.45)}
details.qa .a{padding:0 20px 20px;color:var(--text)}
details.qa .a p{margin:0;max-width:70ch}
/* CTA band */
.ctab{position:relative;overflow:hidden;padding-block:clamp(64px,9vw,120px);text-align:center;background:radial-gradient(ellipse 50% 70% at 50% 100%,rgba(196,216,47,.12),transparent 70%)}
.ctab .verb{font-family:var(--f-script);color:var(--lime);font-size:clamp(48px,7vw,104px);line-height:1;margin:0 0 .25em}
.ctab p{color:var(--text);margin:0 auto 26px;max-width:52ch}
.ctab .cta-row{justify-content:center}
.lets-talk{font-family:var(--f-osd);font-size:22px;letter-spacing:.1em;color:var(--mute);margin-top:18px}
.lets-talk a{color:var(--white);text-decoration:none}.lets-talk a:hover{color:var(--lime)}
/* related channels */
.related{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.related a{display:flex;flex-direction:column;gap:6px;padding:18px;border:1px solid var(--line);border-radius:16px;text-decoration:none;color:var(--white);background:#0f0e0e;transition:border-color .15s,transform .15s}
.related a:hover{border-color:var(--lime);transform:translateY(-3px)}
.related .ch{font:18px/1 var(--f-osd);color:var(--lime);letter-spacing:.1em}
.related b{font-size:20px}
.related span{color:var(--mute);font-size:14px}
/* channel guide rows */
.gl{display:grid;gap:26px}
.gl h3{font:22px/1 var(--f-osd);letter-spacing:.16em;color:var(--mute);margin:0 0 8px;font-weight:400}
.gl-row{display:grid;grid-template-columns:72px minmax(0,220px) minmax(0,1fr) auto;gap:16px;align-items:center;padding:16px 14px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--white);border-radius:10px;transition:background .15s}
.gl-row:hover,.gl-row:focus-visible{background:rgba(196,216,47,.07)}
.gl-row .c{font:30px/1 var(--f-osd);color:var(--lime)}
.gl-row b{font-size:19px}
.gl-row span{color:var(--text);font-size:15px}
.gl-row i{font-style:normal;font:18px/1 var(--f-osd);color:var(--mute);letter-spacing:.08em}
.gl-row:hover i{color:var(--lime)}
.gl .prime .gl-row b{color:var(--lime)}
@media (max-width:700px){.gl-row{grid-template-columns:52px minmax(0,1fr);row-gap:4px}.gl-row span{grid-column:2}.gl-row i{display:none}}
/* industry tiles */
.tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
@media (max-width:900px){.tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
.tile{position:relative;display:block;border-radius:16px;overflow:hidden;aspect-ratio:4/5;text-decoration:none;color:var(--white);border:1px solid var(--line);background:#111}
.tile .tl-m{position:absolute;inset:0}
.tile img,.tile video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s ease-out,filter .3s}
.tile img{filter:grayscale(.65) brightness(.6)}
.tile video{opacity:0;transition:opacity .25s}
.tile.live video{opacity:1}
.tile:hover img,.tile.live img{filter:none;transform:scale(1.04)}
.tile .tl-t{position:absolute;left:0;right:0;bottom:0;padding:16px;background:linear-gradient(transparent,rgba(0,0,0,.85));z-index:1}
.tile .tl-t b{display:block;font:26px/1 var(--f-osd);letter-spacing:.1em;color:var(--lime)}
.tile .tl-t span{font-size:14px;color:var(--text)}
.tile .tl-ch{position:absolute;top:12px;left:12px;z-index:1;font:18px/1 var(--f-osd);color:#fff;background:rgba(0,0,0,.55);padding:4px 8px;border-radius:6px}
/* myth vs tutto */
.myths{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;perspective:1200px}
@media (max-width:1100px){.myths{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.myths{grid-template-columns:minmax(0,1fr)}}
.myth{position:relative;display:block;width:100%;min-height:240px;padding:0;border:0;background:none;color:inherit;text-align:left;cursor:pointer;transform-style:preserve-3d;transition:transform .5s cubic-bezier(.3,1.3,.5,1)}
.myth .f,.myth .b{position:absolute;inset:0;border-radius:16px;padding:18px;backface-visibility:hidden;-webkit-backface-visibility:hidden;display:flex;flex-direction:column;gap:10px}
.myth .f{background:#141213;border:1px solid var(--line)}
.myth .f::after{content:"";position:absolute;left:18px;right:18px;bottom:16px;height:22px;border-radius:4px;background:repeating-linear-gradient(90deg,#2b2728 0 6px,#1c1a1a 6px 9px)}
.myth .b{background:var(--lime);color:#0a0a0a;transform:rotateY(180deg)}
.myth .lab{font:17px/1 var(--f-osd);letter-spacing:.12em}
.myth .f .lab{color:var(--red)}
.myth .f p{margin:0;font-weight:800;font-size:19px;line-height:1.2;color:var(--white)}
.myth .b p{margin:0;font-weight:600;font-size:16px;line-height:1.35}
.myth.flipped{transform:rotateY(180deg)}
.myth:hover:not(.flipped){transform:rotateY(-8deg) translateY(-3px)}
.myth-count{font:22px/1 var(--f-osd);letter-spacing:.1em;color:var(--lime);display:inline-block;transition:transform .2s}
.myth-count.bump{transform:scale(1.15)}
@media (prefers-reduced-motion:reduce){.myth{transition:none}}
/* decode the logo */
.decode{position:relative;text-align:center}
.dc-face{display:inline-grid;grid-template-columns:auto auto;gap:6px 26px;justify-content:center;margin:18px 0 6px}
.dc-mark{background:none;border:0;padding:10px;cursor:pointer;color:var(--lime);border-radius:14px;position:relative;transition:transform .35s cubic-bezier(.3,1.4,.5,1),opacity .4s,filter .2s}
.dc-mark svg{height:clamp(56px,7vw,96px);width:auto;display:block;overflow:visible}
.dc-mark.sm{grid-column:1/-1;justify-self:center;margin-top:-8px}
.dc-mark.sm svg{height:clamp(30px,3.6vw,50px)}
.decode:not(.built) .dc-mark{opacity:0;transform:translateY(-40px) rotate(-20deg)}
.decode.built .dc-mark:nth-child(2){transition-delay:.15s}.decode.built .dc-mark:nth-child(3){transition-delay:.3s}
.dc-mark:hover,.dc-mark:focus-visible,.dc-mark.on{filter:drop-shadow(0 0 16px var(--lime-glow))}
.dc-mark.seen::after{content:"✓";position:absolute;top:-2px;right:-6px;font:16px var(--f-osd);color:var(--lime)}
.dc-mark.on{transform:scale(1.12)}
/* r39: done animation moved to .dc-mark.whole */
@keyframes smile{50%{transform:scaleY(1.6) translateY(-4px)}}
.dc-out{min-height:5.2em;max-width:52ch;margin:10px auto 0;color:var(--text);font-size:17px}
.dc-out b{font:30px/1 var(--f-osd);color:var(--lime);letter-spacing:.08em}
.dc-out span{font:18px/1 var(--f-osd);color:var(--mute);letter-spacing:.1em}
.dc-out.pop{animation:popIn .3s ease-out}
@keyframes popIn{from{opacity:0;transform:translateY(6px)}}
.dc-end{margin-top:18px;font-weight:900;font-size:clamp(22px,2.6vw,34px);line-height:1.15}
.dc-end small{display:block;font:20px/1.3 var(--f-osd);color:var(--mute);letter-spacing:.08em;font-weight:400;margin-bottom:8px}
.dc-end em{font-style:normal;color:var(--lime)}
/* work: tape shelf */
.tapes-filter{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.tapes-filter button{position:relative;min-height:44px;padding:0 16px 0 22px;border-radius:4px;border:1px solid #3a3536;background:linear-gradient(180deg,#1c1a1a,#121111);color:var(--text);font:19px/1 var(--f-osd);letter-spacing:.1em}
.tapes-filter button::before{content:"";position:absolute;left:8px;top:50%;width:6px;height:18px;margin-top:-9px;border-radius:2px;background:#4a4546}
.tapes-filter button[aria-pressed="true"]{color:#000;background:var(--lime);border-color:var(--lime)}
.tapes-filter button[aria-pressed="true"]::before{background:#000}
.cases-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:22px}
@media (max-width:900px){.cases-grid{grid-template-columns:minmax(0,1fr)}}
.case-card{display:grid;grid-template-rows:auto 1fr;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#0f0e0e}
.case-card[hidden]{display:none}
.case-card .cc-m{position:relative;aspect-ratio:16/9;background:#000;overflow:hidden}
.case-card .cc-m img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform 1.6s ease-out}
.case-card:hover .cc-m img{transform:scale(1.04)}
.case-card .cc-m .tag{position:absolute;top:12px;left:12px;font:18px/1 var(--f-osd);color:#000;background:var(--lime);padding:4px 8px;border-radius:4px;letter-spacing:.06em}
.case-card .cc-b{padding:20px}
.case-card h3{margin:0 0 4px;font-size:24px;font-weight:900;letter-spacing:-.01em}
.case-card .meta{font:18px/1.2 var(--f-osd);color:var(--mute);letter-spacing:.06em;margin-bottom:10px}
.case-card p{margin:0 0 12px;color:var(--text);font-size:15px}
.case-card .res{display:inline-block;font-weight:800;color:var(--lime);font-size:15px}
.case-card .svc{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px;list-style:none;padding:0}
.case-card .svc a{font-size:13px;color:var(--text);border:1px solid var(--line);border-radius:999px;padding:4px 10px;text-decoration:none}
.case-card .svc a:hover{border-color:var(--lime);color:var(--lime)}
/* quick facts */
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:0;margin:0;border-top:1px solid var(--line)}
.facts div{padding:14px 0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:130px 1fr;gap:12px}
.facts dt{font:18px/1.3 var(--f-osd);color:var(--lime);letter-spacing:.08em}
.facts dd{margin:0;color:var(--text)}
/* pager form (contact) */
.pager{position:relative;border-radius:28px;padding:clamp(18px,3vw,30px);background:linear-gradient(160deg,#2a2627,#121011);box-shadow:0 30px 70px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.08)}
.pager .lcd{border-radius:12px;background:#0b0e05;border:2px solid #000;box-shadow:inset 0 0 30px rgba(196,216,47,.08);padding:12px 16px;margin-bottom:18px;font:22px/1.2 var(--f-osd);color:var(--lime);letter-spacing:.08em;display:flex;justify-content:space-between}
.pager .lcd .blink{animation:blinkRec 1s steps(2) infinite}
.pager form{display:grid;gap:16px}
.pager label,.pager legend{font:18px/1 var(--f-osd);letter-spacing:.12em;color:var(--mute);margin-bottom:6px;display:block}
.pager fieldset{border:0;padding:0;margin:0}
.checks{display:flex;flex-wrap:wrap;gap:8px}
.checks label{display:inline-flex;align-items:center;gap:8px;margin:0;padding:8px 12px;border:1px solid var(--line);border-radius:999px;font:15px/1 var(--f-body);letter-spacing:0;color:var(--white);cursor:pointer}
.checks input{accent-color:var(--lime);width:16px;height:16px}
.checks label:has(input:checked){border-color:var(--lime);background:rgba(196,216,47,.1)}
fieldset[aria-invalid="true"] .checks label{border-color:var(--red)}
.result .so{display:block;margin-top:6px;font-family:var(--f-osd);color:var(--lime);font-size:20px;letter-spacing:.08em}
.result small{display:block;margin-top:6px;color:var(--mute)}
.lines{display:grid;gap:10px}
.lines a,.lines div{display:grid;grid-template-columns:120px 1fr;gap:12px;padding:16px 0;border-bottom:1px solid var(--line);text-decoration:none;color:var(--white)}
.lines span{font:18px/1.3 var(--f-osd);color:var(--lime);letter-spacing:.1em}
.lines a:hover b{color:var(--lime)}
/* footer (all pages) */
.ft-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;padding-top:6px}
@media (max-width:900px){.ft-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.ft-grid h3{font:18px/1 var(--f-osd);letter-spacing:.14em;color:var(--mute);margin:0 0 12px;font-weight:400}
.ft-grid ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.ft-grid a{color:var(--text);text-decoration:none;font-size:15px}
.ft-grid a:hover{color:var(--lime)}
.ft-nap{color:var(--text);font-size:15px;line-height:1.6}
.ft-nap a{color:var(--white)}
.standby{font:22px/1 var(--f-osd);letter-spacing:.2em;color:var(--mute)}
.signoff{font:clamp(26px,3vw,40px)/1 var(--f-osd);color:var(--lime);letter-spacing:.08em;text-align:center;padding:26px 0 0;border-top:1px solid var(--line)}
.egg-btn{display:block;margin:0 auto;background:none;border:0;color:inherit;cursor:pointer;text-align:center;padding:10px}
.egg-btn .egg-q{display:block;font-weight:700;font-size:clamp(17px,1.6vw,22px);color:#efeadf}
.egg-btn .egg-r{display:block;margin-top:8px;font:22px/1 var(--f-black);color:#cfc8b8}
.egg-btn:hover .egg-r{color:var(--lime)}
/* 404 */
.nosig{min-height:80svh;display:grid;place-items:center;text-align:center;position:relative;overflow:hidden;background:#050505}
.nosig::before{content:"";position:absolute;inset:-50%;background:url(../media/noise.png);opacity:.25;animation:grain .5s steps(4) infinite}
.nosig .bars{position:absolute;left:0;right:0;top:0;height:30%;display:flex;opacity:.35}
.nosig .bars i{flex:1}
.nosig>div{position:relative;z-index:1;padding:24px}
.nosig h1{font:clamp(64px,12vw,170px)/.9 var(--f-osd);color:var(--white);margin:0 0 .2em;letter-spacing:.04em;text-shadow:3px 0 var(--red),-3px 0 #39f}
.nosig p{color:var(--text);font-size:clamp(18px,2vw,24px);font-style:italic;margin:0 auto 28px;max-width:34ch}
/* sr-only helper for semantic H2s */
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* smile meter */
.smile-w{position:fixed;right:max(14px,env(safe-area-inset-right));bottom:calc(14px + env(safe-area-inset-bottom,0px));z-index:85;--p:0;opacity:0;transform:translateY(10px);transition:opacity .4s,transform .4s;display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.smile-w.on{opacity:1;transform:none}
.smile-btn{width:58px;height:58px;border-radius:50%;border:1px solid var(--line);background:rgba(10,10,10,.85);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);padding:4px;cursor:pointer;order:3;transition:transform .2s}
.smile-btn:hover{transform:scale(1.08)}
.smile-btn svg{width:100%;height:100%;overflow:visible}
.smile-btn .ring-bg{fill:none;stroke:#2a2627;stroke-width:3}
.smile-btn .ring{fill:none;stroke:var(--lime);stroke-width:3;stroke-linecap:round;stroke-dasharray:calc(var(--p) * 1) 100;transform:rotate(-90deg);transform-origin:center;transition:stroke-dasharray .6s cubic-bezier(.3,1.3,.5,1)}
.smile-btn .eye-l,.smile-btn .eye-r{fill:var(--lime)}
.smile-btn .mouth{fill:none;stroke:var(--lime);stroke-width:4;stroke-linecap:round;transition:d .6s}
.smile-w[data-p="1"] .mouth,.smile-w[data-p="2"] .mouth{d:path("M18 40 Q32 44 46 40")}
.smile-w[data-p="3"] .mouth,.smile-w[data-p="4"] .mouth,.smile-w[data-p="5"] .mouth{d:path("M17 39 Q32 48 47 39")}
.smile-w[data-p="6"] .mouth,.smile-w[data-p="7"] .mouth{d:path("M16 38 Q32 52 48 38")}
.smile-w[data-p="8"] .mouth,.smile-w[data-p="9"] .mouth{d:path("M15 37 Q32 56 49 37")}
.smile-w.full .mouth{d:path("M14 36 Q32 60 50 36")}
.smile-w.full .smile-btn{box-shadow:0 0 24px var(--lime-glow);border-color:var(--lime)}
.smile-w.pop .smile-btn{animation:smPop .6s cubic-bezier(.3,1.6,.5,1)}
@keyframes smPop{40%{transform:scale(1.25) rotate(-8deg)}}
.smile-toast{order:2;margin:0;font:19px/1 var(--f-osd);letter-spacing:.06em;color:#000;background:var(--lime);border-radius:6px;padding:0;max-width:0;overflow:hidden;white-space:nowrap;transition:max-width .4s,padding .3s}
.smile-w.pop .smile-toast{max-width:80vw;padding:7px 10px}
.smile-p{order:1;width:min(340px,calc(100vw - 28px));background:#0e0d0d;border:1px solid var(--line);border-radius:18px;padding:18px;box-shadow:0 24px 60px rgba(0,0,0,.6)}
.smile-p[hidden]{display:none}
.sp-h{display:flex;justify-content:space-between;align-items:baseline;margin:0 0 6px;font:20px/1 var(--f-osd);letter-spacing:.12em;color:var(--mute)}
.sp-h b{color:var(--lime);font-size:30px;font-weight:400}
.sp-l{margin:0 0 12px;color:var(--text);font-size:14px}
.smile-p ul{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:4px}
.smile-p li{font-size:14px;color:var(--text)}
.smile-p li a{color:var(--text);text-decoration:none;display:block;padding:5px 0}
.smile-p li a:hover{color:var(--lime)}
.smile-p li.ok{color:var(--lime);padding:5px 0}
.smile-p .btn{width:100%}
@media (prefers-reduced-motion:reduce){.smile-w{transition:none}.smile-btn .ring,.smile-btn .mouth{transition:none}}

html,body{overflow-x:clip}#myths{overflow:clip}
/* ===== call sheet ===== */
.callsheet{position:relative;background:#efeadf;color:#111;border-radius:6px;padding:0 clamp(16px,3vw,30px) clamp(18px,3vw,28px);box-shadow:0 30px 70px rgba(0,0,0,.55);transform:rotate(-.4deg);background-image:repeating-linear-gradient(0deg,transparent 0 31px,rgba(0,0,0,.05) 31px 32px)}
.callsheet::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:6px;background:radial-gradient(ellipse at 20% 0%,rgba(255,255,255,.4),transparent 60%),radial-gradient(ellipse at 100% 100%,rgba(120,90,40,.12),transparent 60%)}
.cs-clap{display:flex;height:22px;margin:0 calc(-1*clamp(16px,3vw,30px)) 16px;border-radius:6px 6px 0 0;overflow:hidden;background:#111}
.cs-clap i{flex:1;transform:skewX(-30deg);margin-left:-6px}
.cs-clap i:nth-child(odd){background:#f3f1ec}
.cs-head{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;flex-wrap:wrap;border-bottom:3px double #111;padding-bottom:12px;margin-bottom:14px}
.cs-head b{display:block;font:900 clamp(26px,3.4vw,36px)/1 var(--f-body);letter-spacing:-.01em}
.cs-head span{font:17px/1.1 var(--f-osd);letter-spacing:.12em;color:#555}
.cs-meta{display:grid;gap:4px;text-align:right}
.cs-meta b{display:inline;font:inherit;color:#111;font-size:19px}
.callsheet form{background:none;border:0;border-radius:0;padding:0;display:grid;gap:14px;position:relative;z-index:1}
.cs-sec{font:19px/1 var(--f-osd);letter-spacing:.16em;color:#111;display:flex;align-items:center;gap:10px;margin-top:6px;border-top:1px solid rgba(0,0,0,.18);padding-top:12px}
.cs-n{background:#111;color:var(--lime);padding:3px 7px;border-radius:3px}
.callsheet .fld label{color:#222;font-size:14px;font-weight:700;letter-spacing:.01em}
.callsheet .fld label .opt{color:#6a655c}
.callsheet .fld input,.callsheet .fld select,.callsheet .fld textarea{background:transparent;border:0;border-bottom:2px solid #111;border-radius:0;color:#111;padding:8px 2px;font-family:"Permanent Marker",var(--f-body);font-size:19px;min-height:44px}
.callsheet .fld select{font-family:var(--f-body);font-size:16px;font-weight:600}
.callsheet .fld input::placeholder,.callsheet .fld textarea::placeholder{color:#8d877c;font-family:var(--f-body);font-size:15px}
.callsheet .fld textarea{border:2px solid #111;border-radius:4px;padding:10px}
.callsheet .fld input:focus,.callsheet .fld select:focus,.callsheet .fld textarea:focus{outline:3px solid #111;outline-offset:2px;border-color:#111;background:rgba(196,216,47,.25)}
.callsheet .err{color:#b3170a;font-weight:700}
.callsheet .fld [aria-invalid="true"]{border-color:#b3170a}
.cs-foot{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:6px}
.cs-foot .btn.solid{background:#111;color:var(--lime);border-color:#111}
.cs-sig{font-family:var(--f-script);font-size:28px;color:#333}
.callsheet .form-note,.callsheet p{color:#555;max-width:none}
.callsheet .result{background:#111;color:var(--white);border-radius:6px}
/* ===== remote package builder ===== */
.rb-h{font:800 clamp(22px,2.4vw,30px)/1.15 var(--f-body);color:var(--white);margin:30px 0 22px}
.rb{display:grid;grid-template-columns:200px minmax(0,1fr);gap:clamp(18px,4vw,48px);align-items:center}
.rb-remote{position:relative;justify-self:center;width:180px;padding:26px 18px 30px;border-radius:44px 44px 60px 60px;background:linear-gradient(170deg,#3a3536,#141213 70%);box-shadow:0 30px 60px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.12),inset 0 -10px 20px rgba(0,0,0,.5);transform:rotate(-6deg);transition:transform .4s cubic-bezier(.3,1.4,.5,1)}
.rb-remote:hover{transform:rotate(-2deg) translateY(-4px)}
.rb-ir{width:34px;height:10px;border-radius:6px;margin:0 auto 10px;background:radial-gradient(circle,#7a1010,#2a0606);box-shadow:0 0 0 2px #0a0a0a}
.rb-brand{text-align:center;margin:0 0 14px;font:900 15px/1 var(--f-body);letter-spacing:.3em;color:var(--lime)}
.rb-ch{display:grid;gap:8px}
.rb-b{min-height:48px;border-radius:14px;border:0;background:linear-gradient(#2c2829,#1a1718);color:var(--white);font:22px/1 var(--f-osd);letter-spacing:.1em;box-shadow:0 4px 0 #000,inset 0 1px 0 rgba(255,255,255,.1);cursor:pointer}
.rb-b:active,.rb-c:active,.rb-keys button:active{transform:translateY(3px);box-shadow:0 1px 0 #000}
.rb-lab{text-align:center;font:15px/1 var(--f-osd);letter-spacing:.2em;color:var(--mute);margin:16px 0 8px}
.rb-colors{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.rb-c{display:flex;align-items:center;gap:6px;justify-content:center;min-height:44px;border-radius:12px;border:0;background:#1d1a1b;color:var(--text);font:600 13px/1 var(--f-body);box-shadow:0 4px 0 #000;cursor:pointer}
.rb-c i{width:12px;height:12px;border-radius:50%;background:var(--c);box-shadow:0 0 0 2px rgba(0,0,0,.5)}
.rb-c.red{--c:#e5392b}.rb-c.green{--c:#2fb84a}.rb-c.yellow{--c:#e9c623}.rb-c.blue{--c:#2f7de0}
.rb-c[aria-pressed="true"]{background:var(--c);color:#0a0a0a}
.rb-c[aria-pressed="true"] i{background:#0a0a0a;box-shadow:0 0 10px var(--c)}
.rb-keys{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:16px}
.rb-keys button{min-height:30px;border-radius:50%;border:0;background:#0f0d0e;color:var(--mute);font:17px/1 var(--f-osd);box-shadow:0 3px 0 #000;cursor:pointer}
.rb-keys button:last-child{grid-column:2}
.rb-tv{display:grid;gap:16px}
.rb-scr{position:relative;border-radius:22px;padding:clamp(18px,3vw,28px);background:radial-gradient(ellipse at 50% 40%,#16200a,#060805 75%);border:10px solid #1c191a;box-shadow:0 0 0 2px #000,inset 0 0 60px rgba(196,216,47,.1),0 30px 60px rgba(0,0,0,.5);min-height:300px;overflow:hidden;color:#e9ffd0}
.rb-scr::before{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(0,0,0,.25) 0 1px,transparent 1px 3px)}
.rb-scr.flip{animation:rbFlip .35s steps(4)}
@keyframes rbFlip{0%{filter:brightness(2.4) contrast(2);transform:scaleY(.96)}100%{filter:none;transform:none}}
.rb-osd{display:flex;justify-content:space-between;font:20px/1 var(--f-osd);letter-spacing:.1em;color:#9dff86;text-shadow:0 0 8px rgba(80,255,60,.6)}
.rb .rb-name{margin:18px 0 4px;font:900 clamp(32px,4.4vw,54px)/1 var(--f-body);color:var(--white)}
.rb .rb-name a{color:var(--lime)}
.rb .rb-tag{margin:0 0 14px;color:var(--lime);font-family:var(--f-osd);font-size:21px;letter-spacing:.04em}
.rb-list{margin:0 0 16px;padding:0;list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 18px;font-size:15px;color:var(--text)}
.rb-list li::before{content:"▸ ";color:var(--lime)}
.rb-list li.add{color:var(--white);font-weight:700}
.rb-list li.add::before{content:""}
.rb-total{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;border-top:1px dashed rgba(196,216,47,.35);padding-top:12px}
.rb-total .seg{font:clamp(44px,5vw,64px)/1 var(--f-osd);color:#ff4a3a;text-shadow:0 0 14px rgba(255,60,40,.6);letter-spacing:.04em}
.rb-total small{font:20px/1 var(--f-osd);color:var(--mute)}
.rb-plus{font:22px/1 var(--f-osd);color:var(--lime);margin-left:auto}
.rb-cta{display:flex;gap:12px;flex-wrap:wrap}
.rb .rb-note{margin:0;color:var(--mute);font-size:14px}
@media (max-width:760px){.rb{grid-template-columns:minmax(0,1fr)}.rb-remote{transform:none;width:100%;max-width:340px;border-radius:30px;display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:18px}.rb-remote>*{grid-column:1/-1}.rb-keys{display:none}.rb-list{grid-template-columns:minmax(0,1fr)}.rb-tv{order:-1}.rb-scr{min-height:0}}
@media (prefers-reduced-motion:reduce){.rb-scr.flip{animation:none}.rb-remote,.callsheet{transform:none}}
.fld[hidden]{display:none}
.cs-head b{color:#111}
.smile-rain{position:fixed;inset:0;pointer-events:none;z-index:120;overflow:hidden}
.smile-rain i{position:absolute;bottom:-60px;width:44px;height:44px;color:var(--lime);animation:rainUp 2.4s cubic-bezier(.2,.7,.3,1) forwards}
.smile-rain i svg{width:100%;height:100%}
@keyframes rainUp{to{transform:translateY(-120vh) rotate(var(--r));opacity:.2}}
.smile-psst{margin:10px 0 0;font:16px/1 var(--f-osd);letter-spacing:.08em;color:var(--mute)}
.hero-air{font-size:clamp(16px,1.4vw,19px);margin-bottom:10px;color:var(--mute)}
.price-card{margin-top:22px;display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;padding:22px 24px;border-radius:18px;background:linear-gradient(160deg,#1d1a1b,#121011);border:1px solid rgba(196,216,47,.35);box-shadow:0 0 40px rgba(196,216,47,.06)}
.price-card>div{flex:1 1 320px}
.price-card .pc-lab{display:block;font:18px/1 var(--f-osd);letter-spacing:.14em;color:var(--lime)}
.price-card .pc-amt{display:block;font:clamp(40px,5vw,56px)/1.05 var(--f-osd);color:#ff4a3a;text-shadow:0 0 14px rgba(255,60,40,.5);margin:6px 0}
.blk .price-card p{margin:0;max-width:52ch}
/* ===== channel guide v2: select > click > launch > smile ===== */
.gsteps{position:relative;display:grid;gap:clamp(34px,5vw,60px);padding-left:clamp(0px,3vw,40px)}
.gsteps::before{content:"";position:absolute;left:clamp(0px,1vw,13px);top:20px;bottom:40px;width:2px;background:linear-gradient(var(--lime),rgba(196,216,47,.15));border-radius:2px}
@media (max-width:760px){.gsteps{padding-left:0}.gsteps::before{display:none}}
.gs-head{display:flex;align-items:flex-start;gap:16px;margin-bottom:18px}
.gs-n{font:900 clamp(34px,4vw,52px)/.9 var(--f-body);color:transparent;-webkit-text-stroke:1.5px var(--lime)}
.gs-mark{flex:0 0 auto;width:44px;height:44px;display:grid;place-items:center;border-radius:12px;background:#141213;border:1px solid var(--line);color:var(--lime)}
.gs-mark svg{width:26px;height:26px;fill:var(--lime);overflow:visible}
.gs-head h3{margin:0 0 6px;font:900 clamp(22px,2.4vw,30px)/1.05 var(--f-body);color:var(--white);letter-spacing:.02em}
.gs-head h3 span{font-weight:500;color:var(--mute);letter-spacing:0}
.gs-head p{margin:0;max-width:64ch;color:var(--text)}
.gtrack{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px}
@media (max-width:760px){.gtrack{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:16px;margin-inline:-16px;padding:22px 16px 10px;gap:12px;scrollbar-width:none}.gtrack::-webkit-scrollbar{display:none}.gc{flex:0 0 74%;scroll-snap-align:start}}
.gc{position:relative;display:flex;flex-direction:column;gap:6px;padding:12px 14px 16px;border-radius:18px;background:linear-gradient(170deg,#1b1819,#100e0f);border:1px solid var(--line);color:var(--text);text-decoration:none;
  transition:transform .35s cubic-bezier(.3,1.4,.5,1),border-color .2s,box-shadow .3s;opacity:0;transform:translateX(-40px)}
.gc.on{opacity:1;transform:none;transition:opacity .5s calc(var(--d,0)*90ms),transform .7s cubic-bezier(.2,1.2,.4,1) calc(var(--d,0)*90ms),border-color .2s,box-shadow .3s}
.gc:hover,.gc:focus-visible{border-color:var(--lime);box-shadow:0 18px 40px rgba(0,0,0,.5),0 0 0 1px var(--lime);transform:translateY(-6px)}
.gc-stage{position:relative;display:block;height:132px;margin:-2px -4px 4px;border-radius:12px;background:radial-gradient(ellipse at 50% 60%,#232021,#0d0c0c 75%)}
.gc .il{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.gc-ch{font:17px/1 var(--f-osd);letter-spacing:.12em;color:var(--lime)}
.gc b{font:800 20px/1.1 var(--f-body);color:var(--white)}
.gc-line{font-size:14.5px;line-height:1.4;color:var(--text)}
.gc i{margin-top:auto;padding-top:6px;font:normal 17px/1 var(--f-osd);letter-spacing:.1em;color:var(--mute)}
.gc:hover i{color:var(--lime)}
.gc-smile{grid-column:1/-1;flex-direction:row;align-items:center;gap:20px;flex-wrap:wrap}
.gc-smile .gc-stage{flex:0 0 180px;height:120px;margin:0}
.gc-smile b{font-size:clamp(24px,3vw,34px);flex:1 1 200px}
.gc-smile .gc-line{flex:2 1 280px}
@media (max-width:760px){.gc-smile{flex:0 0 92%;flex-direction:column;align-items:flex-start}}
/* motion: everything runs only once a card is on screen, and pauses for reduced motion */
.gc .il *{transform-box:fill-box}
.gc.on .bars rect{animation:barP 2.4s ease-in-out infinite;transform-origin:bottom}
.gc.on .bars rect:nth-child(2){animation-delay:.3s}.gc.on .bars rect:nth-child(3){animation-delay:.6s}.gc.on .bars rect:nth-child(4){animation-delay:.9s}.gc.on .bars rect:nth-child(5){animation-delay:1.2s}
@keyframes barP{50%{transform:scaleY(.82)}}
.gc.on .insp{animation:insp 3.6s ease-in-out infinite}
@keyframes insp{0%,100%{transform:translateX(0)}50%{transform:translateX(-78px)}}
.gc.on .lens{animation:lens 1.2s ease-in-out infinite;transform-origin:top right}
@keyframes lens{50%{transform:rotate(-8deg)}}
.gc.on .bulb{animation:bulb 3s ease-in-out infinite}
@keyframes bulb{0%{transform:translateY(34px) scale(.6);opacity:0}30%{opacity:1}55%,85%{transform:translateY(0) scale(1);opacity:1}100%{transform:translateY(-6px);opacity:0}}
.gc.on .glass{animation:glass 3s ease-in-out infinite}
@keyframes glass{0%,45%{fill:#2b2728}55%,90%{fill:#e9ff6a;filter:drop-shadow(0 0 8px #c4d82f)}}
.gc .rays{opacity:0}.gc.on .rays{animation:rays 3s ease-in-out infinite}
@keyframes rays{0%,50%{opacity:0}58%,88%{opacity:1}100%{opacity:0}}
.gc.on .brain{animation:brain 3s ease-in-out infinite;transform-origin:center}
@keyframes brain{45%{transform:scale(1)}52%{transform:scale(1.05)}60%{transform:scale(1)}}
.gc .sb>g{opacity:0}
.gc.on .sb>g{animation:frame 4.8s steps(1) infinite}
.gc.on .sb .f2{animation-delay:.8s}.gc.on .sb .f3{animation-delay:1.6s}.gc.on .sb .f4{animation-delay:2.4s}.gc.on .sb .f5{animation-delay:3.2s}.gc.on .sb .f6{animation-delay:4s}
@keyframes frame{0%{opacity:0}2%,92%{opacity:1}100%{opacity:0}}
.gc.on .hl{animation:hl 4.8s steps(1) infinite}
@keyframes hl{0%{transform:translate(0,0)}16.6%{transform:translate(43px,0)}33.3%{transform:translate(86px,0)}50%{transform:translate(0,42px)}66.6%{transform:translate(43px,42px)}83.3%{transform:translate(86px,42px)}}
.gc .stick{transform-origin:2px 14px;transform:rotate(-24deg)}
.gc.on .stick{animation:clap 2.2s cubic-bezier(.6,0,.3,1) infinite}
@keyframes clap{0%,40%{transform:rotate(-24deg)}50%,80%{transform:rotate(0)}100%{transform:rotate(-24deg)}}
.gc .act{opacity:.15}.gc.on .act{animation:act 2.2s steps(1) infinite}
@keyframes act{0%,49%{opacity:.15}50%,80%{opacity:1}}
.gc .burst{opacity:0;transform-origin:center}
.gc.on .burst{animation:burst 2.6s ease-out infinite}
@keyframes burst{0%,60%{opacity:0;transform:scale(.2)}64%{opacity:.95;transform:scale(1)}80%{opacity:0;transform:scale(1.6)}}
.gc.on .flash{animation:fl 2.6s steps(1) infinite}
@keyframes fl{0%,62%{fill:#f3f1ec}63%,70%{fill:#fff;filter:drop-shadow(0 0 10px #fff)}}
.gc .ink{stroke-dasharray:330;stroke-dashoffset:330}
.gc.on .ink{animation:ink 4s ease-in-out infinite}
@keyframes ink{0%{stroke-dashoffset:330}60%,90%{stroke-dashoffset:0}100%{stroke-dashoffset:0;opacity:0}}
.gc.on .pen{animation:pen 4s ease-in-out infinite}
@keyframes pen{0%{transform:translate(-40px,0)}15%{transform:translate(-10px,-20px)}30%{transform:translate(-50px,-10px)}45%{transform:translate(-20px,8px)}60%,100%{transform:translate(0,0)}}
.gc .poster{transform-origin:top;transform:scaleY(0)}
.gc.on .poster{animation:roll 3.4s cubic-bezier(.5,0,.3,1) infinite}
@keyframes roll{0%{transform:scaleY(0)}45%,85%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}
.gc .sw{opacity:0}
.gc.on .sw{animation:tumble 3.6s cubic-bezier(.3,1.4,.5,1) infinite}
.gc.on .s2{animation-delay:.35s}.gc.on .s3{animation-delay:.7s}
@keyframes tumble{0%{opacity:0;transform:translateY(-70px) rotate(-40deg)}22%,80%{opacity:1;transform:none}100%{opacity:0;transform:translateY(10px)}}
.gc.on .feedroll{animation:froll 4s cubic-bezier(.6,0,.3,1) infinite}
@keyframes froll{0%,20%{transform:translateY(0)}35%,55%{transform:translateY(-56px)}70%,100%{transform:translateY(-112px)}}
.emo{position:absolute;left:50%;top:18px;pointer-events:none}
.emo i{position:absolute;left:0;top:0;font-style:normal;font-size:20px;opacity:0}
.gc.on .emo i{animation:emo 2.8s ease-out infinite}
.gc.on .emo i:nth-child(1){--x:-46px}.gc.on .emo i:nth-child(2){--x:30px;animation-delay:.5s}.gc.on .emo i:nth-child(3){--x:-20px;animation-delay:1s}.gc.on .emo i:nth-child(4){--x:44px;animation-delay:1.5s}.gc.on .emo i:nth-child(5){--x:4px;animation-delay:2s}
@keyframes emo{0%{opacity:0;transform:translate(-50%,40px) scale(.4)}20%{opacity:1}100%{opacity:0;transform:translate(calc(-50% + var(--x)),-40px) scale(1.2) rotate(12deg)}}
.gc .pin{opacity:0}
.gc.on .pin{animation:pinL 3s cubic-bezier(.3,1.3,.5,1) infinite}
.gc.on .pr{animation-name:pinR;animation-delay:.25s}.gc.on .pt{animation-name:pinT;animation-delay:.5s}
@keyframes pinL{0%{opacity:0;transform:translate(-90px,-30px)}30%,85%{opacity:1;transform:translate(-14px,0)}100%{opacity:0}}
@keyframes pinR{0%{opacity:0;transform:translate(90px,-30px)}30%,85%{opacity:1;transform:translate(14px,0)}100%{opacity:0}}
@keyframes pinT{0%{opacity:0;transform:translateY(-60px)}30%,85%{opacity:1;transform:translateY(-4px)}100%{opacity:0}}
.gc.on .ring{animation:ring 3s ease-out infinite;transform-origin:center}
@keyframes ring{0%,30%{transform:scale(1);opacity:0}35%{opacity:1}70%{transform:scale(3);opacity:0}}
.gc .lid{transform-origin:bottom;transform:scaleY(.06)}
.gc.on .lid{animation:lid 5s cubic-bezier(.4,0,.2,1) infinite}
@keyframes lid{0%{transform:scaleY(.06)}18%,92%{transform:scaleY(1)}100%{transform:scaleY(.06)}}
.gc .code text{opacity:0}
.gc.on .code text{animation:code 5s steps(1) infinite}
.gc.on .code .c2{animation-delay:.5s}.gc.on .code .c3{animation-delay:1s}.gc.on .code .c4{animation-delay:1.5s}
@keyframes code{0%,20%{opacity:0}21%,88%{opacity:1}89%{opacity:0}}
.gc .box{opacity:0}
.gc.on .box{animation:drop 3.2s cubic-bezier(.5,0,.6,1.4) infinite}
.gc.on .b2{animation-delay:.3s}.gc.on .b3{animation-delay:.6s}
@keyframes drop{0%{opacity:0;transform:translateY(-50px)}15%{opacity:1}40%,100%{opacity:1;transform:translateY(40px)}}
.gc .plus{opacity:0;transform-origin:center}
.gc.on .plus{animation:plus 3.2s ease-out infinite}
@keyframes plus{0%,45%{opacity:0;transform:scale(.4)}55%,80%{opacity:1;transform:scale(1)}100%{opacity:0;transform:translateY(-10px)}}
.gc .mouth{stroke-dasharray:80;stroke-dashoffset:80}
.gc.on .mouth{animation:mouth 3s ease-in-out infinite}
@keyframes mouth{0%{stroke-dashoffset:80}35%,90%{stroke-dashoffset:0}}
.gc.on .eyes ellipse{animation:blinkE 3s steps(1) infinite;transform-origin:center}
@keyframes blinkE{0%,92%{transform:none}93%,97%{transform:scaleY(.1)}}
.gc.on .conf>*{animation:conf 3s ease-in-out infinite}
@keyframes conf{50%{transform:translateY(-8px) rotate(30deg)}}
.gc:hover .il *{animation-duration:inherit}
@media (prefers-reduced-motion:reduce){.gc{opacity:1;transform:none}.gc .il *,.gc .emo i{animation:none!important}.gc .poster,.gc .lid{transform:none}.gc .ink,.gc .mouth{stroke-dashoffset:0}.gc .sb>g,.gc .sw,.gc .pin,.gc .box,.gc .code text{opacity:1}.gc .stick{transform:none}}
.hero h1{font-size:clamp(46px,6.2vw,92px);line-height:.95;letter-spacing:-.02em;margin-bottom:.25em}
.hero-sub{font-size:clamp(19px,1.6vw,23px);line-height:1.35;color:var(--white);font-weight:600;max-width:34ch;margin:0 0 14px}
.hero-lede{font-size:clamp(15px,1.1vw,17px)!important;color:var(--mute)!important;max-width:56ch}
.brand-wall{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:900px){.brand-wall{grid-template-columns:repeat(2,minmax(0,1fr))}}
.brand-wall .wm-ue{font:600 22px/1 var(--f-body);letter-spacing:-.01em}
.brand-wall .wm-jlg{font:900 italic 30px/1 var(--f-body);letter-spacing:.04em}
.ft-grid{grid-template-columns:repeat(6,minmax(0,1fr))}
@media (max-width:1100px){.ft-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:600px){.ft-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.verse-inf{margin:6px 0 0;text-align:center;font-family:var(--f-script);font-size:clamp(22px,2.4vw,30px);color:var(--lime)}
.verse-inf cite{display:block;font:normal 16px/1.4 var(--f-osd);letter-spacing:.14em;color:var(--mute);text-transform:uppercase}
/* ===== hidden verse eggs ===== */
.has-egg{position:relative}
.egg{position:absolute;z-index:4;width:0;height:0}
.egg-obj{position:absolute;left:0;top:0;transform:translate(-50%,-50%) rotate(var(--rot,-12deg));border:0;padding:6px;background:none;cursor:pointer;opacity:.55;filter:saturate(.6) drop-shadow(0 8px 14px rgba(0,0,0,.55));transition:opacity .3s,transform .4s cubic-bezier(.3,1.5,.5,1),filter .3s;animation:eggBob 5s ease-in-out infinite}
.egg-obj svg{display:block;width:var(--w,64px);height:auto}
.egg-obj:hover,.egg-obj:focus-visible{opacity:1;filter:none;transform:translate(-50%,-50%) rotate(0) scale(1.15)}
@keyframes eggBob{50%{margin-top:-6px}}
.egg-paper{--w:56px}.egg-cassette{--w:86px;--rot:8deg}.egg-film{--w:48px;--rot:14deg}.egg-vhs{--w:96px;--rot:-6deg}.egg-polaroid{--w:56px;--rot:10deg}.egg-pager{--w:78px;--rot:-8deg}
.egg-card{position:absolute;right:-20px;top:30px;width:min(340px,82vw);margin:0;padding:22px 22px 18px;background:#f1ebdd;color:#1a1718;border-radius:4px;box-shadow:0 30px 60px rgba(0,0,0,.6);transform-origin:top right;z-index:5}
.egg-card blockquote{margin:0 0 10px;font:400 clamp(20px,2vw,24px)/1.3 var(--f-script);font-family:"Pinyon Script",cursive;font-size:clamp(26px,2.6vw,32px);line-height:1.15}
.egg-card figcaption{font:17px/1 var(--f-osd);letter-spacing:.14em;text-transform:uppercase;color:#6a655c}
.egg-card figcaption::before{content:"— "}
.egg-x{position:absolute;right:6px;top:4px;width:36px;height:36px;border:0;background:none;font-size:24px;line-height:1;color:#6a655c;cursor:pointer}
.egg.open .egg-obj{opacity:0;pointer-events:none}
/* paper ball: the sheet un-crumples */
.egg-paper .egg-card{background:#ede6d6 repeating-linear-gradient(0deg,transparent 0 27px,rgba(80,120,200,.18) 27px 28px);clip-path:polygon(2% 4%,30% 0,58% 3%,100% 1%,97% 40%,100% 74%,96% 100%,60% 97%,26% 100%,0 95%,3% 60%,0 30%)}
.egg-paper.open .egg-card{animation:uncrumple .9s cubic-bezier(.3,1.3,.5,1) both}
@keyframes uncrumple{0%{transform:scale(.12) rotate(-30deg);filter:contrast(1.6) brightness(.8);clip-path:polygon(40% 30%,55% 20%,70% 35%,60% 45%,75% 60%,55% 70%,45% 80%,30% 65%,35% 50%,25% 40%,35% 35%,30% 25%)}60%{filter:none}100%{transform:none}}
/* cassette: J-card unfolds from the top */
.egg-cassette .egg-card{background:#c4d82f;border-top:10px solid #1a1718}
.egg-cassette.open .egg-card{animation:jcard .8s cubic-bezier(.3,1.2,.5,1) both;transform-origin:top center}
@keyframes jcard{0%{transform:perspective(600px) rotateX(-95deg);opacity:0}100%{transform:none;opacity:1}}
/* film canister: a strip slides out */
.egg-film .egg-card{background:#1a1718;color:#f3f1ec;border-block:14px solid #1a1718;background-image:radial-gradient(circle,#0b0a0a 3px,transparent 3.5px),radial-gradient(circle,#0b0a0a 3px,transparent 3.5px);background-size:16px 14px;background-position:0 -7px,0 calc(100% + 7px);background-repeat:repeat-x;padding-block:26px}
.egg-film .egg-card figcaption{color:#c4d82f}.egg-film .egg-x{color:#f3f1ec}
.egg-film.open .egg-card{animation:strip .7s cubic-bezier(.2,1.1,.4,1) both;transform-origin:top right}
@keyframes strip{0%{clip-path:inset(0 0 0 100%)}100%{clip-path:inset(0)}}
/* VHS: the label ejects */
.egg-vhs .egg-card{background:#f3f1ec;border-left:12px solid #ff4636}
.egg-vhs .egg-card blockquote{font-family:"Permanent Marker",cursive;font-size:21px;line-height:1.3}
.egg-vhs.open .egg-card{animation:eject .6s cubic-bezier(.2,1.4,.4,1) both}
@keyframes eject{0%{transform:translateY(-40px) scaleY(.2);opacity:0}100%{transform:none;opacity:1}}
/* Polaroid: develops */
.egg-polaroid .egg-card{background:#f7f5ef;padding:14px 14px 22px;border-radius:2px}
.egg-polaroid .egg-card blockquote{background:#1a1718;color:#c4d82f;padding:26px 18px;min-height:150px;display:grid;place-items:center;text-align:center;margin-bottom:14px}
.egg-polaroid .egg-card figcaption{text-align:center;font-family:"Permanent Marker",cursive;letter-spacing:.02em;text-transform:none;font-size:17px;color:#3a3536}
.egg-polaroid .egg-card figcaption::before{content:""}
.egg-polaroid.open .egg-card{animation:popin .5s cubic-bezier(.3,1.4,.5,1) both}
.egg-polaroid.open .egg-card blockquote{animation:develop 2.6s ease-out both}
@keyframes popin{0%{transform:translateY(30px) rotate(8deg);opacity:0}100%{transform:rotate(-2deg);opacity:1}}
@keyframes develop{0%{filter:brightness(4) blur(6px) sepia(1)}100%{filter:none}}
/* pager: buzz then the message scrolls in */
.egg-pager .egg-card{background:#0b0e05;color:#c4d82f;border:10px solid #2b2728;border-radius:14px}
.egg-pager .egg-card blockquote{font:22px/1.25 var(--f-osd);letter-spacing:.04em}
.egg-pager .egg-card figcaption{color:#7c8a2a}.egg-pager .egg-x{color:#c4d82f}
.egg-pager.buzz .egg-obj{animation:buzz .08s linear 8}
@keyframes buzz{0%{margin-left:-3px}50%{margin-left:3px}}
.egg-pager.open .egg-card{animation:popin .4s ease-out both}
@media (max-width:760px){.egg-card{position:fixed;left:50%;right:auto;top:auto;bottom:90px;transform:translateX(-50%);transform-origin:bottom center}.egg.open .egg-card{animation-name:popin}}
@media (prefers-reduced-motion:reduce){.egg-obj{animation:none}.egg.open .egg-card,.egg.open .egg-card blockquote{animation:none!important}}
.hero h1 .script-w{font-family:var(--f-script);font-weight:400;color:var(--lime);letter-spacing:0;font-size:1.08em;display:inline-block;transform:translateY(.06em)}
.gs-head>div{min-width:0}.gs-head h3{overflow-wrap:anywhere}
.gsteps{grid-template-columns:minmax(0,1fr)}.gstep{min-width:0}
@media (max-width:760px){.egg-card{left:16px;right:16px;width:auto;transform:none}}
@media (max-width:600px){.vcr{display:none}.smile-btn{width:46px;height:46px}.smile-w.pop .smile-toast{max-width:calc(100vw - 96px);text-overflow:ellipsis;font-size:16px}}
.gl-row.gl-site{grid-template-columns:minmax(0,260px) minmax(0,1fr)}
@media (max-width:700px){.gl-row.gl-site{grid-template-columns:minmax(0,1fr);gap:8px}.gl-row.gl-site span{grid-column:auto}}
.hero h1 .script-w{display:block;width:max-content;position:relative;z-index:1;font-size:1.16em;line-height:1;margin:-.2em 0 0 .45em;transform:rotate(-3deg);transform-origin:left center;text-shadow:0 .04em .12em rgba(0,0,0,.75)}
/* channel jump: CRT cut (680ms) */
.tjx{position:fixed;inset:0;z-index:300;pointer-events:none;visibility:hidden}
.tjx-scr{position:absolute;inset:0;background:#030303;display:grid;place-content:center;justify-items:center;gap:16px;clip-path:inset(50% 0 50% 0)}
.tjx-scr::before{content:"";position:absolute;inset:0;background:url(../media/noise.png);opacity:.06;mix-blend-mode:screen}
.tjx-scr::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(0,0,0,.35) 0 1px,transparent 1px 3px),radial-gradient(ellipse at center,transparent 50%,rgba(0,0,0,.8));pointer-events:none}
.tjx-scr img{position:relative;width:min(300px,64vw);height:auto;filter:drop-shadow(0 0 22px rgba(196,216,47,.55)) drop-shadow(0 0 3px rgba(220,255,140,.9)) brightness(1.15)}
.tjx-lbl{position:relative;font:17px/1 var(--f-osd);letter-spacing:.24em;color:#e4f27a;text-shadow:0 0 10px rgba(196,216,47,.8)}
.tjx-line{position:absolute;left:0;right:0;top:50%;height:2px;margin-top:-1px;background:#f4ffd0;box-shadow:0 0 18px 4px rgba(220,255,140,.75),0 0 60px 10px rgba(196,216,47,.35);transform:scaleX(0);opacity:0}
.tjx.off{visibility:visible;pointer-events:auto}
.tjx.off .tjx-line{animation:tjxLine .16s ease-out both}
.tjx.off .tjx-scr{animation:tjxOpen .16s cubic-bezier(.2,.9,.3,1) .1s both}
.tjx.off.on .tjx-scr{animation:tjxClose .26s cubic-bezier(.7,0,.8,.3) both}
.tjx.off.on .tjx-line{animation:tjxLineOut .3s ease-out .18s both}
@keyframes tjxLine{0%{transform:scaleX(0);opacity:1}70%{transform:scaleX(1);opacity:1}100%{transform:scaleX(1);opacity:0}}
@keyframes tjxOpen{from{clip-path:inset(50% 0 50% 0)}to{clip-path:inset(0)}}
@keyframes tjxClose{from{clip-path:inset(0);filter:brightness(1)}70%{filter:brightness(2.2)}to{clip-path:inset(50% 0 50% 0);filter:brightness(3)}}
@keyframes tjxLineOut{0%{transform:scaleX(1);opacity:0}15%{opacity:1}100%{transform:scaleX(0);opacity:0}}
.hero h1 .script-w{margin-left:.57em}
.vcr{display:none!important}
@media (max-width:600px){.smile-btn{width:40px;height:40px;opacity:.6}.smile-btn:hover,.smile-btn:focus-visible,.smile-w.pop .smile-btn{opacity:1}}
.gc-still{display:block;position:relative;aspect-ratio:16/10;margin:-4px -4px 14px;border-radius:10px;overflow:hidden;background:#0b0a0a;box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}
.gc-still img{width:100%;height:100%;object-fit:cover;filter:saturate(.9) contrast(1.05);transition:transform .5s,filter .3s}
.gc-still::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(0,0,0,.22) 0 1px,transparent 1px 3px),radial-gradient(ellipse at center,transparent 55%,rgba(0,0,0,.55));pointer-events:none;border-radius:10px}
.gc:hover .gc-still img{transform:scale(1.05);filter:saturate(1.05) contrast(1.1)}
.smile-w{transition:transform .3s,opacity .3s}.smile-w.tuck{transform:translateY(120%);opacity:0;pointer-events:none}
.tile .tl-t{padding-top:48px;background:linear-gradient(transparent,rgba(0,0,0,.6) 35%,rgba(0,0,0,.88))}.tile .tl-t b{text-shadow:0 1px 10px rgba(0,0,0,.8)}
.ft-logo .wm img{width:200px}.ft-logo .sub{width:94px;margin-top:5px}
.ft-logo{margin-left:-8px}
/* ===== proposal-voice sections ===== */
.script-lab{font-family:var(--f-script);color:var(--lime);font-size:clamp(34px,4.4vw,56px);line-height:1;margin:0 0 6px;text-transform:none}
.proc .proc-h{font-family:var(--f-body);font-weight:800;font-size:clamp(28px,3.6vw,48px);line-height:1.05;letter-spacing:-.01em;max-width:18ch;margin:0 0 44px}
.pgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px}
.pc{border-top:1px solid rgba(255,255,255,.28);padding-top:22px;min-width:0}
.pm{display:flex;align-items:center;height:46px;color:var(--lime);margin-bottom:16px}
.pm svg{height:100%;width:auto;fill:currentColor}
.pm-sm svg{height:22px}
.pm-face{gap:4px}.pm-face i{display:block;height:100%}.pm-face .f-c svg,.pm-face .f-s svg{height:30px}.pm-face .f-m svg{height:14px}
.pc-lab{display:block;font-family:var(--f-osd);font-size:17px;letter-spacing:.08em;color:#b9b6ae;margin-bottom:10px}
.pc h3{font-family:var(--f-body);font-weight:800;font-size:clamp(20px,1.8vw,26px);line-height:1.05;text-transform:uppercase;margin:0 0 12px;letter-spacing:.01em}
.pc p{font-size:15px;line-height:1.55;color:#cfccc4;margin:0 0 16px}
.pc-svc{list-style:none;margin:0;padding:0;border-top:1px dashed rgba(255,255,255,.14)}
.pc-svc li{border-bottom:1px dashed rgba(255,255,255,.14)}
.pc-svc a{display:flex;justify-content:space-between;padding:9px 0;font-size:14px;color:#eee;text-decoration:none}
.pc-svc a i{font-style:normal;color:var(--lime);transition:transform .2s}.pc-svc a:hover{color:var(--lime)}.pc-svc a:hover i{transform:translateX(4px)}
.ptime{position:relative;display:grid;grid-template-columns:repeat(4,1fr);margin:40px 0 34px;height:10px}
.ptime:before{content:"";position:absolute;left:0;right:0;top:4px;border-top:1px dotted rgba(255,255,255,.4)}
.ptime i{position:relative;width:9px;height:9px;border-radius:50%;background:var(--lime);box-shadow:0 0 10px var(--lime-glow)}
.ptime i:last-child{position:absolute;right:0;top:0}
.pclose{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 18px}.pclose p{margin:0;font-size:18px;color:#e9e6de}.pclose .script-lab{font-size:clamp(30px,3.4vw,44px)}
.philo-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:56px;align-items:start}
.ph-lines{margin:14px 0 0;font-family:var(--f-body);font-weight:800;font-size:clamp(30px,4vw,56px);line-height:1.08;letter-spacing:-.01em}
.ph-lines span{display:flex;align-items:center;gap:14px}
.ph-lines b{font-weight:800}.ph-lines em{font-style:normal;color:var(--lime)}
.ph-lines i{display:inline-flex;height:.62em;color:var(--lime)}.ph-lines i svg{height:100%;width:auto;fill:currentColor}
.ph-lines span:last-child i{height:.3em}
.ph-body p{font-size:18px;line-height:1.6;color:#d6d3cb;margin:0 0 16px;max-width:56ch}
.ph-body p.ph-eoa{font-family:var(--f-script);font-size:clamp(34px,3.6vw,48px);color:#fff;line-height:1.1;margin:8px 0 0}
.ph-eoa em{color:var(--lime);font-style:normal}
.why-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px}
.why-h{font-family:var(--f-body);font-weight:800;font-size:clamp(36px,4.4vw,60px);margin:0 0 18px;line-height:1}
.why-p,.why-p2{font-size:18px;line-height:1.6;color:#d6d3cb;margin:0 0 22px;max-width:52ch}
.why-pillars{list-style:none;padding:0;margin:0}
.why-pillars li{font-family:var(--f-body);font-weight:800;color:var(--lime);font-size:clamp(18px,1.7vw,24px);letter-spacing:.02em;padding:10px 0;border-top:1px solid rgba(255,255,255,.14)}
.why-big{font-family:var(--f-body);font-weight:800;font-size:clamp(36px,4.6vw,64px);line-height:.95;margin:4px 0 20px;letter-spacing:-.01em}
.rbu-big{margin:56px 0 0;font-family:var(--f-body);font-weight:800;font-size:clamp(48px,10.5vw,160px);line-height:1;color:#3a3739;letter-spacing:-.03em;display:flex;flex-wrap:wrap;align-items:center;gap:0 .18em;white-space:nowrap}
.rbu-big i{display:inline-flex;height:.55em;color:var(--lime)}.rbu-big i svg{height:100%;width:auto;fill:currentColor}.rbu-big i.rb-sm{height:.24em}
.ao-lede{font-family:var(--f-body);font-weight:800;font-size:clamp(24px,2.8vw,38px);line-height:1.15;max-width:24ch;margin:6px 0 26px}
.ao-list{list-style:none;padding:0;margin:0;columns:2;column-gap:56px}
.ao-list li{break-inside:avoid;font-family:var(--f-body);font-weight:800;font-size:clamp(17px,1.6vw,22px);letter-spacing:.02em;padding:12px 0;border-top:1px solid rgba(255,255,255,.14)}
.ao-list li:first-child{color:var(--lime)}.ao-list li span{font-weight:400;font-family:var(--f-script);font-size:1.4em;letter-spacing:0;text-transform:none}
@media (max-width:900px){.pgrid{grid-template-columns:repeat(2,minmax(0,1fr))}.ptime{display:none}.philo-grid,.why-grid{grid-template-columns:minmax(0,1fr);gap:28px}}
@media (max-width:560px){.pgrid{grid-template-columns:minmax(0,1fr)}.ao-list{columns:1}.rbu-big{white-space:normal}.ph-lines{font-size:34px}}
/* channel guide rail: right-to-left */
.rail{padding-top:0}.rail .h2{margin-bottom:22px}
.rail-vp{overflow:hidden;-webkit-mask:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);mask:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
.rail-tr{display:flex;gap:18px;width:max-content;animation:railgo 70s linear infinite;padding:6px 0 14px}
.rail-dup{display:contents}
.rail-vp:hover .rail-tr,.rail-vp:focus-within .rail-tr{animation-play-state:paused}
@keyframes railgo{to{transform:translateX(calc(-50% - 9px))}}
.rc{position:relative;flex:0 0 270px;display:flex;flex-direction:column;background:#141213;border:1px solid #2e2a2b;border-radius:14px;overflow:hidden;text-decoration:none;color:#eee;transition:transform .3s,border-color .3s}
.rc:hover,.rc:focus-visible{transform:translateY(-6px);border-color:var(--lime)}
.rc-still{display:block;aspect-ratio:16/10;overflow:hidden;position:relative}
.rc-still:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(0,0,0,.18) 0 1px,transparent 1px 3px),radial-gradient(ellipse at center,transparent 50%,rgba(0,0,0,.55))}
.rc-still img{width:100%;height:100%;object-fit:cover;animation:kb 14s ease-in-out infinite alternate;filter:saturate(1.05) contrast(1.05)}
.rc:nth-child(odd) .rc-still img{animation-delay:-7s}
@keyframes kb{from{transform:scale(1.02)}to{transform:scale(1.14) translate(-2%,-1%)}}
.rc-mark{position:absolute;top:12px;right:12px;height:26px;display:flex;align-items:center;color:var(--lime);filter:drop-shadow(0 2px 6px rgba(0,0,0,.7));animation:bob 3.2s ease-in-out infinite}
.rc-mark svg{height:100%;width:auto;fill:currentColor}.rc-par{height:12px;top:20px}
.rc-shutter svg{animation:spin 9s linear infinite}
@keyframes bob{50%{transform:translateY(-4px)}}@keyframes spin{to{transform:rotate(360deg)}}
.rc-ch{font-family:var(--f-osd);font-size:15px;letter-spacing:.06em;color:#9c988f;padding:14px 16px 4px}
.rc b{font-family:var(--f-body);font-weight:800;font-size:21px;padding:0 16px;line-height:1.1}
.rc-line{font-size:14px;line-height:1.45;color:#c9c6be;padding:6px 16px 0;flex:1}
.rc i{font-style:normal;font-family:var(--f-osd);color:var(--lime);font-size:17px;padding:12px 16px 14px}
@media (prefers-reduced-motion:reduce){.rail-tr{animation:none}.rail-vp{overflow-x:auto}.rail-dup{display:none}.rc-still img,.rc-mark,.rc-shutter svg{animation:none}}
@media (max-width:560px){.rc{flex-basis:230px}.rail-tr{animation-duration:55s}}
/* philosophy lines fix */
.ph-lines span{display:block}.ph-lines i{vertical-align:middle;margin-left:.2em}
.pm{height:30px;margin-bottom:14px}.pm-sm svg{height:14px}.pm-face .f-c svg,.pm-face .f-s svg{height:22px}.pm-face .f-m svg{height:10px}
.pc h3{font-size:clamp(24px,2.3vw,34px)}
@media (max-width:900px){.pclose{margin-top:34px}}
.ph-lines span{margin-bottom:.12em}.ph-lines span:last-child{margin-top:.25em}
/* r7 QA fixes */
section.proc .pm{height:28px!important;margin-bottom:14px}
section.proc .pm svg{height:100%!important;width:auto!important;max-width:none}
section.proc .pm-par svg{height:100%!important}
section.proc .pm-face .f-c svg,section.proc .pm-face .f-s svg{height:22px!important}section.proc .pm-face .f-m svg{height:10px!important}
section.proc .pc h3{font-family:var(--f-body);font-weight:800;font-size:clamp(26px,2.4vw,36px)!important;line-height:1.02;letter-spacing:.005em;text-transform:uppercase;margin:0 0 12px}
section.proc .proc-h{opacity:1!important;transform:none!important}
.philo-grid>div:first-child{position:sticky;top:110px}
.nw{white-space:nowrap}
.ao-list{columns:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:56px}
.ao-list li{line-height:1.2}.ao-list .ao-sr{font-family:var(--f-script);font-weight:400;font-size:1.35em;line-height:0;letter-spacing:0}
.ao-list li span{font-size:inherit;font-family:inherit}.ao-list li>.nw{font-weight:400}
.ao-list li:nth-child(n){grid-row:auto}
.smile-toast:empty{display:none!important}
.rbu-big{font-size:clamp(44px,9.2vw,140px);flex-wrap:nowrap}
@media (max-width:900px){.philo-grid>div:first-child{position:static}}
@media (max-width:560px){.ao-list{grid-template-columns:minmax(0,1fr)}.rbu-big{flex-wrap:wrap;font-size:clamp(40px,15vw,72px)}}
.philo-grid>div:first-child{position:static}.philo-grid{align-items:end}.ph-people{justify-content:center;margin-top:44px}.ph-people .pol{width:min(19%,210px)}@media (max-width:700px){.ph-people .pol{width:min(44%,190px)}}
section.proc .pm-par{height:32px!important}section.proc .pm-par path{stroke-width:15}@media (max-width:700px){section.philo{padding-bottom:28px}.ph-people{margin-bottom:0}}
/* 04 mark: a face (cursor + shutter eyes, smile mouth) */
section.proc .pm.pm-face{display:grid!important;grid-template-columns:auto auto;grid-template-rows:auto auto;justify-content:start;align-items:center;column-gap:7px;row-gap:3px;height:auto!important;width:max-content}
section.proc .pm-face i{height:auto;display:flex;align-items:center;justify-content:center}
section.proc .pm-face .f-c svg{height:20px!important}section.proc .pm-face .f-s svg{height:19px!important}
section.proc .pm-face .f-m{grid-column:1 / span 2}section.proc .pm-face .f-m svg{height:11px!important;width:auto}
section.proc .pm,section.proc .pm.pm-face{height:42px!important;align-content:center}
section.proc .pm-cur svg,section.proc .pm-sh svg{height:28px!important}section.proc .pm-par svg{height:32px!important}
section.proc .pm-face .f-m{justify-self:stretch}section.proc .pm-face .f-m svg{width:100%!important;height:12px!important}
/* logo flip fills the stage before the phone assembles */
.stage{position:relative}
.feed-logo{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;z-index:2;transition:opacity .15s linear}
.feed-logo img{width:min(78%,340px);height:auto;filter:drop-shadow(0 0 22px rgba(196,216,47,.35))}
@media (prefers-reduced-motion:reduce){.feed-logo{display:none}}
.tiles{grid-template-columns:repeat(4,minmax(0,1fr))!important}@media (max-width:900px){.tiles{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
.feed{height:calc(100vh + var(--n,5) * 70vh + 60vh)}.rail{padding-bottom:20px!important}.rail-vp{padding-bottom:0}
.feed{height:calc(100vh + var(--n,5) * 55vh + 50vh)}
.why-pillars li:last-child{border-bottom:1px solid rgba(255,255,255,.14)}.rbu-big{margin-top:84px}
@media (max-width:900px){.guide{margin-inline:0!important;padding-inline:0!important;scroll-padding-inline:0!important}}
@media (min-width:901px){.guide{flex-wrap:nowrap;gap:6px}.guide button{font-size:16px;padding:2px 9px;white-space:nowrap}}
/* photoreal objects float over the card stills */
.rc-still img{filter:saturate(.85) contrast(1.05) brightness(.55)}
.rc-obj{position:absolute;left:0;right:0;top:-18px;height:calc(270px * 10 / 16 + 30px);display:grid;place-items:center;pointer-events:none;z-index:2;perspective:600px}
.rc-obj img{width:68%;height:auto;max-height:100%;object-fit:contain;filter:drop-shadow(0 18px 18px rgba(0,0,0,.65));animation:objfloat 5.5s ease-in-out infinite;transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .25s ease-out,filter .3s}
.rc:nth-child(3n+1) .rc-obj img{animation-duration:6.2s;animation-delay:-2s}.rc:nth-child(3n+2) .rc-obj img{animation-duration:4.9s;animation-delay:-1s}
@keyframes objfloat{0%,100%{translate:0 0;rotate:-2deg}50%{translate:0 -9px;rotate:2deg}}
.rc:hover .rc-obj img,.rc:focus-visible .rc-obj img{scale:1.08;filter:drop-shadow(0 26px 22px rgba(0,0,0,.7))}
.rc-o-bulb img,.rc-o-brain img{animation-name:objfloat,bulbglow}
.rc-o-bulb img{animation-duration:5.5s,3.4s}.rc-o-brain img{animation-duration:6s,3.4s}
@keyframes bulbglow{0%,100%{filter:drop-shadow(0 18px 18px rgba(0,0,0,.65)) drop-shadow(0 0 0 rgba(255,190,90,0))}45%{filter:drop-shadow(0 18px 18px rgba(0,0,0,.65)) drop-shadow(0 0 22px rgba(255,190,90,.55))}50%{filter:drop-shadow(0 18px 18px rgba(0,0,0,.65)) drop-shadow(0 0 8px rgba(255,190,90,.2))}55%{filter:drop-shadow(0 18px 18px rgba(0,0,0,.65)) drop-shadow(0 0 26px rgba(255,190,90,.6))}}
.rc-o-dslr::after{content:"";position:absolute;left:50%;top:48%;width:120px;height:120px;margin:-60px 0 0 -60px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.95),rgba(255,255,255,0) 60%);opacity:0}
.rc:hover .rc-o-dslr::after{animation:flash .5s ease-out}
@keyframes flash{0%{opacity:0;transform:scale(.4)}15%{opacity:1}100%{opacity:0;transform:scale(1.6)}}
.rc-o-laptop img{animation-name:objfloat,screenglow;animation-duration:5.5s,2.8s}
@keyframes screenglow{0%,100%{filter:drop-shadow(0 18px 18px rgba(0,0,0,.65)) drop-shadow(0 0 0 rgba(120,255,140,0))}50%{filter:drop-shadow(0 18px 18px rgba(0,0,0,.65)) drop-shadow(0 0 14px rgba(150,255,120,.28))}}
.rc-mark{z-index:3}
@media (prefers-reduced-motion:reduce){.rc-obj img{animation:none!important;transition:none}.rc:hover .rc-o-dslr::after{animation:none}}
.rc-obj{top:0;height:auto;aspect-ratio:16/10;width:100%}
.rc-obj img{width:auto;max-width:62%;max-height:84%}.rc-par svg{height:13px!important}.rc-mark.rc-par{height:13px;top:20px}
/* r9: objects are the hero, stills are atmosphere */
.rc-still img{filter:blur(4px) saturate(.7) brightness(.36);transform:scale(1.12)}
.rc-still img{animation:none}
.rc-obj img{height:70%;width:auto;max-width:72%;max-height:none}
@keyframes objfloat{0%,100%{translate:0 0;rotate:-1.5deg}50%{translate:0 -5px;rotate:1.5deg}}
.rc-obj img{animation-duration:7s}
.rc-obj img{height:118px;width:auto;max-width:72%;max-height:none;object-fit:contain}
@media (max-width:560px){.rc-obj img{height:100px}}
.rc-o-phone img,.rc-o-brain img{height:134px}
@media (max-width:560px){.rc-o-phone img,.rc-o-brain img{height:114px}}
.rc-o-brain img{filter:drop-shadow(0 18px 18px rgba(0,0,0,.65)) brightness(1.12)}
/* r11: Book of Tutto tape */
.btape{position:absolute;z-index:6;left:-118px;bottom:58px;width:150px;aspect-ratio:1;padding:0;border:0;background:none;cursor:grab;touch-action:none;-webkit-tap-highlight-color:transparent}
.btape img{position:absolute;pointer-events:none;user-select:none;filter:drop-shadow(0 16px 16px rgba(0,0,0,.7))}
.bt-book{width:100%;left:0;bottom:0;transform:rotate(-8deg);transition:transform .35s}
.bt-tape{width:58%;left:30%;bottom:34%;transform:rotate(-6deg);z-index:1;transition:opacity .3s}
.btape:hover .bt-book,.btape:focus-visible .bt-book{transform:rotate(-5deg) translateY(-3px)}
.btape:hover .bt-tape,.btape:focus-visible .bt-tape{transform:translate(6px,-14px) rotate(-3deg)}
.btape.drag{cursor:grabbing}.btape.drag .bt-tape{transition:none;filter:drop-shadow(0 26px 22px rgba(0,0,0,.75))}
.btape:focus-visible{outline:2px solid var(--lime);outline-offset:6px;border-radius:12px}
.bt-hint{position:absolute;left:0;right:-20px;top:100%;margin-top:6px;font:15px/1 var(--f-osd);letter-spacing:.08em;color:var(--lime);white-space:nowrap;opacity:.8;animation:bthint 2.4s ease-in-out infinite}
@keyframes bthint{50%{opacity:.35}}
.btape.in .bt-hint{opacity:0}
.scr.drop{box-shadow:inset 0 0 0 3px var(--lime),inset 0 0 40px rgba(196,216,47,.35)}
.vcard{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:.6em;padding:8% 10%;text-align:center;cursor:pointer;
  background:radial-gradient(ellipse at 50% 40%,rgba(40,30,22,.92),rgba(8,7,7,.97) 75%),url(../media/noise.png);background-size:auto,140px;opacity:0;transition:opacity .4s}
.vcard.on{opacity:1}
.vc-h{margin:0;font:clamp(22px,3.2vw,38px)/1 var(--f-black);color:#d9c38a;text-shadow:0 0 12px rgba(217,195,138,.35)}
.vc-q{margin:0;min-height:2.6em;font:700 clamp(15px,1.9vw,24px)/1.25 var(--f-body);color:#f2efe6;max-width:24ch}
.vc-r{margin:0;font:clamp(14px,1.5vw,19px)/1 var(--f-osd);letter-spacing:.08em;color:var(--lime)}
.vc-t{position:absolute;left:5%;top:6%;font:clamp(12px,1.3vw,16px)/1 var(--f-osd);letter-spacing:.08em;color:#fff;opacity:.8}
@media (max-width:1100px){.btape{left:-70px;width:120px}}
@media (max-width:980px){.btape{left:auto;right:-6px;bottom:auto;top:-28px;width:96px}.bt-hint{display:none}}
@media (prefers-reduced-motion:reduce){.bt-hint{animation:none}.vcard{transition:none}}
.btape img{height:auto!important;max-width:none!important;max-height:none!important;object-fit:contain}
.vcard{z-index:5}
.scr:has(.vcard.on) .osd,.scr:has(.vcard.on) .credit{opacity:0}
@media (min-width:1101px){.btape{width:190px;left:-150px;bottom:44px}}
.vcard{inset:-4px -4px -60px;padding-bottom:calc(8% + 56px)}
/* r11b: the book is the hero, the tape peeks out from behind it */
.bt-book{width:84%;z-index:1}
.bt-tape{z-index:0;width:44%;left:56%;bottom:30%;transform:rotate(10deg)}
.btape:hover .bt-tape,.btape:focus-visible .bt-tape{transform:translate(8px,-22px) rotate(6deg)}
.btape.drag .bt-tape{z-index:2}
@media (min-width:1101px){.btape{width:236px;left:-196px;bottom:30px}}
@media (max-width:980px){.btape{right:auto;left:6px;top:-74px;width:104px}
  .bt-hint{display:block;left:100%;right:auto;top:50%;margin:0 0 0 4px;font-size:14px}}
@media (max-width:980px){.bt-hint{left:4px;top:100%;margin:-2px 0 0;text-shadow:0 1px 3px #000,0 0 8px #000}}
.btape.played .bt-hint{display:none}
@media (max-width:980px){.bt-hint{left:100%;top:44%;margin:0 0 0 2px;padding:3px 6px;background:#0d0c0c;border-radius:4px;text-shadow:none}}
/* r12: photoreal TV/VCR. The render is the shell; the real buttons are hotspots */
.tv .ant{display:none}
.crt{aspect-ratio:924/839;background:url(../media/tv-tutto-v1.webp) center/100% 100% no-repeat;filter:drop-shadow(0 34px 40px rgba(0,0,0,.7))}
.crt .shell,.crt .bezel,.tvpanel .grille,.tvpanel .seg{display:none}
.scr{left:20.4%;right:auto;top:10.4%;width:70.2%;height:61.8%;border-radius:8.5% / 11%;box-shadow:0 0 0 2px #050505,inset 0 0 30px rgba(0,0,0,.8),0 0 40px rgba(196,216,47,.08)}
.tvpanel{position:absolute;inset:0;height:auto;display:block;pointer-events:none}
.tvbtns{display:contents}
.tvpanel .tvbtn,.tvpanel .knob,.tvpanel .pwr{position:absolute;pointer-events:auto;min-width:0;min-height:0;padding:0;font-size:0;color:transparent;background:transparent;box-shadow:none;border-radius:3px;cursor:pointer;transition:background .15s,box-shadow .15s}
.tvpanel .tvbtn:hover,.tvpanel .tvbtn:focus-visible,.tvpanel .pwr:hover,.tvpanel .pwr:focus-visible{background:rgba(196,216,47,.14);box-shadow:0 0 0 1px rgba(196,216,47,.7),0 0 14px rgba(196,216,47,.45)}
.tvpanel .tvbtn:active,.tvpanel .pwr:active{transform:none;background:rgba(0,0,0,.45);box-shadow:inset 0 3px 6px rgba(0,0,0,.8)}
.tvbtn[data-tv="up"]{left:18.3%;top:82.6%;width:3.3%;height:9%}
.tvbtn[data-tv="down"]{left:21.8%;top:82.6%;width:3.3%;height:9%}
.tvbtn.ok{left:25.2%;top:82.6%;width:3.3%;height:9%}
.tvbtn[data-tv="pause"]{left:28.7%;top:82.6%;width:3.3%;height:9%}
.tvpanel .knob{left:75.4%;top:79.6%;width:10.8%;height:auto;aspect-ratio:1;border-radius:50%;background:url(../media/tv-knob-v1.webp) center/100% no-repeat}
.tvpanel .knob::before,.tvpanel .knob::after{display:none}
.tvpanel .knob:hover,.tvpanel .knob:focus-visible{box-shadow:0 0 0 2px rgba(196,216,47,.7),0 0 16px rgba(196,216,47,.4)}
.tvpanel .pwr{left:88.5%;top:83.4%;width:5.6%;height:3.4%;border-radius:2px}
.tvpanel .pwr .led{left:48%;top:-98%;width:9px;transform:translateX(-50%);opacity:0}
.tv.isoff .tvpanel .pwr .led{opacity:1}
.vslot{position:absolute;left:34.8%;top:80%;width:36.8%;height:12.2%;border-radius:3px;pointer-events:none;transition:box-shadow .2s}
.vslot i{position:absolute;left:1%;right:1%;bottom:4%;height:44%;border-radius:2px;background:linear-gradient(#000,rgba(0,0,0,.2));opacity:0}
.vslot.drop,.btape.drag~.crt .vslot{box-shadow:0 0 0 2px var(--lime),0 0 24px rgba(196,216,47,.55)}
.vslot.drop i,.vslot.eat i{opacity:1}
.scr.flash::before{content:"";position:absolute;inset:0;z-index:8;background:#fff;animation:tvflash .45s ease-out forwards;pointer-events:none}
@keyframes tvflash{0%{opacity:0}12%{opacity:.95}100%{opacity:0}}
.tv-help{margin-top:6px}
/* bigger tape on the book */
.bt-tape{width:56%;left:50%;bottom:26%}
@media (min-width:1101px){.btape{width:260px;left:-214px;bottom:-6px}}
@media (max-width:980px){.btape{width:118px;top:-96px;left:2px}}
@media (prefers-reduced-motion:reduce){.scr.flash::before{animation:none}}
/* r12: photoreal remote */
.rb-remote{width:190px;aspect-ratio:329/1036;padding:0;border-radius:0;background:url(../media/remote-tutto-v1.webp) center/100% 100% no-repeat;box-shadow:none;filter:drop-shadow(0 30px 40px rgba(0,0,0,.65));display:block;max-width:none}
.rb-remote .rb-ir,.rb-remote .rb-brand,.rb-remote .rb-lab{display:none}
.rb-remote .rb-ch,.rb-remote .rb-colors,.rb-remote .rb-keys{display:contents}
.rb-remote .rb-b,.rb-remote .rb-c,.rb-remote .rb-keys button{position:absolute;min-height:0;padding:0;margin:0;font-size:0;color:transparent;background:transparent;box-shadow:none;border-radius:8px;transition:background .15s,box-shadow .15s}
.rb-remote .rb-c i{display:none}
.rb-remote .rb-b:hover,.rb-remote .rb-c:hover,.rb-remote .rb-keys button:hover,.rb-remote button:focus-visible{background:rgba(196,216,47,.12);box-shadow:0 0 0 2px rgba(196,216,47,.75),0 0 14px rgba(196,216,47,.45)}
.rb-remote .rb-b:active,.rb-remote .rb-c:active,.rb-remote .rb-keys button:active{transform:none;background:rgba(0,0,0,.4)}
.rb-remote .rb-c[aria-pressed="true"]{background:transparent;box-shadow:0 0 0 2px #fff,0 0 18px 2px var(--c)}
.rb-remote .rb-b[data-rbch="1"]{left:34%;top:26.6%;width:31.5%;height:6.6%;border-radius:14px 14px 4px 4px}
.rb-remote .rb-b[data-rbch="-1"]{left:34%;top:34.6%;width:31.5%;height:6.2%;border-radius:4px 4px 14px 14px}
.rb-remote .rb-c{top:46.2%;width:16%;height:3.4%}
.rb-remote .rb-c.red{left:11.6%}.rb-remote .rb-c.green{left:31.4%}.rb-remote .rb-c.yellow{left:52%}.rb-remote .rb-c.blue{left:72.4%}
.rb-remote .rb-keys button{width:19.6%;height:4.6%;border-radius:8px}
.rb-remote .rb-keys button:nth-child(3n+1){left:14.6%}.rb-remote .rb-keys button:nth-child(3n+2){left:40%}.rb-remote .rb-keys button:nth-child(3n){left:65.4%}
.rb-remote .rb-keys button:nth-child(-n+3){top:54.6%}.rb-remote .rb-keys button:nth-child(n+4):nth-child(-n+6){top:61.6%}.rb-remote .rb-keys button:nth-child(n+7):nth-child(-n+9){top:68.5%}
.rb-remote .rb-keys button:nth-child(10){left:40%;top:75.4%}
.rb-remote:hover{transform:rotate(-1.5deg) translateY(-4px)}
.rb-legend{position:absolute;left:50%;top:100%;transform:translateX(-50%);margin:12px 0 0;white-space:nowrap;font:14px/1 var(--f-osd);letter-spacing:.08em;color:var(--mute)}
.rb-legend b{font-weight:400}.rb-legend .lr{color:#e5392b}.rb-legend .lg{color:#3fae49}.rb-legend .ly{color:#e9c623}.rb-legend .lb{color:#3a7bd5}
@media (max-width:760px){.rb-remote{width:150px;justify-self:center;margin-bottom:34px}}
@media (min-width:981px) and (max-width:1100px){.btape{width:150px;left:-128px;bottom:96px}}
/* r12b: mobile remote beside the package screen, sticky so both stay in view */
@media (max-width:760px){
  .rb{grid-template-columns:104px minmax(0,1fr);gap:12px;align-items:start}
  .rb-remote{width:104px;margin:0;position:sticky;top:84px;order:0}
  .rb-remote:hover{transform:none}
  .rb-tv{order:1}
  .rb-scr{padding:14px;border-width:6px}
  .rb .rb-name{font-size:28px;margin-top:10px}
  .rb .rb-tag{font-size:17px}
  .rb-list{grid-template-columns:minmax(0,1fr);font-size:13px}
  .rb-osd{font-size:15px}
  .rb-total .seg{font-size:36px}
  .rb-legend{position:static;transform:none;margin:8px 0 0;white-space:normal;font-size:12px;line-height:1.5;text-align:center}
  .rb-legend b{display:inline}
  .rb-cta .btn{padding-inline:16px}
}
@media (max-width:760px){.rb-legend{position:absolute;left:0;right:0;top:100%;margin-top:8px}}
/* r13: TV mirrored so it angles toward the headline */
.crt{background-image:url(../media/tv-tutto-v2.webp)}
.scr{left:9.4%}
.tvbtn[data-tv="up"]{left:68%}.tvbtn[data-tv="down"]{left:71.5%}.tvbtn.ok{left:74.9%}.tvbtn[data-tv="pause"]{left:78.4%}
.tvpanel .knob{left:13.8%;background-image:url(../media/tv-knob-v2.webp)}
.tvpanel .pwr{left:5.9%}.tvpanel .pwr .led{left:52%}
.vslot{left:28.4%}
/* r13b: book + tape live beside the Millions stat and float */
.tape-cell{position:relative;display:grid;place-items:center;padding:18px 0 40px;border-left:1px solid var(--line)}
.tape-cell .btape{position:relative;inset:auto;left:auto;right:auto;top:auto;bottom:auto;width:250px;margin:0}
.tape-cell .bt-hint{left:50%;right:auto;top:100%;transform:translateX(-50%);margin-top:4px;font-size:14px;padding:0;background:none}
.tape-cell .bt-book{animation:btfloat 6.5s ease-in-out infinite}
.tape-cell .bt-tape{animation:btfloat 5.2s ease-in-out -1.8s infinite}
@keyframes btfloat{0%,100%{translate:0 0;rotate:0deg}50%{translate:0 -9px;rotate:1.2deg}}
.tape-cell .btape.drag .bt-tape,.tape-cell .btape.in .bt-tape{animation:none}
@media (max-width:900px){.tape-cell{border-left:0;border-top:1px solid var(--line);padding:26px 0 44px}.tape-cell .btape{width:190px}}
@media (prefers-reduced-motion:reduce){.tape-cell .bt-book,.tape-cell .bt-tape{animation:none}}
/* r13c: channel guide pinned, cards slide right-to-left with scroll */
.rail.pinned{padding:0!important}
.rail.pinned .rail-pin{position:sticky;top:0;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding:84px 0 28px}
.rail.pinned .rail-tr{animation:none;will-change:transform}
.rail.pinned .rail-dup{display:none}
.rail.pinned .rail-vp{-webkit-mask:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent);mask:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent)}
.rail-foot{display:none}
.rail.pinned .rail-foot{display:flex;align-items:center;gap:16px;margin-top:10px}
.rail-prog{flex:1;height:2px;background:var(--line);overflow:hidden;max-width:420px}
.rail-prog i{display:block;height:100%;background:var(--lime);transform-origin:0 50%;transform:scaleX(0)}
.rail-cue{font:14px/1 var(--f-osd);letter-spacing:.1em;color:#9c988f;transition:opacity .3s}
.rail.done .rail-cue{opacity:0}
@media (max-width:560px){.rail.pinned .rail-pin{padding-top:76px}.rail-cue{font-size:12px}}
.rail.pinned .rail-pin>.wrap{width:100%;box-sizing:border-box}
/* r13d: CD fixes */
.rc-s{display:none}
@media (max-width:560px){.rc-l{display:none}.rc-s{display:inline}}
.smile-w .smile-toast{position:fixed;top:84px;right:24px;white-space:normal;line-height:1.25;max-width:0}
.smile-w.pop .smile-toast{max-width:min(420px,calc(100vw - 32px));padding:8px 12px}
@media (max-width:600px){.smile-w .smile-toast{top:78px;right:16px}.smile-w.pop .smile-toast{max-width:calc(100vw - 32px);text-overflow:clip;font-size:15px}}
@media (max-width:600px){.vcard{inset:0;padding:5% 7%;gap:.35em}.vc-h{font-size:17px}.vc-q{font-size:13.5px;line-height:1.25;min-height:0;max-width:none}.vc-r{font-size:12px}.vc-t{display:none}}
@media (max-width:600px){.vcard{inset:-4px -4px -60px;padding:5% 7% calc(4% + 60px)}}
@media (min-width:601px){.smile-w .smile-toast{white-space:nowrap;top:82px}.smile-w.pop .smile-toast{max-width:min(640px,calc(100vw - 48px))}}
/* r14: remote power easter egg */
.rb-remote .rb-pwr{position:absolute;left:41.4%;top:15.6%;width:19.2%;height:6.2%;border-radius:50%;padding:0;border:0;background:transparent;cursor:pointer;-webkit-tap-highlight-color:transparent}
.rb-remote .rb-pwr:hover,.rb-remote .rb-pwr:focus-visible{background:rgba(255,90,60,.14);box-shadow:0 0 0 2px rgba(255,120,90,.8),0 0 16px rgba(255,90,60,.6);outline:0}
.rb-remote .rb-pwr[aria-pressed="true"]{box-shadow:0 0 0 2px #fff,0 0 18px 2px rgba(255,90,60,.9)}
.rb-fx{position:absolute;inset:0;z-index:4;border-radius:inherit;overflow:hidden;background:#020302;display:none;pointer-events:none}
.rb-scr.pw-off .rb-fx{display:block}
.rb-fx::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at center,#fff 0,#e9f7c0 40%,rgba(196,216,47,.4) 70%,transparent 100%);opacity:0}
.rb-scr.pw-off:not(.pw-static) .rb-fx::before{animation:pwoff .6s cubic-bezier(.6,0,.4,1) forwards}
@keyframes pwoff{0%{opacity:1;transform:scale(1,1)}12%{opacity:1;transform:scale(1.02,1.04)}40%{opacity:1;transform:scale(1,.012)}72%{opacity:1;transform:scale(.03,.012)}100%{opacity:0;transform:scale(0,0)}}
.rb-bars{position:absolute;inset:0;opacity:0;background:
  repeating-linear-gradient(0deg,rgba(0,0,0,.35) 0 2px,transparent 2px 4px),
  url(../media/noise.png),
  linear-gradient(180deg,transparent 0 66%,#0d1f6b 66% 74%,#111 74% 76%,#5a0f6b 76% 84%,#111 84% 86%,#0b6b6b 86% 100%),
  linear-gradient(90deg,#c9c9c9 0 14.28%,#d6d21c 14.28% 28.56%,#1ec9cc 28.56% 42.84%,#21c22a 42.84% 57.12%,#c41fc0 57.12% 71.4%,#d0231d 71.4% 85.68%,#1f2bc4 85.68% 100%);
  background-size:auto,180px 180px,auto,auto}
.rb-scr.pw-static .rb-bars{opacity:1;animation:pwbars .22s steps(3) infinite,pwroll 1.1s linear infinite}
.rb-scr.pw-static .rb-bars::after{content:"";position:absolute;left:0;right:0;height:18%;top:-20%;background:linear-gradient(180deg,transparent,rgba(255,255,255,.35),transparent);animation:pwtear .9s linear infinite}
@keyframes pwbars{0%{background-position:0 0,0 0,0 0,0 0;filter:contrast(1.3) saturate(1.2)}33%{background-position:0 1px,-40px 30px,3px 0,3px 0;filter:contrast(1.6) saturate(.8) brightness(1.15)}66%{background-position:0 2px,60px -20px,-4px 0,-4px 0;filter:contrast(1.2) saturate(1.4) brightness(.85)}}
@keyframes pwroll{0%,100%{transform:translateY(0) skewX(0)}48%{transform:translateY(0) skewX(0)}50%{transform:translateY(-6%) skewX(-3deg)}54%{transform:translateY(3%) skewX(2deg)}58%{transform:none}}
@keyframes pwtear{to{top:110%}}
.rb-verse{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:.55em;padding:8% 9%;text-align:center;opacity:0;transition:opacity .5s;background:radial-gradient(ellipse at 50% 40%,#1a1a12,#050504 75%)}
.rb-verse::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(0,0,0,.28) 0 1px,transparent 1px 3px);pointer-events:none}
.rb-scr.pw-verse .rb-verse{opacity:1}
.rb-scr.pw-verse .rb-bars{opacity:0;transition:opacity .5s}
.rb-verse .vc-h{margin:0;font-size:clamp(22px,3vw,36px)}
.rb-vq{margin:0;min-height:2.5em;font:700 clamp(17px,2vw,24px)/1.28 var(--f-body);color:#f2efe6;max-width:26ch}
.rb-vr{margin:0;font:clamp(14px,1.4vw,18px)/1 var(--f-osd);letter-spacing:.08em;color:var(--lime)}
.rb-scr.pw-back .rb-verse{opacity:0;transition:none}
.rb-scr.pw-back .rb-bars{opacity:.85;transition:none}
@media (max-width:760px){.rb-verse{padding:10% 8%;gap:.4em}.rb-verse .vc-h{font-size:19px}.rb-vq{font-size:15px;max-width:none}.rb-vr{font-size:12px}}
@media (prefers-reduced-motion:reduce){.rb-scr.pw-static .rb-bars,.rb-scr.pw-static .rb-bars::after,.rb-scr.pw-off .rb-fx::before{animation:none}}
.rb-bars{background:
  linear-gradient(180deg,transparent 0 66%,#0d1f6b 66% 74%,#111 74% 76%,#5a0f6b 76% 84%,#111 84% 86%,#0b6b6b 86% 100%),
  linear-gradient(90deg,#c9c9c9 0 14.28%,#d6d21c 14.28% 28.56%,#1ec9cc 28.56% 42.84%,#21c22a 42.84% 57.12%,#c41fc0 57.12% 71.4%,#d0231d 71.4% 85.68%,#1f2bc4 85.68% 100%)}
.rb-bars::before{content:"";position:absolute;inset:0;background:url(../media/noise.png) 0 0/160px 160px,repeating-linear-gradient(0deg,rgba(0,0,0,.4) 0 2px,transparent 2px 4px);mix-blend-mode:hard-light;opacity:.55}
.rb-scr.pw-static .rb-bars::before{animation:pwnoise .12s steps(2) infinite}
@keyframes pwnoise{0%{background-position:0 0,0 0}50%{background-position:-50px 37px,0 1px}100%{background-position:31px -60px,0 2px}}
@keyframes pwbars{0%{filter:contrast(1.25) saturate(1.2)}33%{filter:contrast(1.5) saturate(.8) brightness(1.15) hue-rotate(8deg)}66%{filter:contrast(1.2) saturate(1.4) brightness(.85) hue-rotate(-8deg)}}
.rb-legend span{white-space:nowrap}
/* r14: Book of Tutto opens */
.tape-cell .bt-hint{display:grid;gap:6px;text-align:center}
.bk-open{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0;padding:0}
.bk-open:focus-visible{width:auto;height:auto;clip-path:none;left:50%;bottom:6px;transform:translateX(-50%);padding:6px 12px;border-radius:6px;background:var(--lime);color:#000;font:14px/1 var(--f-osd);letter-spacing:.08em;z-index:7}
.bkdlg{position:fixed;inset:0;z-index:120;display:grid;place-items:center;padding:16px}
.bkdlg[hidden]{display:none}
.bk-back{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 45%,rgba(30,28,18,.82),rgba(0,0,0,.94) 70%);backdrop-filter:blur(3px);opacity:0;transition:opacity .35s}
.bkdlg.on .bk-back{opacity:1}
.bkdlg.closing .bk-back{opacity:0}
.bk-stage{position:relative;width:min(94vw,1040px,calc((100svh - 150px) * 1190 / 728));aspect-ratio:1190/728;perspective:2200px;transform-style:preserve-3d;transform-origin:68.2% 45.6%;cursor:pointer;transition:opacity .3s}
.bkdlg.closing .bk-stage{opacity:0;transform:scale(.94)!important;transition:opacity .3s,transform .3s}
.bk-spread{position:absolute;inset:0;width:100%;height:100%;clip-path:inset(0 0 0 46.3%);filter:drop-shadow(0 30px 40px rgba(0,0,0,.7))}
.bkdlg.opened .bk-spread{clip-path:none}
.bk-leaf{position:absolute;left:46.3%;top:1.1%;width:43.8%;height:89%;transform-origin:0 50%;transform-style:preserve-3d;z-index:3}
.bkdlg.opened .bk-leaf{opacity:0;transition:opacity .25s}
.bk-front,.bk-inside{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden}
.bk-front img{width:100%;height:100%;display:block;filter:drop-shadow(0 20px 30px rgba(0,0,0,.6))}
.bk-inside{transform:rotateY(180deg)}
.bk-inside img{position:absolute;max-width:none;width:228.3%;height:112.36%;left:-5.71%;top:-1.236%}
.bk-words{position:absolute;inset:0;z-index:2;opacity:0;transition:opacity .5s .1s;color:#2a1f14}
.bkdlg.opened .bk-words{opacity:1}
.bk-lp{position:absolute;left:7%;width:36%;top:12%;bottom:18%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.7em;text-align:center}
.bk-rp{position:absolute;left:51%;width:34%;top:10%;bottom:16%;display:flex;align-items:center;justify-content:center;text-align:center}
.bk-h{margin:0;font:clamp(20px,3.6vw,46px)/1.05 var(--f-black);color:#3a2a17;mix-blend-mode:multiply}
.bk-r{margin:0;font:clamp(11px,1.4vw,17px)/1.2 var(--f-osd);letter-spacing:.08em;color:#5a4a1a;mix-blend-mode:multiply}
.bk-orn{margin:0;font-size:clamp(9px,1vw,13px);letter-spacing:.6em;color:#6b5428;opacity:.7}
.bk-q{margin:0;font:700 clamp(12.5px,2.1vw,27px)/1.3 var(--f-body);color:#2a1f14;mix-blend-mode:multiply;text-wrap:balance}
.bk-q::first-letter{font:clamp(22px,3.6vw,48px)/1 var(--f-black);color:#7a2a18;margin-right:.04em}
.bk-x{position:absolute;top:max(16px,env(safe-area-inset-top));right:16px;z-index:3;padding:9px 14px;border-radius:8px;border:1px solid rgba(255,255,255,.25);background:rgba(0,0,0,.55);color:#fff;font:15px/1 var(--f-osd);letter-spacing:.1em;cursor:pointer;opacity:0;transition:opacity .3s .3s}
.bkdlg.on .bk-x{opacity:1}
.bk-x:hover,.bk-x:focus-visible{border-color:var(--lime);color:var(--lime);outline:0}
.bk-tip{position:absolute;bottom:max(18px,env(safe-area-inset-bottom));left:0;right:0;margin:0;text-align:center;z-index:3;font:14px/1 var(--f-osd);letter-spacing:.12em;color:var(--lime);opacity:0;transition:opacity .4s .8s}
.bkdlg.opened .bk-tip{opacity:.8}
@media (max-width:600px){.bk-tip{font-size:12px}.bk-x{font-size:13px}}
@media (prefers-reduced-motion:reduce){.bk-back,.bk-words,.bk-x,.bk-tip{transition:none}}
.bkdlg.opened .bk-leaf{transition:opacity .2s}
.bk-words{transition:opacity .45s .3s}
/* r14b: mobile book zooms onto the verse page */
.bk-mo{display:none}
.bkdlg.mob .bk-lp{display:none}
.bkdlg.mob .bk-mo{display:block}
.bkdlg.mob .bk-rp{flex-direction:column;gap:.55em;left:50%;width:37%;top:8%;bottom:12%}
.bkdlg.mob .bk-h{font-size:9px}
.bkdlg.mob .bk-q{font-size:6.6px;line-height:1.32}
.bkdlg.mob .bk-q::first-letter{font-size:11px}
.bkdlg.mob .bk-r{font-size:4.6px}
.bkdlg.mob .bk-spread{filter:none}
.bkdlg.mob .bk-rp{left:49%;width:38%}.bkdlg.mob .bk-q{font-size:7.6px}.bkdlg.mob .bk-q::first-letter{font-size:12.5px}.bkdlg.mob .bk-h{font-size:10px}.bkdlg.mob .bk-r{font-size:5px}
/* r15: verse text never shrinks into its reference line */
.vc-q,.vc-h,.vc-r,.rb-vq,.rb-vr,.rb-verse .vc-h{flex-shrink:0}
.rb-verse{overflow:hidden}
.rb-vq{font-size:clamp(15px,1.55vw,21px);max-width:30ch;min-height:0}
.rb-verse .vc-h{font-size:clamp(20px,2.4vw,30px)}
/* r15: no opacity on the 3D leaf (it flattens and shows the mirrored cover); page turn */
.bkdlg.opened .bk-leaf{opacity:1;visibility:hidden;transition:none}
.bk-words{transition:opacity .35s}
.bkdlg.turning .bk-words{opacity:0!important;transition:opacity .16s}
.bkdlg.opened:not(.turning) .bk-words{opacity:1}
.bk-page{position:absolute;left:46.3%;top:1.1%;width:43.8%;height:89%;transform-origin:0 50%;transform-style:preserve-3d;z-index:4;visibility:hidden;pointer-events:none}
.bk-page.go{visibility:visible}
.bk-pf,.bk-pb{position:absolute;inset:0;overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.bk-pb{transform:rotateY(180deg)}
.bk-pf img,.bk-pb img{position:absolute;max-width:none;width:228.3%;height:112.36%;top:-1.236%}
.bk-pf img{left:-105.7%}
.bk-pb img{left:-5.71%}
.bk-pf i,.bk-pb i{position:absolute;inset:0;pointer-events:none}
.bk-pf i{background:linear-gradient(90deg,rgba(0,0,0,.28),rgba(0,0,0,0) 22%,rgba(255,255,255,.06) 60%,rgba(0,0,0,.12))}
.bk-pb i{background:linear-gradient(270deg,rgba(0,0,0,.3),rgba(0,0,0,0) 25%)}
.bk-page.go .bk-pf i{animation:pgshade .85s cubic-bezier(.55,.05,.3,1)}
@keyframes pgshade{0%{opacity:.2}50%{opacity:1}100%{opacity:1}}
.bkdlg.shutting .bk-back,.bkdlg.shutting .bk-x,.bkdlg.shutting .bk-tip{opacity:0;transition:opacity .45s}
/* r16: page changes use the logo CRT cut */
html.tjx-in .chan{opacity:1!important;animation:none!important;background:#030303}
.tjx.full{visibility:visible}
.tjx.full .tjx-scr{clip-path:inset(0);animation:none}

/* r16: the real logo icon (smile meter, process 04, decode) and the horizontal parenthesis */
.tt-icon{fill:currentColor;display:block}
.smile-btn .sm-ico{fill:var(--lime)}
.pm-icon{color:var(--lime)}
.pm-icon svg{height:100%;width:auto}
section.proc .pm.pm-icon{display:block!important;height:42px!important}
section.proc .pm.pm-icon svg{height:36px;width:auto}
.dc-face.dc-icon{display:block;position:relative;width:clamp(230px,30vw,380px);aspect-ratio:63/40.4;margin:22px auto 10px}
.dc-icon .dc-mark{position:absolute;padding:0;margin:0;border-radius:8px}
.dc-icon .dc-mark svg,.dc-icon .dc-mark.sm svg{width:100%;height:100%;fill:currentColor}
.dc-icon .dc-mark.seen::after{top:-14px;right:-10px}
section.proc .pm.pm-par{display:flex!important;align-items:center}
section.proc .pm-par svg,.pm-par svg{height:15px!important;width:auto!important}
.rc-mark.rc-par{top:26px}

/* r16b: decode hint and caption share the face centre line */
.decode .src,.decode .dc-out{margin-left:auto!important;margin-right:auto!important;text-align:center}

/* r17: typed verses keep their final layout from the first frame */
.ty-off{visibility:hidden}
/* r17: book text centred on each page's printable area (gutter/ribbon to the fore-edge stack, 12% side padding) */
.bk-lp{left:10.5%;width:26.6%;top:10%;bottom:20%}
.bk-rp{left:53%;width:27.4%;top:10%;bottom:20%}
.bk-q{max-width:100%}
.bkdlg.mob .bk-rp{left:53%;width:27.4%;top:9%;bottom:19%}
.bkdlg.mob .bk-r{margin-top:-.65em}

/* r18: phones: the feed phone is sized from what is left under the header and the controls, so it is never cut off */
@media (max-width:900px){
  .feed-pin{padding-top:80px;padding-bottom:10px}
  .feed-now{padding:8px 12px}.feed-now .d{font-size:13px;line-height:1.35}
  .feed-ctl{gap:8px;margin-top:8px}.feed-ctl .ib{width:42px;height:42px;font-size:16px}.feed-ctl .ct{font-size:19px;min-width:52px}
  .stage{--pw:min(250px,60vw,calc((100svh - 350px) / 2.06))}
}
@media (max-width:900px) and (max-height:640px){
  .feed-now .d{display:none}
  .stage{--pw:min(250px,60vw,calc((100svh - 340px) / 2.06))}
}

/* r18: small phones: TV shows just the channel tag and a short cue */
.osd .ok-s{display:none}
@media (max-width:480px){.osd .nm,.osd .who{display:none}.osd .ok-l{display:none}.osd .ok-s{display:inline}.osd .ch{display:block}.osd .ok{margin-top:6px}}
/* r18b: soft dark wash behind the on-screen text so it reads over bright footage */
.osd::before{content:"";position:absolute;inset:-35% -14% -35% -45%;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 75% 45%,rgba(0,0,0,.6),rgba(0,0,0,.3) 45%,transparent 72%)}
/* r18: phones: the +1 toast docks at the bottom above the smile button, on one line, clear of the TV */
@media (max-width:600px){.smile-w .smile-toast{top:auto;bottom:calc(84px + env(safe-area-inset-bottom));right:16px;white-space:nowrap;text-overflow:ellipsis}.smile-w.pop .smile-toast{max-width:calc(100vw - 32px)}}

/* r18: phones: portrait single-page book, fully contained (cover swings open on the spine, verse types on the page) */
.bkdlg.mobs .bk-stage{width:min(90vw,calc((100svh - 150px) * 760 / 1091));aspect-ratio:760/1091;transform-origin:50% 50%}
.bkdlg.mobs .bk-spread{clip-path:none!important;filter:drop-shadow(0 24px 30px rgba(0,0,0,.7))}
.bkdlg.mobs .bk-leaf{left:0;top:0;width:100%;height:100%}
.bkdlg.mobs .bk-front img{object-fit:contain}
.bkdlg.mobs .bk-inside{display:none}
.bkdlg.mobs .bk-page{left:11.2%;top:2.7%;width:74.6%;height:86.7%}
.bkdlg.mobs .bk-pf img,.bkdlg.mobs .bk-pb img{width:134.05%;height:115.34%;left:-15.01%;top:-3.11%}
.bkdlg.mobs .bk-pb{display:none}
.bkdlg.mobs .bk-lp{display:none}
.bkdlg.mobs .bk-mo{display:block}
.bkdlg.mobs .bk-rp{left:20.1%;width:56.7%;top:10%;bottom:17.6%;flex-direction:column;gap:.7em}
.bkdlg.mobs .bk-h{font-size:clamp(22px,6.6vw,30px)}
.bkdlg.mobs .bk-q{font-size:clamp(15px,4.5vw,20px);line-height:1.3}
.bkdlg.mobs .bk-q::first-letter{font-size:1.7em}
.bkdlg.mobs .bk-r{font-size:clamp(11px,3.1vw,14px);margin-top:0}
/* r18: phones: the pinned Channel Guide sits right under the header instead of floating mid-screen */
@media (max-width:560px){.rail.pinned .rail-pin{justify-content:flex-start;padding-top:92px}}
/* ===== r19: homepage cut, copy pacing ===== */
/* process cards flip: headline on the front, the line and links on the back */
.pgrid{perspective:1400px}
.pc{border-top:0;padding-top:0}
.pc-in{display:grid;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.3,1.25,.5,1);height:100%}
.pc-f,.pc-b{grid-area:1/1;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-top:1px solid rgba(255,255,255,.28);padding:22px 0 8px;min-width:0;transition:visibility 0s .3s}
.pc-f{cursor:pointer;display:flex;flex-direction:column;align-items:flex-start}
.pc-b{transform:rotateY(180deg);visibility:hidden;border-top-color:var(--lime)}
.pc.on .pc-in{transform:rotateY(180deg)}
.pc.on .pc-f{visibility:hidden}.pc.on .pc-b{visibility:visible}
.pc-flip{margin-top:auto;display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border:1px solid rgba(255,255,255,.3);border-radius:999px;background:none;color:#eee;font:15px/1 var(--f-osd);letter-spacing:.12em;cursor:pointer;transition:border-color .2s,color .2s,box-shadow .2s}
.pc-flip i{font-style:normal;color:var(--lime)}
.pc-flip:hover,.pc-f:hover .pc-flip{border-color:var(--lime);color:var(--lime);box-shadow:0 0 14px var(--lime-glow)}
.pc-f h3{margin-bottom:18px!important}
.pc-back{margin-top:14px}
@media (prefers-reduced-motion:reduce){.pc-in{transition:none}}
/* Reel Generator callout */
.reelcall{padding-block:clamp(28px,4vw,48px)}
.rg-call{display:flex;align-items:center;gap:clamp(14px,2vw,26px);padding:clamp(18px,2.4vw,28px) clamp(18px,3vw,36px);border:1px solid var(--line);border-radius:18px;background:#121011;color:inherit;text-decoration:none;transition:border-color .25s,box-shadow .25s}
.rg-call:hover,.rg-call:focus-visible{border-color:var(--lime);box-shadow:0 0 0 1px var(--lime),0 0 28px var(--lime-glow)}
.rg-new{flex:none;padding:7px 11px;border-radius:6px;background:var(--lime);color:#0a0a0a;font:18px/1 var(--f-osd);letter-spacing:.14em}
.rg-t{display:flex;flex-direction:column;gap:6px;min-width:0}
.rg-k{font:17px/1.1 var(--f-osd);letter-spacing:.12em;color:#b9b6ae;text-transform:uppercase}.rg-k em{font-style:normal;color:var(--lime)}
.rg-t b{font-weight:800;font-size:clamp(20px,2.4vw,32px);line-height:1.1}
.rg-go{margin-left:auto;flex:none;font-size:26px;color:var(--lime);transition:transform .2s}.rg-call:hover .rg-go{transform:translateX(5px)}
@media (max-width:560px){.rg-call{flex-wrap:wrap}.rg-go{display:none}}
/* packages remote teaser */
.pkt{background:#0d0c0c;border-block:1px solid var(--line);overflow:hidden}
.pkt-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);align-items:center;gap:clamp(24px,5vw,72px)}
.pkt-remote{justify-self:center;display:block;width:clamp(120px,15vw,180px);transform:rotate(-14deg);filter:drop-shadow(0 30px 40px rgba(0,0,0,.65));transition:transform .45s cubic-bezier(.3,1.4,.5,1)}
.pkt-remote img{display:block;width:100%;height:auto}
.pkt-remote:hover,.pkt-remote:focus-visible{transform:rotate(-8deg) translateY(-6px)}
.pkt-on{color:var(--lime);text-shadow:0 0 18px var(--lime-glow)}
.pkt-copy .cta-row{margin-top:22px}
@media (max-width:760px){.pkt-grid{grid-template-columns:minmax(0,1fr);text-align:center}.pkt-remote{width:80px;transform:rotate(-10deg)}.pkt-remote:hover{transform:rotate(-4deg) translateY(-4px)}.pkt-copy .cta-row{justify-content:center}}
/* work: three tiles, then links out */
.work-more{display:flex;flex-wrap:wrap;gap:12px;margin:28px 0 0}
.term-page .term-wrap{margin-top:0}
/* philosophy, one beat */
.ph-why{margin:18px 0 0;font-weight:700;font-size:clamp(18px,1.6vw,22px);line-height:1.35}
.ph-why .script-lab{display:block;margin-bottom:4px}
.ph-more{margin:22px 0 0}
/* packages page: name, who it's for and price up front, the list on tap */
.pk-inc{margin:14px 0 18px;border-top:1px dashed rgba(255,255,255,.18)}
.pk-inc summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;padding:12px 0 4px;font:16px/1 var(--f-osd);letter-spacing:.12em;color:#e6e3dc;text-transform:uppercase}
.pk-inc summary::-webkit-details-marker{display:none}
.pk-inc summary::after{content:"+";color:var(--lime);font-size:20px;transition:transform .25s}
.pk-inc[open] summary::after{transform:rotate(45deg)}
.pk-inc summary:hover{color:var(--lime)}
.pk-inc ul{margin-top:10px}
.pc-f .pc-one{margin:0 0 22px;font-size:16px;line-height:1.5;color:#cfccc4;max-width:30ch}
.ph-why{margin-top:34px}.ph-why .script-lab{margin-bottom:10px}
.ph-body .ph-why{margin-top:46px}.ph-why .script-lab{line-height:1.25;margin:0 0 8px}
/* ===== r19 quick wins ===== */
/* teleprompter: words light up as the line crosses the screen, the live word carries a lime highlighter */
.tp .tp-w{opacity:.26;transition:opacity .3s}
.tp .tp-w.lit{opacity:1}
.tp .tp-w.cur{color:var(--lime);text-shadow:0 0 18px var(--lime-glow)}
.tp em .tp-w.lit,.tp b .tp-w.lit{color:inherit}
/* signal-break cuts between sections: VHS tracking and chroma, strength follows the scroll */
.sigcut{position:relative;height:0;z-index:4;pointer-events:none;--k:0;--j:0}
.sc-band{position:absolute;left:0;right:0;top:-26px;height:52px;display:block;opacity:calc(var(--k) * .55);mix-blend-mode:screen;
  -webkit-mask:linear-gradient(transparent,#000 35%,#000 65%,transparent),linear-gradient(90deg,#000 0 18%,transparent 18% 23%,#000 23% 61%,transparent 61% 64%,#000 64%);-webkit-mask-composite:source-in;mask:linear-gradient(transparent,#000 35%,#000 65%,transparent) intersect,linear-gradient(90deg,#000 0 18%,transparent 18% 23%,#000 23% 61%,transparent 61% 64%,#000 64%);
  background:url(../media/noise.png) 0 0/220px,repeating-linear-gradient(0deg,rgba(255,255,255,.10) 0 1px,transparent 1px 3px);
  transform:translateX(calc(var(--j) * var(--k) * 18px)) scaleY(calc(.35 + var(--k) * .9));filter:contrast(1.6) brightness(1.1)}
.sc-band::before,.sc-band::after{content:"";position:absolute;left:-2%;right:-2%;height:2px;top:44%;filter:blur(.6px)}
.sc-band::before{background:rgba(255,40,60,.85);transform:translate(calc(var(--k) * 16px),calc(var(--k) * -5px));box-shadow:0 9px 0 rgba(255,40,60,.35),0 -14px 0 rgba(255,40,60,.25)}
.sc-band::after{background:rgba(40,230,255,.85);transform:translate(calc(var(--k) * -16px),calc(var(--k) * 5px));box-shadow:0 -9px 0 rgba(40,230,255,.35),0 15px 0 rgba(40,230,255,.25)}
/* lime glow + tracing border, clickable things only */
@property --tr{syntax:"<angle>";inherits:false;initial-value:0deg}
.btn,.rg-call,.case,.pk,.rc,.case-card,.tile{position:relative}
.btn::after,.rg-call::after,.case::after,.pk::after,.rc::after,.case-card::after,.tile::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.5px;pointer-events:none;z-index:3;
  background:conic-gradient(from var(--tr),transparent 0 62%,rgba(196,216,47,.15) 70%,var(--lime) 86%,#f4ffb0 90%,transparent 92%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
  opacity:0;transition:opacity .25s}
:is(.btn,.rg-call,.case,.pk,.rc,.case-card,.tile):is(:hover,:focus-visible)::after{opacity:1;animation:trace 1.6s linear infinite}
:is(.case,.pk,.rc,.case-card,.tile):is(:hover,:focus-visible){box-shadow:0 0 26px var(--lime-glow)}
.btn:is(:hover,:focus-visible){box-shadow:0 0 18px var(--lime-glow)}
@keyframes trace{to{--tr:360deg}}
@media (prefers-reduced-motion:reduce){:is(.btn,.rg-call,.case,.pk,.rc,.case-card,.tile):is(:hover,:focus-visible)::after{animation:none;background:var(--lime)}}
/* r20 gate: cuts live in their own gap so nothing sits over a control or a photo */
.sigcut{height:40px}
.sc-band{top:-6px}
.cursor-rec.off{margin:-86px 0 0 14px}
.sc-band{top:0;height:40px;transform:translateX(calc(var(--j) * var(--k) * 18px)) scaleY(calc(.35 + var(--k) * .65))}
/* ===== r21: the process on a real torn-paper band (photographed paper, lime = highlighter ink) ===== */
section.proc{--pw:max(100%,1400px);--eh:calc(max(100vw,1400px) * .1285);--ink:#1c1917;position:relative;isolation:isolate;color:var(--ink);
  padding-top:calc(var(--eh) * .78 + 24px);padding-bottom:calc(var(--eh) * .72 + 24px)}
section.proc::before{content:"";position:absolute;left:0;right:0;top:calc(var(--eh) * .8);bottom:calc(var(--eh) * .8);z-index:-2;background:#ebe4d4 url(../media/paper-mid-v1.webp) center top/var(--pw) auto repeat-y}
section.proc::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:url(../media/paper-top-v1.webp) center top/var(--pw) auto no-repeat,url(../media/paper-bot-v1.webp) center bottom/var(--pw) auto no-repeat}
section.proc .script-lab{color:var(--ink)}
section.proc .proc-h,section.proc .pc h3{color:var(--ink)}
section.proc .pm{color:var(--ink)!important}
section.proc .pc-lab{display:inline-block;color:var(--ink);padding:2px 10px 2px 6px;margin-left:-6px;background:url(../media/hilite-v1.webp) center/100% 100% no-repeat;mix-blend-mode:multiply}
section.proc .pc-f,section.proc .pc-b{border-top-color:rgba(28,25,23,.35)}
section.proc .pc-b{border-top:2px solid var(--ink)}
section.proc .pc p,section.proc .pc-f .pc-one{color:#3d3833}
section.proc .pc-svc,section.proc .pc-svc li{border-color:rgba(28,25,23,.22)}
section.proc .pc-svc a{color:var(--ink)}section.proc .pc-svc a i{color:var(--ink)}
section.proc .pc-svc a:hover{color:var(--ink);background:url(../media/hilite-v1.webp) left center/100% 70% no-repeat}
section.proc .pc-flip{color:var(--ink);border-color:rgba(28,25,23,.45)}section.proc .pc-flip i{color:var(--ink)}
section.proc .pc-flip:hover,section.proc .pc-f:hover .pc-flip{color:var(--ink);border-color:var(--ink);box-shadow:none;background:url(../media/hilite-v1.webp) center/110% 120% no-repeat}
section.proc .btn::after,section.proc .pc-flip::after{display:none}
section.proc .ptime:before{border-top-color:rgba(28,25,23,.45)}section.proc .ptime i{background:var(--ink);box-shadow:none}
section.proc .pclose p{color:#3d3833}section.proc .pclose .script-lab{color:var(--ink)}
/* teleprompter on paper: the live word gets the highlighter */
section.proc .tp .tp-w.cur{color:var(--ink);text-shadow:none;background:url(../media/hilite-v1.webp) center/104% 82% no-repeat}
section.proc .tp .tp-w{opacity:.22}section.proc .tp .tp-w.lit{opacity:1}
@media (prefers-reduced-motion:reduce){section.proc .tp .tp-w{opacity:1}}

.m-fill{fill:var(--mfill,var(--lime))}section.proc{--mfill:var(--ink)}
section.proc::before{top:calc(var(--eh) * .5);bottom:calc(var(--eh) * .48);-webkit-mask:linear-gradient(transparent,#000 40px,#000 calc(100% - 40px),transparent);mask:linear-gradient(transparent,#000 40px,#000 calc(100% - 40px),transparent)}
.cursor-rec.ink{background:rgba(28,25,23,.92);border-color:#1c1917;color:#f3f1ec}
/* ===== r22 desk-scene hero ===== */
.proof .wrap:not(.brands){grid-template-columns:repeat(2,minmax(0,1fr))}
.hero.dkhero{padding-block:clamp(6px,1.4vw,18px) clamp(24px,3vw,44px);background:#0a0807;overflow:hidden;position:relative}
.hero.dkhero .wrap{display:block;max-width:none;padding-inline:0}
.dk-scene{--tw:max(300px,min(40vw,560px,calc((100svh - 490px) * 1.04)));--pw:max(100%,1180px);--base:calc(var(--pw) * .106);position:relative;display:grid;grid-template-columns:minmax(0,1fr) var(--tw) minmax(0,1fr);align-items:end;padding-bottom:var(--base);max-width:1700px;margin-inline:auto;isolation:isolate}
.dk-bg{position:absolute;z-index:-1;left:50%;bottom:0;width:var(--pw);aspect-ratio:2400/1018;translate:-50% 0;pointer-events:none;-webkit-mask:linear-gradient(transparent,#000 22%,#000 82%,transparent);mask:linear-gradient(transparent,#000 22%,#000 82%,transparent)}
.dk-bg picture{display:contents}.dk-plate{position:absolute;inset:-12px;width:calc(100% + 24px);height:calc(100% + 24px);max-width:none;object-fit:cover;transform:translate(calc(var(--mx,0) * -8px),calc(var(--my,0) * -5px))}
.dk-glow{position:absolute;left:4%;top:-6%;width:52%;height:78%;background:radial-gradient(ellipse 46% 52% at 42% 8%,rgba(255,196,120,.30),rgba(255,170,90,.08) 55%,transparent 72%);mix-blend-mode:screen;animation:dkflick 9s steps(1) infinite}
@keyframes dkflick{0%,100%{opacity:1}31%{opacity:.86}32%{opacity:1}57%{opacity:.92}58%{opacity:.8}59%{opacity:1}83%{opacity:.9}84%{opacity:1}}
.dk-dust{position:absolute;left:18%;top:-4%;width:46%;height:72%;background:url(../media/dust-v1.webp) center/cover;mix-blend-mode:screen;opacity:.5;-webkit-mask:radial-gradient(ellipse 50% 50% at 50% 45%,#000 30%,transparent 75%);mask:radial-gradient(ellipse 50% 50% at 50% 45%,#000 30%,transparent 75%);animation:dkdrift 38s ease-in-out infinite alternate;translate:calc(var(--mx,0) * 14px) calc(var(--my,0) * 8px)}
.dk-dust.d2{left:26%;width:40%;opacity:.32;transform:scale(1.5) rotate(180deg);animation-duration:53s;animation-direction:alternate-reverse}
@keyframes dkdrift{0%{background-position:40% 20%}100%{background-position:60% 80%}}
.dk-side{position:relative;height:calc(var(--tw) * .6);align-self:end;translate:calc(var(--mx,0) * 10px) calc(var(--my,0) * 4px);z-index:2}
.dk-scene>.tv{grid-column:2;max-width:none;margin:0;width:100%;translate:calc(var(--mx,0) * 3px) calc(var(--my,0) * 2px);z-index:1}
.dk-p{position:absolute;bottom:0}
.dk-p img{display:block;width:100%;height:auto;filter:drop-shadow(0 14px 14px rgba(0,0,0,.65)) drop-shadow(0 2px 3px rgba(0,0,0,.8))}
.dk-tapes{width:calc(var(--tw) * .34);right:8%;bottom:calc(var(--tw) * .02)}
.dk-cam{width:calc(var(--tw) * .42);right:40%;bottom:calc(var(--tw) * -.02)}
.dk-still{width:calc(var(--tw) * .28);right:27%;bottom:calc(var(--tw) * -.075);z-index:2}
.dk-tape{width:calc(var(--tw) * .17);right:5%;bottom:calc(var(--tw) * -.06);z-index:3}
.dk-stack{width:calc(var(--tw) * .5);left:22%;bottom:calc(var(--tw) * .0)}
.dk-lean{width:calc(var(--tw) * .23);left:9%;bottom:calc(var(--tw) * -.05);z-index:2}
.dk-scene .btape{position:relative;inset:auto;width:100%;aspect-ratio:auto;display:block;padding:0;rotate:-7deg;border-radius:10px}
.dk-scene .btape img,.dk-scene .bt-tape{position:relative;left:auto;bottom:auto;width:100%;transform:none}
.dk-scene .btape:hover .bt-tape,.dk-scene .btape:focus-visible .bt-tape{transform:translateY(-6px)}
.dk-book{display:block;width:100%;padding:0;border:0;background:none;cursor:pointer;rotate:9deg;transform-origin:0 100%;border-radius:10px;transition:rotate .35s cubic-bezier(.2,.8,.2,1)}
.dk-book:hover,.dk-book:focus-visible{rotate:5deg}
.dk-book .bt-book{position:static;width:100%;transform:none}
.dk-book,.dk-scene .btape{position:relative}
.dk-book::after,.dk-scene .btape::after{content:"";position:absolute;inset:-6px;border-radius:12px;padding:2px;background:conic-gradient(from var(--tr,0deg),transparent 0 60%,var(--lime) 80%,transparent 100%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);opacity:0;transition:opacity .25s;pointer-events:none}
.dk-book:hover::after,.dk-book:focus-visible::after,.dk-scene .btape:hover::after,.dk-scene .btape:focus-visible::after{opacity:1;animation:trace 1.6s linear infinite}
.dk-book:focus-visible,.dk-scene .btape:focus-visible{outline:0}
.dk-scene .tv .guide{position:absolute;top:100%;left:50%;translate:-50% 0;margin-top:calc(var(--base) * .22);width:max-content;max-width:calc(100vw - 32px)}
.dk-scene .tv .tv-help{position:absolute;top:100%;left:0;right:0;margin-top:calc(var(--base) * .22 + 46px);white-space:nowrap}
.dk-copy{text-align:center;max-width:860px;margin:calc(var(--base,0px) * -.05) auto 0;padding-inline:16px;position:relative;z-index:3}
.dk-copy .hero-air{justify-content:center}
.dk-copy h1{margin-inline:auto}
.hero.dkhero h1 .script-w{margin:-.2em auto 0;transform:rotate(-3deg) translateX(.9em);transform-origin:center}
.dk-copy .hero-lede{margin-inline:auto;max-width:62ch}
.dk-copy .cta-row{justify-content:center}
.dk-copy .reel-link{margin-inline:auto}
@media (max-width:900px){
 .dk-scene{--tw:min(calc(100vw - 32px),560px);--pw:max(210vw,100%);--base:calc(100vw * .13);grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"tv tv" "l r";padding-inline:16px;margin-bottom:58px}
 .dk-bg{left:44%}
 .dk-scene>.tv{grid-area:tv;position:static;translate:none;max-width:var(--tw);justify-self:center}
 .dk-scene .crt{position:relative}
 .dk-side{height:calc(var(--tw) * .3);translate:none}
 .dk-l{grid-area:l}.dk-r{grid-area:r}
 .dk-tapes{width:calc(var(--tw) * .24);right:-2%;bottom:8%}
 .dk-cam{width:calc(var(--tw) * .3);right:auto;left:-3%;bottom:2%}
 .dk-still{display:none}
 .dk-tape{width:calc(var(--tw) * .14);right:14%;bottom:-2%}
 .dk-stack{width:calc(var(--tw) * .3);left:auto;right:-3%;bottom:4%}
 .dk-lean{width:calc(var(--tw) * .14);left:8%;bottom:-2%}
 .dk-scene .tv .guide{top:auto;bottom:-58px;left:16px;right:16px;translate:none;width:auto;max-width:none;margin:0}
}
@media (prefers-reduced-motion:reduce){.dk-glow,.dk-dust{animation:none}.dk-plate,.dk-side,.dk-dust,.dk-scene>.tv{translate:none;transform:none}}
@media (max-width:900px) and (min-width:761px){.dk-side{width:calc(var(--tw) / 2);justify-self:center}.dk-l{justify-self:end}.dk-r{justify-self:start}}
@media (max-width:900px){.dk-scene{margin-bottom:0}.dk-copy .guide{position:static!important;translate:none!important;margin:22px 0 0!important;width:auto!important;max-width:none!important}}
@media (max-width:760px){
 .dk-scene{--base:calc(100vw * .05)}
 .dk-side{height:calc(var(--tw) * .2)}
 .dk-copy{margin-top:2px}
 .dk-copy .hero-air{margin-bottom:4px}
 .dk-copy .guide{position:static!important;translate:none!important;margin:22px 0 0!important;width:auto!important;max-width:none!important}
}
@media (max-width:760px){.smile-w{transition:opacity .35s,visibility .35s}html:not(.scrolled) .smile-w{opacity:0;visibility:hidden}}
/* ===== r23 35mm film strip ===== */
.film{--fh:clamp(250px,24vw,330px);--fw:calc(var(--fh) * 280 / 443);position:relative;overflow:hidden;margin-top:clamp(30px,4vw,60px);padding-block:14px;cursor:grab;touch-action:pan-y;user-select:none;-webkit-user-select:none;outline:0;-webkit-mask:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.film.drag{cursor:grabbing}
.film:focus-visible{box-shadow:inset 0 0 0 2px var(--lime)}
.film-track{display:flex;width:max-content;will-change:transform}
.fm{position:relative;flex:none;width:var(--fw);height:var(--fh);margin:0}
.fm::after{content:"";position:absolute;inset:0;z-index:2;background:url(../media/film-tile-v2.webp) 0 0/100% 100% no-repeat;pointer-events:none}
.fm::before{content:"";position:absolute;left:-8%;right:-8%;top:12%;bottom:12%;z-index:0;background:radial-gradient(ellipse 50% 50% at 50% 50%,rgba(255,214,150,.38),transparent 70%);opacity:0;transition:opacity .45s}
.fm img,.fm-v{position:absolute;left:3.3%;width:93.4%;top:22.3%;height:55.5%;border-radius:4px}
.fm img{z-index:1;object-fit:cover;filter:sepia(.45) saturate(.6) brightness(.55) contrast(1.05);transition:filter .45s}
.fm-v{z-index:3;margin:0;display:grid;align-content:center;gap:.5em;padding:9% 10%;text-align:center;opacity:0;transform:translateY(6px);transition:opacity .45s,transform .45s;background:radial-gradient(ellipse at 50% 50%,rgba(10,8,6,.62),rgba(10,8,6,.35));pointer-events:none}
.fm-v p{margin:0;font-weight:700;font-size:clamp(12px,1.05vw,15px);line-height:1.25;color:#f3ead8;text-wrap:balance;text-shadow:0 1px 6px rgba(0,0,0,.8)}
.fm-v cite{font-style:normal;font-family:var(--f-osd);font-size:clamp(11px,.9vw,13px);letter-spacing:.06em;color:var(--lime)}
.fm.lit::before{opacity:1}
.fm.lit img{filter:sepia(.1) saturate(.95) brightness(.72)}
.fm.lit .fm-v{opacity:1;transform:none}
.film-hint{text-align:center;font-family:var(--f-osd);font-size:14px;letter-spacing:.08em;color:var(--mute);margin:6px 0 0}
@media (max-width:760px){.film{--fh:250px;margin-top:26px;-webkit-mask:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);mask:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}.fm-v{padding:8%}.fm-v p{font-size:12.5px}}
@media (prefers-reduced-motion:reduce){.fm img,.fm-v,.fm::before{transition:none}}
/* r23b: lime buttons get an always-on orbit: a glowing line circling just outside the edge */
@property --orb{syntax:"<angle>";inherits:false;initial-value:0deg}
.btn.solid::before{content:"";position:absolute;inset:-6px;border-radius:999px;padding:2.5px;pointer-events:none;z-index:0;
  background:conic-gradient(from var(--orb),rgba(196,216,47,.10) 0 40%,rgba(196,216,47,.35) 62%,var(--lime) 80%,#fbffe0 88%,var(--lime) 91%,rgba(196,216,47,.10) 94%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
  filter:drop-shadow(0 0 5px rgba(196,216,47,.95)) drop-shadow(0 0 14px rgba(196,216,47,.5));animation:orbit 2.6s linear infinite}
.btn.solid:is(:hover,:focus-visible)::before{animation-duration:1.2s}
.btn.solid::after{display:none}
.btn.solid[hidden]::before{display:none}
.cs-foot .btn.solid::before{display:none}
@keyframes orbit{to{--orb:360deg}}
@media (prefers-reduced-motion:reduce){.btn.solid::before{animation:none;background:conic-gradient(from 300deg,transparent 0 58%,var(--lime) 88%,transparent 95%)}}
/* r23b: straight-on TV (v3) and its control map */
.crt{aspect-ratio:1767/1697;background-image:url(../media/tv-tutto-v3.webp)}
.scr{left:12.6%;width:76%;top:12.1%;height:61.6%;border-radius:7% / 9.5%}
.tvpanel .knob{left:15.1%;top:86.3%;width:8.2%;background-image:url(../media/tv-knob-v3.webp)}
.tvpanel .pwr{left:7.4%;top:88.8%;width:3.4%;height:5.6%}.tvpanel .pwr .led{left:50%;top:-55%}
.vslot{left:28.5%;top:86%;width:44%;height:8.8%}
.tvbtn[data-tv="up"],.tvbtn[data-tv="down"],.tvbtn.ok,.tvbtn[data-tv="pause"]{top:86.3%;width:2.7%;height:8.3%}
.tvbtn[data-tv="up"]{left:77.1%}.tvbtn[data-tv="down"]{left:81.2%}.tvbtn.ok{left:85.4%}.tvbtn[data-tv="pause"]{left:89.6%}
/* r23c: bigger invisible tap areas for the TV keys and power on touch screens (art unchanged) */
@media (pointer:coarse){
 .tvpanel .tvbtn::before,.tvpanel .pwr::before{content:"";position:absolute;top:50%;height:max(100%,44px);translate:0 -50%}
 .tvpanel .tvbtn::before{width:236%}
 .tvbtn[data-tv="up"]::before{left:-133%}.tvbtn[data-tv="down"]::before{left:-60%}.tvbtn.ok::before{left:12%}.tvbtn[data-tv="pause"]::before{left:85%}
 .tvpanel .pwr::before{left:50%;width:max(100%,32px);height:max(100%,32px);translate:-50% -50%}
}
/* ===== r24 Viewfinder mode ===== */
.dk-vf{display:block;width:100%;padding:0;border:0;background:none;cursor:pointer;border-radius:12px;position:relative}
.dk-vf img{transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.dk-vf:hover img,.dk-vf:focus-visible img{transform:translateY(-4px)}
.dk-vf::after{content:"";position:absolute;inset:-6px;border-radius:14px;padding:2px;background:conic-gradient(from var(--tr,0deg),transparent 0 60%,var(--lime) 80%,transparent 100%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);opacity:0;transition:opacity .25s;pointer-events:none}
.dk-vf:hover::after,.dk-vf:focus-visible::after,.dk-vf[aria-pressed="true"]::after{opacity:1;animation:trace 1.6s linear infinite}
.dk-vf:focus-visible{outline:0}
.vf-raw{position:fixed;inset:0;z-index:88;pointer-events:none;opacity:0;transition:opacity .35s;-webkit-backdrop-filter:saturate(.2) contrast(.74) brightness(1.08) sepia(.08);backdrop-filter:saturate(.2) contrast(.74) brightness(1.08) sepia(.08);
  -webkit-mask:linear-gradient(#000 0 0),linear-gradient(#000 0 0) var(--vx,-999px) var(--vy,-999px)/var(--vw,0) var(--vh,0) no-repeat;-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) exclude,linear-gradient(#000 0 0) var(--vx,-999px) var(--vy,-999px)/var(--vw,0) var(--vh,0) no-repeat}
.vf-frame{position:fixed;left:0;top:0;z-index:9991;width:300px;aspect-ratio:16/9;pointer-events:none;opacity:0;transition:opacity .35s;box-shadow:0 0 0 1px rgba(255,255,255,.18),0 0 40px rgba(0,0,0,.35);font-family:var(--f-osd);font-size:13px;letter-spacing:.08em;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.9)}
.vf-c{position:absolute;width:18px;height:18px;border:2px solid var(--lime)}
.vf-c.tl{left:-2px;top:-2px;border-right:0;border-bottom:0}.vf-c.tr{right:-2px;top:-2px;border-left:0;border-bottom:0}.vf-c.bl{left:-2px;bottom:-2px;border-right:0;border-top:0}.vf-c.br{right:-2px;bottom:-2px;border-left:0;border-top:0}
.vf-x{position:absolute;left:50%;top:50%;width:18px;height:18px;translate:-50% -50%;background:linear-gradient(var(--lime),var(--lime)) center/100% 1.5px no-repeat,linear-gradient(var(--lime),var(--lime)) center/1.5px 100% no-repeat;opacity:.9}
.vf-rec{position:absolute;left:8px;top:6px;display:flex;align-items:center;gap:5px}
.vf-rec b{width:8px;height:8px;border-radius:50%;background:#ff3b30;box-shadow:0 0 6px #ff3b30;animation:vfblink 1s steps(1) infinite}
@keyframes vfblink{50%{opacity:0}}
.vf-tc{position:absolute;right:8px;top:6px}
.vf-l{position:absolute;left:8px;bottom:6px;color:var(--lime)}
.vf-raw-l{position:absolute;right:0;bottom:calc(100% + 8px);padding:2px 6px;border-radius:3px;background:rgba(0,0,0,.6);color:#d9d4c8;font-size:12px}
.vf-exit{white-space:nowrap;position:fixed;left:50%;bottom:max(16px,env(safe-area-inset-bottom));translate:-50% 0;z-index:9992;display:none;min-height:44px;padding:0 18px;border-radius:999px;border:1px solid var(--lime);background:rgba(10,8,6,.86);color:var(--lime);font-family:var(--f-osd);font-size:15px;letter-spacing:.08em;cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.vfm .vf-raw,.vfm .vf-frame{opacity:1}
.vfm .vf-exit{display:inline-flex;align-items:center;gap:.5em}
@media (hover:hover) and (pointer:fine){html.vfm,html.vfm *{cursor:none!important}html.vfm .vf-exit{cursor:pointer!important}}
.vfm .cursor-rec{opacity:0!important}
.vfm .smile-w{visibility:hidden}
@media (max-width:760px){.vf-frame{width:min(250px,70vw)}}
@media (prefers-reduced-motion:reduce){.vf-rec b{animation:none}.vf-raw,.vf-frame{transition:none}}
@media (min-width:1280px){.vf-frame{width:420px}}
.vf-exit{box-shadow:0 0 0 6px rgba(5,4,3,.55),0 10px 30px rgba(0,0,0,.6)}
/* r25: dead-on 5:4 TV (v4) and its control map */
.crt{aspect-ratio:1881/1574;background-image:url(../media/tv-tutto-v4.webp)}
.scr{left:10.6%;width:78.6%;top:10.8%;height:67%;border-radius:9% / 12%}
.tvpanel .knob{left:18.2%;top:87.8%;width:6.8%;background-image:url(../media/tv-knob-v4.webp)}
.tvpanel .pwr{left:3.4%;top:88.6%;width:7.6%;height:5.4%}.tvpanel .pwr .led{left:16%;top:50%;transform:translate(-50%,-50%)}
.vslot{left:30.8%;top:87.5%;width:38.5%;height:7.1%}
.tvbtn[data-tv="up"],.tvbtn[data-tv="down"],.tvbtn.ok,.tvbtn[data-tv="pause"]{top:87.8%;width:2.4%;height:6.5%}
.tvbtn[data-tv="up"]{left:76.2%}.tvbtn[data-tv="down"]{left:80.3%}.tvbtn.ok{left:84.5%}.tvbtn[data-tv="pause"]{left:88.7%}
/* r25: fixed-size centre plate, table extends either side at any width */
@media (min-width:901px){
 .dk-scene{--tw:max(300px,min(44vw,640px,calc((100svh - 472px) * 1.195)));--pw:1440px}
 .dk-bg{-webkit-mask:linear-gradient(transparent,#000 22%,#000 82%,transparent),linear-gradient(90deg,transparent,#000 5.5%,#000 94.5%,transparent);-webkit-mask-composite:source-in;mask:linear-gradient(transparent,#000 22%,#000 82%,transparent),linear-gradient(90deg,transparent,#000 5.5%,#000 94.5%,transparent);mask-composite:intersect}
 .dk-plate{inset:auto;left:-12px;bottom:-12px;width:calc(100% + 24px);height:auto;object-fit:fill}
 .dk-scene::before,.dk-scene::after{content:"";position:absolute;z-index:-2;bottom:0;height:calc(var(--pw) * .42417);width:calc(50vw - var(--pw) / 2 + 80px);pointer-events:none;background-repeat:no-repeat,repeat-x;background-size:100% 100%,auto calc((var(--pw) + 24px) * .42417);-webkit-mask:linear-gradient(transparent,#000 22%,#000 82%,transparent);mask:linear-gradient(transparent,#000 22%,#000 82%,transparent);transform:translate(calc(var(--mx,0) * -8px),calc(var(--my,0) * -5px))}
 .dk-scene::before{right:calc(50% + var(--pw) / 2 - 80px);background-image:linear-gradient(to left,transparent 80px,rgba(10,8,7,.35) 45%,rgba(10,8,7,.9)),url(../media/desk-side-v1.webp);background-position:0 0,calc(100% - 92px) 2px}
 .dk-scene::after{left:calc(50% + var(--pw) / 2 - 80px);background-image:linear-gradient(to right,transparent 80px,rgba(10,8,7,.35) 45%,rgba(10,8,7,.9)),url(../media/desk-side-v1.webp);background-position:0 0,92px 2px}
}
/* r25: contact shadows and the CRT's light on the table */
.dk-scene>.tv::after{content:"";position:absolute;z-index:-1;left:4%;right:4%;bottom:-1.5%;height:7%;border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.85),rgba(0,0,0,.45) 60%,transparent);filter:blur(4px);pointer-events:none}
.dk-bg::after{content:"";position:absolute;left:50%;top:50%;width:calc(var(--tw) * 1.9);height:46%;translate:-50% 0;background:radial-gradient(ellipse 50% 46% at 50% 42%,rgba(190,225,255,.20),rgba(196,216,47,.07) 55%,transparent 78%);mix-blend-mode:screen;pointer-events:none;animation:crtglow 6s ease-in-out infinite;transition:opacity .5s}
@keyframes crtglow{0%,100%{opacity:1}45%{opacity:.82}52%{opacity:.95}}
.dk-scene:has(.tv.isoff) .dk-bg::after{opacity:0;animation:none}
.dk-p img{filter:drop-shadow(0 10px 12px rgba(0,0,0,.7)) drop-shadow(0 2px 2px rgba(0,0,0,.85))}
@media (prefers-reduced-motion:reduce){.dk-bg::after{animation:none}}
/* ===== r26: always-on orbit glow on chosen elements ===== */
.orb,.tabs button,.myth{position:relative}
:is(.orb,.tabs button[aria-selected="true"],.myth:is(:hover,:focus-visible))::before{content:"";position:absolute;inset:-5px;border-radius:var(--orr,999px);padding:2px;pointer-events:none;z-index:4;
  background:conic-gradient(from var(--orb),rgba(196,216,47,.10) 0 40%,rgba(196,216,47,.35) 62%,var(--lime) 80%,#fbffe0 88%,var(--lime) 91%,rgba(196,216,47,.10) 94%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
  filter:drop-shadow(0 0 5px rgba(196,216,47,.95)) drop-shadow(0 0 14px rgba(196,216,47,.5));animation:orbit 3.2s linear infinite}
:is(.orb,.tabs button[aria-selected="true"]):is(:hover,:focus-visible)::before{animation-duration:1.4s}
.tabs{padding:8px 8px 14px;margin-inline:-8px}
.tabs button{--orr:16px}
.myth{--orr:21px}.myth:is(:hover,:focus-visible)::before{animation-duration:2s}
@media (prefers-reduced-motion:reduce){:is(.orb,.tabs button[aria-selected="true"],.myth:is(:hover,:focus-visible))::before{animation:none;background:conic-gradient(from 300deg,transparent 0 58%,var(--lime) 88%,transparent 95%)}}
/* ===== r26: Tutto Reel Generator card ===== */
.reelcall .wrap{display:flex;justify-content:center}
.rg-call.orb{--orr:24px;width:min(100%,820px);display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:clamp(18px,3vw,40px);padding:clamp(22px,3.4vw,44px) clamp(22px,3.6vw,48px);border-radius:20px;background:radial-gradient(ellipse 60% 90% at 85% 50%,rgba(196,216,47,.08),transparent 70%),#121011}
.rg-k{display:flex;align-items:center;gap:10px;font:clamp(18px,1.8vw,24px)/1 var(--f-osd);letter-spacing:.14em;color:#e9e4d8;text-transform:uppercase}
.rg-rec{width:12px;height:12px;border-radius:50%;background:#e3241b;box-shadow:0 0 0 3px rgba(227,36,27,.2),0 0 12px rgba(227,36,27,.85);animation:recblink 1.2s steps(1) infinite}
@keyframes recblink{50%{opacity:.25}}
.rg-t{gap:clamp(8px,1vw,14px)}
.rg-t .rg-h{font-weight:900;font-size:clamp(32px,4.6vw,62px);line-height:.98;letter-spacing:-.02em;color:var(--white)}
.rg-s{font-size:clamp(16px,1.4vw,19px);color:#b9b6ae;font-weight:400}
.rg-reel{width:clamp(120px,15vw,210px);aspect-ratio:1;filter:drop-shadow(0 14px 22px rgba(0,0,0,.7)) drop-shadow(0 0 18px rgba(196,216,47,.12))}
.rg-reel img{display:block;width:100%;height:100%;animation:reelspin 7s linear infinite}
.rg-call:is(:hover,:focus-visible) .rg-reel img{animation-duration:2.2s}
@keyframes reelspin{to{rotate:360deg}}
@media (max-width:560px){.rg-call.orb{grid-template-columns:minmax(0,1fr) 34%;gap:14px;flex-wrap:nowrap}}
@media (prefers-reduced-motion:reduce){.rg-reel img,.rg-rec{animation:none}}
/* ===== r26: film strip with one full-width verse, tilted ===== */
.filmsec{position:relative;overflow:hidden;padding-block:clamp(56px,7vw,110px) clamp(70px,9vw,140px);background:radial-gradient(ellipse 70% 60% at 50% 70%,rgba(196,216,47,.05),transparent 70%)}
.fq{margin:0;padding-inline:clamp(16px,3vw,48px);text-align:center;position:relative;z-index:2}
.fq p{margin:0 auto;max-width:none;font-weight:900;font-size:clamp(34px,5.6vw,96px);line-height:1;letter-spacing:-.025em;color:#f1ebdd;text-wrap:balance}
.fq em{font-family:var(--f-script,inherit);font-style:normal;font-weight:400;color:var(--lime);letter-spacing:0;text-shadow:0 0 24px rgba(196,216,47,.35)}
.fq cite{display:block;margin-top:clamp(12px,1.4vw,20px);font:clamp(15px,1.3vw,19px)/1 var(--f-osd);font-style:normal;letter-spacing:.12em;color:var(--lime)}
.film-tilt{width:116vw;margin-left:calc(50% - 58vw);rotate:-4deg;margin-top:clamp(28px,4vw,56px)}
.film-tilt .film{margin-top:0;-webkit-mask:none;mask:none}
@media (max-width:760px){.fq p{font-size:clamp(30px,8.4vw,44px)}.film-tilt{rotate:-4deg;width:124vw;margin-left:calc(50% - 62vw)}}
/* ===== r26: recent work fans out like a hand of cards ===== */
.wfan{--cw:clamp(190px,19vw,270px);--sp:6%;--rt:1.5deg;--dy:0px;position:relative;height:calc(var(--cw) * 1.25 + 120px);margin-top:20px}
.wfan.open{--sp:72%;--rt:6.5deg;--dy:9px}
.wfan .fc{position:absolute;left:50%;bottom:70px;width:var(--cw);margin-left:calc(var(--cw) / -2);aspect-ratio:4/5;transform-origin:50% 140%;
  transform:translateX(calc(var(--i) * var(--sp))) rotate(calc(var(--i) * var(--rt))) translateY(calc(var(--i) * var(--i) * var(--dy)));
  transition:transform .9s cubic-bezier(.2,.9,.25,1),box-shadow .3s;box-shadow:0 18px 40px rgba(0,0,0,.6);z-index:3}
.wfan .fc:nth-child(2),.wfan .fc:nth-child(4){z-index:2}.wfan .fc:nth-child(1),.wfan .fc:nth-child(5){z-index:1}
.wfan .fc:nth-child(1){transition-delay:.12s}.wfan .fc:nth-child(5){transition-delay:.12s}.wfan .fc:nth-child(2),.wfan .fc:nth-child(4){transition-delay:.06s}
.wfan.open .fc:is(:hover,:focus-visible){transform:translateX(calc(var(--i) * var(--sp))) translateY(-26px) rotate(0deg) scale(1.06);z-index:6;transition-delay:0s;box-shadow:0 30px 60px rgba(0,0,0,.7),0 0 0 1px rgba(196,216,47,.5)}
.wfan .fc .meta{padding:50px 16px 16px}.wfan .fc .meta b{font-size:17px}.wfan .fc .meta span{font-size:15px}
@media (max-width:1100px) and (min-width:761px){.wfan.open{--sp:56%}}
@media (max-width:760px){.wfan{--cw:35vw;height:calc(var(--cw) * 1.25 + 64px)}.wfan .fc{bottom:34px;transform-origin:50% 105%}.wfan.open{--sp:33%;--rt:5deg;--dy:4px}.wfan .fc .meta{padding:36px 10px 10px}.wfan .fc .meta b{font-size:14px}.wfan .fc .meta span{font-size:12px}}
@media (prefers-reduced-motion:reduce){.wfan .fc{transition:none}}
/* ===== r26: call sheet clapperboard, open until the form is sent ===== */
.callsheet{margin-top:clamp(70px,9vw,120px)}
.cs-clap{position:relative;display:block;height:30px;margin:0 calc(-1 * clamp(16px,3vw,30px)) 16px;background:none;overflow:visible;border-radius:0}
.clap-bar,.clap-arm{position:absolute;left:0;right:0;height:30px;display:flex;overflow:hidden;background:linear-gradient(#262626,#0d0d0d);box-shadow:inset 0 1px 0 rgba(255,255,255,.18),inset 0 -2px 0 rgba(0,0,0,.6)}
.clap-bar{bottom:0;border-radius:6px 6px 0 0}
.clap-arm{bottom:31px;border-radius:5px;transform-origin:14px 100%;transform:rotate(-12deg);box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 10px 18px rgba(0,0,0,.45)}
.clap-bar i,.clap-arm i{flex:1;margin-left:-8px;transform:skewX(-32deg)}.clap-arm i{transform:skewX(32deg)}
.cs-clap .clap-bar i,.cs-clap .clap-arm i{background:none;flex:1;margin-left:-8px}
.cs-clap .clap-bar i:nth-child(odd),.cs-clap .clap-arm i:nth-child(even){background:linear-gradient(#fbfaf6,#d9d6cf)}
.clap-pin{position:absolute;left:5px;bottom:24px;width:18px;height:18px;border-radius:50%;z-index:2;background:radial-gradient(circle at 35% 30%,#f4f4f4,#8f8f8f 55%,#3d3d3d);box-shadow:0 2px 4px rgba(0,0,0,.6)}
.callsheet.clapped .clap-arm{transform:rotate(0deg);animation:clapsnap .32s cubic-bezier(.7,0,1,.6) both}
@keyframes clapsnap{0%{transform:rotate(-12deg)}100%{transform:rotate(0deg)}}
.cs-action{position:absolute;inset:0;z-index:5;display:grid;place-items:center;pointer-events:none;opacity:0}
.cs-action span{font-weight:900;font-size:clamp(56px,9vw,128px);line-height:1;letter-spacing:-.02em;color:#b3170a;border:6px solid #b3170a;border-radius:10px;padding:.08em .22em;background:rgba(239,234,223,.93);rotate:-8deg;box-shadow:0 20px 50px rgba(0,0,0,.35);mix-blend-mode:multiply}
.callsheet.clapped .cs-action{animation:actstamp .5s cubic-bezier(.2,1.4,.4,1) .3s both}
@keyframes actstamp{0%{opacity:0;transform:scale(1.7)}60%{opacity:1}100%{opacity:1;transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.callsheet.clapped .clap-arm,.callsheet.clapped .cs-action{animation:none}.callsheet.clapped .cs-action{opacity:1}}
/* ===== r26: shorter feed scroll (two posts on the page scroll, the rest over the phone) ===== */
@media (prefers-reduced-motion:no-preference){.feed{height:calc(100vh + 240vh)}}
@media (max-width:760px){
 .wfan .fc .meta{transition:opacity .3s}
 .wfan .fc:not(.front) .meta{opacity:0}
 .wfan.open .fc.front{z-index:7;transform:translateX(calc(var(--i) * var(--sp))) translateY(-14px) rotate(0deg) scale(1.08);transition-delay:0s;box-shadow:0 26px 50px rgba(0,0,0,.75),0 0 0 1px rgba(196,216,47,.55)}
}
@media (max-width:760px){.cs-action{align-items:start;padding-top:210px}}
/* r27: bigger hero tape (+70%) and leaning book (+50%); real-world scale on the left (VHS 187mm, Z8 body 144mm, Komodo rig ~300mm) */
@media (min-width:901px){
 .dk-tape{width:calc(var(--tw) * .289);right:2%;bottom:calc(var(--tw) * -.07)}
 .dk-lean{width:calc(var(--tw) * .345);left:2%;bottom:calc(var(--tw) * -.06)}
 .dk-tapes{width:calc(var(--tw) * .36);right:16%;bottom:calc(var(--tw) * .085);z-index:0}
 .dk-cam{width:calc(var(--tw) * .45);right:47%;z-index:1}
 .dk-still{width:calc(var(--tw) * .42);right:27%;bottom:calc(var(--tw) * -.085)}
}
@media (max-width:900px){.dk-tapes{right:-4%;bottom:26%;z-index:0}.dk-tape{width:calc(var(--tw) * .238);right:16%;bottom:-4%}.dk-lean{width:calc(var(--tw) * .21);left:4%;bottom:-4%}}
/* ===== r27: call sheet as a 3-step form in a square slate ===== */
.callsheet{max-width:600px;width:100%;justify-self:end}
.cs-steps{list-style:none;margin:2px 0 4px;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;border-top:1px solid rgba(0,0,0,.18);padding-top:12px}
.cs-steps button{width:100%;display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:6px 8px;border:2px solid #111;border-radius:4px;background:transparent;color:#111;font:17px/1 var(--f-osd);letter-spacing:.12em;cursor:pointer;white-space:nowrap}
.cs-steps button .cs-n{background:#111;color:var(--lime);padding:3px 5px;border-radius:2px}
.cs-steps button[aria-current="step"]{background:#111;color:#efeadf}
.cs-steps button[aria-current="step"] .cs-n{background:var(--lime);color:#111}
.cs-steps button:disabled{opacity:.35;cursor:default}
.cs-steps button:not(:disabled):not([aria-current]):hover{background:rgba(196,216,47,.3)}
.cs-stack{display:grid}
.cs-step{grid-area:1/1;border:0;margin:0;padding:0;min-width:0;display:grid;gap:14px;align-content:start;transition:opacity .3s,transform .3s}
.cs-step[hidden]{display:grid;visibility:hidden;opacity:0;transform:translateX(14px);pointer-events:none}
.cs-step .fld textarea{min-height:178px}
.cs-foot{justify-content:flex-start}
.cs-foot .btn.solid::before{display:block}
.cs-foot .btn.solid{--orr:999px}
.cs-foot .btn.ghost{border-color:#111;color:#111;background:transparent}
.cs-foot .btn.ghost:hover{background:rgba(0,0,0,.06)}
.cs-foot .cs-sig{margin-left:auto;font:17px/1 var(--f-osd);letter-spacing:.14em;color:#6a655c}
@media (max-width:560px){.cs-steps button{font-size:14px;gap:5px;letter-spacing:.06em;padding:6px 4px}.cs-foot .cs-sig{width:100%;margin-left:0}}
@media (prefers-reduced-motion:reduce){.cs-step{transition:none}}
/* ===== r27: headline: static glitch on "We mean", flickering neon on "everything." ===== */
.glw{position:relative;display:inline-block;animation:glwM 4.6s steps(1) infinite}
.glw::before,.glw::after{content:attr(data-t);position:absolute;left:0;top:0;width:100%;white-space:nowrap;pointer-events:none;opacity:0;mix-blend-mode:screen;background:url(../media/noise.png) 0 0/90px;-webkit-background-clip:text;background-clip:text}
.glw::before{color:#ff2b4a;animation:glwA 4.6s steps(1) infinite}
.glw::after{color:#29e0ff;animation:glwB 4.6s steps(1) infinite}
@keyframes glwA{0%,71%,100%{opacity:0;transform:none;clip-path:inset(0)}72%{opacity:.9;transform:translate(-4px,1px);clip-path:inset(12% 0 58% 0)}74%{opacity:.9;transform:translate(5px,-1px);clip-path:inset(62% 0 8% 0)}76%{opacity:.75;transform:translate(-2px,0);clip-path:inset(34% 0 40% 0)}78%{opacity:0}90%{opacity:.85;transform:translate(3px,0);clip-path:inset(70% 0 4% 0)}91%{opacity:0}}
@keyframes glwB{0%,71%,100%{opacity:0;transform:none;clip-path:inset(0)}72%{opacity:.9;transform:translate(4px,-1px);clip-path:inset(48% 0 20% 0)}74%{opacity:.9;transform:translate(-5px,1px);clip-path:inset(4% 0 70% 0)}76%{opacity:.75;transform:translate(3px,0);clip-path:inset(20% 0 52% 0)}78%{opacity:0}90%{opacity:.85;transform:translate(-3px,0);clip-path:inset(8% 0 66% 0)}91%{opacity:0}}
@keyframes glwM{0%,71%,79%,89%,92%,100%{transform:none;opacity:1}72%{transform:translateX(2px) skewX(-6deg);opacity:.85}74%{transform:translateX(-3px)}76%{transform:translateX(1px) skewX(4deg);opacity:.9}90%{transform:translateX(-2px)}}
.hero.dkhero h1 .script-w{text-shadow:0 0 4px rgba(214,236,70,.9),0 0 14px rgba(196,216,47,.75),0 0 34px rgba(196,216,47,.45),0 0 70px rgba(196,216,47,.25);animation:neonflk 7s linear infinite}
@keyframes neonflk{0%,18%,22%,25%,53%,57%,100%{opacity:1;text-shadow:0 0 4px rgba(214,236,70,.9),0 0 14px rgba(196,216,47,.75),0 0 34px rgba(196,216,47,.45),0 0 70px rgba(196,216,47,.25)}
 20%,24%,55%{opacity:.55;text-shadow:none}21%{opacity:.9}56%{opacity:.8;text-shadow:0 0 3px rgba(214,236,70,.6)}}
@media (prefers-reduced-motion:reduce){.glw,.glw::before,.glw::after,.hero.dkhero h1 .script-w{animation:none}}
/* ===== r27: channel guide as a staggered sideways gallery that fades from night to paper ===== */
.rail2{--k:0;--rh:min(60vh,560px);--rfg:color-mix(in srgb,#f1ebdd,#1c1917 calc(var(--k) * 100%));--rmu:color-mix(in srgb,#9c988f,#6a655c calc(var(--k) * 100%));background:color-mix(in srgb,#0b0a0a,#ece5d6 calc(var(--k) * 100%));color:var(--rfg)}
.rail2 .h2,.rail2 .eyebrow{color:var(--rfg)}
.rail2 .rail-tr{gap:clamp(30px,4.2vw,72px);align-items:flex-start;padding-block:8px 0}
.rail2.pinned .rail-tr{height:var(--rh)}
.rail2 .rail-dup{display:contents}.rail2.pinned .rail-dup{display:none}
.rail2 .rcol{flex:none;display:flex;flex-direction:column;gap:clamp(18px,2.4vh,28px)}
.rail2 .c-lo{padding-top:calc(var(--rh) * .2)}.rail2 .c-dn{padding-top:calc(var(--rh) * .08)}.rail2 .c-up{padding-top:0}
.rail2 .ri{flex:none;display:flex;flex-direction:column;gap:8px;background:none;border:0;border-radius:0;overflow:visible;color:var(--rfg);transition:none}
.rail2 .ri:hover,.rail2 .ri:focus-visible{transform:none}
.rail2 .ri::after{display:none}
.ri-eb{font:14px/1 var(--f-osd);letter-spacing:.14em;color:var(--rmu)}
.rail2 .rc-still{border-radius:10px;box-shadow:0 18px 40px rgba(0,0,0,calc(.55 - var(--k) * .35))}
.rail2 .rc-still::after{background:radial-gradient(ellipse at center,transparent 55%,rgba(0,0,0,.35))}
.rail2 .rc-still img{transition:transform .6s cubic-bezier(.2,.8,.2,1),filter .3s;animation:none;transform:scale(1.02)}
.rail2 .ri:is(:hover,:focus-visible) .rc-still img{transform:scale(1.08)}
.rail2 .ri:is(:hover,:focus-visible) .rc-still{outline:2px solid var(--lime);outline-offset:3px}
.ri-s .rc-still{width:clamp(210px,19vw,290px);aspect-ratio:16/10}
.ri-w .rc-still{width:clamp(300px,31vw,480px);aspect-ratio:16/10}
.ri-p .rc-still{width:clamp(190px,16vw,250px);aspect-ratio:5/7}
.ri-q .rc-still{width:clamp(220px,20vw,300px);aspect-ratio:1}
.ri-t{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.rail2 .ri b{padding:0;font-size:clamp(17px,1.4vw,21px);line-height:1.15;font-weight:800}
.rail2 .ri .rc-line{display:none}
.rail2 .ri i{padding:0;font-size:15px;white-space:nowrap;color:color-mix(in srgb,var(--lime),#3f4a00 calc(var(--k) * 100%));opacity:0;transition:opacity .25s}
.rail2 .ri:is(:hover,:focus-visible) i{opacity:1}
.rcall{align-self:center;width:clamp(280px,30vw,500px)}
.rcall p{margin:0;font-weight:900;font-size:clamp(30px,3.4vw,56px);line-height:1.02;letter-spacing:-.02em;color:var(--rfg);text-wrap:balance}
.rcall em{font-family:var(--f-script);font-style:normal;font-weight:400;letter-spacing:0;font-size:1.12em;color:color-mix(in srgb,var(--lime),#4d5a00 calc(var(--k) * 100%))}
.rail2 .rail-prog{background:color-mix(in srgb,#2e2a2b,#cfc7b6 calc(var(--k) * 100%))}
.rail2 .rail-cue{color:var(--rmu)}
@media (max-width:560px){.rail2{--rh:min(58svh,500px)}.ri-s .rc-still{width:62vw}.ri-w .rc-still{width:78vw}.ri-p .rc-still{width:52vw}.ri-q .rc-still{width:60vw}.rcall{width:78vw}.rcall p{font-size:34px}.rail2 .ri i{opacity:1}}
@media (prefers-reduced-motion:reduce){.rail2{--k:0}}
.rail2 .rc-still img{filter:saturate(1.05) contrast(1.04) brightness(calc(.86 + var(--k) * .1))}
.dk-still,.dk-tapes,.dk-stack{pointer-events:none}
/* r27b: phones: props stay under the TV controls; slate steps fit one screen */
.dk-side{pointer-events:none}.dk-side :is(.btape,.dk-book,.dk-vf){pointer-events:auto}
@media (max-width:900px){.dk-tape{width:calc(var(--tw) * .19);bottom:-2%}.dk-lean{width:calc(var(--tw) * .17);bottom:-2%}}
@media (max-width:760px){
 .dk-side{height:calc(var(--tw) * .25)}
 .callsheet .cs-head{flex-wrap:nowrap;align-items:center;padding-bottom:8px;margin-bottom:8px}
 .callsheet .cs-head b{font-size:22px}.callsheet .cs-head>div:first-child>span{display:none}
 .callsheet .cs-meta{font-size:12px;gap:2px}.callsheet .cs-meta b{font-size:14px}
 .callsheet .row{grid-template-columns:1fr 1fr;gap:10px}
 .callsheet form,.cs-step{gap:10px}
 .callsheet .fld{gap:2px}.callsheet .fld label{font-size:12.5px}
 .callsheet .fld input,.callsheet .fld select{font-size:15px;min-height:42px;padding:6px 1px}
 .callsheet .fld select{font-size:14px}
 .cs-step .fld textarea{min-height:150px}
 .callsheet .err{font-size:12px}
 .cs-steps{padding-top:8px}.cs-steps button{min-height:40px}
 .callsheet .form-note{font-size:12px;margin:0}
 .cs-clap{margin-bottom:10px}
}
.cs-foot [hidden]{display:none!important}
.callsheet .cs-step .row:has(#dateFld:not([hidden])){grid-template-columns:repeat(3,minmax(0,1fr))}
/* r28: the TV scene fills the first screen; the headline follows with breathing room */
@media (min-width:901px){
 .dk-scene{--tw:max(300px,min(60vw,1240px,calc((100svh - 104px) * .93)));--pw:calc(var(--tw) * 2.25);min-height:calc(100svh - 91px);align-content:end}
 .dk-copy{margin-top:clamp(56px,7vw,110px)}
}
@media (max-width:900px){
 .dk-scene{min-height:calc(100svh - 79px);align-content:center}
 .dk-copy{margin-top:clamp(40px,10vw,72px)}
}
/* r28: a soft travelling glow line under "everything" */
.hero.dkhero h1 .script-w{position:relative}
.hero.dkhero h1 .script-w::after{content:"";position:absolute;left:8%;right:4%;bottom:.02em;height:2px;border-radius:2px;pointer-events:none;
 background:linear-gradient(90deg,transparent,rgba(196,216,47,.18) 15%,rgba(196,216,47,.18) 85%,transparent),linear-gradient(90deg,transparent 0,rgba(226,244,110,.95) 50%,transparent 100%) no-repeat;
 background-size:100% 100%,28% 100%;background-position:0 0,-40% 0;filter:drop-shadow(0 0 4px rgba(196,216,47,.7));animation:evline 4.2s ease-in-out infinite}
@keyframes evline{0%{background-position:0 0,-40% 0}60%,100%{background-position:0 0,140% 0}}
@media (prefers-reduced-motion:reduce){.hero.dkhero h1 .script-w::after{animation:none}}
/* r28: a soft lime light flare drifts across the channel guide as it scrolls */
.rail2 .rail-pin{isolation:isolate;overflow:hidden}
.rail2 .rail-pin::before,.rail2 .rail-pin::after{content:"";position:absolute;pointer-events:none;z-index:-1;left:calc(var(--p,0) * 130% - 15%);translate:-50% -50%;transition:opacity .4s}
.rail2 .rail-pin::before{top:46%;width:min(70vw,900px);aspect-ratio:1.6;background:radial-gradient(closest-side,rgba(200,226,40,.42),rgba(196,216,47,.16) 45%,transparent 75%);filter:blur(6px);opacity:calc(.5 + var(--k,0) * .5)}
.rail2 .rail-pin::after{top:calc(46% + var(--p,0) * 8%);width:min(120vw,1500px);height:2px;background:linear-gradient(90deg,transparent,rgba(214,236,70,.35) 35%,rgba(240,255,150,.75) 50%,rgba(214,236,70,.35) 65%,transparent);filter:blur(1px) drop-shadow(0 0 6px rgba(196,216,47,.6));opacity:calc(.25 + var(--k,0) * .35)}
@media (prefers-reduced-motion:reduce){.rail2 .rail-pin::before,.rail2 .rail-pin::after{left:50%}}
/* r28b: wherever the TV can't grow, the room carries up to the header: warm wall, lamp spill, no void */
.hero.dkhero::before{content:"";position:absolute;z-index:0;left:0;right:0;top:0;height:calc(100svh - 73px);pointer-events:none;
 background:radial-gradient(ellipse 34% 46% at 19% 52%,rgba(255,168,72,.16),rgba(255,140,50,.05) 55%,transparent 75%),radial-gradient(ellipse 42% 40% at 50% 46%,rgba(190,225,255,.05),transparent 70%),radial-gradient(ellipse 90% 70% at 50% 100%,rgba(92,56,26,.42),transparent 72%),linear-gradient(#0b0908,#140e0a 55%,#1b130c)}
.hero.dkhero .dk-scene{z-index:1}
@media (min-width:901px){.dk-scene{align-content:end}}
@media (max-width:900px){
 .dk-scene{align-content:end;--lift:max(0px,calc((100svh - 79px - var(--tw) * 1.14 - var(--base)) * .6));padding-bottom:calc(var(--base) + var(--lift))}
 .dk-scene .dk-bg{bottom:var(--lift)}
 .hero.dkhero::before{background:radial-gradient(ellipse 60% 34% at 22% 30%,rgba(255,168,72,.15),rgba(255,140,50,.05) 55%,transparent 78%),radial-gradient(ellipse 120% 60% at 50% 100%,rgba(92,56,26,.45),transparent 72%),linear-gradient(#0b0908,#150f0a 50%,#1b130c)}
}
@media (max-width:760px){.dk-scene{--lift:max(0px,calc((100svh - 79px - var(--tw) * 1.04 - var(--base)) * .6))}}
/* r28c: on narrower or squarer desktops keep the side props on screen */
@media (min-width:901px) and (max-width:1300px),(min-width:901px) and (max-aspect-ratio:7/5){
 .dk-scene{--tw:max(300px,min(50vw,1240px,calc((100svh - 104px) * .93)))}
 .dk-cam{right:30%}
}
/* r28d: the channel objects are back, floating over their moody stills, and they sway as the guide scrolls */
.rail2 .rc-still>img{filter:blur(3px) saturate(.75) brightness(calc(.42 + var(--k) * .08));transform:scale(1.12)}
.rail2 .ri:is(:hover,:focus-visible) .rc-still>img{transform:scale(1.18)}
.rail2 .rc-still .rc-obj{position:absolute;inset:0;top:0;height:auto;width:auto;aspect-ratio:auto;display:grid;place-items:center;z-index:2;perspective:600px;
 transform:translateX(calc((var(--p,0) - .5) * var(--sd,1) * -36px)) rotate(calc((var(--p,0) - .5) * var(--sd,1) * 12deg))}
.rail2 .rcol:nth-child(even) .rc-obj{--sd:-1}
.rail2 .rc-still .rc-obj img{width:auto;height:72%;max-width:70%;max-height:none;object-fit:contain;filter:drop-shadow(0 16px 16px rgba(0,0,0,.6)) drop-shadow(0 0 18px rgba(196,216,47,.12));
 transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));animation:objfloat2 5.5s ease-in-out infinite;transition:transform .25s ease-out,scale .35s,filter .3s}
.rail2 .ri:nth-child(2) .rc-obj img{animation-duration:6.4s;animation-delay:-2.2s}
.rail2 .rcol:nth-child(3n) .rc-obj img{animation-duration:4.8s;animation-delay:-1.1s}
.rail2 .ri:is(:hover,:focus-visible) .rc-obj img{scale:1.1;filter:drop-shadow(0 24px 20px rgba(0,0,0,.7)) drop-shadow(0 0 22px rgba(196,216,47,.35))}
@keyframes objfloat2{0%,100%{translate:0 0;rotate:-3deg}50%{translate:0 -10px;rotate:3deg}}
@media (prefers-reduced-motion:reduce){.rail2 .rc-still .rc-obj img{animation:none}.rail2 .rc-still .rc-obj{transform:none}}
/* r28e: ACTION! drops the red stamp box for a black OSD pill (like HOW IT WORKS) with pulsing lime neon text */
.cs-action span{font:clamp(40px,6vw,84px)/1 var(--f-osd);font-weight:400;letter-spacing:.14em;color:#e4f57a;border:1px solid rgba(196,216,47,.35);border-radius:999px;padding:.28em .7em .3em .84em;background:rgba(8,8,7,.94);rotate:-4deg;mix-blend-mode:normal;
 text-shadow:0 0 4px rgba(214,236,70,.95),0 0 14px rgba(196,216,47,.75),0 0 34px rgba(196,216,47,.45);box-shadow:0 0 0 1px rgba(0,0,0,.6),0 0 26px rgba(196,216,47,.18),0 24px 50px rgba(0,0,0,.45)}
.callsheet.clapped .cs-action span{animation:actpulse 2.4s ease-in-out .8s infinite}
@keyframes actpulse{0%,100%{text-shadow:0 0 4px rgba(214,236,70,.95),0 0 14px rgba(196,216,47,.75),0 0 34px rgba(196,216,47,.45);box-shadow:0 0 0 1px rgba(0,0,0,.6),0 0 22px rgba(196,216,47,.14),0 24px 50px rgba(0,0,0,.45)}
 50%{text-shadow:0 0 3px rgba(214,236,70,.8),0 0 9px rgba(196,216,47,.5),0 0 20px rgba(196,216,47,.25);box-shadow:0 0 0 1px rgba(0,0,0,.6),0 0 34px rgba(196,216,47,.26),0 24px 50px rgba(0,0,0,.45)}}
@media (prefers-reduced-motion:reduce){.callsheet.clapped .cs-action span{animation:none}}
/* r28f: hover the remote and it swings to point at the copy; a lime ring lights around the power button */
.pkt-remote{position:relative;transform-origin:50% 70%}
.pkt-remote:hover,.pkt-remote:focus-visible{transform:rotate(14deg) translate(6px,-6px)}
.pkt-remote::after{content:"";position:absolute;left:49.2%;top:18.5%;width:24%;aspect-ratio:1;translate:-50% -50%;border-radius:50%;pointer-events:none;
 border:2px solid rgba(214,236,70,.95);box-shadow:0 0 8px rgba(196,216,47,.9),0 0 20px rgba(196,216,47,.55),inset 0 0 8px rgba(196,216,47,.5);opacity:0;scale:.7;transition:opacity .3s,scale .35s cubic-bezier(.3,1.4,.5,1)}
.pkt-remote:is(:hover,:focus-visible)::after{opacity:1;scale:1;animation:pwrring 1.8s ease-in-out .35s infinite}
@keyframes pwrring{0%,100%{box-shadow:0 0 8px rgba(196,216,47,.9),0 0 20px rgba(196,216,47,.55),inset 0 0 8px rgba(196,216,47,.5)}50%{box-shadow:0 0 12px rgba(196,216,47,1),0 0 32px rgba(196,216,47,.7),inset 0 0 12px rgba(196,216,47,.65)}}
@media (max-width:760px){.pkt-remote:hover{transform:rotate(10deg) translate(4px,-4px)}.pkt-remote::after{border-width:1.5px}}
@media (prefers-reduced-motion:reduce){.pkt-remote:is(:hover,:focus-visible)::after{animation:none}}
/* r28g: objects are absolutely boxed inside their card (12% inset) so float + sway never crop them */
.rail2 .rc-still .rc-obj{display:block}
.rail2 .rc-still .rc-obj img{position:absolute;left:13%;top:13%;width:74%;height:74%;max-width:none;max-height:none;object-fit:contain}
.rail2 .ri-p .rc-still .rc-obj img{left:10%;width:80%}
/* r28g: remote hit area stays still; only the inner wrapper turns */
.pkt-remote,.pkt-remote:hover,.pkt-remote:focus-visible{transform:none}
.pkt-remote::after{content:none}
.pkt-rot{display:block;position:relative;transform:rotate(-14deg);transform-origin:50% 70%;transition:transform .45s cubic-bezier(.3,1.4,.5,1)}
.pkt-remote:is(:hover,:focus-visible) .pkt-rot{transform:rotate(14deg) translate(6px,-6px)}
.pkt-rot::after{content:"";position:absolute;left:49.2%;top:18.5%;width:24%;aspect-ratio:1;translate:-50% -50%;border-radius:50%;pointer-events:none;
 border:2px solid rgba(214,236,70,.95);box-shadow:0 0 8px rgba(196,216,47,.9),0 0 20px rgba(196,216,47,.55),inset 0 0 8px rgba(196,216,47,.5);opacity:0;scale:.7;transition:opacity .3s,scale .35s cubic-bezier(.3,1.4,.5,1)}
.pkt-remote:is(:hover,:focus-visible) .pkt-rot::after{opacity:1;scale:1;animation:pwrring 1.8s ease-in-out .35s infinite}
@media (max-width:760px){.pkt-rot{transform:rotate(-10deg)}.pkt-remote:hover .pkt-rot{transform:rotate(10deg) translate(4px,-4px)}.pkt-rot::after{border-width:1.5px}}
@media (prefers-reduced-motion:reduce){.pkt-remote:is(:hover,:focus-visible) .pkt-rot::after{animation:none}}
.rail2 .rc-still .rc-obj img{left:16%;top:16%;width:68%;height:68%}
.rail2 .ri-p .rc-still .rc-obj img{left:12%;width:76%}
.rail2 .rc-still .rc-obj{transform:translateX(calc((var(--p,0) - .5) * var(--sd,1) * -24px)) rotate(calc((var(--p,0) - .5) * var(--sd,1) * 8deg))}
@media (max-width:560px) and (max-height:780px){.ri-s .rc-still{width:56vw}}
.rail2 .rc-still .rc-obj img{left:19%;top:19%;width:62%;height:62%}
.rail2 .ri-p .rc-still .rc-obj img{left:14%;width:72%}
/* ===== r29 fine-tuning ===== */
/* Book of Tutto leans toward the TV */
.dk-book{rotate:-9deg;transform-origin:100% 100%}
.dk-book:hover,.dk-book:focus-visible{rotate:-5deg}
/* TV off: a phosphor ghost line */
.scr::before{content:"STORYTELLING WITHOUT BOUNDARIES";position:absolute;inset:0;z-index:6;display:grid;place-items:center;padding:0 14%;text-align:center;pointer-events:none;
 font:400 clamp(16px,7.4cqi,58px)/1.02 var(--f-osd);letter-spacing:.06em;color:#dff26a;text-shadow:0 0 4px rgba(214,236,70,.9),0 0 14px rgba(196,216,47,.6),0 0 34px rgba(196,216,47,.3);
 background:repeating-linear-gradient(0deg,rgba(0,0,0,.28) 0 1px,transparent 1px 3px),radial-gradient(ellipse at center,rgba(196,216,47,.07),transparent 70%);opacity:0;transition:opacity .2s}
.scr.off::before{opacity:1;transition:opacity .9s .75s;animation:offglow 3.6s ease-in-out 1.6s infinite}
@keyframes offglow{0%,100%{filter:brightness(1)}50%{filter:brightness(.72)}}
/* headline: the two words fly in from opposite sides, then keep their glitch and neon */
.hero.dkhero h1.pre :is(.glw,.script-w){animation:none;opacity:0}
.hero.dkhero h1.fly .glw{animation:glwM 4.6s steps(1) infinite,flyL 1.15s cubic-bezier(.16,1,.3,1) backwards}
.hero.dkhero h1.fly .script-w{animation:neonflk 7s linear infinite,flyR 1.25s cubic-bezier(.16,1,.3,1) .14s backwards}
@keyframes flyL{from{translate:-60vw 0;opacity:0;filter:blur(8px)}70%{filter:blur(0)}to{translate:0 0;opacity:1;filter:blur(0)}}
@keyframes flyR{from{translate:60vw 0;opacity:0;filter:blur(8px)}70%{filter:blur(0)}to{translate:0 0;opacity:1;filter:blur(0)}}
/* client logos: after the projector flicker-in they drift gently, in a slow wave */
.brand-wall.js.in li{animation:proj .7s steps(1) forwards,lfloat 6s ease-in-out infinite;animation-delay:calc(var(--i) * 110ms),calc(var(--i) * 260ms + 1.2s)}
.brand-wall li>*{transition:filter .3s,scale .3s}
.brand-wall li:hover>*{scale:1.08}
.brand-wall li:hover{border-color:rgba(196,216,47,.55);box-shadow:0 0 18px rgba(196,216,47,.18)}
@keyframes lfloat{0%,100%{translate:0 0}50%{translate:0 -5px}}
/* philosophy polaroids: a neat fan that opens on view; each photo can be dragged around */
.ph-people.pfan{position:relative;display:block;height:clamp(300px,27vw,380px);margin-top:44px}
.ph-people.pfan .pol{position:absolute;left:50%;top:6%;width:clamp(160px,15vw,210px);min-width:0;margin:0;transform:none!important;--oo:0;--sp:min(13.5vw,175px);
 translate:calc(-50% + var(--oo) * var(--sp) + var(--dx,0px)) calc(var(--oo) * var(--oo) * 9px + var(--dy,0px));rotate:calc(var(--oo) * 7deg + var(--dr,0deg));
 transition:translate .9s cubic-bezier(.2,.9,.25,1),rotate .9s cubic-bezier(.2,.9,.25,1),scale .3s,box-shadow .3s;transition-delay:calc(var(--ad,0) * 70ms);cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none}
.ph-people.pfan.open .pol{--oo:var(--o)}
.ph-people.pfan .pol:hover{scale:1.06;box-shadow:0 30px 60px rgba(0,0,0,.7)}
.ph-people.pfan .pol.drag{cursor:grabbing;transition:scale .2s,box-shadow .2s;scale:1.08;box-shadow:0 40px 70px rgba(0,0,0,.75)}
.ph-people.pfan .pol img{pointer-events:none;-webkit-user-drag:none}
.ph-people.pfan::after{content:"DRAG THE PHOTOS";position:absolute;left:50%;bottom:-6px;translate:-50% 0;font:15px/1 var(--f-osd);letter-spacing:.16em;color:var(--mute);opacity:.7}
@media (max-width:700px){.ph-people.pfan{height:clamp(250px,72vw,330px)}.ph-people.pfan .pol{width:40vw;--sp:13.5vw;top:4%}.ph-people.pfan .pol{touch-action:pan-y}}
/* recent work: arrives as one stacked card, then fans out */
.wfan{--sp:0%;--rt:0deg;--dy:0px}
.wfan.pre .fc{translate:0 90px;opacity:0}
.wfan .fc{transition:transform .9s cubic-bezier(.2,.9,.25,1),translate .7s cubic-bezier(.16,1,.3,1),opacity .5s,box-shadow .3s}
.wfan.in .fc{translate:0 0;opacity:1}
.wfan .fc:nth-child(3){z-index:5}
/* Tutto Reel Generator: pops in, then a periodic nudge and a light sweep pull the eye */
.rg-call.rv{opacity:0}
.rg-call.rv-in{animation:rvPop .9s cubic-bezier(.2,1.3,.4,1) both,rgnudge 5.5s ease-in-out 2.2s infinite}
@keyframes rvPop{from{opacity:0;translate:0 50px;scale:.9}to{opacity:1;translate:0 0;scale:1}}
@keyframes rgnudge{0%,78%,100%{scale:1;rotate:0deg}82%{scale:1.035;rotate:-.6deg}86%{scale:1.035;rotate:.6deg}90%{scale:1.02;rotate:0deg}}
.rg-call .rg-t{position:relative}
.rg-call.rv-in .rg-h{background:linear-gradient(100deg,currentColor 40%,#f4ffb0 50%,currentColor 60%) 200% 0/250% 100% no-repeat;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:rgsheen 5.5s ease-in-out 2.2s infinite}
@keyframes rgsheen{0%,70%{background-position:200% 0}88%,100%{background-position:-60% 0}}
.rg-call.rv-in .rg-rec{animation:recblink 1.1s steps(1) infinite}
@keyframes recblink{50%{opacity:.2}}
/* Browse packages: remote and copy float in from opposite sides */
.pkt-remote.rv,.pkt-copy.rv,.callsheet.rv{opacity:0}
.pkt-remote.rv-in{animation:rvL 1.1s cubic-bezier(.16,1,.3,1) both}
.pkt-copy.rv-in{animation:rvR 1.1s cubic-bezier(.16,1,.3,1) .1s both}
@keyframes rvL{from{opacity:0;translate:-40vw 0}to{opacity:1;translate:0 0}}
@keyframes rvR{from{opacity:0;translate:40vw 0}to{opacity:1;translate:0 0}}
/* the call sheet floats up */
.callsheet.rv-in{animation:rvUp 1.1s cubic-bezier(.16,1,.3,1) both}
@keyframes rvUp{from{opacity:0;translate:0 140px}to{opacity:1;translate:0 0}}
.pkt,#contact{overflow-x:clip}
@media (prefers-reduced-motion:reduce){.brand-wall.js.in li,.rg-call.rv-in,.rg-call.rv-in .rg-h,.rg-call.rv-in .rg-rec,.scr.off::before{animation:none}.rg-call.rv-in .rg-h{-webkit-text-fill-color:currentColor;background:none}}
.wfan:not(.open) .fc:not(:nth-child(3)){opacity:0}
.wfan.open .fc{opacity:1}
.ph-people.pfan{height:clamp(270px,23vw,330px)}
@media (max-width:700px){.ph-people.pfan{height:clamp(220px,62vw,280px)}.ph-people.pfan .pol{width:34vw;--sp:10.5vw}}
.rg-call.rv-in .rg-h{background:linear-gradient(100deg,transparent 40%,rgba(244,255,176,.95) 50%,transparent 60%) 200% 0/250% 100% no-repeat,#f1ebdd;-webkit-background-clip:text;background-clip:text}
.pfan-reset{position:absolute;left:50%;bottom:-36px;translate:-50% 0;z-index:30;padding:7px 14px;border:1px solid rgba(196,216,47,.5);border-radius:999px;background:#0d0c0c;color:var(--lime);font:15px/1 var(--f-osd);letter-spacing:.14em;cursor:pointer}
.pfan-reset[hidden]{display:none}
.pfan-reset:hover{box-shadow:0 0 14px var(--lime-glow)}
/* r30 first-load TV intro (html.tvi is set in <head> once per session; skipped for reduced motion). .go is added on the first frame so the clock starts at first paint */
html.tvi{background:#000;overflow:hidden}
html.tvi::before,html.tvi::after{content:"";position:fixed;inset:0;z-index:10000;pointer-events:none}
html.tvi::before{content:"TUTTO MEDIA";display:grid;place-items:center;font:clamp(22px,3.4vw,44px)/1 "VT323",ui-monospace,monospace;letter-spacing:.18em;color:#f1ebdd;text-shadow:0 0 8px rgba(255,255,255,.35);
  background:linear-gradient(#0d0c0c,#0d0c0c) center/min(46vw,420px) clamp(48px,6vw,78px) no-repeat,
  linear-gradient(90deg,#0000c0 0 14.29%,#131313 0 28.57%,#c000c0 0 42.86%,#131313 0 57.14%,#00c0c0 0 71.43%,#131313 0 85.71%,#c0c0c0 0) 0 67%/100% 8% no-repeat,
  linear-gradient(90deg,#00214c 0 18%,#fff 0 36%,#32006a 0 54%,#131313 0 80%,#090909 0 86%,#1d1d1d 0) 0 100%/100% 25% no-repeat,
  linear-gradient(90deg,#c0c0c0 0 14.29%,#c0c000 0 28.57%,#00c0c0 0 42.86%,#00c000 0 57.14%,#c000c0 0 71.43%,#c00000 0 85.71%,#0000c0 0) 0 0/100% 67% no-repeat,#000;
}
html.tvi.go::before{animation:tviBars 1s linear forwards,tviJit .12s steps(2) 5}
html.tvi::after{opacity:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='1' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='3' intercept='-1'/%3E%3CfeFuncG type='linear' slope='3' intercept='-1'/%3E%3CfeFuncB type='linear' slope='3' intercept='-1'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E") 0 0/320px 320px,#3a3a3a;image-rendering:pixelated;
}
html.tvi.go::after{animation:tviStatic 1.38s linear forwards,tviNoise .16s steps(4) infinite}
html.tvi body{transform-origin:50% 50vh;transform:scale(1.02,.004)}
html.tvi.go body{animation:tviOn .55s cubic-bezier(.2,.8,.2,1) 1.3s both}
@keyframes tviBars{0%,52%{opacity:1}58%{opacity:1;filter:saturate(.3) brightness(1.2)}64%,100%{opacity:0;filter:saturate(0)}}
@keyframes tviJit{50%{transform:translateY(-3px)}}
@keyframes tviStatic{0%,37%{opacity:0;clip-path:inset(0)}42%{opacity:1;filter:contrast(1.3) brightness(1.1);clip-path:inset(0)}88%{opacity:1;filter:contrast(1.1) brightness(.9);clip-path:inset(0)}95%{opacity:1;filter:brightness(3);clip-path:inset(49.6% 0 49.6% 0)}100%{opacity:0;clip-path:inset(50% 0 50% 0)}}
@keyframes tviNoise{0%{background-position:0 0}25%{background-position:-90px 60px}50%{background-position:70px -110px}75%{background-position:-40px -30px}}
@keyframes tviOn{0%{transform:scale(1.02,.004);filter:brightness(5) saturate(0)}20%{transform:scale(1.01,.06);filter:brightness(3) saturate(.3)}70%{transform:scale(1,1.015);filter:brightness(1.25)}100%{transform:none;filter:none}}
/* r31 zoom hero (home): the TV fills the first screen, then shrinks onto the desk as you scroll. html.zh is set in <head>, .zr by the inline script right after the hero */
html.zh .hero.dkhero{overflow:clip}
html.zh .zh-pin{position:relative}
html.zh:not(.zh-m) #desk{position:sticky;transform-origin:0 0;will-change:transform}
html.zh:not(.zh-m) #desk .dk-side{opacity:var(--zs,1)}
html.zh:not(.zr) #desk{opacity:0;animation:zhFail 0s 2.5s forwards}
@keyframes zhFail{to{opacity:1}}
.zh-scr{position:absolute;inset:0;z-index:7;background:radial-gradient(ellipse at 50% 45%,#141712,#050505 75%);overflow:hidden;pointer-events:none}
.zh-id{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:3.2%;padding:0 10%}
.zh-id .zh-logo{width:min(64%,420px);height:auto;filter:drop-shadow(0 0 10px rgba(196,216,47,.25))}
.zh-id .zh-mw{width:min(30%,200px);height:auto;margin-top:-1%;opacity:.9}
.zh-id p{margin:6% 0 0;font:clamp(9px,2.6cqw,22px)/1.1 "VT323",ui-monospace,monospace;letter-spacing:.2em;text-align:center;color:var(--lime);text-shadow:0 0 6px var(--lime-glow),0 0 16px rgba(196,216,47,.35);animation:offglow 3.6s ease-in-out 2s infinite}
.zh-scr::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(0,0,0,.22) 0 1px,transparent 1px 3px);pointer-events:none}
.zh-cue{position:absolute;left:50%;bottom:7%;translate:-50% 0;font:clamp(8px,1.6cqw,13px)/1 "VT323",ui-monospace,monospace;letter-spacing:.3em;color:var(--lime);opacity:.7;text-shadow:0 0 6px var(--lime-glow);animation:blink 1.6s steps(2) infinite}
.zh-bars,.zh-snow{position:absolute;inset:0;opacity:0}
.zh-bars{background:linear-gradient(90deg,#0000c0 0 14.29%,#131313 0 28.57%,#c000c0 0 42.86%,#131313 0 57.14%,#00c0c0 0 71.43%,#131313 0 85.71%,#c0c0c0 0) 0 67%/100% 8% no-repeat,linear-gradient(90deg,#00214c 0 18%,#fff 0 36%,#32006a 0 54%,#131313 0 80%,#090909 0 86%,#1d1d1d 0) 0 100%/100% 25% no-repeat,linear-gradient(90deg,#c0c0c0 0 14.29%,#c0c000 0 28.57%,#00c0c0 0 42.86%,#00c000 0 57.14%,#c000c0 0 71.43%,#c00000 0 85.71%,#0000c0 0) 0 0/100% 67% no-repeat,#000}
.zh-snow{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='1' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='3' intercept='-1'/%3E%3CfeFuncG type='linear' slope='3' intercept='-1'/%3E%3CfeFuncB type='linear' slope='3' intercept='-1'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E") 0 0/200px 200px,#3a3a3a;image-rendering:pixelated}
.zh-scr.play .zh-bars{animation:zhBars 1s linear both}
.zh-scr.play .zh-snow{animation:zhSnow 1.32s linear both,tviNoise .16s steps(4) infinite}
.zh-scr.play .zh-id{animation:zhOn .55s cubic-bezier(.2,.8,.2,1) 1.3s both}
.zh-scr.play .zh-cue{animation:zhCue .4s 2.2s both,blink 1.6s steps(2) 2.6s infinite}
@keyframes zhBars{0%,55%{opacity:1}64%,100%{opacity:0}}
@keyframes zhSnow{0%,38%{opacity:.01;clip-path:inset(0)}46%{opacity:1;clip-path:inset(0)}88%{opacity:1;filter:brightness(.9);clip-path:inset(0)}95%{opacity:1;filter:brightness(3);clip-path:inset(49.4% 0 49.4% 0)}100%{opacity:0;clip-path:inset(50% 0 50% 0)}}
@keyframes zhOn{0%{transform:scale(1.03,.006);filter:brightness(5) saturate(0)}25%{transform:scale(1.02,.07);filter:brightness(3)}70%{transform:scale(1,1.02);filter:brightness(1.3)}100%{transform:none;filter:none}}
@keyframes zhCue{from{opacity:0}}
html.zh-done .zh-scr{opacity:0!important;visibility:hidden!important;transition:opacity .4s,visibility 0s .4s}
/* r32 home: menu bar hidden over the first screen, slides in on scroll (html.zh-sc). It is fixed so the zoomed TV can use the full height; the hero keeps the bar's room so the desk sits where it did */
html.zh .hdr{position:fixed;top:0;left:0;right:0;transition:transform .45s cubic-bezier(.2,.8,.2,1),opacity .35s,background .2s}
html.zh:not(.zh-sc):not(.zh-hf) .hdr:not(:focus-within){transform:translateY(-105%);opacity:0;pointer-events:none}
html.zh .hero.dkhero{padding-top:calc(var(--hdrh,80px) + clamp(6px,1.4vw,18px))}
@media (prefers-reduced-motion:reduce){html.zh .hdr{transition:none}}
html.zh.zh-hf .hdr{transition:none}
/* r34: hero service line, styled like the TV channel guide */
.hero-ch{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 16px}
.dk-copy .hero-ch{justify-content:center}
.hero-ch span{font-family:var(--f-osd);font-size:18px;letter-spacing:.04em;line-height:1;padding:8px 10px;border:1px solid var(--line);border-radius:6px;color:var(--mute);background:rgba(0,0,0,.4);white-space:nowrap}
.hero-ch i{font-style:normal;color:var(--lime);font-family:var(--f-osd);font-size:18px}
@media (max-width:700px){.hero-ch{gap:6px}.hero-ch span{font-size:15px;padding:7px 8px}.hero-ch i{display:none}}
@media (max-width:700px){.hero .dk-copy .guide,.hero .dk-copy .tv-help{display:none!important}}
/* r35: call back request popup (every Book link opens it) */
.cbdlg{position:fixed;inset:0;z-index:300;display:grid;place-items:center;padding:16px}
.cbdlg[hidden]{display:none}
html.cb-open{overflow:hidden}
.cb-back{position:absolute;inset:0;background:rgba(0,0,0,.72);backdrop-filter:blur(3px)}
.cb-sheet{position:relative;width:min(540px,100%);max-height:calc(100dvh - 32px);overflow:auto;background:#efeadf;color:#111;border-radius:6px;padding:clamp(20px,3.4vw,32px);box-shadow:0 30px 80px rgba(0,0,0,.6);background-image:repeating-linear-gradient(0deg,transparent 0 31px,rgba(0,0,0,.05) 31px 32px);animation:cbIn .35s cubic-bezier(.2,.8,.2,1)}
@keyframes cbIn{from{opacity:0;transform:translateY(14px) scale(.98)}}
.cb-x{position:absolute;top:10px;right:10px;width:40px;height:40px;border-radius:50%;border:0;background:transparent;color:#111;font-size:18px;cursor:pointer}
.cb-x:hover,.cb-x:focus-visible{background:rgba(0,0,0,.08)}
.cb-k{display:inline-flex;align-items:center;gap:8px;font:15px/1 var(--f-osd);letter-spacing:.12em;color:#555;margin:0 0 8px}
.cb-k .dot{width:8px;height:8px;border-radius:50%;background:var(--red);animation:blinkRec 1.2s steps(2) infinite}
.cb-sheet h2{font-size:clamp(26px,4vw,34px);line-height:1.05;margin:0 0 8px;color:#111}
.cb-l{color:#444;margin:0 0 16px;font-size:16px}
.cb-sheet form{display:grid;gap:12px}
.cb-sheet .row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.cb-sheet .fld label{color:#222;font-size:14px;font-weight:700}
.cb-sheet .fld label .opt{color:#6a655c;font-weight:400}
.cb-sheet .fld input,.cb-sheet .fld textarea{background:transparent;border:0;border-bottom:2px solid #111;border-radius:0;color:#111;padding:8px 2px;font-family:"Permanent Marker",var(--f-body);font-size:19px;min-height:44px}
.cb-sheet .fld textarea{border:2px solid #111;border-radius:4px;padding:10px;min-height:88px}
.cb-sheet .fld input::placeholder,.cb-sheet .fld textarea::placeholder{color:#8d877c;font-family:var(--f-body);font-size:15px}
.cb-sheet .fld input:focus,.cb-sheet .fld textarea:focus{outline:3px solid #111;outline-offset:2px;background:rgba(196,216,47,.25)}
.cb-sheet .fld [aria-invalid="true"]{border-color:#b3170a}
.cb-sheet .err{color:#b3170a;font-weight:700;font-size:14px}
.cb-sheet .btn{justify-self:start}
.cb-sheet .form-note{color:#555;font-size:13px;margin:0}
.cb-sheet .result{background:#111;color:var(--white);border-radius:6px;padding:14px 16px}
.cb-sheet .result small{display:block;opacity:.7;margin-top:6px}
.cb-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
@media (max-width:560px){.cb-sheet .row{grid-template-columns:1fr}.cb-sheet .btn{justify-self:stretch}}
@media (prefers-reduced-motion:reduce){.cb-sheet{animation:none}}
.cb-sheet form{background:none;border:0;border-radius:0;padding:0;box-shadow:none}
.cb-sheet .result a,.callsheet .result a{color:var(--lime)}
.cb-sheet h2{text-wrap:balance}
.cb-sheet.sent form>*:not(.result),.cb-sheet.sent .cb-l{display:none!important}
.cb-sheet .cb-done{display:flex;margin-top:14px}
#form.cs-sent .cs-steps,#form.cs-sent .cs-stack,#form.cs-sent .cs-foot,#form.cs-sent .form-note{display:none!important}
/* r36: Work page showcase */
.sc-air{position:relative;margin:clamp(8px,2vw,24px) 0 0;aspect-ratio:16/9;max-height:78vh;width:100%;overflow:hidden;background:#000;isolation:isolate}
.sc-air-v{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.sc-air::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.35),transparent 30%,transparent 55%,rgba(0,0,0,.75));pointer-events:none}
.sc-air-osd{position:absolute;z-index:1;top:clamp(12px,2vw,24px);left:clamp(16px,3vw,40px);right:clamp(16px,3vw,40px);display:flex;justify-content:space-between;font:clamp(15px,1.4vw,20px)/1 var(--f-osd);letter-spacing:.1em;color:var(--white);text-shadow:0 1px 3px #000}
.sc-rec{color:#ff5a4a}
.sc-air-cap{position:absolute;z-index:1;left:0;right:0;bottom:clamp(14px,3vw,40px)}
.sc-k{font:clamp(14px,1.2vw,18px)/1 var(--f-osd);letter-spacing:.12em;color:var(--lime);margin:0 0 8px}
.sc-t{font-weight:900;font-size:clamp(26px,4.2vw,58px);line-height:1;margin:0;color:var(--white);max-width:16ch;text-wrap:balance}
.sc-feat .wrap{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(24px,4vw,64px);align-items:center}
.sc-feat-m .mon{max-width:380px;margin-inline:auto}
.sc-feat .m-scr video{width:100%;height:100%;object-fit:cover;display:block}
.sc-feat h2{margin-bottom:clamp(14px,1.6vw,22px)}
.sc-did{font:15px/1 var(--f-osd);letter-spacing:.12em;color:var(--lime);margin:22px 0 10px}
.sc-strip{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(6px,1vw,12px)}
.sc-strip img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;display:block;border-radius:6px}
.sc-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:clamp(10px,1.4vw,18px)}
.sc-tile{margin:0}
.sc-tile video{width:100%;aspect-ratio:9/16;object-fit:cover;display:block;border-radius:10px;background:#111;border:1px solid var(--line)}
.sc-tile p{display:flex;flex-direction:column;gap:2px;margin:10px 2px 0;font-size:15px}
.sc-tile p span{font:15px/1.2 var(--f-osd);letter-spacing:.06em;color:var(--mute)}
.sc-mood p{flex-direction:row;justify-content:space-between;gap:10px}
.sc-lede{color:var(--mute);max-width:60ch;margin:0 0 18px}
.sc-finish .wrap{row-gap:0}.sc-finish h2{margin-bottom:18px}.sc-finish .sc-lede{margin:0 0 clamp(24px,3.4vw,48px)}
.sc-fin{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:clamp(10px,1.6vw,20px);align-items:start}
.sc-cards{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(8px,1.2vw,16px)}
.sc-cards img{width:100%;height:auto;display:block;border-radius:6px}
.sc-mood video{aspect-ratio:9/16}
@media (max-width:900px){.sc-feat .wrap{grid-template-columns:1fr}.sc-grid{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:46%;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:16px;margin-inline:-16px;padding-inline:16px;scrollbar-width:none}.sc-grid li{scroll-snap-align:start}.sc-grid::-webkit-scrollbar{display:none}.sc-fin{grid-template-columns:1fr}
  .sc-strip{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:62%;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:16px;margin-inline:-16px;padding-inline:16px;scrollbar-width:none}.sc-strip li{scroll-snap-align:start}.sc-strip::-webkit-scrollbar{display:none}
  .sc-air{aspect-ratio:4/5;max-height:none}}
@media (max-width:560px){.sc-mood p{flex-direction:column;gap:2px}}
/* r38: recent work is seven cards (center is card 4); the reels autoplay muted */
.wfan .fc:nth-child(3),.wfan .fc:nth-child(5){z-index:3}.wfan .fc:nth-child(2),.wfan .fc:nth-child(6){z-index:2}.wfan .fc:nth-child(1),.wfan .fc:nth-child(7){z-index:1}.wfan .fc:nth-child(4){z-index:5}
.wfan .fc:nth-child(3),.wfan .fc:nth-child(5){transition-delay:0s}.wfan .fc:nth-child(2),.wfan .fc:nth-child(6){transition-delay:.06s}.wfan .fc:nth-child(1),.wfan .fc:nth-child(7){transition-delay:.12s}
.wfan:not(.open) .fc:nth-child(3){opacity:0}.wfan:not(.open) .fc:nth-child(4){opacity:1}
.wfan.open{--sp:52%;--rt:4.2deg;--dy:5px}
@media (max-width:1100px) and (min-width:761px){.wfan.open{--sp:44%}}
@media (max-width:760px){.wfan.open{--sp:24%;--rt:3.5deg;--dy:2px}}
/* r38: once the phone is built and still, flatten its 3D so iOS Safari composites the reel in place (no black band) */
.stage.flat .floaty,.phone.flat,.phone.flat .pp{transform-style:flat}
.phone.flat,.phone.flat .pp{transform:none}
/* r38: the film frames read in full color; the lit frame pops */
.fm img{filter:sepia(.12) saturate(.95) brightness(.82) contrast(1.04)}
.fm.lit img{filter:none}
/* r38: the site menu's phone rule (.nav, top:72px) was catching the fake phone's tab bar and pinning it under the Reels header as a black band */
.ig .nav{top:auto;bottom:0;flex-direction:row;border-bottom:0;padding:2.4% 0 0}
.card .ico svg path:not([class]){fill:var(--lime)} /* r38: the smile mark had no fill class and drew black */
.scr-your{font-family:var(--f-script);font-weight:400;color:var(--lime);font-size:1.05em;letter-spacing:0;text-transform:none;font-style:normal} /* r38: Cesco: "Your" in the script, everywhere */
p .scr-your{font-size:1.35em;line-height:1}
/* r38: market analysis hero graph */
.ma-graph{position:relative;aspect-ratio:2/1;border-radius:22px;padding:22px;background:radial-gradient(120% 90% at 80% 10%,rgba(196,216,47,.10),transparent 60%),linear-gradient(180deg,#121310,#0a0b09);border:1px solid rgba(196,216,47,.14);box-shadow:0 30px 70px rgba(0,0,0,.55),inset 0 0 60px rgba(0,0,0,.6);overflow:hidden}
.ma-graph::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0 1px,transparent 1px 3px);pointer-events:none}
.ma-graph svg{width:100%;height:100%;overflow:visible}
.ma-grid line{stroke:rgba(233,230,223,.07);stroke-width:1}
.ma-line{fill:none;stroke:#d6ec3c;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;animation:maDraw 2.6s cubic-bezier(.55,.1,.25,1) .3s forwards}
.ma-area{opacity:0;animation:maFade 1.2s ease 2.2s forwards}
.ma-dot{fill:#eaff6a;opacity:0;transform-origin:520px 34px;animation:maFade .4s ease 2.8s forwards,maPulse 2.2s ease-in-out 3.2s infinite}
@keyframes maDraw{to{stroke-dashoffset:0}}
@keyframes maFade{to{opacity:1}}
@keyframes maPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.6)}}
@media (prefers-reduced-motion:reduce){.ma-line{animation:none;stroke-dashoffset:0}.ma-area,.ma-dot{animation:none;opacity:1}}

/* r38: logos sit whole inside the screen, never cropped */
.mon .m-scr img.fit{object-fit:contain;padding:9% 7%;box-sizing:border-box;background:#0b0b0b}
/* r38: on phones every Channel Guide card (image, title, TUNE IN) fits inside the rail height */
@media (max-width:560px){.rail2 .ri-s .rc-still{width:min(62vw,calc((var(--rh) * .92 - 170px) * .8))}.rail2 .ri-p .rc-still{width:min(52vw,calc((var(--rh) * .8 - 90px) / 1.4))}.rail2 .ri-q .rc-still{width:min(60vw,calc(var(--rh) - 90px))}.rail2 .ri-w .rc-still{width:min(78vw,calc((var(--rh) * .8 - 90px) * 1.6))}}
.mon .m-scr img.fit[src*="fortune"]{padding:0}
.cc-m img[src$="web-fortune.jpg"]{object-fit:contain;background:#0b0b0b}
/* r38: Work cards play real client clips; click opens the longer cut */
.case-card .cc-open{display:block;width:100%;height:100%;color:inherit}
.case-card .cc-m video{width:100%;height:100%;object-fit:cover;display:block}
.case-card .cc-pl{position:absolute;right:12px;bottom:12px;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:rgba(0,0,0,.6);color:var(--lime);font-size:16px;border:1px solid rgba(196,216,47,.6);transition:transform .2s}
.case-card .cc-open:is(:hover,:focus-visible) .cc-pl{transform:scale(1.1)}
.case-card .cc-open:focus-visible{outline:2px solid var(--lime);outline-offset:-4px}
.cc-dlg{border:0;padding:0;background:#000;border-radius:14px;width:min(92vw,1100px);max-height:90vh;overflow:hidden}
.cc-dlg::backdrop{background:rgba(0,0,0,.82)}
.cc-dlg video{display:block;width:100%;max-height:90vh;background:#000}
.cc-dlg .cc-x{position:absolute;top:10px;right:10px;z-index:2;width:40px;height:40px;border-radius:50%;border:0;background:rgba(0,0,0,.65);color:#fff;font-size:18px;cursor:pointer}
.cc-dlg.vert{width:auto;max-width:92vw}.cc-dlg.vert video{height:min(86vh,calc(92vw * 16 / 9));width:auto;max-width:92vw}
@media (min-width:901px){.case-card.cc-wide{grid-column:1/-1;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);grid-template-rows:none}.case-card.cc-wide .cc-m{aspect-ratio:auto;min-height:320px}}
/* r39: 04 the client reaction = the assembled face */
.dc-mark.whole{display:flex;flex-direction:column;align-items:center;gap:4px;margin:4px auto 0;padding:8px 12px}
.dc-mark.whole svg{height:clamp(34px,4vw,48px);width:auto;fill:currentColor}
.dc-mark.whole small{font:13px/1 var(--f-osd);letter-spacing:.12em;color:var(--mute)}
.decode.done .dc-mark.whole svg{animation:smile 1s ease-in-out 2}
/* r39b: all four marks numbered in brand order */
.dc-mark .dc-n{font:13px/1 var(--f-osd);letter-spacing:.12em;color:var(--mute);pointer-events:none}
.dc-icon .dc-mark .dc-n{position:absolute;left:50%;transform:translateX(-50%);top:-20px}
.dc-icon .dc-mark.sm .dc-n{top:2px;left:-26px;transform:none}
.dc-mark.whole{margin-top:22px}
/* r39b: the decode toast sits at the top on phones so it never covers the reaction blurb */
@media (max-width:600px){.smile-w[data-k="decode"] .smile-toast{top:78px;bottom:auto}}
/* r40: phones scroll the Channel Guide vertically, a two-up grid with the callouts full width */
@media (max-width:760px){
.rail2.vert{--k:0}
.rail2.vert .rail-pin{padding-top:0}
.rail2.vert .rail-vp{overflow:visible;-webkit-mask:none;mask:none}
.rail2.vert .rail-tr{animation:none;width:auto;height:auto;display:grid;grid-template-columns:1fr 1fr;gap:26px 14px;padding:8px 16px 0;transform:none}
.rail2.vert .rail-dup,.rail2.vert .rail-foot{display:none}
.rail2.vert .rcol{display:contents}
.rail2.vert .rcall{grid-column:1/-1;width:auto;padding:6px 0}
.rail2.vert .rcall p{font-size:clamp(28px,8vw,38px)}
.rail2.vert .ri .rc-still{width:100%!important;aspect-ratio:4/5}
.rail2.vert .ri-t{flex-direction:column;align-items:flex-start;gap:6px}
.rail2.vert .ri-eb{font-size:12px}
.rail2.vert .rail-pin::before,.rail2.vert .rail-pin::after{display:none}
}
/* r42: phones get the 800px TV frame (preloaded in the head) */
@media (max-width:760px){.crt{background-image:url(../media/tv-tutto-sm-v1.webp)}}