:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#23322b;background:#eef1ed;font-synthesis:none;--ink:#23322b;--muted:#7c887f;--line:#e0e6df;--lime:#c4ef84;--side:#18271f;--accent:#386849}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button,a,input,select{outline-offset:4px}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}button{border:0}a{color:inherit;text-decoration:none}svg{width:18px;height:18px;vertical-align:middle;flex-shrink:0}button .icon{pointer-events:none}.app-shell{display:grid;grid-template-columns:188px minmax(0,1fr);min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:188px;background:var(--side);color:#c3cec6;padding:31px 17px 20px;display:flex;flex-direction:column;z-index:30}.brand{color:white;font-size:29px;font-weight:950;letter-spacing:-2px;display:flex;align-items:center;gap:8px;margin-left:13px}.brand .brand-mark{font-size:21px;letter-spacing:-3px;transform:rotate(-10deg);color:#c2ef83}.brand small{letter-spacing:2.5px;font-size:9px;font-weight:550;color:#a5b7aa;margin-left:2px}.brand-block{display:flex;flex-direction:column}.workspace-label{margin:36px 14px 10px;color:#718679;font-size:9px;letter-spacing:1.8px;font-weight:700}.nav{display:grid;gap:5px}.nav-item{background:none;color:#aebfb3;width:100%;text-align:left;display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:8px;font-size:12px;font-weight:550;transition:.18s}.nav-item.active{color:#17271b;background:var(--lime);font-weight:750}.nav-item:not(.active):hover{background:#23392b;color:white}.nav-item svg{width:17px;height:17px}.nav-count{margin-left:auto;font-size:9px;color:#56745e;border:1px solid #628e5d33;border-radius:4px;padding:1px 4px}.sidebar-bottom{margin-top:auto;padding:20px 12px 0;font-size:10px;line-height:1.6;color:#7e9485}.phase-label{display:inline-flex;gap:5px;align-items:center;background:#2b4030;color:#a3c594;padding:5px 8px;border-radius:5px;font-size:9px;letter-spacing:.4px;margin-bottom:9px}.phase-dot{width:5px;height:5px;background:#b6d580;border-radius:50%}.sidebar-owner{display:flex;align-items:center;gap:9px;border-top:1px solid #314236;margin-top:18px;padding-top:16px;color:#dbe5dc}.owner-icon{width:28px;height:28px;border-radius:50%;background:#314b38;display:grid;place-items:center;font-size:10px;font-weight:800}.sidebar-owner small{display:block;color:#708d79;font-size:9px}.shell-main{grid-column:2;min-width:0}.topbar{height:69px;display:flex;align-items:center;justify-content:space-between;gap:14px;border-bottom:1px solid var(--line);padding:0 29px;background:#f8faf7}.crumb{font-size:11px;display:flex;gap:11px;align-items:center;color:#9aa69d}.crumb strong{color:#4b5e50;font-weight:600}.top-actions{display:flex;align-items:center;gap:9px}.save-state{font-size:10px;color:#8a978d;margin-right:7px;display:flex;gap:5px;align-items:center}.save-state.dirty{color:#ac7e36}.save-state:before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor}.btn{border:1px solid #dce4da;background:#fff;color:#435446;font-size:11px;font-weight:650;padding:9px 12px;border-radius:7px;display:inline-flex;gap:7px;align-items:center;justify-content:center;white-space:nowrap;transition:.15s}.btn:hover{border-color:#9daf9e;transform:translateY(-1px)}.btn svg{width:14px;height:14px}.btn-primary{background:#243f2d;border-color:#243f2d;color:#fff}.btn-lime{background:var(--lime);color:#26432a;border-color:var(--lime)}.btn-subtle{background:transparent;border-color:transparent;color:#738477}.btn-danger{color:#bd5656}.icon-btn{height:31px;width:31px;padding:0;display:inline-grid;place-items:center;background:#fff;border:1px solid var(--line);border-radius:6px;color:#6a7a6e}.main-page{padding:26px 29px 24px;max-width:1900px;margin:auto}.page-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;margin-bottom:22px}.eyebrow{font-size:9px;font-weight:750;letter-spacing:1.5px;color:#8a9b8a;margin-bottom:7px;text-transform:uppercase}h1{font-size:24px;letter-spacing:-.8px;line-height:1.15;margin:0 0 7px;font-weight:750}h2{font-size:16px;letter-spacing:-.3px;margin:0 0 8px}h3{font-size:12px;margin:0}.page-description{font-size:11px;line-height:1.7;color:#8a968d;margin:0}.live-chip{background:#e8f1e0;color:#5e7b41;display:flex;gap:6px;align-items:center;border-radius:5px;padding:6px 9px;font-size:9px;font-weight:700}.live-chip:before{content:"";width:5px;height:5px;border-radius:50%;background:#76a348}.connection-chip{display:flex;align-items:center;gap:6px;font-size:10px;color:#65806a}.connection-chip:before{content:"";width:6px;height:6px;border-radius:50%;background:#83ac6b}.connection-chip.offline{color:#af7750}.connection-chip.offline:before{background:#bf8256}.studio-layout{display:grid;grid-template-columns:minmax(0,1fr) 258px;gap:18px;align-items:start}.workspace-panel{border:1px solid #dce4d9;border-radius:11px;background:#f8faf6;min-width:0;overflow:hidden}.stage-toolbar{min-height:49px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:9px 14px;gap:9px;background:#fff}.toolbar-group{display:flex;gap:7px;align-items:center;min-width:0}.segmented{display:flex;align-items:center;padding:3px;border:1px solid #e2e8df;border-radius:6px;background:#f7f9f4;gap:2px}.segment{padding:5px 8px;border-radius:4px;color:#8a978c;font-size:9px;line-height:1;background:transparent;display:flex;align-items:center;gap:5px}.segment.active{background:#fff;color:#4d6250;box-shadow:0 1px 4px #19372413}.segment svg{width:12px;height:12px}.toolbar-select{font-size:10px;border:0;background:transparent;color:#536859;max-width:155px}.toolbar-divider{width:1px;height:20px;background:#e5ebe2}.zoom-label{font-size:10px;color:#78887b;min-width:37px;text-align:center}.stage-area{min-height:455px;padding:33px 24px 26px;display:flex;flex-direction:column;align-items:center;justify-content:center;background-color:#eef2eb;background-image:radial-gradient(#c9d2c7 0.8px,transparent .8px);background-size:13px 13px;position:relative;overflow:hidden}.stage-label{font-size:8px;letter-spacing:1.6px;color:#92a08f;font-weight:600;position:absolute;left:19px;top:15px}.device-holder{width:100%;position:relative;display:flex;align-items:center;justify-content:center;overflow:visible;padding:0 3px}.device-frame{position:relative;border:7px solid #202d28;border-radius:26px;background:#183f35;box-shadow:0 19px 32px #2c3f292b,0 3px 5px #1d2c2433;max-width:100%;aspect-ratio:844/390;overflow:hidden;container-type:inline-size;width:100%;isolation:isolate}.device-frame:after{content:"";width:4px;height:20%;background:#13221a;position:absolute;right:1px;top:40%;border-radius:4px;z-index:20;pointer-events:none}.device-frame.portrait{aspect-ratio:390/844;width:270px;border-radius:30px}.device-frame.portrait:after{right:auto;left:39%;top:2px;height:4px;width:22%}.device-frame.tablet{aspect-ratio:1024/768;width:580px}.game-canvas{height:100%;width:100%;position:relative;overflow:hidden;background:radial-gradient(ellipse at 50% 45%,#2c867059 0,transparent 63%),linear-gradient(140deg,#174d45,#0d3736);font-size:clamp(7px,1.25cqw,11px);color:#efffe7;--card-scale:1;--overlap:.62;--fan-angle:3;--game-accent:#c9ef81;--font-scale:1}.game-canvas:before{content:"";position:absolute;inset:13% 9%;border:1px solid #a5d5ad19;border-radius:45%;box-shadow:0 0 0 21px #acd5ab05,0 0 0 22px #acd5ab0d;transform:rotate(-8deg);pointer-events:none}.game-canvas:after{content:"W";position:absolute;left:50%;top:48%;transform:translate(-50%,-50%) rotate(-12deg);font-size:32cqw;font-weight:1000;color:#9ed4a307;line-height:1;pointer-events:none}.game-topbar{position:absolute;inset:0 0 auto;display:flex;align-items:center;justify-content:space-between;padding:1.4% 2.2%;font-size:.85em;z-index:5}.table-mode{display:flex;align-items:center;gap:5px;color:#cfdfc8;letter-spacing:.5px;font-size:.85em}.table-brand{font-size:1.4em;font-weight:950;letter-spacing:-.6px;color:#f1ffdf}.table-pill{padding:.25em .6em;border:1px solid #ffffff1e;border-radius:10px;color:#a7c1aa;background:#0d30274d}.table-options{display:flex;gap:.5em;align-items:center}.game-gear{font-size:1.15em;opacity:.7}.player{position:absolute;display:flex;align-items:center;gap:7px;z-index:6;pointer-events:auto}.player-top{left:50%;top:9%;transform:translateX(-50%)}.player-left{left:3%;top:36%;flex-direction:column;gap:4px}.player-right{right:3%;top:36%;flex-direction:column;gap:4px}.player-bottom{left:3%;bottom:4%;align-items:center}.avatar{width:4.4cqw;height:4.4cqw;min-width:20px;min-height:20px;border:2px solid #ffffff4d;border-radius:50%;display:grid;place-items:center;font-size:1.25em;font-weight:850;color:#fff;position:relative;box-shadow:0 2px 7px #071e2b40}.avatar.active{border-color:#d9f996;box-shadow:0 0 0 3px #b9e5753d,0 0 18px #a2cf8355}.avatar .turn-dot{position:absolute;right:-2px;bottom:-2px;width:10px;height:10px;border:2px solid #1d5545;background:#d7ef82;border-radius:50%}.avatar-a{background:linear-gradient(145deg,#d9ab75,#bf7e6d)}.avatar-b{background:linear-gradient(145deg,#a9bff5,#8d83bf)}.avatar-c{background:linear-gradient(145deg,#94c1b1,#547c7b)}.avatar-d{background:linear-gradient(145deg,#ebae9f,#b17183)}.player-name{font-size:1em;font-weight:700;line-height:1.3;text-shadow:0 1px 2px #16372b}.player-sub{font-size:.76em;color:#8fb4a3;line-height:1.4}.seat-badge{font-size:.7em;padding:1px 4px;color:#d7edcd;background:#ffffff12;border-radius:3px}.opponent-hand{position:absolute;z-index:3;display:flex;justify-content:center;pointer-events:none}.opponent-hand.top{left:50%;top:23%;transform:translateX(-50%);height:10cqw}.opponent-hand.left{left:12%;top:42%;transform:rotate(62deg);transform-origin:center;height:9cqw}.opponent-hand.right{right:12%;top:42%;transform:rotate(-62deg);height:9cqw}.back-card{width:4cqw;height:6cqw;min-width:15px;border:1.4px solid #a5bdb355;background:linear-gradient(130deg,#203f39,#15302c);border-radius:.5cqw;margin-left:-2.5cqw;display:grid;place-items:center;color:#d6efab;box-shadow:0 2px 4px #051d2740}.back-card:first-child{margin-left:0}.back-card span{font-size:1.1cqw;font-weight:1000;transform:rotate(-14deg);border:1px solid #92b97b6b;border-radius:50%;width:75%;height:64%;display:grid;place-items:center;background:#0a282150}.hand-count-bubble{position:absolute;right:-.5cqw;bottom:1.5cqw;background:#173d2c;color:#d6edc6;min-width:17px;text-align:center;border:1px solid #7dab654d;padding:2px 4px;border-radius:7px;font-size:8px}.table-center{position:absolute;left:50%;top:43%;transform:translate(-50%,-50%);display:flex;align-items:center;gap:2.5cqw;z-index:5}.draw-pile{width:7.2cqw;height:10.6cqw;border:0;background:none;padding:0;position:relative;transform:rotate(-9deg);color:#eaffc4}.draw-pile .back-card{width:100%;height:100%;margin:0;border:2px solid #d2e3c1;border-radius:.8cqw;box-shadow:-3px 2px 0 #acc0a6,-6px 4px 0 #597961,0 8px 12px #03241e55}.draw-pile .back-card span{font-size:2.8cqw}.draw-caption{position:absolute;bottom:-2.7cqw;width:160%;left:-30%;font-size:.73em;text-align:center;color:#9ec0a9;white-space:nowrap}.discard-pile{width:7.7cqw;height:11.2cqw;position:relative;transform:rotate(9deg);z-index:2}.discard-pile:before{content:"";position:absolute;inset:0;transform:rotate(-16deg);background:#eed392;border:2px solid #f6edce;border-radius:.8cqw;box-shadow:0 4px 5px #0c312f55}.turn-arrows{position:absolute;left:50%;top:44%;width:30cqw;height:23cqw;border:1px dashed #b4d09e25;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none}.turn-arrows:before,.turn-arrows:after{content:"›";position:absolute;color:#9bbc8799;font-size:3.5cqw}.turn-arrows:before{right:2%;top:14%;transform:rotate(45deg)}.turn-arrows:after{left:2%;bottom:14%;transform:rotate(-135deg)}.turn-arrows.ccw{transform:translate(-50%,-50%) scaleX(-1)}.current-color{position:absolute;left:50%;top:64%;transform:translateX(-50%);display:flex;align-items:center;gap:.5em;font-size:.75em;color:#b2cbb3;z-index:4}.color-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#f6d26b;box-shadow:0 0 0 2px #fff2}.hand-zone{position:absolute;left:15%;right:15%;bottom:-1.7cqw;height:15.6cqw;z-index:10;overflow:visible}.hand-scroll{width:100%;height:100%;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;padding:2.2cqw 1.2cqw 0;display:flex;align-items:flex-start;justify-content:center;gap:0;position:relative;isolation:isolate}.hand-scroll::-webkit-scrollbar{height:3px}.hand-scroll::-webkit-scrollbar-thumb{background:#9abe8d6b;border-radius:3px}.hand-scroll.crowded{justify-content:flex-start;scrollbar-width:thin;scrollbar-color:#8ebc7b55 transparent}.card-button{position:relative;background:none;padding:0;border:0;flex:0 0 auto;width:calc(7.5cqw * var(--card-scale));height:calc(11.25cqw * var(--card-scale));margin-left:calc(-4.7cqw * var(--card-scale) * var(--overlap) / .62);transform-origin:center 150%;transition:transform .16s,filter .16s;margin-top:var(--raise,0);z-index:var(--order,1);color:white}.card-button:first-child{margin-left:0}.card-button:not(:disabled):hover,.card-button.selected{transform:translateY(-2cqw) rotate(0deg)!important;z-index:50;filter:drop-shadow(0 0 4px #e8ff94)}.card-button:disabled{opacity:1;cursor:default}.card-button:not(.playable):not(.selected){filter:brightness(.81)}.card-button.playable:after{content:"";position:absolute;inset:0;border-radius:.7cqw;box-shadow:0 0 0 1px #dfff9060;pointer-events:none}.card-face{width:100%;height:100%;border:2px solid #f7ffed;border-radius:.75cqw;box-shadow:0 3px 5px #092c2860;position:relative;overflow:hidden;display:grid;place-items:center;isolation:isolate;color:white;background:var(--card-color,#529ac4)}.card-face:before{content:"";position:absolute;inset:15% 9%;border:1px solid #ffffff45;border-radius:35% 12% 35% 12%;transform:rotate(17deg);background:linear-gradient(135deg,#ffffff0d,#fff2);z-index:-1}.card-face .card-corner{position:absolute;top:5%;left:8%;font-size:1.25cqw;line-height:1;font-weight:850;text-shadow:0 1px #0002}.card-face .card-corner.bottom{top:auto;left:auto;bottom:5%;right:8%;transform:rotate(180deg)}.card-face .card-value{font-size:4.5cqw;font-weight:900;font-style:italic;line-height:1;text-shadow:0 2px #0002;letter-spacing:-.5cqw}.card-face[data-special="true"] .card-value{font-size:3cqw;letter-spacing:-.2cqw}.card-face.is-wild{background:conic-gradient(from 30deg at 50% 50%,#558fd8,#4cb773,#e6bd4b,#e96967,#558fd8)}.card-face.has-skin{background:#142834}.card-face .skin-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center bottom;z-index:-1}.card-face.has-skin:before{display:none}.card-face.has-skin .card-value{display:none}.card-face.has-skin .card-corner{background:#162b40cc;border-radius:2px;padding:1px 2px;font-size:1.15cqw}.hand-helper{position:absolute;bottom:2%;left:50%;transform:translateX(-50%);font-size:.65em;color:#6f9b84;z-index:1;white-space:nowrap}.uno-button{position:absolute;bottom:8%;right:3%;background:linear-gradient(135deg,#d2ef88,#a9ce65);color:#2f512a;box-shadow:0 4px 0 #739e43,0 5px 12px #183c2b66;border:1px solid #e5ffb9;padding:.65em 1.2em;border-radius:99px;font-size:1.1em;font-weight:1000;font-style:italic;transform:rotate(-8deg);z-index:15;letter-spacing:-.5px}.uno-button:disabled{opacity:.55}.table-turn-message{position:absolute;left:50%;top:71%;transform:translateX(-50%);padding:.35em 1em;border-radius:15px;color:#deedb6;background:#456a3f66;border:1px solid #adc47b15;font-size:.8em;white-space:nowrap;z-index:8}.table-notification{position:absolute;inset:31% 17% auto;background:#13392aeb;backdrop-filter:blur(6px);border:1px solid #b3d57e80;border-radius:13px;padding:2.5cqw;z-index:40;text-align:center;box-shadow:0 7px 20px #08251b5c}.table-notification h3{font-size:2.1cqw;color:#e5fac4;margin:0 0 .7em}.table-notification p{font-size:1.3cqw;line-height:1.5;margin:0 0 .9em;color:#aac5aa}.table-notification .btn{font-size:1.3cqw;padding:.5em 1em}.table-notification .row{display:flex;justify-content:center;gap:.5em}.game-canvas.guides .guide-x{position:absolute;left:50%;top:0;bottom:0;border-left:1px dashed #edeca67d;z-index:50;pointer-events:none}.game-canvas.guides .guide-y{position:absolute;top:50%;left:0;right:0;border-top:1px dashed #edeca67d;z-index:50;pointer-events:none}.game-canvas.guides .safe-area{position:absolute;inset:3%;border:1px dashed #e0d19a4d;z-index:50;pointer-events:none}.stage-caption{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:20px;font-size:9px;color:#94a08f}.stage-caption svg{width:12px;height:12px}.stage-controls{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;background:#fff;border-top:1px solid var(--line);gap:10px}.playback-controls{display:flex;align-items:center;gap:5px}.playback-controls .btn{padding:7px 10px;font-size:10px}.speed-select{font-size:9px;color:#869080;border:0;background:transparent}.timeline-label{font-size:9px;color:#879583}.simulation-status{font-size:9px;color:#8b998b;display:flex;gap:10px}.dot-sep{color:#c3ccc1}.inspector{display:grid;gap:13px}.panel-card{border:1px solid #dce4da;background:#fff;border-radius:10px;overflow:hidden}.panel-title{padding:14px 15px 12px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ecf0e9}.panel-title h3{font-size:11px;font-weight:700;display:flex;align-items:center;gap:7px}.panel-title svg{width:13px;height:13px;color:#8e9c8b}.panel-body{padding:14px 15px}.tiny-label{font-size:8px;letter-spacing:1px;text-transform:uppercase;color:#a1ad9d;font-weight:650;margin-bottom:7px}.field{margin-bottom:13px}.field:last-child{margin-bottom:0}.field label{font-size:9px;color:#7b8c7b;margin-bottom:6px;display:flex;align-items:center;justify-content:space-between}.field-value{font-size:9px;color:#506c51;font-weight:600;font-variant-numeric:tabular-nums}.field select,.field input[type=text],.field input[type=number],.field textarea{width:100%;border:1px solid #e1e7dc;padding:8px 9px;border-radius:6px;background:#fafcf8;color:#52684f;font-size:10px}.field select:focus,.field input:focus,.field textarea:focus{outline:2px solid #bad891;outline-offset:1px}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:9px}input[type=range]{appearance:none;width:100%;height:3px;border-radius:3px;background:linear-gradient(to right,#9cbc76 0%,#dfe8d9 100%);accent-color:#718e51;display:block;margin:10px 0}input[type=range]::-webkit-slider-thumb{appearance:none;width:10px;height:10px;background:#83a364;border:2px solid white;border-radius:50%;box-shadow:0 0 0 1px #a4bd8c}input[type=color]{width:28px;height:27px;padding:2px;border:1px solid #dce5d8;background:white;border-radius:5px;cursor:pointer}.swatch-row{display:flex;gap:5px;align-items:center}.swatch{height:20px;width:20px;border-radius:5px;border:2px solid transparent;box-shadow:0 0 0 1px #e5eae1;cursor:pointer}.swatch.active{border-color:white;box-shadow:0 0 0 1px #709761}.color-hex{font-size:9px;color:#91a08a;padding-left:4px;font-family:ui-monospace,monospace}.toggle-row{display:flex;align-items:center;justify-content:space-between;font-size:10px;color:#73856b;gap:8px;padding:5px 0}.switch{appearance:none;width:26px;height:15px;border-radius:10px;background:#dce4d5;position:relative;cursor:pointer;margin:0}.switch:before{content:"";position:absolute;top:3px;left:3px;width:9px;height:9px;background:white;border-radius:50%;transition:.15s}.switch:checked{background:#95b776}.switch:checked:before{left:14px}.mode-note{font-size:8px;line-height:1.6;color:#9ca795;background:#f5f8f1;border:1px solid #e8eee2;border-radius:5px;padding:7px 8px;margin-top:9px}.mode-note strong{color:#73905a;font-weight:600}.seat-list{display:grid;gap:9px}.seat-row{display:flex;align-items:center;gap:7px;font-size:10px}.seat-dot{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;color:white;font-size:9px;font-weight:700;flex-shrink:0}.seat-row .seat-name{flex:1;min-width:0}.seat-row small{color:#9aaa94;display:block;font-size:8px;margin-top:1px}.seat-row select{border:1px solid #e4eadf;padding:4px;border-radius:4px;font-size:8px;color:#7b8f70;background:#fff}.seat-row button{background:none;color:#98aa8b;padding:3px}.seat-row button svg{width:12px;height:12px}.seat-row.is-turn .seat-name{color:#4a7136;font-weight:700}.seat-turn{font-size:7px;padding:2px 4px;border-radius:3px;color:#7d9b51;background:#eff5e6;white-space:nowrap}.bottom-panels{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:17px}.scenario-list{display:flex;gap:6px;flex-wrap:wrap;padding:14px}.scenario-pill{padding:6px 8px;background:#f7f9f3;border:1px solid #e3e9db;color:#89987c;border-radius:5px;font-size:9px;display:flex;align-items:center;gap:5px}.scenario-pill.active{background:#ecf3df;color:#718f43;border-color:#cdddaf}.scenario-pill .count{font-weight:800;font-size:10px}.event-list{padding:2px 14px 8px;max-height:117px;overflow:auto;scrollbar-width:thin;scrollbar-color:#c8d6bc transparent}.event-row{display:flex;align-items:flex-start;gap:8px;padding:8px 0;border-bottom:1px solid #f0f3eb;font-size:9px;color:#8b9981}.event-row:last-child{border-bottom:0}.event-time{font-size:8px;color:#b1bcaa;font-variant-numeric:tabular-nums;white-space:nowrap;min-width:27px}.event-icon{width:5px;height:5px;background:#b7cda2;border-radius:50%;margin-top:3px;flex-shrink:0}.event-row strong{color:#63804c;font-weight:600}.footer-bar{display:flex;align-items:center;justify-content:space-between;font-size:8px;color:#a6b09f;margin-top:20px;gap:10px}.footer-bar span{display:flex;gap:5px;align-items:center}.footer-bar svg{width:10px;height:10px}.footer-build{font-family:ui-monospace,monospace;color:#b2bba9}.section-page{min-height:560px}.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.content-card{border:1px solid #dce4da;border-radius:11px;background:#fff;padding:20px}.content-card p{font-size:11px;line-height:1.7;color:#85917f}.asset-card{display:flex;flex-direction:column;border:1px solid #dde5d8;border-radius:12px;overflow:hidden;background:#fff}.asset-card-preview{background:radial-gradient(#29394c,#14252c);height:240px;display:flex;align-items:center;justify-content:center;padding:16px;position:relative}.asset-card-preview img{height:100%;width:auto;max-width:100%;object-fit:contain;border-radius:10px}.asset-card-preview iframe{position:absolute;inset:0;width:100%;height:100%;border:0}.asset-card-body{padding:17px}.asset-card-body p{font-size:10px;line-height:1.6;color:#8b9585}.asset-card-actions{display:flex;gap:7px;margin-top:12px}.badge{display:inline-flex;align-items:center;gap:5px;font-size:8px;font-weight:700;padding:4px 6px;border-radius:4px;background:#edf3e5;color:#759050}.badge.warn{background:#fbf1dd;color:#a38b52}.badge.info{background:#eaf0f6;color:#7d94a3}.layer-list{display:grid;gap:10px}.layer-item{display:flex;gap:12px;align-items:flex-start;border:1px solid #e5ebdf;padding:13px;border-radius:7px}.layer-number{width:24px;height:24px;background:#f0f5e9;border-radius:6px;color:#7c965b;display:grid;place-items:center;font-size:10px;font-weight:800;flex-shrink:0}.layer-item h3{font-size:11px;color:#5c7450}.layer-item p{font-size:10px;margin:4px 0 0;line-height:1.6;color:#98a18f}.audit-tabs{display:flex;gap:6px;margin-bottom:17px}.audit-tab{border:1px solid #dce6d2;background:#f8fbf4;color:#849777;padding:8px 13px;border-radius:6px;font-size:10px}.audit-tab.active{background:#dfeccf;color:#557838;border-color:#c8dcb0}.audit-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.audit-item{background:#fff;border:1px solid #dce4d8;border-radius:9px;padding:17px}.audit-item-header{display:flex;justify-content:space-between;gap:8px;align-items:center;margin-bottom:9px}.audit-item h3{font-size:13px;color:#536d48}.audit-item p{font-size:10px;color:#8c9883;line-height:1.7;margin:7px 0}.source-link{font-size:9px;color:#7a9955;display:inline-flex;align-items:center;gap:5px;text-decoration:underline;text-underline-offset:2px;max-width:100%;overflow-wrap:anywhere}.audit-note{font-size:10px;line-height:1.8;padding:13px 16px;border-left:3px solid #adc58c;background:#f7faf2;color:#8d9c7d;border-radius:0 7px 7px 0;margin-bottom:18px}.approval-list{display:grid;gap:11px}.approval-card{padding:17px;background:#fff;border:1px solid #dee8d5;border-radius:9px}.approval-header{display:flex;align-items:center;justify-content:space-between;gap:12px}.approval-card h3{font-size:13px;color:#597548}.approval-card p{font-size:10px;color:#95a286;line-height:1.6}.hash{font-size:9px;color:#829b6b;font-family:ui-monospace,monospace;background:#f3f7ee;padding:7px;border-radius:4px;overflow-wrap:anywhere}.empty-state{padding:55px 25px;text-align:center;border:1px dashed #cddac1;border-radius:10px;background:#f6f9f1;color:#95a286}.empty-state svg{width:30px;height:30px;color:#b4c4a4;margin-bottom:10px}.empty-state h3{font-size:14px;color:#72885d}.empty-state p{font-size:11px;line-height:1.7}.comparison-controls{display:flex;gap:12px;align-items:center;margin-bottom:14px;flex-wrap:wrap}.file-picker{padding:9px 12px;border:1px dashed #b9cba7;border-radius:6px;font-size:10px;color:#78915e;background:#f7faf2;cursor:pointer}.file-picker input{display:none}.comparison-stage{background:#e7ede0;min-height:260px;border:1px solid #d9e3ce;border-radius:10px;display:flex;align-items:center;justify-content:center;overflow:auto;position:relative}.comparison-overlay{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;opacity:.5;z-index:40}.compare-empty{font-size:11px;line-height:1.7;color:#9eaa92;text-align:center;padding:30px}.approve-form{display:grid;gap:13px;max-width:600px}.approve-form .field{margin:0}.approval-warning{font-size:10px;color:#94a086;line-height:1.7;background:#f7f9f2;padding:11px;border-radius:6px}.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px;margin-bottom:18px}.metric{padding:15px 18px;border-radius:8px;border:1px solid #dee7d5;background:#fff}.metric strong{font-size:22px;color:#5f794b;font-weight:700;letter-spacing:-.5px}.metric span{display:block;font-size:9px;color:#9aa58e;margin-top:4px}.login-wrap{min-height:100vh;display:grid;place-items:center;background:#edf2e7;padding:24px}.login-card{width:min(390px,100%);background:#fff;padding:33px;border:1px solid #d7e4cb;border-radius:14px;box-shadow:0 15px 55px #3c5f2420}.login-card .brand{color:#29482e;margin:0 0 27px}.login-card h1{font-size:21px}.login-card p{font-size:11px;line-height:1.7;color:#9aa58e}.login-card input{width:100%;margin:17px 0 12px;border:1px solid #d5e2c8;border-radius:7px;padding:12px;font-size:12px}.login-card .btn{width:100%}.modal-backdrop{position:fixed;inset:0;background:#15271980;backdrop-filter:blur(3px);z-index:100;display:grid;place-items:center;padding:25px}.modal{width:min(410px,100%);border:1px solid #d5e4c6;border-radius:14px;background:#fff;padding:25px;box-shadow:0 25px 80px #18361255}.modal h2{font-size:18px;color:#526f3c}.modal p{font-size:11px;color:#94a47e;line-height:1.7}.modal-actions{display:flex;gap:7px;justify-content:flex-end;margin-top:18px}.color-options{display:flex;gap:12px;justify-content:center;margin:24px 0}.color-choice{width:57px;height:57px;border-radius:13px;border:3px solid white;box-shadow:0 0 0 1px #dae4d0;transition:.15s}.color-choice:hover{transform:translateY(-4px);box-shadow:0 0 0 2px #afc797}.seat-choices{display:grid;gap:8px;margin-top:18px}.seat-choice{padding:13px;background:#f2f6ea;color:#688750;border:1px solid #e0e9d4;border-radius:7px;text-align:left;font-size:12px}#toast{position:fixed;left:50%;bottom:27px;transform:translate(-50%,20px);background:#28472f;color:#effce2;padding:11px 18px;border-radius:8px;font-size:11px;box-shadow:0 6px 25px #203e2830;z-index:200;opacity:0;pointer-events:none;transition:.2s;max-width:90vw;text-align:center}#toast.show{opacity:1;transform:translate(-50%,0)}#toast.error{background:#904f43}.error-banner{border:1px solid #ead0ba;background:#fbf4e7;color:#a58559;border-radius:7px;padding:11px 14px;font-size:10px;line-height:1.6;margin-bottom:15px}.loading{height:100vh;display:grid;place-items:center;color:#70865c;background:#eff4e7;font-size:12px}.loading-ring{width:24px;height:24px;border:2px solid #d2dfc4;border-top-color:#759d4f;border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 15px}.viewer-shell{min-height:100vh;background:#101e16;color:#dae8d3;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;gap:17px}.viewer-top{display:flex;align-items:center;justify-content:space-between;width:min(100%,1100px);font-size:11px}.viewer-top a{font-size:10px;color:#94b277}.viewer-shell .device-holder{max-width:1100px}.viewer-shell .device-frame{border-width:8px}.viewer-shell .viewer-controls{display:flex;gap:8px}.viewer-status{font-size:10px;color:#7e9b6d}.no-motion *{transition:none!important;animation:none!important}.screen-reader{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}.portrait .game-topbar{padding:5% 5%;font-size:1.4em}.portrait .player-top{top:11%}.portrait .avatar{width:10cqw;height:10cqw;font-size:2em}.portrait .player{font-size:1.8em}.portrait .player-left{left:3%;top:32%}.portrait .player-right{right:3%;top:32%}.portrait .player-bottom{left:5%;bottom:25%}.portrait .opponent-hand.top{top:20%;height:14cqw}.portrait .back-card{width:7cqw;height:11cqw;margin-left:-4.5cqw}.portrait .back-card span{font-size:2cqw}.portrait .opponent-hand.left{left:17%;top:43%;height:11cqw}.portrait .opponent-hand.right{right:17%;top:43%;height:11cqw}.portrait .table-center{top:45%;gap:8cqw}.portrait .draw-pile{width:14cqw;height:21cqw}.portrait .draw-pile .back-card{margin:0}.portrait .draw-pile .back-card span{font-size:5cqw}.portrait .draw-caption{bottom:-5cqw;font-size:1.6em}.portrait .discard-pile{width:15cqw;height:22.5cqw}.portrait .card-face{border-radius:1.4cqw}.portrait .card-face .card-value{font-size:9cqw}.portrait .card-face[data-special=true] .card-value{font-size:6cqw}.portrait .card-face .card-corner{font-size:2.5cqw}.portrait .card-face.has-skin .card-corner{font-size:2cqw}.portrait .current-color{top:60%;font-size:1.5em}.portrait .hand-zone{left:3%;right:3%;bottom:2%;height:30cqw}.portrait .hand-scroll{padding-top:6cqw}.portrait .card-button{width:calc(16cqw * var(--card-scale));height:calc(24cqw * var(--card-scale));margin-left:calc(-10cqw * var(--card-scale) * var(--overlap)/.62)}.portrait .card-button:first-child{margin-left:0}.portrait .uno-button{bottom:26%;right:5%;font-size:2.3em}.portrait .table-turn-message{top:68%;font-size:1.6em}.portrait .turn-arrows{top:45%;width:65cqw;height:50cqw}.portrait .table-notification{inset:34% 8% auto;padding:5cqw}.portrait .table-notification h3{font-size:4cqw}.portrait .table-notification p,.portrait .table-notification .btn{font-size:3cqw}.portrait .hand-helper{font-size:1.2em;bottom:1%}.portrait .hand-count-bubble{font-size:7px}.portrait .table-brand{font-size:2em}.portrait .seat-badge{font-size:.7em}.portrait .table-mode{font-size:1.4em}.portrait .game-gear{font-size:2em}@keyframes spin{to{transform:rotate(360deg)}}@media(min-width:1550px){.studio-layout{grid-template-columns:minmax(0,1fr) 286px}.stage-area{min-height:570px;padding:55px 34px}.device-frame{max-width:1100px}.page-heading{margin-bottom:26px}.main-page{padding-top:32px}.panel-body{padding:17px}.field label{font-size:10px}.field select,.field input[type=text]{font-size:11px}.seat-row{font-size:11px}.seat-row select{font-size:9px}}@media(max-width:1200px){.app-shell{grid-template-columns:158px minmax(0,1fr)}.sidebar{width:158px;padding-left:10px;padding-right:10px}.brand{font-size:25px;margin-left:10px}.nav-item{font-size:10px;padding:11px 12px;gap:9px}.workspace-label{margin-left:11px}.main-page{padding:23px 19px}.topbar{padding:0 19px}.studio-layout{grid-template-columns:minmax(0,1fr) 231px;gap:13px}.stage-area{min-height:420px;padding:36px 18px}.toolbar-select{max-width:125px;font-size:9px}.stage-toolbar{padding:9px 10px}.segment{padding:5px 6px;font-size:8px}.inspector .panel-body{padding:12px}.page-heading h1{font-size:22px}.bottom-panels{gap:12px}.sidebar-bottom{padding-left:10px;padding-right:10px}}@media(max-width:1020px){.app-shell{grid-template-columns:67px minmax(0,1fr)}.sidebar{width:67px;padding:23px 8px}.brand{font-size:20px;margin-left:4px;gap:0}.brand-mark{display:none}.brand small,.workspace-label,.nav-item span,.nav-count,.sidebar-bottom{display:none}.nav{margin-top:35px;gap:9px}.nav-item{padding:12px;justify-content:center;border-radius:9px}.nav-item svg{width:19px;height:19px}.studio-layout{grid-template-columns:minmax(0,1fr) 228px}.main-page{padding:23px 16px}.topbar{padding:0 17px}.stage-area{min-height:405px;padding:38px 14px}.stage-toolbar .toolbar-divider,.stage-toolbar .segment span{display:none}.stage-controls{padding:10px}.playback-controls .btn{font-size:8px;padding:7px}.simulation-status{font-size:8px;gap:5px}.timeline-label{font-size:8px}.metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:800px){.studio-layout{grid-template-columns:1fr}.inspector{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}.stage-area{min-height:380px;padding:39px 22px 28px}.inspector>.panel-card:last-child{grid-column:1/-1}.seat-list{grid-template-columns:repeat(2,minmax(0,1fr))}.top-actions .save-state{display:none}.page-heading{align-items:center}.grid-3{grid-template-columns:1fr 1fr}.audit-grid{grid-template-columns:1fr}.asset-card-preview{height:280px}.game-canvas{font-size:clamp(7px,1.4cqw,10px)}}@media(max-width:560px){.app-shell{display:block;padding-bottom:61px}.sidebar{inset:auto 0 0;width:100%;height:61px;padding:7px 12px;background:#203324eb;backdrop-filter:blur(9px);border-top:1px solid #4f674134}.sidebar .brand{display:none}.nav{display:flex;justify-content:space-around;gap:2px;margin:0}.nav-item{padding:9px 12px;width:auto;flex-direction:column;gap:4px}.nav-item svg{width:17px;height:17px}.nav-item span{display:block;font-size:7px}.nav-item .nav-count{display:none}.topbar{height:56px;padding:0 14px}.crumb{font-size:9px;gap:6px}.top-actions{gap:5px}.top-actions .btn{padding:7px 9px;font-size:9px}.top-actions .btn svg{display:none}.main-page{padding:20px 13px}.page-heading{margin-bottom:17px;gap:7px}.page-heading h1{font-size:21px}.page-description{font-size:9px}.eyebrow{font-size:8px}.live-chip{font-size:7px;padding:5px 7px}.stage-area{min-height:270px;padding:34px 12px 22px}.stage-toolbar{flex-wrap:wrap;padding:8px}.toolbar-group{gap:5px}.toolbar-select{max-width:137px;font-size:9px}.segment{font-size:8px;padding:5px 6px}.zoom-label{font-size:9px;min-width:27px}.stage-caption{font-size:7px;margin-top:16px;gap:4px}.stage-controls{padding:9px 8px}.playback-controls{gap:3px}.playback-controls .btn{font-size:8px;padding:6px 7px;gap:4px}.playback-controls .btn svg{width:11px;height:11px}.simulation-status .dot-sep,.simulation-status .revision-label{display:none}.inspector{gap:10px;grid-template-columns:1fr}.inspector>.panel-card:last-child{grid-column:auto}.inspector .panel-title{padding:13px 14px}.inspector .panel-body{padding:14px}.seat-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.field-row{gap:14px}.bottom-panels{grid-template-columns:1fr;gap:10px;margin-top:11px}.scenario-list{padding:12px;gap:5px}.scenario-pill{font-size:8px}.footer-bar{font-size:7px;align-items:flex-start}.footer-build{display:none}.grid-2,.grid-3{grid-template-columns:1fr}.metrics{gap:8px}.metric{padding:12px}.metric strong{font-size:19px}.metric span{font-size:8px}.content-card{padding:17px}.asset-card-preview{height:300px}.approval-header{align-items:flex-start}.comparison-controls{gap:8px}.comparison-stage{min-height:200px}.device-frame{border-width:5px;border-radius:17px}.game-canvas{font-size:clamp(4px,1.4cqw,8px)}.hand-count-bubble{min-width:14px;font-size:6px;padding:1px 3px}.table-notification .btn{font-size:1.5cqw}.table-notification h3{font-size:2.7cqw}.table-notification p{font-size:1.8cqw}.device-frame.portrait{width:270px}.device-frame.portrait .game-canvas{font-size:6px}.viewer-shell{padding:10px}.viewer-top{font-size:9px}.viewer-shell .device-frame{border-width:4px}.viewer-controls .btn{font-size:9px}.player-sub{font-size:.8em}}

.catch-button{position:absolute;right:3%;bottom:27%;z-index:20;background:#e7b46c;color:#4d3e20;border-radius:9px;font-size:.85em;font-weight:750;padding:.5em .8em;box-shadow:0 3px 0 #9a6e36}.draw-penalty{position:absolute;left:50%;top:25%;transform:translateX(-50%);background:#193d2dea;border:1px solid #a8c2865e;border-radius:8px;padding:.6em 1em;z-index:25;display:flex;gap:.7em;align-items:center;font-size:.9em;white-space:nowrap}.draw-penalty button{font-size:inherit;border-radius:4px;background:#c9e79b;color:#486030;padding:.3em .7em}.draw-penalty small{font-size:.7em;color:#a4be93}.portrait .catch-button{font-size:1.7em;bottom:35%}.portrait .draw-penalty{top:27%;font-size:1.4em;white-space:normal;width:70%;flex-wrap:wrap;justify-content:center}

/* The inner viewport owns the exact logical ratio; shell borders are outside it. */
.device-frame,.device-frame.portrait,.device-frame.tablet{aspect-ratio:auto}.game-canvas{height:auto;aspect-ratio:844/390}.portrait .game-canvas{aspect-ratio:390/844}.tablet .game-canvas{aspect-ratio:1024/768}

.asset-viewer-backdrop{padding:20px;background:#0b1719c9;backdrop-filter:blur(6px)}.asset-viewer-modal{width:min(1100px,96vw);height:min(880px,92vh);height:min(880px,92dvh);background:#101725;border:1px solid #3b4e50;border-radius:14px;box-shadow:0 25px 100px #0005;display:flex;flex-direction:column;overflow:hidden}.asset-viewer-header{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:16px 19px;background:#19232c;color:#e7f0df;flex:0 0 auto;border-bottom:1px solid #35423f}.asset-viewer-header .eyebrow{font-size:8px;color:#839e8c;margin-bottom:5px}.asset-viewer-header h2{font-size:15px;margin:0;font-weight:650;color:#e8f3e0}.asset-viewer-actions{display:flex;gap:9px;align-items:center}.asset-viewer-actions .btn{background:#26372f;border-color:#415142;color:#d1dfc5;font-size:10px}.asset-viewer-actions .icon-btn{background:#23332b;border-color:#3b4b3d;color:#c4d3b9}.asset-viewer-frame-wrap{flex:1;min-height:0;position:relative}.asset-viewer-frame-wrap iframe{width:100%;height:100%;border:0;display:block;background:#101725}.asset-viewer-status{padding:10px 18px;background:#19252b;border-top:1px solid #35423f;color:#96b59d;font-size:10px;line-height:1.6;display:flex;align-items:flex-start;gap:8px;flex:0 0 auto}.asset-viewer-status svg{width:13px;height:13px;margin-top:1px}.asset-viewer-status.renderer-warning{color:#dbbe87;background:#2a2925}@media(max-width:700px){.asset-viewer-backdrop{padding:6px}.asset-viewer-modal{width:100%;height:98vh;height:98dvh;border-radius:10px}.asset-viewer-header{padding:11px 12px;gap:8px}.asset-viewer-header h2{font-size:12px}.asset-viewer-header .eyebrow{font-size:7px;letter-spacing:.8px}.asset-viewer-actions .btn{font-size:8px;padding:7px}.asset-viewer-actions .btn svg{width:11px;height:11px}.asset-viewer-actions{gap:5px}.asset-viewer-status{padding:8px 11px;font-size:9px}}

/* A device-screen is a uniformly fitted window into a fixed logical canvas.
   Every card, font, spacing and hit target is laid out before the scale transform. */
.device-screen{position:relative;width:100%;overflow:hidden;isolation:isolate;flex:none}.device-screen>.game-canvas{position:absolute;left:0;top:0;container-type:inline-size;transform-origin:0 0;aspect-ratio:auto!important;max-width:none;max-height:none}.device-screen>.comparison-overlay{z-index:60;object-fit:contain}