:root{
  --bg:#070917;--panel:#0e1430;--panel2:#151d42;--line:rgba(255,255,255,.09);
  --text:#f8f9ff;--muted:#98a5c6;--a:#775bff;--b:#25e0ff;--pink:#ff4db6;
  --gold:#ffd55b;--green:#35e1a4;--danger:#ff5e78;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;background:var(--bg);color:var(--text)}
button,input,select{font:inherit}
button{cursor:pointer}
a{text-decoration:none;color:inherit}
.hidden{display:none!important}
.studio-bg{position:fixed;inset:0;pointer-events:none;background:
radial-gradient(circle at 5% 0,rgba(119,91,255,.20),transparent 28%),
radial-gradient(circle at 95% 5%,rgba(255,77,182,.14),transparent 28%),
linear-gradient(180deg,#060817,#080b1b);z-index:-1}
.studio-top{height:74px;position:sticky;top:0;z-index:80;display:grid;grid-template-columns:240px 1fr auto;gap:18px;align-items:center;padding:8px 16px;background:rgba(5,7,20,.82);backdrop-filter:blur(22px);border-bottom:1px solid var(--line)}
.studio-brand img{height:50px;max-width:220px;object-fit:contain}
.studio-title{min-width:0}.studio-title span{display:block;color:#8fbaff;font-size:8px;letter-spacing:1.7px;font-weight:1000}.studio-title b{display:block;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}
.studio-actions{display:flex;gap:7px;align-items:center}.ui-btn{border:1px solid var(--line);background:rgba(255,255,255,.045);color:white;border-radius:12px;padding:9px 13px;font-size:10px;font-weight:900}.ui-btn:hover{background:rgba(255,255,255,.075)}.ui-btn.primary{border:0;background:linear-gradient(135deg,#7657ff,#d74cff 58%,#ff5cad);box-shadow:0 9px 24px rgba(118,87,255,.22)}.ui-btn.ghost{background:rgba(255,255,255,.035)}
.studio-shell{display:grid;grid-template-columns:78px minmax(0,1fr) 330px;gap:12px;width:min(1900px,100%);margin:0 auto;min-height:calc(100vh - 74px);padding:12px}
.tool-rail{position:sticky;top:86px;height:max-content;display:flex;flex-direction:column;gap:8px;padding:8px;border:1px solid var(--line);border-radius:21px;background:rgba(12,17,40,.72);backdrop-filter:blur(18px)}
.tool-btn{height:62px;border:1px solid transparent;border-radius:15px;background:transparent;color:var(--muted);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:9px;font-weight:850}.tool-btn span{font-size:18px;color:#c7cff0}.tool-btn.active{color:white;border-color:rgba(127,105,255,.26);background:linear-gradient(145deg,rgba(125,92,255,.19),rgba(32,221,255,.055));box-shadow:0 8px 18px rgba(0,0,0,.18)}
.stage-column{min-width:0}.stage-toolbar{height:44px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 5px}.stage-status{display:flex;gap:7px;align-items:center;color:#9eabc9;font-size:9px}.stage-status i{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 11px var(--green)}.stage-toolbar-actions{display:flex;gap:6px}.mini-action{border:1px solid var(--line);background:rgba(255,255,255,.035);color:#bdc7e0;border-radius:10px;padding:7px 10px;font-size:9px;font-weight:850}
.room-viewport{min-height:710px;display:grid;place-items:center;padding:4px}
.room-scene{--ra:#7657ff;--rb:#25ddff;--rc:#ff4db6;--wall:#11183a;--floor:#080d21;width:min(1160px,100%);aspect-ratio:16/9;position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.11);border-radius:31px 31px 42px 42px;background:#050818;box-shadow:0 1px 0 rgba(255,255,255,.09) inset,0 30px 55px rgba(0,0,0,.30),0 70px 120px rgba(0,0,0,.30);perspective:1100px;transform-style:preserve-3d}
.room-scene.theme-vault{--ra:#ffca57;--rb:#f7e9ac;--rc:#8e73ff;--wall:#19182b;--floor:#0b0d17}
.room-scene.theme-festival{--ra:#ff5c73;--rb:#ffd45d;--rc:#37e0bf;--wall:#211536;--floor:#0b0a1b}
.room-scene.theme-cyber{--ra:#25e1ff;--rb:#965bff;--rc:#ff48cc;--wall:#081a2d;--floor:#061018}
.room-bg-image{position:absolute;inset:0;background-position:center;background-size:cover;opacity:.34;filter:saturate(.9) contrast(1.05);z-index:0}.room-scene.no-glow .room-bg-image{opacity:.25}
.room-ceiling{position:absolute;left:0;right:0;top:0;height:21%;clip-path:polygon(0 0,100% 0,86% 100%,14% 100%);background:linear-gradient(180deg,#050817,#111732);z-index:1}
.room-left,.room-right{position:absolute;top:0;bottom:0;width:20%;z-index:1;opacity:.96}.room-left{left:0;clip-path:polygon(0 0,100% 9%,100% 76%,0 100%);background:linear-gradient(90deg,#060a1c,var(--wall))}.room-right{right:0;clip-path:polygon(0 9%,100% 0,100% 100%,0 76%);background:linear-gradient(90deg,var(--wall),#060a1c)}
.room-back{position:absolute;left:13%;right:13%;top:8%;bottom:24%;z-index:2;border-radius:16px 16px 4px 4px;background:linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(180deg,var(--wall),#080d25);background-size:32px 32px,32px 32px,auto;box-shadow:inset 0 0 60px rgba(0,0,0,.30)}
.room-floor{position:absolute;left:0;right:0;bottom:0;height:37%;z-index:3;clip-path:polygon(13% 0,87% 0,100% 100%,0 100%);background:linear-gradient(90deg,transparent 49.5%,rgba(255,255,255,.035) 50%,transparent 50.5%),linear-gradient(0deg,transparent 49.5%,rgba(255,255,255,.027) 50%,transparent 50.5%),radial-gradient(ellipse at 50% 15%,color-mix(in srgb,var(--ra) 17%,transparent),transparent 46%),linear-gradient(180deg,#0d1230,var(--floor));background-size:78px 100%,100% 46px,auto,auto}
.room-scene.no-glow .room-floor{background:linear-gradient(90deg,transparent 49.5%,rgba(255,255,255,.025) 50%,transparent 50.5%),linear-gradient(0deg,transparent 49.5%,rgba(255,255,255,.02) 50%,transparent 50.5%),linear-gradient(180deg,#0d1230,var(--floor))}
.event-badge{position:absolute;left:50%;top:15px;transform:translateX(-50%);padding:5px 9px;border:1px solid rgba(255,255,255,.14);border-radius:999px;background:rgba(6,10,28,.56);color:#99ffd9;font-size:7px;font-weight:1000;letter-spacing:1.3px;z-index:4}
.event-heading{position:absolute;left:5%;right:5%;top:47px;text-align:center;z-index:4}.event-heading small{display:block;color:#8fc4ff;font-size:7px;font-weight:1000;letter-spacing:2px}.event-heading h1{margin:4px 0 2px;font-size:clamp(21px,2.7vw,42px);line-height:1;color:#fff;text-shadow:0 0 12px rgba(255,255,255,.36),0 0 30px var(--ra);letter-spacing:-.8px}.event-heading p{margin:0;color:#c1c9df;font-size:10px}
.light-wire{position:absolute;left:5%;right:5%;top:115px;height:28px;display:flex;justify-content:space-between;border-top:1px solid rgba(255,255,255,.17);z-index:4}.light-wire span{width:9px;height:9px;border-radius:50%;transform:translateY(-5px);background:var(--rb);box-shadow:0 0 8px var(--rb),0 0 19px var(--rb);animation:lamp 1.5s ease-in-out infinite alternate}.light-wire span:nth-child(3n+2){background:var(--rc);box-shadow:0 0 8px var(--rc),0 0 18px var(--rc);animation-delay:.35s}.light-wire span:nth-child(3n){background:#ffd55b;box-shadow:0 0 8px #ffd55b,0 0 18px #ffd55b;animation-delay:.70s}@keyframes lamp{from{opacity:.35;transform:translateY(-5px) scale(.8)}to{opacity:1;transform:translateY(-5px) scale(1.18)}}.room-scene.lights-off .light-wire span{animation:none;opacity:.18;box-shadow:none}
.prize-wall{position:absolute;left:6%;right:6%;top:151px;bottom:71px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;align-content:start;z-index:4}.room-prize{min-width:0;height:110px;border:1px solid rgba(255,255,255,.095);border-radius:14px;padding:7px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.015)),rgba(6,10,28,.74);box-shadow:0 9px 18px rgba(0,0,0,.20),inset 0 1px 0 rgba(255,255,255,.06);transition:.16s ease;overflow:hidden}.room-prize img{width:58px;height:58px;object-fit:cover;border-radius:11px;box-shadow:0 8px 14px rgba(0,0,0,.28)}.room-prize .fallback-icon{font-size:30px;filter:drop-shadow(0 8px 8px rgba(0,0,0,.25))}.room-prize b{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:5px;font-size:9px}.room-prize small{margin-top:2px;font-size:6px;color:#7987ad;letter-spacing:1px}.room-prize.active{transform:translateY(-4px) scale(1.035);border-color:color-mix(in srgb,var(--rb) 65%,white);box-shadow:0 0 25px color-mix(in srgb,var(--rb) 28%,transparent),0 13px 18px rgba(0,0,0,.24)}.room-prize.winner{z-index:7;transform:translateY(-14px) scale(1.13);border-color:#ffe064;background:linear-gradient(145deg,rgba(255,224,100,.19),rgba(125,92,255,.15)),#10162f;box-shadow:0 0 18px #ffe064,0 0 52px rgba(255,208,82,.38),0 23px 29px rgba(0,0,0,.30)}
.winner-board{position:absolute;left:50%;bottom:11px;transform:translateX(-50%);width:52%;min-height:48px;border:1px solid rgba(255,255,255,.10);border-radius:12px;background:#050916;display:flex;align-items:center;justify-content:center;gap:9px;padding:6px 12px;box-shadow:inset 0 0 22px rgba(32,221,255,.06),0 7px 15px rgba(0,0,0,.23);z-index:5}.winner-board div{min-width:0}.winner-board small{display:block;color:#66749c;font-size:6px;letter-spacing:1.4px}.winner-board strong{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;color:#c6faff;text-shadow:0 0 11px var(--rb)}.winner-board img{width:34px;height:34px;border-radius:8px;object-fit:cover}
.spinner-console{position:absolute;z-index:7;left:50%;bottom:18px;width:220px;height:203px;transform:translateX(-50%) perspective(760px) rotateX(2deg);transform-style:preserve-3d}.console-top{position:absolute;left:18px;right:18px;top:0;height:24px;border-radius:11px 11px 5px 5px;background:linear-gradient(180deg,#303a72,#121940);transform:rotateX(66deg) translateY(-9px);transform-origin:bottom;display:grid;place-items:center;color:#94a0c7;font-size:6px;font-weight:1000;letter-spacing:1.4px}.console-screen{position:absolute;inset:18px 19px 0 0;border-radius:19px 14px 16px;background:linear-gradient(145deg,rgba(255,255,255,.08),transparent 24%),linear-gradient(160deg,#283369,#11183d 68%,#080d29);border:1px solid rgba(255,255,255,.12);box-shadow:inset 0 -13px 24px rgba(0,0,0,.20),0 15px 27px rgba(0,0,0,.30)}.console-side{position:absolute;right:0;top:26px;bottom:4px;width:20px;clip-path:polygon(0 0,100% 8%,100% 94%,0 100%);background:linear-gradient(90deg,#141a43,#080c27)}.console-wheel{position:absolute;left:50%;top:13px;transform:translateX(-50%);width:108px;height:108px;border-radius:50%;background:conic-gradient(#7657ff 0 45deg,#25cbee 45deg 90deg,#2bdba8 90deg 135deg,#ffd45a 135deg 180deg,#ff7c61 180deg 225deg,#ff49b5 225deg 270deg,#bd55ff 270deg 315deg,#4bd2ff 315deg);border:4px solid rgba(255,255,255,.72);box-shadow:0 0 20px rgba(125,92,255,.22),0 9px 15px rgba(0,0,0,.27)}.console-ring{position:absolute;inset:16px;border-radius:50%;background:#0d1333;border:2px solid rgba(255,255,255,.12)}.console-core{position:absolute;inset:35px;border-radius:50%;display:grid;place-items:center;background:#151d49;color:white;font-size:9px;font-weight:1000}.console-leds{position:absolute;left:18px;top:25px;display:grid;gap:7px}.console-leds i{width:6px;height:6px;border-radius:50%;background:#4c5d94;box-shadow:0 0 5px rgba(76,93,148,.5)}.console-spin{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);border:0;border-radius:999px;padding:8px 20px;background:linear-gradient(135deg,#ffe36d,#ff9d34);color:#281600;font-size:9px;font-weight:1000;box-shadow:0 5px 0 #9d5d12,0 9px 16px rgba(0,0,0,.30),0 0 21px rgba(255,201,65,.20)}.console-spin:active{transform:translateX(-50%) translateY(3px);box-shadow:0 2px 0 #9d5d12,0 5px 10px rgba(0,0,0,.28)}.console-shadow{position:absolute;left:15%;right:15%;bottom:-20px;height:25px;border-radius:50%;background:radial-gradient(ellipse at center,rgba(0,0,0,.55),transparent 68%);filter:blur(5px)}.spinner-console.spinning{animation:vibe .12s ease-in-out infinite alternate}.spinner-console.spinning .console-wheel{animation:consoleSpin .22s linear infinite}.spinner-console.spinning .console-leds i{background:#5fffd1;box-shadow:0 0 8px #5fffd1,0 0 18px #5fffd1;animation:ledBlink .18s steps(2,end) infinite}.spinner-console.spinning .console-leds i:nth-child(2){animation-delay:.06s}.spinner-console.spinning .console-leds i:nth-child(3){animation-delay:.12s}@keyframes vibe{from{transform:translateX(-50%) perspective(760px) rotateX(2deg) translateX(-1px)}to{transform:translateX(-50%) perspective(760px) rotateX(2deg) translateX(1px)}}@keyframes consoleSpin{to{transform:translateX(-50%) rotate(360deg)}}@keyframes ledBlink{50%{opacity:.25}}
.floor-presents{position:absolute;right:7%;bottom:34px;z-index:5;width:132px;height:120px}.floor-presents span{position:absolute;width:59px;height:59px;border:1px solid rgba(255,255,255,.12);border-radius:13px;display:grid;place-items:center;font-size:29px;background:linear-gradient(145deg,color-mix(in srgb,var(--rc) 38%,#252b61),#11173b);box-shadow:0 14px 20px rgba(0,0,0,.29),inset 0 1px 0 rgba(255,255,255,.09)}.floor-presents span:nth-child(1){right:8px;bottom:0;transform:rotate(7deg)}.floor-presents span:nth-child(2){left:0;bottom:7px;transform:rotate(-8deg);background:linear-gradient(145deg,color-mix(in srgb,var(--ra) 45%,#252b61),#11173b)}.floor-presents span:nth-child(3){right:32px;bottom:55px;width:49px;height:49px;transform:rotate(3deg);background:linear-gradient(145deg,color-mix(in srgb,var(--rb) 42%,#252b61),#11173b)}.room-scene.decor-off .floor-presents{display:none}
.custom-text-layer{position:absolute;inset:0;z-index:10;pointer-events:none}.custom-room-text{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);pointer-events:auto;cursor:grab;user-select:none;white-space:nowrap;text-shadow:0 3px 12px rgba(0,0,0,.45);padding:4px 7px;border:1px solid transparent;border-radius:7px}.custom-room-text:hover,.custom-room-text.selected{border-color:rgba(255,255,255,.26);background:rgba(6,10,28,.28)}.custom-room-text:active{cursor:grabbing}
.room-flash{position:absolute;inset:0;z-index:12;pointer-events:none;opacity:0;background:radial-gradient(circle at 50% 48%,rgba(255,226,111,.31),transparent 32%)}.room-flash.go{animation:flash .85s ease forwards}@keyframes flash{0%{opacity:0}28%{opacity:1}100%{opacity:0}}
.stage-help{text-align:center;color:#697796;font-size:8px;padding:7px}.stage-help span{color:#a9b5d0;font-weight:900}

.inspector{position:sticky;top:86px;max-height:calc(100vh - 100px);overflow:auto;border:1px solid var(--line);border-radius:22px;background:rgba(12,17,40,.78);backdrop-filter:blur(18px);box-shadow:0 18px 50px rgba(0,0,0,.18)}
.tool-panel{display:none;padding:18px}.tool-panel.active{display:block;animation:panelin .20s ease}@keyframes panelin{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}.panel-title span{display:block;color:#8fbaff;font-size:7px;letter-spacing:1.7px;font-weight:1000}.panel-title h2{margin:5px 0 5px;font-size:17px}.panel-title p{margin:0 0 17px;color:var(--muted);font-size:9px;line-height:1.55}.field{display:block;margin-top:12px}.field>span{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;color:#aeb9d5;font-size:9px;font-weight:850}.field em{font-style:normal;color:#84baff}.field input[type=text],.field select{width:100%;border:1px solid var(--line);border-radius:11px;background:#080d24;color:white;padding:9px 10px;outline:none}.field input[type=text]:focus,.field select:focus{border-color:rgba(126,100,255,.52);box-shadow:0 0 0 3px rgba(126,100,255,.08)}.field input[type=range]{width:100%;accent-color:#7657ff}.field input[type=color]{width:100%;height:37px;border:1px solid var(--line);border-radius:10px;background:#080d24;padding:3px}
.section-sep{height:1px;background:var(--line);margin:18px 0}.panel-subhead b{display:block;font-size:10px}.panel-subhead small{display:block;color:var(--muted);font-size:8px;margin-top:3px;line-height:1.5}.upload-box{margin-top:11px;border:1px dashed rgba(145,132,255,.32);border-radius:13px;padding:15px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:rgba(125,92,255,.045);cursor:pointer}.upload-box span{font-size:22px;color:#a89cff}.upload-box b{font-size:9px;margin-top:4px}.upload-box small{font-size:7px;color:#7f8baa;margin-top:2px}.small-btn{width:100%;margin-top:8px;border:1px solid var(--line);border-radius:10px;padding:8px;background:rgba(255,255,255,.035);color:#bac4df;font-size:8px;font-weight:850}.small-btn.danger{color:#ffadb9;border-color:rgba(255,94,120,.18)}
.prize-editor{display:grid;gap:8px}.prize-edit-row{display:grid;grid-template-columns:56px minmax(0,1fr) 28px;gap:7px;align-items:center;padding:7px;border:1px solid var(--line);border-radius:13px;background:rgba(255,255,255,.025)}.prize-thumb{width:56px;height:56px;border-radius:10px;overflow:hidden;display:grid;place-items:center;background:#080d24;border:1px solid var(--line);cursor:pointer;font-size:22px}.prize-thumb img{width:100%;height:100%;object-fit:cover}.prize-row-fields input{width:100%;border:0;background:transparent;color:white;font-size:9px;font-weight:800;outline:none}.prize-row-fields small{display:block;margin-top:5px;color:#7381a4;font-size:7px}.prize-remove{width:28px;height:28px;border:0;border-radius:8px;background:rgba(255,94,120,.08);color:#ff97a7;font-size:12px}.add-prize-btn,.add-text-btn{width:100%;margin-top:10px;border:1px solid rgba(125,92,255,.23);border-radius:11px;padding:10px;background:rgba(125,92,255,.08);color:#c6bdff;font-size:9px;font-weight:900}.hint{color:#687697;font-size:7px;line-height:1.5}
.room-presets{display:grid;grid-template-columns:1fr 1fr;gap:8px}.room-preset{border:1px solid var(--line);border-radius:13px;padding:7px;background:rgba(255,255,255,.025);color:#c9d2e8;text-align:left}.room-preset.active{border-color:rgba(134,112,255,.47);box-shadow:0 0 0 2px rgba(125,92,255,.06)}.preset-preview{display:block;height:50px;border-radius:9px;margin-bottom:6px}.preset-preview.arcade{background:radial-gradient(circle at 50% 38%,#7657ff,transparent 34%),linear-gradient(145deg,#11183a,#050818)}.preset-preview.vault{background:radial-gradient(circle at 50% 38%,#ffca57,transparent 34%),linear-gradient(145deg,#19182b,#080915)}.preset-preview.festival{background:radial-gradient(circle at 50% 38%,#ff5c73,transparent 34%),linear-gradient(145deg,#211536,#090819)}.preset-preview.cyber{background:radial-gradient(circle at 50% 38%,#25e1ff,transparent 34%),linear-gradient(145deg,#081a2d,#050818)}.room-preset b{font-size:8px}
.color-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.toggle-list{display:grid;gap:7px;margin-top:14px}.toggle-list label{display:flex;align-items:center;justify-content:space-between;gap:9px;padding:9px 10px;border:1px solid var(--line);border-radius:11px;background:rgba(255,255,255,.025);font-size:9px;color:#b8c3dc}.toggle-list input{accent-color:#7657ff}
.text-list{display:grid;gap:7px;margin-top:10px}.text-list-row{display:flex;align-items:center;justify-content:space-between;gap:7px;padding:8px 9px;border:1px solid var(--line);border-radius:11px;background:rgba(255,255,255,.025);cursor:pointer}.text-list-row.active{border-color:rgba(125,92,255,.42);background:rgba(125,92,255,.07)}.text-list-row b{max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:8px}.text-list-row span{font-size:7px;color:#7280a1}
.winner-modal{position:fixed;inset:0;z-index:140;background:rgba(3,5,14,.78);backdrop-filter:blur(11px);display:grid;place-items:center;padding:18px}.winner-card{width:min(480px,100%);border:1px solid var(--line);border-radius:27px;padding:27px;text-align:center;background:linear-gradient(150deg,#151d43,#090f29);box-shadow:0 40px 100px rgba(0,0,0,.62)}.winner-kicker{color:#8fbaff;font-size:8px;letter-spacing:2px;font-weight:1000}.winner-card img{width:145px;height:145px;border-radius:20px;object-fit:cover;margin:13px auto 2px;box-shadow:0 18px 32px rgba(0,0,0,.32),0 0 38px rgba(125,92,255,.16)}.winner-card h2{font-size:42px;line-height:1.04;margin:14px 0 6px;word-break:break-word}.winner-card p{color:var(--muted);font-size:10px}.winner-actions{display:flex;gap:7px;justify-content:center;margin-top:18px}
.toast{position:fixed;left:50%;bottom:22px;z-index:180;transform:translate(-50%,16px);opacity:0;pointer-events:none;border:1px solid var(--line);border-radius:12px;padding:9px 13px;background:#151d3d;color:white;font-size:9px;font-weight:850;transition:.2s}.toast.show{opacity:1;transform:translate(-50%,0)}

body.presenting .tool-rail,body.presenting .inspector,body.presenting .stage-toolbar,body.presenting .stage-help,body.presenting .studio-actions,body.presenting .studio-title{display:none!important}
body.presenting .studio-top{grid-template-columns:1fr;justify-items:center;height:62px}
body.presenting .studio-brand img{height:46px}
body.presenting .studio-shell{display:block;padding:0;min-height:calc(100vh - 62px)}
body.presenting .room-viewport{min-height:calc(100vh - 62px);padding:0}
body.presenting .room-scene{width:min(100vw,177.777vh);height:min(calc(100vh - 62px),56.25vw);border-radius:0;border:0}

@media(max-width:1200px){.studio-shell{grid-template-columns:68px minmax(0,1fr)}.inspector{position:fixed;right:12px;top:88px;bottom:12px;width:min(340px,calc(100vw - 100px));z-index:75;box-shadow:0 28px 80px rgba(0,0,0,.55)}.room-viewport{padding-right:0}.studio-title{display:none}.studio-top{grid-template-columns:220px 1fr}.studio-actions{justify-self:end}}
@media(max-width:760px){.studio-top{height:66px;grid-template-columns:150px 1fr;padding:7px 9px}.studio-brand img{height:40px;max-width:145px}.studio-actions .ghost{display:none}.studio-shell{grid-template-columns:1fr;padding:7px}.tool-rail{position:fixed;left:7px;right:7px;bottom:7px;top:auto;z-index:90;flex-direction:row;justify-content:center;padding:5px}.tool-btn{height:48px;flex:1}.tool-btn span{font-size:15px}.room-viewport{min-height:520px}.room-scene{min-width:780px;transform:scale(.72);transform-origin:center}.stage-column{overflow:hidden}.inspector{left:7px;right:7px;top:78px;bottom:65px;width:auto}.floor-presents{display:none}.prize-wall{grid-template-columns:repeat(4,1fr)}}


/* =========================================================
   V5.1 TRUE FULLSCREEN
   Only the Prize Room itself enters browser fullscreen.
   ========================================================= */

#roomScene:fullscreen{
  width:100vw !important;
  height:100vh !important;
  max-width:none !important;
  max-height:none !important;
  aspect-ratio:auto !important;
  margin:0 !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  background:#050818 !important;
}

#roomScene:fullscreen::backdrop{
  background:#050818;
}

#roomScene:fullscreen .event-badge{
  top:2.5vh;
  font-size:clamp(8px,.7vw,13px);
  padding:7px 13px;
}
#roomScene:fullscreen .event-heading{
  top:5.5vh;
}
#roomScene:fullscreen .event-heading h1{
  font-size:clamp(34px,4.2vw,72px);
}
#roomScene:fullscreen .event-heading p{
  font-size:clamp(12px,1.05vw,20px);
}
#roomScene:fullscreen .light-wire{
  top:15vh;
}
#roomScene:fullscreen .prize-wall{
  left:9%;
  right:9%;
  top:19vh;
  bottom:23vh;
  gap:1.05vw;
}
#roomScene:fullscreen .room-prize{
  height:min(13.5vh,150px);
  border-radius:18px;
}
#roomScene:fullscreen .room-prize img{
  width:min(7vh,82px);
  height:min(7vh,82px);
  border-radius:14px;
}
#roomScene:fullscreen .room-prize .fallback-icon{
  font-size:min(5vh,52px);
}
#roomScene:fullscreen .room-prize b{
  font-size:clamp(10px,.85vw,16px);
}
#roomScene:fullscreen .room-prize small{
  font-size:clamp(7px,.5vw,10px);
}
#roomScene:fullscreen .spinner-console{
  bottom:2.5vh;
  width:min(16vw,300px);
  height:min(22vh,260px);
}
#roomScene:fullscreen .console-wheel{
  width:min(8vw,150px);
  height:min(8vw,150px);
}
#roomScene:fullscreen .console-ring{inset:14%}
#roomScene:fullscreen .console-core{
  inset:31%;
  font-size:clamp(9px,.8vw,15px);
}
#roomScene:fullscreen .console-spin{
  font-size:clamp(10px,.75vw,15px);
  padding:10px 24px;
}
#roomScene:fullscreen .winner-board{
  bottom:2vh;
  width:42%;
  min-height:6vh;
  border-radius:16px;
}
#roomScene:fullscreen .winner-board strong{
  font-size:clamp(15px,1.25vw,24px);
}
#roomScene:fullscreen .winner-board small{
  font-size:clamp(7px,.5vw,10px);
}
#roomScene:fullscreen .floor-presents{
  right:6%;
  bottom:4vh;
  transform:scale(1.25);
  transform-origin:bottom right;
}
#roomScene:fullscreen .custom-room-text{
  border-color:transparent !important;
  background:transparent !important;
  cursor:default;
}

/* WebKit fallback */
#roomScene:-webkit-full-screen{
  width:100vw !important;
  height:100vh !important;
  max-width:none !important;
  max-height:none !important;
  aspect-ratio:auto !important;
  border-radius:0 !important;
  border:0 !important;
}

@media(max-width:760px){
  #roomScene:fullscreen{
    min-width:0 !important;
    transform:none !important;
  }
}


/* =========================================================
   V5.2 — 15 BUILT-IN BACKGROUND TEMPLATES
   ========================================================= */
.background-gallery{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  margin-top:10px;
  max-height:430px;
  overflow:auto;
  padding-right:3px;
}
.bg-template{
  min-width:0;
  border:1px solid var(--line);
  border-radius:12px;
  overflow:hidden;
  padding:0;
  background:rgba(255,255,255,.025);
  color:#cbd4e9;
  text-align:left;
  transition:.18s ease;
}
.bg-template:hover{
  transform:translateY(-2px);
  border-color:rgba(145,126,255,.32);
  box-shadow:0 10px 18px rgba(0,0,0,.20);
}
.bg-template.active{
  border-color:#8c74ff;
  box-shadow:0 0 0 2px rgba(124,91,255,.14),0 0 25px rgba(124,91,255,.12);
}
.bg-template img{
  display:block;
  width:100%;
  aspect-ratio:16/9;
  object-fit:cover;
  background:#060916;
}
.bg-template span{
  display:block;
  padding:7px 8px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:8px;
  font-weight:900;
}
.room-bg-image{
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}
@media(max-width:1200px){
  .background-gallery{max-height:50vh}
}


/* =========================================================
   V5.3 — BACKGROUND VISIBILITY FIX
   Generated/custom backgrounds now become the actual room scene.
   ========================================================= */

/* Background image must live above the old solid room shell. */
.room-bg-image{
  z-index:1 !important;
  opacity:0;
  transition:opacity .28s ease,filter .28s ease;
}

.room-scene.has-background .room-bg-image{
  opacity:1 !important;
  filter:saturate(1.06) contrast(1.02) brightness(.94);
}

/*
  Keep the 3D geometry, but remove the opaque fills that were hiding
  the selected background.
*/
.room-scene.has-background .room-ceiling{
  z-index:2;
  background:linear-gradient(180deg,rgba(3,5,16,.30),rgba(10,15,35,.04));
  opacity:.32;
}

.room-scene.has-background .room-left{
  z-index:2;
  background:linear-gradient(90deg,rgba(2,5,18,.36),rgba(8,14,34,.02));
  opacity:.35;
}

.room-scene.has-background .room-right{
  z-index:2;
  background:linear-gradient(90deg,rgba(8,14,34,.02),rgba(2,5,18,.36));
  opacity:.35;
}

/* The back wall still contains the event title/prize wall, so make only its fill transparent. */
.room-scene.has-background .room-back{
  z-index:2;
  background:
    linear-gradient(180deg,rgba(5,8,22,.07),rgba(5,8,22,.14));
  box-shadow:none;
}

/* The generated scene already has its own stage/floor. Keep only a tiny grounding shadow. */
.room-scene.has-background .room-floor{
  z-index:3;
  background:
    linear-gradient(180deg,rgba(5,8,22,0) 0%,rgba(3,5,15,.10) 50%,rgba(2,4,12,.28) 100%);
  opacity:.34;
}

/* Make UI readable while preserving most of the artwork. */
.room-scene.has-background .event-heading{
  text-shadow:0 3px 18px rgba(0,0,0,.68);
}
.room-scene.has-background .event-heading h1{
  text-shadow:
    0 3px 16px rgba(0,0,0,.72),
    0 0 18px rgba(255,255,255,.18),
    0 0 32px var(--ra);
}
.room-scene.has-background .event-badge{
  background:rgba(4,8,22,.62);
  backdrop-filter:blur(8px);
}
.room-scene.has-background .light-wire{
  filter:drop-shadow(0 4px 7px rgba(0,0,0,.38));
}
.room-scene.has-background .room-prize{
  background:
    linear-gradient(145deg,rgba(255,255,255,.09),rgba(255,255,255,.018)),
    rgba(5,9,25,.72);
  backdrop-filter:blur(7px);
}

/* In true fullscreen keep full artwork visible too. */
#roomScene.has-background:fullscreen .room-bg-image{
  opacity:1 !important;
  filter:saturate(1.07) contrast(1.025) brightness(.96);
}


/* =========================================================
   V5.4 — SHARP / FIT BACKGROUNDS + ANIMATED SCENE LIGHTING
   ========================================================= */

/* The image itself is now the room, not a blurred insert inside old walls. */
.room-bg-image{
  position:absolute;
  inset:0;
  z-index:1 !important;
  width:100%;
  height:100%;
  opacity:0;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
  filter:none !important;
  transform:translateZ(0);
  will-change:opacity;
}

.room-scene.has-background .room-bg-image{
  opacity:1 !important;
  filter:none !important;
}

/* Completely stop the old fake room shell from covering the artwork. */
.room-scene.has-background .room-ceiling,
.room-scene.has-background .room-left,
.room-scene.has-background .room-right{
  opacity:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  pointer-events:none;
}

.room-scene.has-background .room-back{
  background:transparent !important;
  box-shadow:none !important;
}

/* Keep a very light grounding gradient only, so the lower UI stays readable. */
.room-scene.has-background .room-floor{
  background:linear-gradient(
    to bottom,
    rgba(2,4,12,0) 0%,
    rgba(2,4,12,.04) 42%,
    rgba(2,4,12,.14) 100%
  ) !important;
  opacity:1 !important;
}

/* More transparent prize cards so the background remains visible. */
.room-scene.has-background .room-prize{
  background:
    linear-gradient(145deg,rgba(255,255,255,.09),rgba(255,255,255,.018)),
    rgba(6,10,28,.64) !important;
  backdrop-filter:blur(3px);
}

/* Fullscreen stays crisp and full-bleed. */
#roomScene.has-background:fullscreen .room-bg-image{
  opacity:1 !important;
  filter:none !important;
  background-size:cover !important;
  background-position:center center !important;
}

/* ---------------- LIVE SCENE FX ---------------- */
.scene-fx{
  position:absolute;
  inset:0;
  z-index:2;
  overflow:hidden;
  pointer-events:none;
  mix-blend-mode:screen;
}

/* Moving stage lights */
.fx-beam{
  position:absolute;
  top:-19%;
  width:20%;
  height:88%;
  transform-origin:50% 0;
  clip-path:polygon(44% 0,56% 0,100% 100%,0 100%);
  filter:blur(8px);
  opacity:.18;
  will-change:transform,opacity;
}
.beam-a{
  left:5%;
  background:linear-gradient(to bottom,rgba(66,224,255,.78),rgba(66,224,255,.04));
  animation:beamA 6.5s ease-in-out infinite alternate;
}
.beam-b{
  left:25%;
  background:linear-gradient(to bottom,rgba(165,95,255,.76),rgba(165,95,255,.035));
  animation:beamB 8s ease-in-out infinite alternate;
}
.beam-c{
  right:24%;
  background:linear-gradient(to bottom,rgba(255,76,193,.72),rgba(255,76,193,.03));
  animation:beamC 7.2s ease-in-out infinite alternate;
}
.beam-d{
  right:4%;
  background:linear-gradient(to bottom,rgba(255,216,89,.72),rgba(255,216,89,.025));
  animation:beamD 9s ease-in-out infinite alternate;
}

@keyframes beamA{
  from{transform:rotate(-19deg) translateX(-3%) scaleX(.82);opacity:.11}
  to{transform:rotate(13deg) translateX(22%) scaleX(1.15);opacity:.28}
}
@keyframes beamB{
  from{transform:rotate(14deg) translateX(-13%) scaleX(1.05);opacity:.10}
  to{transform:rotate(-13deg) translateX(16%) scaleX(.78);opacity:.24}
}
@keyframes beamC{
  from{transform:rotate(-12deg) translateX(-15%) scaleX(.92);opacity:.11}
  to{transform:rotate(16deg) translateX(13%) scaleX(1.12);opacity:.25}
}
@keyframes beamD{
  from{transform:rotate(18deg) translateX(-18%) scaleX(.80);opacity:.09}
  to{transform:rotate(-16deg) translateX(8%) scaleX(1.12);opacity:.23}
}

/* Pulsing ambient pools */
.fx-glow{
  position:absolute;
  width:32vw;height:32vw;
  max-width:520px;max-height:520px;
  border-radius:50%;
  filter:blur(55px);
  opacity:.10;
  will-change:transform,opacity;
}
.glow-a{
  left:-8%;bottom:-18%;
  background:#20e4ff;
  animation:glowA 7s ease-in-out infinite;
}
.glow-b{
  right:-7%;bottom:-18%;
  background:#b44cff;
  animation:glowB 8.5s ease-in-out infinite;
}
@keyframes glowA{50%{transform:scale(1.28) translate(7%,-4%);opacity:.19}}
@keyframes glowB{50%{transform:scale(1.22) translate(-8%,-2%);opacity:.18}}

/* Reflection/light sweep across floor */
.fx-sweep{
  position:absolute;
  left:-40%;bottom:-5%;
  width:38%;height:35%;
  transform:skewX(-24deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.19),rgba(75,214,255,.10),transparent);
  filter:blur(12px);
  opacity:.0;
  animation:floorSweep 8s ease-in-out infinite;
  will-change:transform,opacity;
}
@keyframes floorSweep{
  0%,12%{transform:translateX(0) skewX(-24deg);opacity:0}
  24%{opacity:.24}
  68%{opacity:.16}
  82%,100%{transform:translateX(390%) skewX(-24deg);opacity:0}
}

/* Small sparkling light points */
.fx-sparkles{position:absolute;inset:0}
.fx-sparkles i{
  position:absolute;
  left:var(--x);
  top:var(--y);
  width:5px;height:5px;
  border-radius:50%;
  background:#fff8c5;
  box-shadow:
    0 0 5px #fff,
    0 0 13px #ffd85a,
    0 0 25px rgba(255,216,90,.55);
  opacity:.18;
  transform:scale(var(--scale));
  animation:twinkle var(--dur) ease-in-out var(--delay) infinite;
  will-change:transform,opacity;
}
.fx-sparkles i:nth-child(3n+2){
  background:#bff9ff;
  box-shadow:0 0 5px #fff,0 0 13px #47e5ff,0 0 24px rgba(71,229,255,.45);
}
.fx-sparkles i:nth-child(3n){
  background:#ffc7f0;
  box-shadow:0 0 5px #fff,0 0 13px #ff58ca,0 0 24px rgba(255,88,202,.42);
}
@keyframes twinkle{
  0%,100%{opacity:.08;transform:scale(calc(var(--scale) * .55))}
  47%{opacity:.88;transform:scale(calc(var(--scale) * 1.45))}
  60%{opacity:.28}
}

/* Existing light toggle now shuts down ALL animated stage lights. */
.room-scene.lights-off .scene-fx{
  display:none;
}

/* Showtime increases the energy while spinning. */
.room-scene.showtime .fx-beam{
  animation-duration:2.1s !important;
  opacity:.28;
}
.room-scene.showtime .fx-sparkles i{
  animation-duration:1s !important;
}
.room-scene.showtime .fx-sweep{
  animation-duration:2.8s !important;
}
.room-scene.showtime .light-wire span{
  animation-duration:.26s !important;
}

/* Preserve motion accessibility. */
@media(prefers-reduced-motion:reduce){
  .fx-beam,.fx-glow,.fx-sweep,.fx-sparkles i{
    animation:none !important;
  }
}


/* =========================================================
   V5.5 — FULL-BLEED SHARP BACKGROUND + FESTIVE LED PRIZE ROOM
   ========================================================= */

/*
  BUILT-IN BACKGROUNDS ARE ALL 1920x1080.
  Stretch them exactly to the 16:9 room so there are NO side bars,
  NO blurred filler and NO empty areas.
*/
.room-scene{
  aspect-ratio:16/9 !important;
  --led1:#25ddff;
  --led2:#7657ff;
  --led3:#ff4db6;
}

.room-bg-image{
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  opacity:0;
  background-size:100% 100% !important;
  background-position:50% 50% !important;
  background-repeat:no-repeat !important;
  filter:none !important;
  image-rendering:auto;
  transform:none !important;
}

.room-scene.has-background .room-bg-image{
  opacity:1 !important;
  filter:none !important;
}

/* Kill every old blur/fake side-wall effect while an image is selected. */
.room-scene.has-background .room-ceiling,
.room-scene.has-background .room-left,
.room-scene.has-background .room-right{
  display:none !important;
}

.room-scene.has-background .room-back{
  background:transparent !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
}

.room-scene.has-background .room-floor{
  background:
    linear-gradient(to bottom,
      rgba(2,4,12,0) 0%,
      rgba(2,4,12,.02) 48%,
      rgba(2,4,12,.12) 100%) !important;
}

/* Fullscreen stays pixel-sharp and edge-to-edge. */
#roomScene.has-background:fullscreen .room-bg-image,
#roomScene.has-background:-webkit-full-screen .room-bg-image{
  background-size:100% 100% !important;
  filter:none !important;
  opacity:1 !important;
}

/* ---------------------- MORE FESTIVE LIGHTING ---------------------- */
.scene-fx{
  mix-blend-mode:screen;
  opacity:1;
}

.beam-e{
  left:44%;
  width:14%;
  background:linear-gradient(to bottom,var(--led1),transparent 84%);
  animation:beamE 5.3s ease-in-out infinite alternate;
}
.beam-f{
  right:42%;
  width:14%;
  background:linear-gradient(to bottom,var(--led3),transparent 84%);
  animation:beamF 6.1s ease-in-out infinite alternate;
}
@keyframes beamE{
  from{transform:rotate(-9deg) translateX(-24%) scaleX(.70);opacity:.08}
  to{transform:rotate(11deg) translateX(28%) scaleX(1.12);opacity:.27}
}
@keyframes beamF{
  from{transform:rotate(12deg) translateX(-18%) scaleX(1.10);opacity:.08}
  to{transform:rotate(-12deg) translateX(21%) scaleX(.70);opacity:.25}
}

/* Top theatre bulbs */
.fx-marquee{
  position:absolute;
  z-index:5;
  left:4%;
  right:4%;
  top:1.5%;
  height:22px;
  display:flex;
  justify-content:space-between;
  align-items:center;
}
.fx-marquee::before{
  content:"";
  position:absolute;
  left:0;right:0;top:50%;
  height:1px;
  background:linear-gradient(90deg,transparent,var(--led2),var(--led1),var(--led3),transparent);
  opacity:.35;
}
.fx-marquee i,
.fx-side-led i{
  width:9px;height:9px;border-radius:50%;
  background:var(--led1);
  box-shadow:0 0 6px #fff,0 0 14px var(--led1),0 0 25px var(--led1);
  animation:marqueePulse .95s ease-in-out var(--d) infinite alternate;
}
.fx-marquee i:nth-child(3n+2),
.fx-side-led i:nth-child(3n+2){
  background:var(--led2);
  box-shadow:0 0 6px #fff,0 0 14px var(--led2),0 0 25px var(--led2);
}
.fx-marquee i:nth-child(3n),
.fx-side-led i:nth-child(3n){
  background:var(--led3);
  box-shadow:0 0 6px #fff,0 0 14px var(--led3),0 0 25px var(--led3);
}
@keyframes marqueePulse{
  from{opacity:.26;transform:scale(.72)}
  to{opacity:1;transform:scale(1.22)}
}

/* Side LED rails */
.fx-side-led{
  position:absolute;
  top:7%;
  bottom:10%;
  width:18px;
  z-index:5;
  display:flex;
  flex-direction:column;
  justify-content:space-around;
  align-items:center;
}
.fx-side-led-left{left:1.3%}
.fx-side-led-right{right:1.3%}
.fx-side-led i{width:7px;height:7px}

/* Floating festive confetti, very subtle until spin starts */
.fx-confetti-float{
  position:absolute;inset:0;z-index:4;
  overflow:hidden;
}
.fx-confetti-float i{
  position:absolute;
  left:var(--x);
  top:-5%;
  width:7px;height:13px;
  border-radius:2px;
  background:var(--led1);
  opacity:.25;
  transform:rotate(var(--rot));
  animation:floatConfetti var(--dur) linear var(--delay) infinite;
}
.fx-confetti-float i:nth-child(3n+2){background:var(--led2)}
.fx-confetti-float i:nth-child(3n){background:var(--led3)}
@keyframes floatConfetti{
  from{transform:translate3d(-12px,-8vh,0) rotate(var(--rot));opacity:0}
  12%{opacity:.20}
  65%{opacity:.26}
  to{transform:translate3d(28px,108vh,0) rotate(calc(var(--rot) + 540deg));opacity:0}
}

.room-scene.showtime .fx-marquee i,
.room-scene.showtime .fx-side-led i{
  animation-duration:.23s !important;
}
.room-scene.showtime .fx-confetti-float i{
  opacity:.70;
  animation-duration:2.5s !important;
}

/* ----------------------- LED PRIZE CARDS ----------------------- */
.room-prize{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.11) !important;
  background:
    linear-gradient(145deg,rgba(255,255,255,.08),rgba(255,255,255,.018)),
    rgba(7,11,31,.73) !important;
  box-shadow:
    0 10px 18px rgba(0,0,0,.23),
    inset 0 1px 0 rgba(255,255,255,.07),
    0 0 13px color-mix(in srgb,var(--led1) 10%,transparent);
}

/* animated LED perimeter; no blur on the actual background image */
.room-prize::before{
  content:"";
  position:absolute;
  z-index:-2;
  left:50%;top:50%;
  width:180%;height:180%;
  transform:translate(-50%,-50%) rotate(0deg);
  background:
    conic-gradient(
      from 0deg,
      transparent 0deg 42deg,
      var(--led1) 52deg 72deg,
      transparent 82deg 132deg,
      var(--led2) 142deg 165deg,
      transparent 175deg 225deg,
      var(--led3) 235deg 258deg,
      transparent 268deg 318deg,
      var(--led1) 328deg 350deg,
      transparent 360deg
    );
  animation:prizeLedOrbit 5.8s linear infinite;
  opacity:.72;
}
.room-prize::after{
  content:"";
  position:absolute;
  z-index:-1;
  inset:2px;
  border-radius:12px;
  background:rgba(8,12,32,.91);
  box-shadow:inset 0 0 24px rgba(255,255,255,.025);
}
@keyframes prizeLedOrbit{
  to{transform:translate(-50%,-50%) rotate(360deg)}
}

.room-prize:nth-child(2n)::before{animation-delay:-1.4s}
.room-prize:nth-child(3n)::before{animation-delay:-2.8s}
.room-prize:nth-child(4n)::before{animation-delay:-4.2s}

/* Content stays above LED shell */
.room-prize > *{
  position:relative;
  z-index:2;
}

/* Gentle pulse when idle */
.room-prize{
  animation:prizeIdle 3.4s ease-in-out infinite;
}
.room-prize:nth-child(2n){animation-delay:-1.1s}
.room-prize:nth-child(3n){animation-delay:-2.1s}
@keyframes prizeIdle{
  0%,100%{transform:translateY(0);box-shadow:0 10px 18px rgba(0,0,0,.23),0 0 10px color-mix(in srgb,var(--led1) 8%,transparent)}
  50%{transform:translateY(-2px);box-shadow:0 13px 21px rgba(0,0,0,.25),0 0 19px color-mix(in srgb,var(--led1) 16%,transparent)}
}

/* Current scanning card */
.room-prize.active{
  animation:prizeActive .22s ease-in-out infinite alternate !important;
  border-color:var(--led1) !important;
  box-shadow:
    0 0 8px #fff,
    0 0 20px var(--led1),
    0 0 42px color-mix(in srgb,var(--led2) 48%,transparent),
    0 16px 24px rgba(0,0,0,.30) !important;
}
.room-prize.active::before{
  opacity:1;
  animation-duration:.65s;
}
@keyframes prizeActive{
  from{transform:translateY(-4px) scale(1.025)}
  to{transform:translateY(-7px) scale(1.055)}
}

/* Winner becomes a bright event card */
.room-prize.winner{
  animation:winnerCard 1.15s cubic-bezier(.2,.8,.2,1) both !important;
  border-color:#fff4a8 !important;
  box-shadow:
    0 0 8px #fff,
    0 0 24px var(--led1),
    0 0 55px var(--led2),
    0 0 90px color-mix(in srgb,var(--led3) 55%,transparent),
    0 24px 32px rgba(0,0,0,.34) !important;
}
.room-prize.winner::before{
  opacity:1;
  animation-duration:.42s;
}
@keyframes winnerCard{
  0%{transform:translateY(-3px) scale(1.03)}
  38%{transform:translateY(-20px) scale(1.18) rotate(-1deg)}
  68%{transform:translateY(-15px) scale(1.13) rotate(1deg)}
  100%{transform:translateY(-17px) scale(1.15)}
}

/* Light mode toggle still disables extra FX, but prize borders remain elegant. */
.room-scene.lights-off .scene-fx{display:none !important}
.room-scene.lights-off .room-prize::before{
  animation:none;
  opacity:.16;
}
.room-scene.lights-off .room-prize{
  animation:none;
}

/* Keep the scene smooth on GPU-friendly properties. */
.fx-beam,
.fx-marquee i,
.fx-side-led i,
.fx-confetti-float i,
.room-prize::before{
  will-change:transform,opacity;
}

/* Mobile reduces the number/intensity of decorative layers */
@media(max-width:760px){
  .beam-e,.beam-f,.fx-side-led,.fx-confetti-float{display:none}
  .fx-marquee{left:2%;right:2%}
  .room-prize{animation:none}
}

/* Accessibility */
@media(prefers-reduced-motion:reduce){
  .fx-marquee i,.fx-side-led i,.fx-confetti-float i,
  .room-prize,.room-prize::before,.room-prize.active,.room-prize.winner{
    animation:none !important;
  }
}



/* =========================================================
   V6.0 — PRIZE ROOM EDITOR LIGHT / DARK MODE
   The editor chrome changes; the event stage stays cinematic.
   ========================================================= */
:root{color-scheme:dark light}
html[data-theme="dark"]{color-scheme:dark}
html[data-theme="light"]{color-scheme:light}

.theme-toggle{
  min-width:88px;height:38px;
  padding:5px 10px 5px 5px;
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  border:1px solid var(--line);border-radius:999px;
  color:var(--text);background:rgba(255,255,255,.045);
  font-size:9px;font-weight:900;
}
.theme-toggle-icon{
  width:27px;height:27px;border-radius:50%;
  display:grid;place-items:center;font-size:14px;
  background:#111733;box-shadow:0 3px 8px rgba(0,0,0,.20);
}
.theme-only-host{margin-left:auto}

html[data-theme="light"]{
  --bg:#f6f7fc;
  --panel:#ffffff;
  --panel2:#f2f4fb;
  --line:rgba(40,51,87,.12);
  --text:#141a2c;
  --muted:#66718a;
}
html[data-theme="light"] body{
  background:#f6f7fc !important;color:#141a2c !important;
}
html[data-theme="light"] .studio-bg{
  background:
    radial-gradient(circle at 5% 0,rgba(119,91,255,.08),transparent 28%),
    radial-gradient(circle at 95% 5%,rgba(255,77,182,.055),transparent 28%),
    linear-gradient(180deg,#fafbff,#f1f3fa) !important;
}
html[data-theme="light"] .studio-top{
  background:rgba(255,255,255,.88) !important;
  border-bottom-color:rgba(40,51,87,.10) !important;
  box-shadow:0 6px 24px rgba(40,51,87,.07);
}
html[data-theme="light"] .studio-title span{color:#5e4be0 !important}
html[data-theme="light"] .studio-title b{color:#182036 !important}
html[data-theme="light"] .ui-btn,
html[data-theme="light"] .mini-action{
  color:#27304a !important;
  background:#fff !important;
  border-color:rgba(40,51,87,.12) !important;
  box-shadow:0 4px 12px rgba(40,51,87,.06);
}
html[data-theme="light"] .ui-btn.primary{
  color:#fff !important;
  background:linear-gradient(135deg,#7657ff,#d74cff 58%,#ff5cad) !important;
}
html[data-theme="light"] .theme-toggle{
  color:#26304a;background:#eef1f8;border-color:rgba(40,51,87,.12);
}
html[data-theme="light"] .theme-toggle-icon{
  color:#6d4d00;background:linear-gradient(145deg,#fff5b5,#ffd560);
}
html[data-theme="light"] .tool-rail,
html[data-theme="light"] .inspector{
  background:rgba(255,255,255,.88) !important;
  border-color:rgba(40,51,87,.11) !important;
  box-shadow:0 16px 42px rgba(40,51,87,.08);
}
html[data-theme="light"] .tool-btn{
  color:#69758e !important;
}
html[data-theme="light"] .tool-btn span{color:#505b77 !important}
html[data-theme="light"] .tool-btn.active{
  color:#30255f !important;
  border-color:rgba(119,91,255,.20) !important;
  background:linear-gradient(145deg,rgba(119,91,255,.10),rgba(32,221,255,.04)) !important;
}
html[data-theme="light"] .stage-status{color:#68748c !important}
html[data-theme="light"] .stage-help{color:#7a849b !important}
html[data-theme="light"] .stage-help span{color:#46516b !important}

html[data-theme="light"] .panel-title h2,
html[data-theme="light"] .panel-subhead b,
html[data-theme="light"] .field>span{color:#202941 !important}
html[data-theme="light"] .panel-title span{color:#6650e6 !important}
html[data-theme="light"] .panel-title p,
html[data-theme="light"] .panel-subhead small,
html[data-theme="light"] .hint{color:#717c94 !important}

html[data-theme="light"] .field input[type=text],
html[data-theme="light"] .field select{
  color:#182036 !important;
  background:#f6f7fc !important;
  border-color:rgba(40,51,87,.11) !important;
}
html[data-theme="light"] .field input[type=color]{
  background:#f6f7fc !important;
  border-color:rgba(40,51,87,.11) !important;
}
html[data-theme="light"] .upload-box,
html[data-theme="light"] .prize-edit-row,
html[data-theme="light"] .text-list-row,
html[data-theme="light"] .toggle-list label,
html[data-theme="light"] .room-preset,
html[data-theme="light"] .bg-template{
  color:#27304a !important;
  background:#f8f9fd !important;
  border-color:rgba(40,51,87,.11) !important;
}
html[data-theme="light"] .prize-thumb{
  background:#eef1f8 !important;
  border-color:rgba(40,51,87,.10) !important;
}
html[data-theme="light"] .prize-row-fields input{color:#1e2740 !important}
html[data-theme="light"] .prize-row-fields small{color:#818ba1 !important}
html[data-theme="light"] .add-prize-btn,
html[data-theme="light"] .add-text-btn{
  color:#5742d1 !important;
  background:rgba(119,91,255,.07) !important;
  border-color:rgba(119,91,255,.18) !important;
}
html[data-theme="light"] .small-btn{
  color:#46516b !important;background:#f7f8fc !important;border-color:rgba(40,51,87,.10) !important;
}
html[data-theme="light"] .section-sep{background:rgba(40,51,87,.09) !important}

/* Do NOT wash out the actual event room. */
html[data-theme="light"] #roomScene,
html[data-theme="light"] #roomScene *{
  color-scheme:dark;
}

/* Winner modal uses a clean light shell, winner image remains unchanged */
html[data-theme="light"] .winner-modal{
  background:rgba(238,241,249,.80) !important;
}
html[data-theme="light"] .winner-card{
  color:#151b2d !important;
  background:linear-gradient(150deg,#ffffff,#eef1fa) !important;
  border-color:rgba(40,51,87,.11) !important;
  box-shadow:0 35px 90px rgba(40,51,87,.24) !important;
}
html[data-theme="light"] .winner-card p{color:#6d7891 !important}

@media(max-width:700px){
  .theme-toggle{min-width:38px;width:38px;padding:5px}
  .theme-toggle-label{display:none}
}


/* =========================================================
   V6.1.3 — PRIZE ROOM STUDIO BIG / CLEAR TYPOGRAPHY
   ========================================================= */

.studio-title span{
  font-size:clamp(.72rem,.62vw,.84rem) !important;
}
.studio-title b{
  font-size:clamp(1rem,.90vw,1.14rem) !important;
}
.ui-btn{
  font-size:clamp(.78rem,.68vw,.90rem) !important;
  min-height:42px !important;
  padding-inline:14px !important;
}
.tool-btn{
  font-size:clamp(.74rem,.64vw,.86rem) !important;
  min-height:67px !important;
}
.tool-btn span{
  font-size:1.25rem !important;
}
.stage-status,
.mini-action{
  font-size:clamp(.72rem,.62vw,.84rem) !important;
}
.mini-action{
  min-height:38px !important;
  padding-inline:12px !important;
}

/* Event room text */
.event-badge,
.event-heading small{
  font-size:clamp(.64rem,.54vw,.74rem) !important;
}
.event-heading h1{
  font-size:clamp(2rem,3vw,3.15rem) !important;
}
.event-heading p{
  font-size:clamp(.80rem,.70vw,.94rem) !important;
}
.room-prize b{
  font-size:clamp(.76rem,.65vw,.88rem) !important;
}
.room-prize small{
  font-size:clamp(.62rem,.52vw,.72rem) !important;
}
.winner-board small{
  font-size:clamp(.62rem,.52vw,.72rem) !important;
}
.winner-board strong{
  font-size:clamp(.90rem,.78vw,1.06rem) !important;
}
.console-top{
  font-size:clamp(.62rem,.52vw,.72rem) !important;
}
.console-core,
.console-spin{
  font-size:clamp(.72rem,.62vw,.84rem) !important;
}
.stage-help{
  font-size:clamp(.70rem,.60vw,.82rem) !important;
}

/* Inspector */
.panel-title span{
  font-size:clamp(.68rem,.58vw,.78rem) !important;
}
.panel-title h2{
  font-size:clamp(1.28rem,1.15vw,1.5rem) !important;
}
.panel-title p{
  font-size:clamp(.76rem,.66vw,.88rem) !important;
  line-height:1.5 !important;
}
.field>span{
  font-size:clamp(.74rem,.64vw,.86rem) !important;
}
.panel-subhead b{
  font-size:clamp(.84rem,.72vw,.96rem) !important;
}
.panel-subhead small{
  font-size:clamp(.72rem,.62vw,.84rem) !important;
  line-height:1.45 !important;
}
.upload-box b{
  font-size:clamp(.78rem,.68vw,.90rem) !important;
}
.upload-box small{
  font-size:clamp(.68rem,.58vw,.80rem) !important;
}
.small-btn,
.add-prize-btn,
.add-text-btn{
  font-size:clamp(.72rem,.62vw,.84rem) !important;
  min-height:38px !important;
}
.prize-row-fields input{
  font-size:clamp(.78rem,.68vw,.90rem) !important;
  min-height:38px !important;
}
.prize-row-fields small{
  font-size:clamp(.66rem,.56vw,.76rem) !important;
}
.hint{
  font-size:clamp(.68rem,.58vw,.80rem) !important;
  line-height:1.5 !important;
}
.room-preset b,
.toggle-list label,
.text-list-row b{
  font-size:clamp(.74rem,.64vw,.86rem) !important;
}
.text-list-row span{
  font-size:clamp(.66rem,.56vw,.76rem) !important;
}
.bg-template span{
  font-size:clamp(.68rem,.58vw,.80rem) !important;
  padding:9px 10px !important;
}
.winner-kicker{
  font-size:clamp(.74rem,.64vw,.86rem) !important;
}
.winner-card h2{
  font-size:clamp(2.5rem,4vw,3.8rem) !important;
}
.winner-card p{
  font-size:clamp(.82rem,.72vw,.94rem) !important;
}
.toast{
  font-size:clamp(.76rem,.66vw,.88rem) !important;
}

/* Fullscreen: keep text readable on projector / TV */
#roomScene:fullscreen .event-badge{
  font-size:clamp(.68rem,.72vw,.92rem) !important;
}
#roomScene:fullscreen .event-heading h1{
  font-size:clamp(2.7rem,4.3vw,5rem) !important;
}
#roomScene:fullscreen .event-heading p{
  font-size:clamp(.92rem,1.15vw,1.35rem) !important;
}
#roomScene:fullscreen .room-prize b{
  font-size:clamp(.78rem,.88vw,1.1rem) !important;
}
#roomScene:fullscreen .room-prize small{
  font-size:clamp(.64rem,.62vw,.82rem) !important;
}
#roomScene:fullscreen .console-core,
#roomScene:fullscreen .console-spin{
  font-size:clamp(.76rem,.82vw,1rem) !important;
}
#roomScene:fullscreen .winner-board strong{
  font-size:clamp(1rem,1.3vw,1.55rem) !important;
}
#roomScene:fullscreen .winner-board small{
  font-size:clamp(.68rem,.62vw,.84rem) !important;
}

/* Theme toggle */
.theme-toggle{
  font-size:clamp(.76rem,.66vw,.88rem) !important;
  min-width:98px !important;
  height:42px !important;
}
.theme-toggle-icon{
  font-size:1rem !important;
  width:29px !important;
  height:29px !important;
}

@media(max-width:700px){
  .tool-btn{
    min-height:62px !important;
  }
  .theme-toggle{
    min-width:42px !important;
    width:42px !important;
  }
  .theme-toggle-label{display:none !important}
}