body[data-ui-theme="ocean"]{--room-bg:#101c30;--room-card:#192b43;--room-card-top:#21364e;--room-panel:#122338;--room-text:#eaf3ff;--room-muted:#91a9c7;--room-accent:#9bcced;--room-button:#acd9ed;--room-button-text:#20384d}
body[data-ui-theme="forest"]{--room-bg:#12241f;--room-card:#1c342a;--room-card-top:#254031;--room-panel:#172d24;--room-text:#e4ede1;--room-muted:#9bb49c;--room-accent:#c9d9a9;--room-button:#cfdbb6;--room-button-text:#293f2c}
body[data-ui-theme="plum"]{--room-bg:#21182c;--room-card:#30233d;--room-card-top:#3b2e4a;--room-panel:#291d35;--room-text:#f3eaf8;--room-muted:#b6a0c5;--room-accent:#d7b5e4;--room-button:#dabee8;--room-button-text:#3c294a}
body[data-ui-theme="burgundy"]{--room-bg:#2b1721;--room-card:#3b242d;--room-card-top:#472b36;--room-panel:#321c26;--room-text:#f5e6e9;--room-muted:#c4a0a9;--room-accent:#e0b0bc;--room-button:#e5bac4;--room-button-text:#4d2b35}
body[data-ui-theme="rose"]{--room-bg:#f5edef;--room-card:#fff8fa;--room-card-top:#fff;--room-panel:#eee1e7;--room-text:#44333e;--room-muted:#9b7d8c;--room-line:#957d8e30;--room-accent:#92637e;--room-button:#a67791;--room-button-text:#fff;--room-shadow:#58324514;color-scheme:light}
body[data-ui-theme="ice"]{--room-bg:#eaf1f5;--room-card:#f6fafc;--room-card-top:#fff;--room-panel:#dee9ef;--room-text:#2a3c4d;--room-muted:#768e9f;--room-line:#6a91aa30;--room-accent:#4e7c9d;--room-button:#5686a4;--room-button-text:#fff;--room-shadow:#244c6814;color-scheme:light}
body[data-ui-theme="slate"]{--room-bg:#20242c;--room-card:#2c323b;--room-card-top:#353d48;--room-panel:#242a33;--room-text:#e5eaf1;--room-muted:#9ba7b7;--room-accent:#c1cfdb;--room-button:#b9ccd8;--room-button-text:#2b3847}
body[data-ui-theme="amber"]{--room-bg:#302214;--room-card:#40301f;--room-card-top:#4b3925;--room-panel:#352719;--room-text:#f6ead8;--room-muted:#bda37e;--room-accent:#e9c17f;--room-button:#e2c28e;--room-button-text:#49351f}
.appearance-panel{max-height:min(78vh,740px);overflow-y:auto;scrollbar-width:thin}.theme-options{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.theme-options button{min-height:32px}
.custom-theme-row{display:flex;gap:16px;margin:15px 0}.custom-theme-row label{display:flex;align-items:center;justify-content:space-between;gap:7px;flex:1;font-size:8px;margin:0}.custom-theme-row input[type="color"]{width:29px;height:27px;min-height:27px;padding:2px;cursor:pointer}
.appearance-panel>.open-studio{justify-content:center;font-size:10px;margin-top:10px}.scene-strip>.open-studio{margin:0 auto 0 0;font-size:10px}.scene-strip{flex-wrap:wrap}
.board-surface{background-image:var(--scene);background-size:cover;background-position:center;border-radius:19px;box-shadow:0 15px 30px #0003}
.board-surface:before{content:'';position:absolute;inset:0;background:var(--room-panel);opacity:calc(1 - var(--board-scenery-strength,.55));border-radius:inherit;pointer-events:none}
.board{z-index:1;background:linear-gradient(145deg,color-mix(in srgb,var(--room-board-top) 50%,transparent),color-mix(in srgb,var(--room-board-bottom) 66%,transparent));backdrop-filter:blur(1px)}
.no-board-scenery .board-surface{background-image:none}.no-board-scenery .board-surface:before{opacity:1}.no-board-scenery .board{background:linear-gradient(145deg,var(--room-board-top),var(--room-board-bottom))}
.objects-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:3;pointer-events:none;border-radius:inherit}
.winning-path{z-index:5}.cell.token-custom{background:var(--room-hole);border:1px solid #0006;box-shadow:inset 0 5px 10px #03050a90,inset 0 -1px 1px #b0bed32b}
.cell.token-custom:before,.cell.token-custom:after{display:none}
.fallback-piece{position:absolute;inset:4%;border-radius:50%;background:radial-gradient(circle at 28% 17%,#fff9,transparent 21%),linear-gradient(165deg,transparent 40%,#ffffff73 51%,transparent 63%),radial-gradient(circle at 32% 22%,hsl(var(--metal-h) var(--metal-s) 78%),hsl(var(--metal-h) var(--metal-s) 42%) 58%,hsl(var(--metal-h) var(--metal-s) 15%));box-shadow:inset 0 1px 3px #fff7,inset 0 -4px 7px #0008,0 3px 4px #0006;display:flex;align-items:center;justify-content:center;pointer-events:none}
.fallback-piece.gem{clip-path:polygon(25% 5%,75% 5%,97% 30%,97% 70%,75% 95%,25% 95%,3% 70%,3% 30%);background:conic-gradient(from 20deg,#ffffff70,transparent 17%,#0004 28%,#ffffff50 40%,transparent 55%,#0005 70%,#fff6 85%,transparent),radial-gradient(circle at 32% 22%,hsl(var(--metal-h) var(--metal-s) 75%),hsl(var(--metal-h) var(--metal-s) 38%) 60%,hsl(var(--metal-h) var(--metal-s) 18%))}
.fallback-piece.bottle{inset:1% 19%;border-radius:12%;clip-path:polygon(36% 0,64% 0,66% 23%,83% 37%,86% 94%,77% 100%,23% 100%,14% 94%,17% 37%,34% 23%)}
.fallback-piece img{width:65%;max-height:45%;object-fit:contain}.object-brand{background:var(--label-paper,#fff);color:var(--label-ink,#333);font-size:clamp(5px,.6vw,9px);font-weight:800;padding:2px 3px;max-width:90%;overflow:hidden;white-space:nowrap}.object-number{font-size:12px;color:#fff8;text-shadow:0 1px 2px #0008}
.has-webgl .fallback-piece{display:none}.has-webgl .cell.token-custom{box-shadow:inset 0 4px 9px #03050a70,inset 0 -1px 1px #b0bed32b;background:color-mix(in srgb,var(--room-hole) 82%,transparent)}
.has-webgl .cell.winning{outline:2px solid #f2e5bf;box-shadow:0 0 17px #f8e1a92c,inset 0 3px 8px #0007}.has-webgl .cell{filter:none}
.studio-dialog{width:850px;max-width:calc(100vw - 32px);max-height:91vh;padding:35px;border-radius:23px;overflow-y:auto;scrollbar-width:thin;background:linear-gradient(130deg,var(--room-card-top),var(--room-card));color:var(--room-text)}
.studio-close{position:absolute;right:18px;top:18px}.studio-heading h2{font-size:36px;line-height:1.13;margin:16px 0;font-weight:600;letter-spacing:-1px}.studio-heading h2 em{font-style:normal;color:var(--room-accent)}.studio-heading p{max-width:500px;font-size:12px;color:var(--room-muted);line-height:1.8}
.studio-layout{display:grid;grid-template-columns:1.1fr 1fr;gap:32px;align-items:start;margin-top:24px}.studio-visual{padding:24px 18px;background:var(--room-panel);border:1px solid var(--room-line);border-radius:17px;position:sticky;top:0;background-image:linear-gradient(145deg,#101626be,#101626e6),var(--scene);background-size:cover}
.object-preview{height:205px;position:relative}.object-preview .objects-canvas{border-radius:10px}.preview-captions{display:flex;justify-content:space-around;font-size:9px;color:#d0ccde}.studio-visual .fine-print{font-size:9px;color:#9ba1b8;margin-top:20px}.render-status{display:block;width:max-content;margin:20px auto 0;font-size:8px;letter-spacing:1px;color:#d1c7e8;border:1px solid #ffffff1c;border-radius:12px;padding:6px 10px}
.studio-editor .segmented{margin:0 0 22px}.studio-editor>label{font-size:10px}.studio-editor input,.studio-editor select{font-size:11px}.logo-upload{padding:13px;border:1px dashed var(--room-accent);border-radius:8px;color:var(--room-accent);font-size:11px!important;text-align:center;cursor:pointer}.logo-upload input{display:none}.studio-button-row{display:flex;justify-content:space-between;gap:12px}.studio-button-row button{font-size:9px}.studio-editor>.fine-print{font-size:9px;line-height:1.8}
.studio-bottom{display:grid;grid-template-columns:1fr 1fr;gap:17px;padding:22px 0;border-top:1px solid var(--room-line);margin-top:24px}.studio-toggle{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0;color:var(--room-text);font-size:11px}.studio-toggle input{width:17px;min-height:17px;accent-color:var(--room-accent)}.scene-strength{grid-column:1/-1;margin:5px 0;color:var(--room-muted);font-size:10px}.scene-strength input{width:100%;margin-top:13px;min-height:14px;padding:0;accent-color:var(--room-accent)}.studio-done{justify-content:space-between;max-width:280px;margin-left:auto}
@media(max-width:700px){.appearance-panel{max-height:74vh}.scene-strip{gap:11px}.scene-strip>.open-studio{width:100%;padding-bottom:9px;border-bottom:1px solid var(--room-line);font-size:10px}.studio-dialog{padding:27px 22px;max-width:calc(100vw - 22px);max-height:93vh}.studio-heading h2{font-size:30px}.studio-heading p{font-size:11px}.studio-layout{grid-template-columns:1fr;gap:20px}.studio-visual{position:relative;padding:15px}.object-preview{height:175px}.studio-visual .fine-print{display:none}.render-status{margin-top:16px}.studio-bottom{gap:20px}.studio-toggle{font-size:10px}.studio-done{width:100%;max-width:none}.board-surface{border-radius:15px}.object-brand{font-size:6px}.studio-editor .segmented{margin-bottom:15px}}

.preview-token{position:absolute;top:20%;width:104px;height:104px}.preview-token.p1{left:calc(28% - 52px)}.preview-token.p2{left:calc(72% - 52px)}.has-webgl .preview-token{display:none}.object-preview .object-brand{font-size:12px}.object-preview .object-number{font-size:22px}

.has-webgl .cell.falling{animation:none}.cell.blast .fallback-piece{filter:drop-shadow(0 2px 3px #0008)}
