/* =====================================================================
   Moonbase v2 "real" layer: materials, lighting, depth, life.
   Loaded after room.css + windows.css. Textures are procedurally generated
   greyscale tiles (/assets/tex) blended over the original colours.
   ===================================================================== */
:root{--tex-wall:url(/assets/tex/wall.webp);--tex-metal:url(/assets/tex/brushed.webp);--tex-wood:url(/assets/tex/wood.webp);--tex-fab:url(/assets/tex/fabric.webp);--tex-plas:url(/assets/tex/plastic.webp);--tex-floor:url(/assets/tex/floor.webp);--warm:255,196,130}
body{background:#0d0814}

/* ---------- architecture ---------- */
.wall{background:
    radial-gradient(300px 220px at 58% 14%,rgba(255,170,110,.14),transparent 70%),
    var(--tex-wall) 0 0/256px 320px,
    linear-gradient(180deg,#3b2350 0%,#2b183b 38%,#1e1129 78%,#170d20 100%);
  background-blend-mode:normal,overlay,normal}
.wall::after{display:none}
.wall-ao{left:-200px;right:-200px;top:96px;height:640px;pointer-events:none;
  background:linear-gradient(180deg,rgba(0,0,0,.55),transparent 60px),linear-gradient(0deg,rgba(0,0,0,.6),transparent 90px),
  radial-gradient(130% 80% at 50% 45%,transparent 50%,rgba(6,2,12,.45))}
.floor{left:-200px;right:-200px;top:728px;height:180px;
  background:linear-gradient(180deg,rgba(0,0,0,.65),transparent 50px),radial-gradient(60% 90px at 50% 0,rgba(255,120,190,.14),transparent),var(--tex-floor) 0 0/200px 200px,linear-gradient(180deg,#2a2236,#120c19);
  background-blend-mode:normal,screen,overlay,normal}
.baseboard{left:-200px;right:-200px;top:722px;height:12px;background:var(--tex-metal) 0 0/256px,linear-gradient(180deg,#8b86a0,#3a364a 60%,#1b1824);background-blend-mode:overlay,normal;box-shadow:0 3px 8px rgba(0,0,0,.7),inset 0 1px 0 rgba(255,255,255,.35);z-index:1}
.baseboard i{position:absolute;left:0;right:0;bottom:-3px;height:2px;background:linear-gradient(90deg,transparent,#ff7ac0 20%,#7ff0ff 50%,#ff7ac0 80%,transparent);box-shadow:0 0 10px 2px rgba(255,120,200,.45);opacity:.7;animation:hum 6s ease-in-out infinite}
.ceiling{background:var(--tex-metal) 0 0/256px,linear-gradient(180deg,#05030a,#160d22 60%,#2a1a38);background-blend-mode:overlay,normal;border-bottom:0;box-shadow:0 2px 0 #4a3462,0 3px 0 #120a1a,0 10px 24px rgba(0,0,0,.75);z-index:2}
.ceiling .duct{position:absolute;left:180px;right:180px;bottom:26px;height:14px;border-radius:3px;background:repeating-linear-gradient(90deg,rgba(0,0,0,.5) 0 2px,transparent 2px 6px),linear-gradient(180deg,#3a2f4a,#1c1526);box-shadow:inset 0 1px 0 rgba(255,255,255,.12)}
.ceiling .strip{bottom:8px;height:3px;box-shadow:0 0 14px 3px rgba(var(--warm),.5),0 0 40px 8px rgba(var(--warm),.18);animation:hum 9s ease-in-out infinite}
@keyframes hum{0%,100%{opacity:.85}50%{opacity:.68}}

/* ceiling fixtures + volumetric light cones */
.wall-lights{top:84px;height:24px;z-index:3;pointer-events:none}
.wall-lights .fx{position:absolute;top:0;width:44px;height:12px;border-radius:2px 2px 10px 10px;background:linear-gradient(180deg,#5d566e,#2a2434);box-shadow:0 2px 3px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.25)}
.wall-lights .fx b{position:absolute;left:5px;right:5px;bottom:-2px;height:5px;border-radius:0 0 8px 8px;background:#fff3dc;box-shadow:0 0 6px 2px rgba(var(--warm),.9),0 0 22px 6px rgba(var(--warm),.45)}
.wall-lights .f1{left:38px}.wall-lights .f2{left:173px}.wall-lights .f3{left:308px}
.wall-lights .f2 b{animation:flicker 11s infinite 3s}
.cones{left:0;right:0;top:96px;height:640px;z-index:5;pointer-events:none}
.cone{position:absolute;top:0;width:240px;height:560px;margin-left:-120px;background:radial-gradient(40% 100% at 50% 0,rgba(var(--warm),.20),rgba(var(--warm),.07) 50%,transparent 100%);will-change:opacity}
.cone::before{content:"";position:absolute;left:50%;top:8px;width:120px;height:150px;margin-left:-60px;border-radius:50%/40% 40% 60% 60%;background:radial-gradient(50% 60% at 50% 12%,rgba(255,214,160,.30),rgba(255,180,120,.10) 55%,transparent 75%)}
.cone.c1{left:60px}.cone.c2{left:195px;animation:flicker 11s infinite 3s}.cone.c3{left:330px;opacity:.85}
@keyframes flicker{0%,6%,9%,62%,100%{opacity:1}7%{opacity:.35}8%{opacity:.85}8.5%{opacity:.4}63%{opacity:.7}64%{opacity:1}}

/* practical light spill (screen blend onto the wall) */
.spill{z-index:1;pointer-events:none;border-radius:50%}
.sp-neon{left:-10px;top:96px;width:260px;height:150px;background:radial-gradient(closest-side,rgba(255,79,176,calc(.30 + var(--beat)*.3)),rgba(120,200,255,.08) 60%,transparent);animation:neonspill 7s infinite}
@keyframes neonspill{0%,91%,100%{opacity:1}92%{opacity:.45}93%{opacity:1}96%{opacity:.7}97%{opacity:1}}
.sp-port{left:-10px;top:170px;width:290px;height:270px;background:radial-gradient(closest-side,rgba(110,170,255,.22),transparent)}
.sp-tv{left:-30px;top:400px;width:220px;height:200px;background:radial-gradient(closest-side,rgba(255,110,190,calc(.32 + var(--beat)*.3)),transparent);animation:tvspill 5.3s ease-in-out infinite}
.sp-tv i{position:absolute;inset:0;border-radius:50%;background:radial-gradient(closest-side,rgba(90,170,255,.32),transparent);animation:tvspill 3.7s ease-in-out infinite reverse}
@keyframes tvspill{0%,100%{opacity:.9}30%{opacity:.55}55%{opacity:1}70%{opacity:.7}}
.sp-lava{left:140px;top:400px;width:120px;height:180px;background:radial-gradient(closest-side,rgba(255,90,170,calc(.34 + var(--beat)*.35)),transparent);animation:hum 7s ease-in-out infinite}
.sp-term{left:226px;top:380px;width:190px;height:170px;background:radial-gradient(closest-side,rgba(92,255,157,.20),transparent)}
.sp-arc{left:260px;top:540px;width:170px;height:200px;background:radial-gradient(closest-side,rgba(255,79,176,.26),rgba(79,230,255,.12) 55%,transparent);animation:hum 4s ease-in-out infinite}
.cshadow{pointer-events:none;border-radius:50%;z-index:1}
.cs-couch{left:140px;top:694px;width:170px;height:30px;background:radial-gradient(closest-side,rgba(0,0,0,.75),transparent)}
.cs-arc{left:290px;top:744px;width:110px;height:26px;background:radial-gradient(closest-side,rgba(0,0,0,.8),transparent)}

/* ---------- neon: glass tubes ---------- */
.neon .n1,.neon .n2{color:#fff6fb;-webkit-text-stroke:.4px rgba(255,255,255,.7)}
.neon .n1{text-shadow:0 0 1px #fff,0 0 4px #ffd0ea,0 0 10px var(--pink),0 0 22px var(--pink),0 0 44px var(--pink),0 0 80px rgba(255,79,176,.6)}
.neon .n2{color:#f2fdff;text-shadow:0 0 1px #fff,0 0 4px #d9fbff,0 0 10px var(--cyan),0 0 22px var(--cyan),0 0 44px #1aa9d6,0 0 80px rgba(79,230,255,.55)}
.neon::after{content:"";position:absolute;left:4px;right:20px;top:-6px;bottom:-6px;border-radius:10px;border:1px solid rgba(255,255,255,.06);background:rgba(10,6,18,.18);box-shadow:inset 0 0 18px rgba(255,79,176,.12);z-index:-1;pointer-events:none}

/* ---------- posters: paper, frames, glare ---------- */
.poster{border:0;border-radius:1px;box-shadow:0 0 0 2px #1a1220,0 0 0 3px #4d4058,0 8px 14px rgba(0,0,0,.65),0 2px 3px rgba(0,0,0,.5)}
.poster::after{background:linear-gradient(115deg,rgba(255,255,255,.32),transparent 32%,transparent 70%,rgba(255,255,255,.06)),linear-gradient(0deg,rgba(0,0,0,.25),transparent 30%)}

/* ---------- porthole: brushed steel ring, Earth over the lunar horizon ---------- */
.port-space{background:radial-gradient(circle at 50% 120%,#2b2350,#090718 55%,#020109)}
.ps-stars.tw{inset:0;background-image:radial-gradient(1.6px 1.6px at 24px 30px,#fff,transparent),radial-gradient(1.4px 1.4px at 150px 64px,#e0f4ff,transparent),radial-gradient(1.8px 1.8px at 96px 110px,#fff,transparent),radial-gradient(1.2px 1.2px at 40px 96px,#ffe9f5,transparent);animation:twinkle 3.2s ease-in-out infinite}
@keyframes twinkle{50%{opacity:.25}}
.ps-neb{position:absolute;left:-20%;top:-10%;width:90%;height:70%;border-radius:50%;background:radial-gradient(closest-side,rgba(160,90,255,.22),rgba(255,79,176,.08) 60%,transparent);filter:blur(4px)}
.ps-earth{position:absolute;left:66px;top:22px;width:104px;height:104px;border-radius:50%;overflow:hidden;background:#0a1f4a;box-shadow:0 0 18px 3px rgba(110,180,255,.45),0 0 50px 10px rgba(80,140,255,.15)}
.ps-earth .e-map,.ps-earth .e-cloud{position:absolute;top:0;left:0;height:100%;width:416px;background:url(/assets/tex/earth.webp) 0 0/208px 100% repeat-x;animation:spinE 90s linear infinite;will-change:transform}
.ps-earth .e-cloud{background-image:url(/assets/tex/clouds.webp);opacity:.8;animation-duration:60s}
@keyframes spinE{to{transform:translate3d(-208px,0,0)}}
/* spherical shading: day side upper-left, night side lower-right, limb darkening */
.ps-earth .e-shade{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 34% 30%,rgba(255,255,255,.18),transparent 30%),radial-gradient(circle at 30% 28%,transparent 50%,rgba(0,4,20,.45) 68%,rgba(0,2,12,.9) 88%);box-shadow:inset -14px -12px 26px rgba(0,0,10,.85),inset 4px 4px 10px rgba(180,220,255,.25)}
.ps-earth .e-atmo{position:absolute;inset:-1px;border-radius:50%;box-shadow:inset 3px 3px 6px rgba(160,210,255,.6),inset 0 0 2px rgba(200,230,255,.8)}
.ps-horizon{background:radial-gradient(ellipse at 40% 0%,rgba(255,255,255,.25),transparent 55%),url(/assets/tex/regolith.webp) center/220px auto,linear-gradient(180deg,#b9b5c8,#5d5a72 45%,#1d1a2c);background-blend-mode:normal,overlay,normal;box-shadow:0 -2px 6px rgba(160,200,255,.45),0 -10px 30px rgba(120,160,255,.2),inset 0 10px 18px rgba(255,255,255,.12)}
.ps-horizon::before{display:none}
.port-ring{border:0;background:
   radial-gradient(circle closest-side,transparent calc(100% - 13px),rgba(0,0,0,.6) calc(100% - 12px),transparent calc(100% - 9px),transparent calc(100% - 2px),rgba(0,0,0,.5) 100%),
   conic-gradient(from 18deg,#5a5768,#dcd9e6 8%,#77748a 18%,#3e3b4c 30%,#a9a6b8 42%,#5a5768 52%,#e9e6f2 63%,#6d6a7e 74%,#3e3b4c 86%,#5a5768);
  -webkit-mask:radial-gradient(circle closest-side,transparent 0 calc(100% - 13px),#000 calc(100% - 12px) calc(100% - .5px),transparent 100%);mask:radial-gradient(circle closest-side,transparent 0 calc(100% - 13px),#000 calc(100% - 12px) calc(100% - .5px),transparent 100%);
  box-shadow:none}
.port::before{content:"";position:absolute;inset:-6px;border-radius:50%;background:conic-gradient(from 200deg,#2b2838,#6a6680 25%,#2b2838 50%,#4c4860 75%,#2b2838);box-shadow:0 14px 34px rgba(0,0,0,.7),0 3px 6px rgba(0,0,0,.6),inset 0 0 0 2px rgba(0,0,0,.6)}
.port::after{content:"";position:absolute;inset:0;border-radius:50%;pointer-events:none;background:var(--tex-metal) center/180px;-webkit-mask:radial-gradient(circle closest-side,transparent 0 calc(100% - 13px),#000 calc(100% - 12px) calc(100% - .5px),transparent 100%);mask:radial-gradient(circle closest-side,transparent 0 calc(100% - 13px),#000 calc(100% - 12px) calc(100% - .5px),transparent 100%);opacity:.3}
.port-ring i{width:8px;height:8px;margin:-4px;background:radial-gradient(circle at 35% 30%,#fff,#a9a6b8 35%,#3b3848 80%);box-shadow:0 1px 1px rgba(0,0,0,.7)}
.port-glass{box-shadow:inset 0 0 26px rgba(0,0,0,.85),inset 0 0 0 2px rgba(0,0,0,.5);background:linear-gradient(130deg,rgba(255,255,255,.22) 0%,rgba(255,255,255,.04) 26%,transparent 40%,transparent 64%,rgba(255,255,255,.07) 70%,transparent 78%)}
.port-glass .smudge{position:absolute;inset:0;border-radius:50%;background:url(/assets/tex/smudge.webp) 30% 20%/160px;opacity:.3}
.sill{background:var(--tex-metal) 0 0/256px,linear-gradient(180deg,#a7a3bb,#4a465e 60%,#2a2738);background-blend-mode:overlay,normal;box-shadow:0 8px 14px rgba(0,0,0,.65),inset 0 1px 0 rgba(255,255,255,.5)}

/* ---------- badge cabinet: walnut + felt + glass ---------- */
.cabinet{background:var(--tex-wood) 0 0/180px,linear-gradient(180deg,#6a4630,#3a2418);background-blend-mode:overlay,normal;border:0;box-shadow:inset 0 0 0 3px #24150d,inset 0 2px 0 4px rgba(255,220,180,.12),0 16px 28px -6px rgba(0,0,0,.75),0 3px 6px rgba(0,0,0,.5)}
.peg{background:var(--tex-fab) 0 0/64px,radial-gradient(circle,rgba(0,0,0,.55) 1.4px,transparent 1.8px) 0 0/10px 10px,#3a2038;background-blend-mode:overlay,normal,normal;box-shadow:inset 0 3px 10px rgba(0,0,0,.85),inset 0 0 0 1px rgba(0,0,0,.6)}
.cab-glass{background:linear-gradient(118deg,rgba(255,255,255,.2),rgba(255,255,255,.04) 30%,transparent 46%,transparent 78%,rgba(255,255,255,.08) 84%,transparent 90%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.cab-glass::after{content:"";position:absolute;inset:0;background:url(/assets/tex/smudge.webp) 0 0/120px;opacity:.22}
.stk{filter:drop-shadow(0 2px 1px rgba(0,0,0,.7)) drop-shadow(0 0 1px rgba(0,0,0,.6))}

/* ---------- CRT TV: wood veneer, bulged glass ---------- */
.tv-body{background:var(--tex-wood) 0 0/220px,linear-gradient(180deg,#7a6450,#4a3a2c 60%,#33271c);background-blend-mode:overlay,normal;border:0;box-shadow:inset 0 0 0 3px #1f1812,inset 0 3px 0 4px rgba(255,230,190,.14),0 16px 26px -6px rgba(0,0,0,.8),0 3px 6px rgba(0,0,0,.55)}
.tv-screen{border-radius:16px/20px;box-shadow:inset 0 0 22px rgba(0,0,0,.95),0 0 0 3px #15110d,0 0 0 4px rgba(255,230,190,.12)}
.tv-pic{filter:saturate(1.25) contrast(1.05);animation:tvpic 4s ease-in-out infinite,tvroll 9s steps(1) infinite}
@keyframes tvroll{0%,96%,100%{transform:none}97%{transform:translateY(-2px) skewX(1deg)}98%{transform:translateY(1px)}}
.tv-glow{background:radial-gradient(ellipse at 32% 22%,rgba(255,255,255,.35),transparent 30%),radial-gradient(ellipse at 50% 50%,transparent 55%,rgba(0,0,0,.55))}
.tv-screen::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,rgba(255,0,60,.06) 0 1px,rgba(0,255,120,.04) 1px 2px,rgba(40,80,255,.06) 2px 3px);pointer-events:none}
.knob{background:radial-gradient(circle at 35% 30%,#fff7ea,#b8aa94 40%,#5d5244);box-shadow:0 2px 3px rgba(0,0,0,.65),inset 0 -1px 2px rgba(0,0,0,.4)}
.knob::after{content:"";position:absolute;width:2px;height:6px;margin:2px 0 0 7px;background:#3a2c20;border-radius:1px}
.knob{position:relative}
.tv-ant::before,.tv-ant::after{background:linear-gradient(90deg,#6b6b80,#e3e3ee,#6b6b80)}
.shelf{background:var(--tex-wood) 0 0/200px,linear-gradient(180deg,#9a6a44,#4a2e18);background-blend-mode:overlay,normal;box-shadow:0 10px 16px rgba(0,0,0,.65),inset 0 1px 0 rgba(255,220,180,.35)}

/* ---------- cassette deck: brushed aluminium ---------- */
.deck{background:var(--tex-metal) 0 0/200px,linear-gradient(180deg,#e2ddd4,#a39d94 55%,#7f7a72);background-blend-mode:overlay,normal;border:0;box-shadow:inset 0 0 0 2px #2a2622,inset 0 2px 0 2px rgba(255,255,255,.55),0 12px 20px -4px rgba(0,0,0,.75),0 2px 4px rgba(0,0,0,.5)}
.deck-win{box-shadow:inset 0 0 10px #000,inset 0 0 0 1px rgba(255,255,255,.15),0 1px 0 rgba(255,255,255,.4)}
.deck-win::after{content:"";position:absolute;inset:0;border-radius:4px;background:linear-gradient(120deg,rgba(255,255,255,.22),transparent 40%);pointer-events:none}
.deck-keys i{background:linear-gradient(180deg,#fffdf8,#c9c1b4);box-shadow:0 2px 0 #5d564d,0 3px 3px rgba(0,0,0,.4),inset 0 -2px 0 rgba(0,0,0,.08)}
.records{background:linear-gradient(180deg,rgba(255,255,255,.18),transparent 12%,transparent 85%,rgba(0,0,0,.5)),repeating-linear-gradient(90deg,#c2135f 0 5px,#111 5px 7px,#0e7490 7px 12px,#111 12px 14px,#f59e0b 14px 18px,#111 18px 20px,#7c3aed 20px 25px,#111 25px 27px);box-shadow:0 8px 12px rgba(0,0,0,.6);opacity:.95}

/* ---------- lava lamp: glass + bloom ---------- */
.lava{background:linear-gradient(90deg,rgba(255,255,255,.25),transparent 30%,transparent 70%,rgba(255,255,255,.08)),linear-gradient(180deg,rgba(255,79,176,.45),rgba(255,140,60,.32));border:1.5px solid rgba(255,200,230,.25);box-shadow:0 0 calc(22px + var(--beat)*22px) rgba(255,79,176,.65),0 0 60px rgba(255,79,176,.25),inset 0 0 10px rgba(255,180,220,.35)}
.lava::before{content:"";position:absolute;left:-3px;right:-3px;top:-10px;height:12px;border-radius:6px 6px 2px 2px;background:var(--tex-metal) 0 0/100px,linear-gradient(180deg,#b8b4ca,#4a465e);background-blend-mode:overlay,normal}
.lava::after{background:var(--tex-metal) 0 0/100px,linear-gradient(180deg,#b8b4ca,#3c3950);background-blend-mode:overlay,normal;box-shadow:0 6px 10px rgba(0,0,0,.6)}
.lava i{background:radial-gradient(circle at 40% 35%,#fff0f7,#ff7ac0 45%,#e0207a);box-shadow:0 0 8px rgba(255,79,176,.8);filter:blur(.3px)}

/* ---------- plant ---------- */
.plant::after{background:var(--tex-plas) 0 0/60px,linear-gradient(180deg,#e09a62,#9a5428 70%,#6a3414);background-blend-mode:overlay,normal;box-shadow:0 6px 10px rgba(0,0,0,.6),inset 0 2px 0 rgba(255,220,180,.35),inset 0 -6px 8px rgba(0,0,0,.3)}
.plant::before{content:"";position:absolute;left:10px;bottom:22px;width:32px;height:5px;border-radius:2px;background:linear-gradient(180deg,#f0ae74,#a8602e);z-index:1;box-shadow:0 2px 3px rgba(0,0,0,.4)}
.plant i{background:linear-gradient(90deg,#1c6b40,#3fbf78 45%,#7cf0b0 50%,#2f9c5e 55%,#165a35);box-shadow:inset 0 0 4px rgba(0,0,0,.35);filter:drop-shadow(1px 2px 1px rgba(0,0,0,.35))}

/* ---------- terminal: beige ABS plastic ---------- */
.terminal{background:var(--tex-plas) 0 0/90px,linear-gradient(180deg,#d6d3dc,#8a8797 70%,#6c6979);background-blend-mode:overlay,normal;border:0;box-shadow:inset 0 0 0 2px #2a2834,inset 0 3px 0 2px rgba(255,255,255,.6),inset -3px 0 6px rgba(0,0,0,.18),0 16px 28px -6px rgba(0,0,0,.75),0 3px 6px rgba(0,0,0,.5)}
.term-screen::before{content:"";position:absolute;inset:0;z-index:2;border-radius:8px;pointer-events:none;background:radial-gradient(ellipse at 30% 18%,rgba(255,255,255,.22),transparent 34%),radial-gradient(ellipse at 50% 50%,transparent 58%,rgba(0,0,0,.6))}
.term-screen{box-shadow:inset 0 0 16px #000,0 0 0 3px #22202c,0 0 0 4px rgba(255,255,255,.2),0 0 26px rgba(92,255,157,.3)}
.term-sym,.term-chg{animation:phos 4s ease-in-out infinite}
@keyframes phos{50%{opacity:.86}}
.term-keys i{box-shadow:0 2px 0 #0a0f0c,0 3px 3px rgba(0,0,0,.4),inset 0 0 6px rgba(92,255,157,.35),inset 0 1px 0 rgba(255,255,255,.12)}

/* ---------- arcade: laminate cabinet + T-molding ---------- */
.arcade{background:var(--tex-wood) 0 0/160px,linear-gradient(90deg,#140b26,#2f1b52 50%,#140b26);background-blend-mode:soft-light,normal;border:0;box-shadow:inset 0 0 0 2px #0c0616,inset 3px 0 0 #ff4fb0,inset -3px 0 0 #ff4fb0,0 14px 26px -6px rgba(0,0,0,.8)}
.arc-marquee{background:linear-gradient(180deg,rgba(255,255,255,.35),transparent 40%),linear-gradient(180deg,#ff6ab3,#a3125b);box-shadow:0 0 18px rgba(255,79,176,.75),0 0 40px rgba(255,79,176,.35),inset 0 0 0 1px rgba(255,255,255,.3)}
.arc-screen{box-shadow:inset 0 0 12px #000,0 0 0 2px #000,0 0 18px rgba(79,230,255,.45)}
.arc-screen::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 30% 20%,rgba(255,255,255,.2),transparent 35%),repeating-linear-gradient(0deg,rgba(0,0,0,.3) 0 1px,transparent 1px 3px);pointer-events:none}
.arc-panel{background:linear-gradient(180deg,#2a1a44,#0e0818);box-shadow:inset 0 1px 0 rgba(255,255,255,.15),0 3px 4px rgba(0,0,0,.5)}
.arc-panel i{box-shadow:0 0 8px currentColor,inset 0 -2px 2px rgba(0,0,0,.35),inset 0 1px 1px rgba(255,255,255,.6)}

/* ---------- couch: velvet, tufted ---------- */
.couch .back,.couch .seat,.couch .arm{background-blend-mode:overlay,normal,normal}
.couch .back{background:var(--tex-fab) 0 0/48px,radial-gradient(circle at 50% 50%,rgba(0,0,0,.35) 1.5px,transparent 2.5px) 6px 8px/22px 18px,linear-gradient(180deg,#e8627a,#b42c47 60%,#8a1c33);box-shadow:inset 0 3px 0 rgba(255,255,255,.22),inset 0 -10px 14px rgba(0,0,0,.3),0 4px 8px rgba(0,0,0,.35)}
.couch .seat{background:var(--tex-fab) 0 0/48px,linear-gradient(90deg,transparent 49.4%,rgba(0,0,0,.35) 50%,transparent 50.6%),linear-gradient(180deg,#d8475f,#a02640 55%,#6e1426);box-shadow:inset 0 2px 0 rgba(255,255,255,.28),inset 0 -6px 10px rgba(0,0,0,.35),0 14px 20px -4px rgba(0,0,0,.7)}
.couch .arm{background:var(--tex-fab) 0 0/48px,radial-gradient(ellipse at 40% 15%,rgba(255,255,255,.3),transparent 50%),linear-gradient(180deg,#e05470,#8e1e38);box-shadow:inset 0 -8px 10px rgba(0,0,0,.35),0 6px 10px rgba(0,0,0,.45)}
.couch .pillow{box-shadow:0 4px 6px rgba(0,0,0,.55),inset 0 0 6px rgba(0,0,0,.35),inset 2px 2px 0 rgba(255,255,255,.25)}
.couch .pillow.p2{left:auto;right:24px;top:22px;width:32px;height:26px;transform:rotate(9deg);background:linear-gradient(135deg,transparent 40%,#ffd23e 40% 48%,transparent 48% 52%,#ffd23e 52% 60%,transparent 60%),var(--tex-fab) 0 0/40px,linear-gradient(180deg,#ff6a3d,#c2361a);background-blend-mode:normal,overlay,normal}
.couch .throw{left:58px;top:58px;width:56px;height:22px;border-radius:6px 10px 12px 4px;transform:rotate(-3deg);background:var(--tex-fab) 0 0/36px,linear-gradient(180deg,#3d4a9a,#22285e);background-blend-mode:overlay,normal;box-shadow:0 3px 5px rgba(0,0,0,.45)}
.couch .legs{left:16px;right:16px;top:76px;height:10px;background:linear-gradient(90deg,#c9c4d6 0 6px,transparent 6px calc(100% - 6px),#c9c4d6 calc(100% - 6px));opacity:.85}

/* ---------- global lighting + finish ---------- */
.dust{left:0;top:0;width:390px;height:844px;z-index:5;pointer-events:none}
.grade{inset:0;pointer-events:none;z-index:6;background:radial-gradient(80% 50% at 50% 30%,rgba(255,170,120,.035),transparent),linear-gradient(180deg,rgba(30,8,50,.10),transparent 25%,transparent 75%,rgba(8,0,24,.22))}
.vignette{background:radial-gradient(115% 85% at 50% 42%,transparent 52%,rgba(4,1,10,.62))}
.grain{position:fixed;left:-60px;top:-60px;right:-60px;bottom:-60px;z-index:15;pointer-events:none;background:url(/assets/tex/grain.webp) 0 0/128px;opacity:.14;animation:grain 1s steps(5) infinite;will-change:transform}
@keyframes grain{0%{transform:translate3d(0,0,0)}20%{transform:translate3d(-37px,21px,0)}40%{transform:translate3d(19px,-41px,0)}60%{transform:translate3d(-13px,33px,0)}80%{transform:translate3d(43px,9px,0)}}
.zoom-veil{position:fixed;inset:0;z-index:30;pointer-events:none;opacity:0;background:radial-gradient(60% 45% at 50% 46%,transparent 30%,rgba(4,2,10,.75))}
body.night .cone{opacity:.45}

/* ---------- tactile: press, release spring, light flash ---------- */
.obj{transition:transform .14s cubic-bezier(.3,.7,.4,1),filter .14s}
.obj:active,.obj.down{transform:translateY(1.5px) scale(.965);filter:brightness(1.22) saturate(1.1)}
.obj.rel{animation:rel .5s cubic-bezier(.2,1.6,.4,1)}
@keyframes rel{0%{transform:translateY(1.5px) scale(.965)}45%{transform:translateY(-1px) scale(1.025)}100%{transform:none}}
.neon.obj:active,.neon.obj.down{transform:rotate(-4deg) scale(.97)}
.neon.obj.rel{animation:none}
.flash{position:absolute;z-index:6;width:160px;height:160px;margin:-80px 0 0 -80px;border-radius:50%;pointer-events:none;background:radial-gradient(closest-side,rgba(255,250,235,.85),rgba(255,200,150,.35) 35%,transparent);mix-blend-mode:screen;animation:flash .45s ease-out forwards}
@keyframes flash{from{transform:scale(.25);opacity:1}to{transform:scale(1.3);opacity:0}}
.press:active,.press.down{transform:translateY(1.5px) scale(.95)}
.press.rel{animation:prel .42s cubic-bezier(.2,1.6,.4,1)}
@keyframes prel{0%{transform:translateY(1.5px) scale(.95)}50%{transform:scale(1.04)}100%{transform:none}}
.dock button.on{transition:background .3s,box-shadow .3s,color .3s}
.radio,.dock{background:linear-gradient(180deg,rgba(255,255,255,.07),transparent 40%),rgba(14,10,26,.74);box-shadow:0 12px 30px rgba(0,0,0,.65),inset 0 1px 0 rgba(255,255,255,.16),inset 0 -1px 0 rgba(0,0,0,.4)}

/* ---------- Wizmo (painted rig) ---------- */
.wizmo-wrap{left:0;top:0;width:136px;height:98px;z-index:4;cursor:pointer;will-change:transform;touch-action:none;filter:drop-shadow(0 0 .6px rgba(24,10,20,.7))}
.wz{width:100%;height:100%;overflow:visible;display:block}
.wz image{transform-box:view-box}
.wz-all{transform-box:view-box;transform-origin:445px 645px;transition:transform .3s var(--spring)}
.wz-body{transform-box:view-box;transform-origin:445px 645px;animation:wzbreathe 3.4s ease-in-out infinite}
.wizmo-wrap.happy .wz-body{animation-duration:1.7s}
.wizmo-wrap.sleep .wz-body{animation-duration:5.5s}
@keyframes wzbreathe{50%{transform:scale(1.022,.985)}}
.wz-ear{transition:transform .35s var(--spring)}
.wz-ear.l{transform-origin:298px 190px}
.wz-ear.r{transform-origin:608px 180px}
.wz-tail{transform-origin:284px 470px;transition:transform .4s var(--spring)}
.wz-lid{transform-box:fill-box;transform-origin:50% 0;transform:scaleY(0);transition:transform .07s ease-in}
.wizmo-wrap.blink .wz-lid,.wizmo-wrap.sleep .wz-lid,.wizmo-wrap.purr .wz-lid{transform:scaleY(1)}
.wizmo-wrap.half .wz-lid,.wizmo-wrap.annoyed .wz-lid{transform:scaleY(.5)}
.wz-lash{opacity:0;transition:opacity .05s}
.wizmo-wrap.blink .wz-lash,.wizmo-wrap.sleep .wz-lash{opacity:.85}
.wz-happy-eyes{opacity:0;transition:opacity .1s}
.wizmo-wrap.purr .wz-happy-eyes{opacity:1}
.wz-brow{opacity:0;transition:opacity .2s}
.wizmo-wrap.annoyed .wz-brow{opacity:1}
.wz-blush{opacity:0;transition:opacity .3s}
.wizmo-wrap.happy .wz-blush,.wizmo-wrap.purr .wz-blush{opacity:.22}
.wz-mouth>*{opacity:0;transition:opacity .1s}
.wizmo-wrap[data-mouth=open] .m-open,.wizmo-wrap[data-mouth=flat] .m-flat,.wizmo-wrap[data-mouth=o] .m-o,.wizmo-wrap[data-mouth=cat] .m-cat{opacity:1}
.wizmo-wrap.wide .wz-base{filter:brightness(1.06)}
.wz-lensring,.wz-iris{animation:lens 4s ease-in-out infinite;transition:opacity .25s}
.wz-iris{mix-blend-mode:normal}
.wz-lensring{filter:drop-shadow(0 0 5px #4fe6ff)}
.wz-lensdim{opacity:0;transition:opacity .6s}
.wizmo-wrap.blink .wz-iris{opacity:.35}
.wizmo-wrap.wide .wz-iris{transform-box:fill-box;transform-origin:50% 50%;transform:scale(1.25)}
.wizmo-wrap.purr .wz-lensring,.wizmo-wrap.happy .wz-lensring{stroke:#ff9be0}
@keyframes lens{50%{opacity:.75}}
.wz-led{animation:led 1.4s steps(2) infinite}
.wz-wire{stroke-dasharray:6 10;animation:wire 1.2s linear infinite}
@keyframes wire{to{stroke-dashoffset:-16}}
.wizmo-wrap.sleep .wz-iris,.wizmo-wrap.sleep .wz-lensring,.wizmo-wrap.sleep .wz-led{opacity:0;animation:none}
.wizmo-wrap.sleep .wz-lensdim{opacity:.72}
.wizmo-wrap.half .wz-lensdim{opacity:.35}
.wizmo-wrap.squish .wz-all{transform:scale(1.06,.93)!important}
.wz-floor-shadow{left:0;top:0;width:66px;height:15px;z-index:3;pointer-events:none;border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.7),rgba(0,0,0,.3) 60%,transparent);will-change:transform}
.heart{position:absolute;z-index:8;pointer-events:none;font-size:16px;color:#ff6ab3;text-shadow:0 0 8px #ff4fb0;animation:heart 1.3s var(--out) forwards}
@keyframes heart{from{transform:translate(0,0) scale(.4);opacity:0}20%{opacity:1}to{transform:translate(var(--dx,0px),-60px) scale(1.2);opacity:0}}
.zzz{z-index:8;font:800 14px var(--display);color:#cfe8ff;opacity:0;pointer-events:none;text-shadow:0 0 8px #7fd0ff}
body.wz-sleep .zzz{opacity:1;animation:zzz 3s ease-in-out infinite}
.zzz span{display:inline-block;margin-left:2px;font-size:.8em;transform:translateY(-6px)}.zzz span+span{font-size:.65em;transform:translateY(-12px)}
@keyframes zzz{0%{transform:translate(0,0);opacity:0}30%{opacity:1}100%{transform:translate(10px,-22px);opacity:0}}

@media (prefers-reduced-motion:reduce){.grain,.cone,.ps-earth *,.dust{animation:none!important}.dust{display:none}}

/* ---------- themed windows: real materials (texture under content, above the base colour) ---------- */
.crt-set{background:var(--tex-wood) 0 0/640px,linear-gradient(180deg,#7a6450,#4a3a2c 60%,#3a2c20);background-blend-mode:soft-light,normal}
.vault{background:var(--tex-wood) 0 0/640px,linear-gradient(180deg,#4a2f20,#2c1a10);background-blend-mode:soft-light,normal}
.boom{background:var(--tex-metal) 0 0/300px,linear-gradient(180deg,#d9d4cc,#a7a097 55%,#8d877e);background-blend-mode:overlay,normal}
.tele{background:var(--tex-metal) 0 0/300px,linear-gradient(180deg,#5a5a64,#2e2e36);background-blend-mode:overlay,normal}
.tcase{background:var(--tex-plas) 0 0/120px,linear-gradient(180deg,#d4d2da,#9e9bab 60%,#7d7a8a);background-blend-mode:overlay,normal}
.cab{background:var(--tex-wood) 0 0/400px,linear-gradient(90deg,#1b1030,#3a2160 50%,#1b1030);background-blend-mode:soft-light,normal}
.idc{background:var(--tex-plas) 0 0/140px,linear-gradient(180deg,#1d2440,#0e1222);background-blend-mode:soft-light,normal}
.crt-set,.boom,.vault,.tcase,.cab,.tele{box-shadow:0 34px 60px rgba(0,0,0,.75),0 6px 14px rgba(0,0,0,.5),inset 0 2px 0 rgba(255,255,255,.22),inset 0 -3px 0 rgba(0,0,0,.35)}
.win{background:radial-gradient(120% 80% at 50% 40%,rgba(10,6,20,.6),rgba(5,3,10,.9))}
/* glass on every CRT-style screen */
.crt-screen::after,.arc-glass{content:"";position:absolute;inset:0;z-index:5;pointer-events:none;border-radius:inherit;background:radial-gradient(ellipse at 28% 16%,rgba(255,255,255,.16),transparent 32%),radial-gradient(ellipse at 50% 50%,transparent 62%,rgba(0,0,0,.45))}
/* arcade cabinet */
.cab{--gc:#ff4fb0;--ga:#4fe6ff;box-shadow:0 34px 60px rgba(0,0,0,.75),inset 4px 0 0 var(--gc),inset -4px 0 0 var(--gc),inset 0 2px 0 rgba(255,255,255,.2)}
.cab-marq{background:linear-gradient(180deg,rgba(255,255,255,.35),transparent 45%),linear-gradient(180deg,var(--gc),color-mix(in srgb,var(--gc) 55%,#000));box-shadow:0 0 30px color-mix(in srgb,var(--gc) 60%,transparent),inset 0 0 0 1px rgba(255,255,255,.35)}
.cab-bezel{margin-top:14px;padding:10px;border-radius:18px;background:linear-gradient(180deg,#0e0a18,#05030a);box-shadow:inset 0 2px 8px #000,0 1px 0 rgba(255,255,255,.08)}
.cab-bezel .cab-screen{margin-top:0;box-shadow:inset 0 0 0 3px #000,0 0 30px color-mix(in srgb,var(--ga) 35%,transparent)}
.arc-glass{border-radius:14px}
.cab-panel{background:var(--tex-metal) 0 0/260px,linear-gradient(180deg,#2c1a4a,#120a22);background-blend-mode:soft-light,normal;box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 4px 10px rgba(0,0,0,.5)}
.abtn{box-shadow:0 6px 0 #000,0 8px 12px rgba(0,0,0,.5),inset 0 2px 0 rgba(255,255,255,.45),inset 0 -4px 6px rgba(0,0,0,.25)}
.carts{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.cart{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:3px;min-height:92px;padding:12px;border-radius:10px 10px 14px 14px;text-align:left;color:#fff;
  background:linear-gradient(180deg,rgba(255,255,255,.14),transparent 30%),linear-gradient(160deg,color-mix(in srgb,var(--c,#555) 70%,#111),#120a1c);box-shadow:0 5px 0 #05030a,0 8px 14px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.25)}
.cart::before{content:"";position:absolute;left:12px;right:12px;top:-6px;height:8px;border-radius:3px 3px 0 0;background:repeating-linear-gradient(90deg,#c9a24a 0 4px,#6b5220 4px 6px)}
.cart-ic{font-size:20px;color:var(--a,#fff);text-shadow:0 0 10px var(--a,#fff)}
.cart b{font:900 italic 14px var(--display);letter-spacing:.04em}
.cart small{font-size:11px;color:rgba(255,255,255,.7)}
.cart.on{box-shadow:0 5px 0 #05030a,0 0 0 2px var(--a),0 0 22px color-mix(in srgb,var(--a) 50%,transparent),inset 0 1px 0 rgba(255,255,255,.25)}
.cart.empty{background:repeating-linear-gradient(135deg,rgba(255,255,255,.04) 0 8px,transparent 8px 16px),#120a1c;color:var(--mute);box-shadow:inset 0 0 0 2px rgba(255,255,255,.1)}
.cart.empty::before{display:none}
body:not(.playing) .room-beat{display:none}