body{background:#100b1c;isolation:isolate}body:after{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 50% 22%,#200b4640,#08080dda 82%)}.basement-scene{position:fixed;inset:0;z-index:-2;overflow:hidden;background:linear-gradient(0deg,#1c1220 0 13%,transparent 13%),repeating-linear-gradient(0deg,#332138 0 28px,#170f23 29px 32px);box-shadow:inset 0 0 150px #030105}.blacklight-tube{position:absolute;top:6%;left:12%;width:76%;height:8px;border-radius:20px;background:#e3b5ff;box-shadow:0 0 12px 8px #9a36ff,0 0 70px 26px #7431f4,0 80px 150px #bd34fa}.poster{position:absolute;top:19%;width:210px;height:320px;border:10px solid #0a0913;transform:rotate(-5deg);box-shadow:0 0 50px #712df175;display:grid;place-items:center;opacity:.8}.poster span{font:900 48px/.9 'Barlow Condensed',sans-serif;text-align:center;color:#efff79;text-shadow:0 0 14px #c0f600;letter-spacing:4px}.poster-one{left:2%;background:repeating-radial-gradient(ellipse at 50% 65%,#152240 0 13px,#41318d 14px 23px,#ce56fb 24px 28px)}.poster-two{right:2%;transform:rotate(4deg);background:repeating-conic-gradient(#170d32 0deg 20deg,#ff376699 20deg 40deg,#29ded788 40deg 60deg)}.poster-two span{color:#72ffe5;text-shadow:0 0 10px #2cfff3}.lava{position:absolute;bottom:12%;width:85px;height:230px;border-radius:45% 45% 30% 30%;border:3px solid #574758;background:linear-gradient(90deg,#170b2555,#ed3e7822,#14091855);box-shadow:0 0 90px #f8009770;overflow:hidden}.lava:before,.lava:after{content:'';position:absolute;left:0;right:0;height:32px;background:linear-gradient(90deg,#25232e,#797488,#201e27);z-index:3}.lava:before{top:0;clip-path:polygon(30% 0,70% 0,100% 100%,0 100%)}.lava:after{bottom:0}.lava-left{left:4%}.lava-right{right:4%;filter:hue-rotate(110deg)}.lava i,.lava b{position:absolute;left:15%;width:70%;height:75px;border-radius:48% 52% 60% 40%;background:#fb327b;box-shadow:0 0 22px #ed006b;animation:lava 11s ease-in-out infinite alternate}.lava b{left:28%;width:50%;animation-delay:-6s;animation-duration:14s}@keyframes lava{from{top:22%;transform:scale(.7,1.2) rotate(-25deg)}to{top:60%;transform:scale(1.2,.7) rotate(30deg)}}.smoke{position:absolute;width:160%;height:65%;left:-30%;background:radial-gradient(ellipse at 50% 60%,#ac97c51f,transparent 65%);filter:blur(24px);animation:haze 24s ease-in-out infinite alternate;pointer-events:none}.smoke-one{bottom:4%;transform:rotate(-16deg)}.smoke-two{top:12%;animation-delay:-10s;opacity:.7}@keyframes haze{to{transform:translate(12%,-8%) rotate(8deg)}}main{max-width:1000px;background:linear-gradient(#0f0b18b8,#0b0a14d9);border-left:1px solid #9544cc33;border-right:1px solid #9544cc33;box-shadow:0 0 100px #210b3599}.eyebrow{color:#d899ff}h1{text-shadow:0 0 45px #a743fc66}header{color:#a683d6}.box{max-width:860px;margin:0 auto}.controls{background:#181023ed;border-color:#7d448c}.video-room{padding:28px 20px;background:linear-gradient(140deg,#241332e8,#10262a99);border:1px solid #a05bea;box-shadow:0 0 26px #8244e533;margin-top:25px;border-radius:10px}.video-room h2{margin:8px 0 16px;color:#79f5df}.video-room button{background:#a3f0df}#videoGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:20px}.video-tile{position:relative;aspect-ratio:16/9;background:radial-gradient(circle,#4b276359,#090d17 80%);border:2px solid #5f407b;border-radius:8px;overflow:hidden}.video-tile:before{content:'CAMERA OFF';position:absolute;inset:0;display:grid;place-items:center;letter-spacing:3px;color:#a27abb;font-size:12px}.video-tile.live:before{display:none}.video-tile video{width:100%;height:100%;object-fit:cover;position:relative}.video-tile span{position:absolute;bottom:8px;left:8px;background:#0b0a15db;padding:7px;border-left:3px solid #a1ffcf;font-size:11px}.video-tile.live{border-color:#82eac7;box-shadow:0 0 18px #47bd9944}.room{padding:26px 20px}.roster span{background:#21142f;border-top-color:#bf83e9}#wall{border-bottom-color:#584037}.tape-card{box-shadow:0 8px 14px #000a,0 0 14px #b067ec22}#videoStatus{color:#d4bee3}.room #network{font-size:11px;color:#ad94c7}@media(max-width:650px){.poster{width:130px;height:220px;top:12%;opacity:.45}.poster span{font-size:30px}.lava{width:55px;height:160px;bottom:5%}.blacklight-tube{top:3%}main{background:#0c0915c9}.video-room{padding:16px}#videoGrid{gap:8px}.video-tile span{font-size:8px;padding:4px}.video-tile:before{font-size:9px;letter-spacing:1px}.room{padding:20px 0}.intro{max-width:280px;line-height:1.7}}@media(prefers-reduced-motion:reduce){.lava i,.lava b,.smoke{animation:none}.lava i{top:30%}.lava b{top:60%}}
.hardware{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr) minmax(0,1fr)}.deck,.speaker{min-width:0}.speaker{width:100%}.deck small{overflow-wrap:anywhere}
/* Real scanned surfaces from Poly Haven, optimized for mobile. */
body{background:#171715}.basement-scene{background:linear-gradient(#10121888,#0b100fe3),url('/materials/brick-color.webp') center/560px;box-shadow:inset 0 0 180px #000a}.basement-scene:after{content:'';position:absolute;bottom:0;left:-30%;width:160%;height:25%;background:linear-gradient(#08080580,#020402a8),url('/materials/oak-color.webp') center/320px;transform:perspective(450px) rotateX(34deg);transform-origin:bottom;box-shadow:0 -5px 30px #000a}.poster{border-color:#40392e;box-shadow:inset 0 0 12px #000c,0 8px 20px #0008;background:linear-gradient(#182b2888,#091412bb),url('/materials/fabric-color.webp') center/200px;opacity:.75}.poster-two{background:linear-gradient(#30262299,#101412bb),url('/materials/leather-color.webp') center/200px}.poster span{color:#d3d1b8;text-shadow:none;font-size:40px;letter-spacing:2px}.poster-two span{color:#b6cfcb;text-shadow:none}.lava{border-color:#818279;background:linear-gradient(90deg,#eef7eb1c,#ffffff08 40%,#f2f4e627 60%,#080d11a6);box-shadow:inset 2px 0 3px #ffffff40,inset -3px 0 7px #0007,0 0 45px #e8724833}.lava:before,.lava:after{background:linear-gradient(90deg,#202421aa,#d6d7ce44,#1b2221aa),url('/materials/steel-color.webp') center/100px}.lava i,.lava b{background:#d7754d;box-shadow:0 0 22px #dd492066}.blacklight-tube{height:5px;box-shadow:0 0 10px 3px #897dc6,0 0 45px 12px #635caf66;background:#dcd7eb}.smoke{filter:blur(14px);opacity:.3}
main{background:linear-gradient(#0c1111b8,#0a0e10ed);border-color:#85867a26;box-shadow:0 0 80px #0007}.eyebrow{color:#acbcb4}h1{color:#dfd2b4;text-shadow:0 2px 4px #0007}header{color:#bdbbad}.box{background:linear-gradient(135deg,#d9dcd33b,#242a2788 48%,#a3a9a43b),url('/materials/steel-color.webp') center/300px;border:3px solid #4e5651;border-radius:10px;box-shadow:0 22px 45px #000b,inset 0 2px 2px #fff7,inset 0 -4px 8px #0008,0 0 0 1px #252c28}.handle{border-color:#363c37;border-width:9px;box-shadow:inset 0 2px 2px #b6bdbd44;border-radius:8px 8px 0 0}.tuner{background:linear-gradient(#060b0f88,#101d19aa),url('/materials/steel-color.webp') center/160px;border:3px solid #48514a;border-radius:3px;box-shadow:inset 0 3px 10px #000a,0 1px 1px #e4e1d455;color:#bcbb8f}.tuner span,.tuner b{background:#091410aa;text-shadow:0 0 4px #c5d09255}.speaker{background:radial-gradient(circle,#0b1112e6 0 12%,#75817a70 13% 15%,#10181590 17% 45%,#3c484399 47% 50%,#15201bdd 52% 70%,#b0b5a677 71% 73%,#17201dd9 75%),url('/materials/fabric-color.webp') center/180px;border-color:#333e36;border-width:9px;box-shadow:0 0 0 3px #89918766,inset 0 5px 12px #000d,0 2px 4px #0008}.deck{background:linear-gradient(#171e1be6,#242d25d9),url('/materials/leather-color.webp') center/180px;border:3px solid #555e50;border-radius:3px;box-shadow:inset 0 3px 8px #000b,0 1px 0 #fff3;color:#bdbfae}.cassette{background:linear-gradient(#c4bba326,#101612a6),url('/materials/steel-color.webp') center/180px;border:4px solid #303a31;border-radius:5px;color:#d9d5b8;box-shadow:inset 0 1px 1px #fff3,0 4px 6px #0009}.cassette strong{background:#cfcbafb8;color:#222c24;padding:5px 3px;font-size:11px;text-shadow:none}.reels{background:#0c100ebd;border:1px solid #7b847344;box-shadow:inset 0 2px 5px #000b;color:#b6b8a0}.transport button{background:linear-gradient(#ffffff1f,#00000030),url('/materials/steel-color.webp') center/130px;border-color:#3d473e;border-radius:3px;color:#1b251d;box-shadow:inset 0 1px 1px #fff5,0 3px 0 #313a30,0 5px 5px #0005}.transport button.red{background:linear-gradient(#c9887455,#4c211f77),url('/materials/leather-color.webp') center/100px;color:#ede4d2}.controls{background:linear-gradient(#0e1513ee,#17201bda),url('/materials/leather-color.webp') center/320px;border-color:#86857844;border-radius:6px;box-shadow:inset 0 1px 1px #fff1,0 10px 35px #0006}.video-room{background:linear-gradient(#1b2420e8,#111a17e8),url('/materials/oak-color.webp') center/350px;border-color:#858a7766;box-shadow:inset 0 1px 1px #fff2,0 12px 30px #0006}.video-room h2{color:#c4d2bc}.video-room button{background:#aebbaa}.video-tile{background:linear-gradient(#111a16da,#0b1513ee),url('/materials/fabric-color.webp') center/180px;border-color:#536554;box-shadow:inset 0 2px 10px #0007}.video-tile:before{color:#8a9c83}.video-tile span{background:#111b15db;border-left-color:#b8ccb0}.roster span{background:linear-gradient(#101a16da,#151e18da),url('/materials/leather-color.webp') center/150px;border-top-color:#8c9a7f}.tape-card{background:linear-gradient(#d4cbad99,#9c947777),url('/materials/steel-color.webp') center/200px;border-color:#333d32;box-shadow:inset 0 1px 1px #fff6,0 8px 16px #000b;border-radius:6px}.tape-card .holes{background:#1b271dc9;box-shadow:inset 0 2px 6px #0008;border:1px solid #d0c8b133}.tape-card h3{color:#1f2b21}#wall{border-image:url('/materials/oak-color.webp') 24 repeat;border-bottom-width:18px}#videoStatus,.room #network{color:#abb9a4}.mic-options p,.beat-help{color:#b7bcab}.mic-options{border-color:#7e8a6b55}
@media(max-width:650px){.poster span{font-size:27px}.speaker{border-width:5px}.deck{border-width:2px}.cassette{border-width:3px}.cassette strong{font-size:7px;padding:3px 1px}.basement-scene{background-size:420px}.box{background-size:220px}.hardware{gap:9px}}
/* Molded ABS and brushed aluminum scanned from ambientCG's CC0 library. */
.box{background:linear-gradient(135deg,#eef1ec55,#56636950 48%,#d1d9d344),url('/materials/aluminum-color.webp') center/650px;color:#1b2420;border-color:#596760}.handle{background:url('/materials/plastic-color.webp') center/120px}.tuner{background:linear-gradient(#060d14cc,#12232acc),url('/materials/aluminum-color.webp') center/250px;color:#d6ce97}.speaker{background:radial-gradient(circle,#090d10e6 0 12%,#9daba780 13% 15%,#17232977 17% 45%,#52646580 47% 50%,#111b22c9 52% 69%,#bac4b577 71% 73%,#141e22e6 75%),url('/materials/plastic-color.webp') center/150px;border-color:#354148}.deck{background:linear-gradient(#142226c4,#28302add),url('/materials/plastic-color.webp') center/180px;border-color:#636f65}.cassette{background:linear-gradient(#867d6622,#1b241fc4),url('/materials/plastic-color.webp') center/150px;border-color:#56634d}.cassette strong{background:#e2dfc9;color:#28352c}.transport button{background:linear-gradient(#fff8,#88999533),url('/materials/aluminum-color.webp') center/180px;color:#15251e;text-shadow:0 1px 0 #fff5}.transport button.red{background:linear-gradient(#ae4d3dde,#803027ee),url('/materials/plastic-color.webp') center/100px;color:#fff5e5;text-shadow:0 1px 1px #0008}.tape-card{background:linear-gradient(#dfd2acb8,#bab39799),url('/materials/plastic-color.webp') center/150px}.lava:before,.lava:after{background:linear-gradient(90deg,#202421aa,#d6d7ce44,#1b2221aa),url('/materials/aluminum-color.webp') center/100px}
@media(max-width:650px){.box{background-size:420px}}
/* A detailed CC0 vintage recorder render replaces the illustrative speaker shapes. */
.scanned-recorder{display:grid;grid-template-columns:minmax(180px,.7fr) minmax(0,1fr);grid-template-rows:auto 1fr auto;gap:18px 36px;max-width:780px;background:linear-gradient(120deg,#111a15cc,#080e12db),url('/materials/oak-color.webp') center/450px;border:1px solid #a7b09a40;padding:28px;box-shadow:inset 0 1px 1px #d8e0cf25,0 22px 45px #0009}.recorder-object{grid-column:1;grid-row:1/4;display:block;width:100%;height:440px;object-fit:contain;filter:drop-shadow(12px 14px 10px #000b)}.scanned-recorder>.handle{display:none}.scanned-recorder>.tuner{grid-column:2;grid-row:1;align-items:center;gap:6px;flex-wrap:wrap;font-size:10px}.scanned-recorder>.hardware{grid-column:2;grid-row:2;display:block;padding:0;align-self:center}.scanned-recorder .speaker{display:none}.scanned-recorder .deck{padding:18px;gap:15px;min-height:180px}.scanned-recorder .cassette{max-width:310px;width:100%;margin:auto;padding:16px}.scanned-recorder .cassette strong{font-size:13px}.scanned-recorder .reels{margin:18px 0}.scanned-recorder .transport{grid-column:2;grid-row:3;display:grid;grid-template-columns:1fr 1fr;gap:10px}.scanned-recorder .transport button{font-size:11px;min-height:44px;color:#203027}.scanned-recorder .transport .red{color:#fff5e5}
@media(max-width:650px){.scanned-recorder{grid-template-columns:110px minmax(0,1fr);gap:10px 12px;padding:14px}.recorder-object{height:245px}.scanned-recorder>.tuner{font-size:8px;padding:4px}.scanned-recorder>.tuner>span:first-child{display:none}.scanned-recorder .deck{padding:8px;min-height:116px;font-size:8px;gap:8px}.scanned-recorder .cassette{padding:8px;border-width:2px}.scanned-recorder .cassette strong{font-size:8px;padding:4px}.scanned-recorder .reels{margin:10px 0;padding:4px}.scanned-recorder .reels i{font-size:20px}.scanned-recorder .transport{gap:7px}.scanned-recorder .transport button{font-size:9px;padding:8px 4px}}