:root{color-scheme:dark;--bg: #101820;--surface: #1a2530;--surface-2: #223041;--text: #f0f0f5;--text-dim: #9aa5b1;--accent: #60a5fa;--error: #ff6a6a;--positive: #6ee79a;--border: #2a3a4d;--shadow: rgba(0, 0, 0, .4);--scrim: rgba(0, 0, 0, .55);--felt-tint: rgba(50, 90, 130, .12);--slot-empty-border: rgba(255, 255, 255, .22);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:14px}.theme-toggle{padding:4px 8px!important;font-size:14px!important;line-height:1;background:transparent!important;border:1px solid var(--border)!important}.theme-toggle:hover{background:var(--surface-2)!important}.landing-theme-toggle{position:fixed;top:16px;right:16px;z-index:10}:root[data-theme=light]{color-scheme:light;--bg: #f3f5f8;--surface: #ffffff;--surface-2: #eef1f5;--text: #101418;--text-dim: #596577;--accent: #2563eb;--error: #d1384b;--positive: #1f9d5a;--border: #d2d7de;--shadow: rgba(20, 30, 50, .12);--scrim: rgba(20, 30, 50, .35);--felt-tint: rgba(80, 140, 200, .1);--slot-empty-border: rgba(20, 30, 50, .45)}*{box-sizing:border-box}html,body,#root{margin:0;padding:0;height:100%;background:var(--bg);color:var(--text)}body{background-image:radial-gradient(1200px 800px at 50% 40%,var(--felt-tint),transparent 70%),linear-gradient(var(--bg),var(--bg))}button{background:var(--surface-2);color:var(--text);border:1px solid var(--border);padding:8px 14px;border-radius:8px;font-size:14px;cursor:pointer;transition:background .12s ease-out,transform .12s ease-out}button:hover:not(:disabled){background:#2b3d52}button:active:not(:disabled){transform:translateY(1px)}button:disabled{opacity:.5;cursor:not-allowed}button.primary{background:var(--accent);color:#06121f;border-color:transparent;font-weight:600}button.primary:hover:not(:disabled){background:#79b4fa}input[type=text],input[type=number]{background:var(--surface);color:var(--text);border:1px solid var(--border);padding:8px 12px;border-radius:8px;font-size:14px;outline:none;width:100%}input:focus{border-color:var(--accent)}label{color:var(--text-dim);font-size:12px;display:block;margin-bottom:4px}.app{height:100%;display:flex;flex-direction:column}.landing-shell{flex:1;display:flex;flex-direction:column;min-height:0;padding:24px 24px 32px;max-width:1200px;width:100%;margin:0 auto;overflow-y:auto}.landing-header{margin-bottom:18px;text-align:center}.landing-header h1{margin:0 0 4px;font-size:26px;letter-spacing:.2px}.landing-header .subtitle{color:var(--text-dim);margin:0 0 10px;font-size:13px}.landing-stats{display:inline-flex;flex-wrap:wrap;justify-content:center;gap:6px;align-items:center;font-size:13px;color:var(--text-dim);background:var(--surface-2);border:1px solid var(--border);border-radius:999px;padding:6px 14px}.landing-stats strong{color:var(--text);font-weight:600}.landing-stats .dot-sep{opacity:.4}.landing-stats .muted{color:var(--text-dim)}.landing-body{display:grid;grid-template-columns:minmax(0,460px) minmax(0,1fr);gap:20px;align-items:start}@media (max-width: 880px){.landing-body{grid-template-columns:1fr}}.landing-card{width:100%;background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:24px;box-shadow:0 10px 40px #00000059}.landing-card .row{display:flex;gap:10px;align-items:flex-end}.landing-card .row>div{flex:1}.landing-card .error{color:var(--error);margin-top:10px;font-size:13px;min-height:18px}.landing-card .divider{height:1px;background:var(--border);margin:16px 0}.landing-section-head{font-size:12px;text-transform:uppercase;letter-spacing:.6px;color:var(--text-dim);margin-bottom:8px}.landing-card details{border:1px solid var(--border);border-radius:8px;padding:8px 12px;margin-top:14px;background:var(--surface-2)}.landing-card details summary{cursor:pointer;color:var(--text-dim);font-size:12px;-webkit-user-select:none;user-select:none}.landing-card .create-opts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}.visibility-row{margin-top:10px}.visibility-toggle{display:inline-flex;border:1px solid var(--border);border-radius:8px;overflow:hidden;background:var(--bg)}.visibility-toggle button{flex:1;padding:6px 12px;font-size:12px;border:none;border-radius:0;background:transparent;color:var(--text-dim)}.visibility-toggle button+button{border-left:1px solid var(--border)}.visibility-toggle button.on{background:var(--accent);color:#06121f;font-weight:600}.visibility-toggle button:disabled{opacity:.4;cursor:not-allowed}.visibility-row .hint,.field .hint{font-size:11px;color:var(--text-dim);margin-top:6px}.muted{color:var(--text-dim);font-size:11px}.rooms-pane{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:16px;box-shadow:0 10px 40px #00000059;display:flex;flex-direction:column;min-height:320px;max-height:calc(100vh - 220px)}.rooms-pane-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:10px}.rooms-pane-title{font-size:15px;font-weight:600}.rooms-pane-count{font-size:12px;color:var(--text-dim)}.rooms-search{width:100%;margin-bottom:10px;background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:8px;padding:8px 12px;font-size:13px;outline:none}.rooms-search:focus{border-color:var(--accent)}.rooms-list{display:flex;flex-direction:column;gap:6px;overflow-y:auto;min-height:0;padding-right:2px}.rooms-empty{text-align:center;color:var(--text-dim);font-size:13px;padding:24px 12px}.room-item{display:flex;flex-direction:column;align-items:stretch;gap:4px;padding:10px 12px;background:var(--surface-2);border:1px solid var(--border);border-radius:8px;cursor:pointer;text-align:left;font-size:13px;color:var(--text);transition:border-color .12s ease,transform .12s ease}.room-item:hover:not(:disabled){border-color:var(--accent);transform:translateY(-1px)}.room-item:disabled{opacity:.55;cursor:not-allowed}.room-item.full{opacity:.7}.room-item-line1{display:flex;justify-content:space-between;gap:8px;align-items:center}.room-item-name{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.room-item-icons{display:inline-flex;gap:4px;flex-shrink:0}.room-icon{font-size:13px}.room-item-line2{display:flex;gap:10px;align-items:center;font-size:12px;color:var(--text-dim)}.room-item-code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--bg);padding:1px 6px;border-radius:4px;letter-spacing:1px;color:var(--text);font-size:11px}.room-item-cap.full{color:var(--error);font-weight:600}.room-item-spec{color:var(--text-dim)}.prejoin{flex:1;display:grid;place-items:center;padding:24px}.prejoin-card{position:relative;width:100%;max-width:480px;background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:28px;box-shadow:0 10px 40px #00000059}.prejoin-card h2{margin:0 0 16px;font-size:18px;letter-spacing:.3px}.prejoin-back{position:absolute;top:12px;left:12px;background:transparent;border:none;color:var(--text-dim);cursor:pointer;font-size:12px;padding:4px 8px;border-radius:6px}.prejoin-back:hover{background:var(--surface-2);color:var(--text)}.prejoin-info{color:var(--text-dim);font-size:13px;padding:12px 0}.prejoin-error{color:var(--error);font-size:13px;padding:8px 10px;background:#ff787814;border:1px solid rgba(255,120,120,.25);border-radius:6px;margin:10px 0}.prejoin-summary{background:var(--surface-2);border:1px solid var(--border);border-radius:8px;padding:10px 12px;margin-bottom:14px}.prejoin-row{display:flex;justify-content:space-between;gap:12px;padding:4px 0;font-size:13px}.prejoin-row .k{color:var(--text-dim)}.prejoin-row .v{color:var(--text)}.prejoin-row .v .full{color:var(--error)}.prejoin-people{margin-bottom:14px}.prejoin-people-head{color:var(--text-dim);font-size:12px;margin-bottom:6px}.prejoin-people-list{display:flex;flex-wrap:wrap;gap:6px}.prejoin-chip{display:inline-flex;align-items:center;gap:6px;padding:3px 8px;border-radius:999px;border:1px solid var(--border);background:var(--bg);font-size:12px;color:var(--text)}.prejoin-chip.reconnecting em{color:var(--text-dim)}.prejoin-chip.offline{opacity:.55}.prejoin-chip .dot{width:8px;height:8px;border-radius:50%}.prejoin-field{margin:12px 0}.prejoin-field>label{display:block;color:var(--text-dim);font-size:12px;margin-bottom:4px}.prejoin-field input[type=text]{width:100%}.prejoin-role-opts{display:grid;grid-template-columns:1fr 1fr;gap:8px}.prejoin-role{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border:1px solid var(--border);border-radius:8px;background:var(--bg);cursor:pointer;transition:border-color .12s ease}.prejoin-role:hover:not(.disabled){border-color:var(--accent);background:var(--surface-2)}.prejoin-role.on{border-color:var(--accent);background:var(--surface-2)}.prejoin-role.disabled{opacity:.45;cursor:not-allowed}.prejoin-role>div{display:flex;flex-direction:column;gap:2px}.prejoin-role strong{font-size:13px;color:var(--text)}.prejoin-role .hint{font-size:11px;color:var(--text-dim)}.prejoin-role input{accent-color:var(--accent);margin-top:2px}.role-toggle{font-size:12px;padding:4px 10px;border-radius:6px;border:1px solid var(--border);background:var(--bg);color:var(--text);cursor:pointer}.role-toggle:hover:not(:disabled){border-color:var(--accent);background:var(--surface-2)}.role-toggle.spectator{border-color:#a0c0ff66;color:#b6d0ff}.role-toggle:disabled{opacity:.45;cursor:not-allowed}.topbar{height:40px;flex:0 0 40px;background:var(--surface);border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 12px;gap:12px;font-size:13px;z-index:5;position:relative}.topbar .room-id{font-weight:600;letter-spacing:.3px;color:var(--text);cursor:pointer}.topbar .room-id:hover{color:var(--accent)}.topbar .spacer{flex:1}.topbar .players{display:flex;gap:6px;align-items:center}.topbar .player-chip{display:inline-flex;align-items:center;gap:6px;background:var(--surface-2);padding:2px 8px;border-radius:999px;font-size:12px;border:1px solid var(--border)}.topbar .player-chip .dot{width:8px;height:8px;border-radius:50%;background:var(--positive)}.topbar .player-chip.reconnecting .dot{background:#facc15}.topbar .player-chip.offline .dot{background:var(--text-dim)}.net-bars{display:inline-flex;align-items:flex-end;gap:1.5px;margin-left:4px;height:11px}.net-bars .bar{width:2.5px;background:var(--text-dim);opacity:.35;border-radius:1px}.net-bars .bar-1{height:3px}.net-bars .bar-2{height:5px}.net-bars .bar-3{height:8px}.net-bars .bar-4{height:11px}.net-bars.great .bar.on,.net-bars.good .bar.on{background:#2ecc71;opacity:1}.net-bars.meh .bar.on{background:#f59e0b;opacity:1}.net-bars.bad .bar.on{background:#ef4444;opacity:1}.player-chip .ping-self{display:inline-flex;align-items:center;gap:4px;margin-left:2px;font-variant-numeric:tabular-nums;color:var(--text-dim);font-size:11px}.topbar button{padding:4px 10px;font-size:12px}.topbar .host-pill{background:linear-gradient(180deg,#f7c63d,#e2a400);color:#201600;font-weight:700}.stage{position:relative;flex:1;min-height:0;overflow:hidden}.playground-wrap{position:absolute;top:0;right:0;bottom:0;left:0;display:flex}.playground-wrap.spectator .playground,.playground-wrap.spectator .slot,.playground-wrap.spectator .free-card,.playground-wrap.spectator .deckview-card{cursor:default}.playground-wrap:has(.drag-active),.playground-wrap:has(.drag-active) *{user-select:none;-webkit-user-select:none}.toolrail{width:56px;flex:0 0 56px;background:var(--surface);border-right:1px solid var(--border);display:flex;flex-direction:column;align-items:stretch;padding:8px 4px;gap:6px;z-index:2}.toolrail .tool-btn{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 2px;font-size:10px;letter-spacing:.3px;background:var(--surface-2);border:1px solid var(--border);border-radius:10px;cursor:pointer;color:var(--text-dim)}.toolrail .tool-btn:hover{color:var(--text)}.toolrail .tool-btn.active{background:var(--accent);color:#06121f;border-color:transparent}.toolrail .tool-btn .ico{font-size:18px}.toolrail-sep{height:1px;background:var(--border);margin:4px 0}.toolrail-hint{font-size:10px;color:var(--text-dim);text-align:center;line-height:1.2;padding:4px}.playground{position:relative;flex:1;overflow:hidden;background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.03),transparent 60%),radial-gradient(circle at 70% 70%,rgba(255,255,255,.02),transparent 60%)}.playground.placing{cursor:crosshair}.playground.target-pick{cursor:copy}.mode-banner{position:absolute;top:12px;left:50%;transform:translate(-50%);background:var(--accent);color:#06121f;padding:6px 14px;border-radius:999px;font-size:12px;font-weight:600;box-shadow:0 4px 14px #0000004d;z-index:5;pointer-events:none}.mode-banner.target{background:var(--positive)}.slot{position:absolute;display:flex;flex-direction:column;align-items:center;gap:4px;padding:6px;border-radius:10px;border:1.5px dashed transparent;-webkit-user-select:none;user-select:none;touch-action:none;cursor:grab;isolation:isolate;transition:transform .12s ease-out,border-color .12s ease-out,box-shadow .12s ease-out,left .16s cubic-bezier(.2,.6,.2,1),top .16s cubic-bezier(.2,.6,.2,1)}.slot .access-ring{position:absolute;top:-4px;right:-4px;bottom:-4px;left:-4px;border-radius:13px;padding:3px;pointer-events:none;z-index:0;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:.9}.slot.is-restricted{border-color:transparent}.slot.dragging{transition:none}.slot:hover{border-color:#ffffff26}.slot.operable.dragging{cursor:grabbing;z-index:10}.slot.read-only{cursor:default;opacity:.95}.slot.empty{border-color:var(--slot-empty-border);min-width:90px;min-height:125px}.slot.selected{border-color:var(--accent)}.slot.targetable{border-color:var(--positive);box-shadow:0 0 0 2px #6ee79a26;animation:pulse 1.2s ease-in-out infinite}.slot.untargetable{opacity:.45;cursor:not-allowed}@keyframes pulse{0%,to{box-shadow:0 0 0 2px #6ee79a1a}50%{box-shadow:0 0 0 4px #6ee79a47}}.slot-card-stack{position:relative;min-height:125px}.slot-empty{display:grid;place-items:center;width:90px;height:125px;color:var(--text-dim);font-size:11px;letter-spacing:.5px;text-transform:uppercase}.card-img{display:block;border-radius:6px;box-shadow:0 2px 6px #00000059;background:#fff}.stack-depth{position:absolute;right:-6px;bottom:-6px;min-width:22px;height:22px;padding:0 6px;background:var(--surface);border:1px solid var(--border);border-radius:999px;display:grid;place-items:center;font-size:11px;font-weight:600;color:var(--text)}.slot-label{font-size:11px;color:var(--text-dim);text-align:center;max-width:120px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.slot-label .lock{margin-left:4px}.context-menu{position:fixed;background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:4px;min-width:220px;box-shadow:0 12px 32px #00000080;z-index:200;display:flex;flex-direction:column;cursor:default}.context-menu .menu-item{text-align:left;background:transparent;border:none;padding:7px 10px;font-size:13px;color:var(--text);border-radius:6px;cursor:pointer}.context-menu .menu-item:hover:not(:disabled){background:var(--surface-2)}.context-menu .menu-item:disabled{opacity:.4;cursor:not-allowed}.context-menu .menu-item.danger{color:var(--error)}.context-menu .menu-sep{height:1px;background:var(--border);margin:4px 8px}.slot.drop-target{border-color:var(--positive);box-shadow:0 0 0 2px #6ee79a26;animation:pulse 1.2s ease-in-out infinite}.slot.snap-target{border-color:#f0b458;box-shadow:0 0 0 3px #f0b45859,0 0 24px 6px #f0b45840;animation:snap-pulse .7s ease-in-out infinite;z-index:3}@keyframes snap-pulse{0%,to{box-shadow:0 0 0 3px #f0b45859,0 0 24px 6px #f0b45840}50%{box-shadow:0 0 0 4px #f0b4588c,0 0 34px 10px #f0b45873}}.slot.is-hand{border-style:dashed;border-color:#a99cff;box-shadow:0 0 0 1px #a99cff2e}.slot.is-hand.operable{border-color:#c3b8ff}.slot.is-hand .slot-label{color:#c3b8ff}.slot.is-hand .hand-badge{margin-right:4px;font-size:11px}.slot.is-owned:not(.is-hand) .slot-label{color:#ffd28a}.slot.pos-locked .pin-badge{margin-right:4px;font-size:11px;opacity:.85}.slot.pos-locked.operable{cursor:default}.slot.drag-source{opacity:.6}.slot.snap-return{border-color:#8ab0ff;box-shadow:0 0 0 2px #8ab0ff4d,0 0 20px 6px #8ab0ff38;animation:snap-return-pulse .9s ease-in-out infinite;z-index:3}@keyframes snap-return-pulse{0%,to{box-shadow:0 0 0 2px #8ab0ff4d,0 0 20px 6px #8ab0ff38}50%{box-shadow:0 0 0 3px #8ab0ff73,0 0 28px 8px #8ab0ff59}}.slot.no-access{border-style:dashed;border-color:#ffffff2e;background:#ffffff05}.slot.no-access .slot-card-stack{opacity:.55;filter:saturate(.6)}.slot .access-badge{position:absolute;top:-8px;right:-8px;background:var(--surface);border-radius:999px;font-size:11px;padding:2px 6px;box-shadow:0 2px 6px var(--shadow);pointer-events:none;z-index:2}.slot .access-badge.locked{color:#f0b458;border:1px solid rgba(240,180,88,.5)}.slot .access-badge.info{color:#8ab0ff;border:1px solid rgba(138,176,255,.5);opacity:.85}.slot-label .lock.subtle{opacity:.6}.free-card{position:absolute;cursor:grab;-webkit-user-select:none;user-select:none;transition:transform .14s ease-out,left .16s cubic-bezier(.2,.6,.2,1),top .16s cubic-bezier(.2,.6,.2,1),opacity .12s ease-out;will-change:transform}.free-card:active{cursor:grabbing}.deckview{position:fixed;left:56px;right:0;bottom:0;max-height:200px;background:var(--surface);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-top:1px solid var(--border);display:flex;flex-direction:column;z-index:20;box-shadow:0 -10px 28px #0006;user-select:none;-webkit-user-select:none}.deckview *{user-select:none;-webkit-user-select:none}.deckview-header{display:flex;align-items:center;height:30px;padding:0 12px;gap:12px;border-bottom:1px solid var(--border);font-size:12px;color:var(--text-dim)}.deckview-header .title{font-weight:600;color:var(--text)}.deckview-header .hint{flex:1;color:var(--text-dim)}.deckview-header .close{background:transparent;border:none;color:var(--text-dim);font-size:14px;cursor:pointer;padding:2px 6px}.deckview-body{flex:1;padding:10px 16px;overflow-x:auto;overflow-y:hidden}.deckview-body .dim{color:var(--text-dim);font-size:12px}.deckview-fan{position:relative;height:128px}.deckview-card{position:absolute;top:0;cursor:grab;transition:transform .12s ease-out;touch-action:none}.deckview-card:hover{transform:translateY(-10px) scale(1.04);z-index:100!important}.deckview-card:active{cursor:grabbing}.deckview-card.selected{transform:translateY(-18px) scale(1.04)}.deckview-card.selected:hover{transform:translateY(-22px) scale(1.06)}.deckview-card.selected .card-img{outline:2px solid var(--accent);outline-offset:2px;box-shadow:0 0 0 4px #5aa0ff38,0 8px 18px #00000073}.deckview-card.dragging{opacity:.3}.deckview-sort{display:inline-flex;align-items:center;gap:4px;margin-left:auto;font-size:11px;color:var(--text-dim)}.deckview-sort-label{margin-right:2px;letter-spacing:.04em;text-transform:uppercase;font-size:10px}.deckview-sort-btn{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;font-size:11px;background:transparent;border:1px solid var(--border);border-radius:999px;color:var(--text-dim);cursor:pointer;line-height:1.4}.deckview-sort-btn .ico{font-size:10px;font-weight:600;letter-spacing:.5px;opacity:.75}.deckview-sort-btn:hover:not(:disabled){background:var(--surface-2);color:var(--text);border-color:var(--accent)}.deckview-sort-btn.active{background:var(--accent);border-color:var(--accent);color:#06121f}.deckview-sort-btn.active .ico{opacity:1}.inspector{position:absolute;left:12px;right:12px;bottom:12px;max-width:900px;margin:0 auto;background:var(--surface);border:1px solid var(--border);border-radius:12px;box-shadow:0 10px 30px #00000080;overflow:hidden;z-index:15}.inspector-header{display:flex;align-items:center;padding:8px 12px;border-bottom:1px solid var(--border);background:var(--surface-2);font-size:13px}.inspector-header .title{flex:1;font-weight:600}.inspector-header .close{background:transparent;border:none;color:var(--text-dim);font-size:16px;cursor:pointer;padding:2px 6px}.inspector-body{padding:14px;min-height:140px;max-height:220px;overflow:auto}.inspector-body .dim{color:var(--text-dim);font-size:13px}.inspector-body .fan{position:relative;height:130px}.inspector-body .fan-card{position:absolute;top:0}.empty-hint.center-slot{pointer-events:none;color:var(--text-dim)}.empty-hint{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;color:var(--text-dim);pointer-events:none;font-size:14px;letter-spacing:.2px}.chat{position:absolute;right:12px;bottom:12px;width:460px;max-width:calc(100vw - 24px);max-height:70%;display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);border-radius:12px;overflow:hidden;box-shadow:0 6px 24px var(--shadow);transition:bottom .16s cubic-bezier(.2,.6,.2,1)}.chat.collapsed{height:36px;max-height:36px;width:260px}.stage:has(.deckview) .chat{bottom:212px}.chat-layout{display:grid;grid-template-columns:160px 1fr;min-height:260px;max-height:calc(70vh - 36px)}.chat-sidebar{border-right:1px solid var(--border);background:var(--surface-2);padding:6px 4px;overflow-y:auto;display:flex;flex-direction:column;gap:2px}.chat-main{display:flex;flex-direction:column;min-width:0}.chat-section-label{padding:8px 8px 2px;font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--text-dim);display:flex;align-items:center;justify-content:space-between}.chat-channel-row{all:unset;display:flex;align-items:center;gap:6px;padding:5px 8px;border-radius:6px;cursor:pointer;font-size:13px;color:var(--text)}.chat-channel-row:hover{background:var(--surface)}.chat-channel-row.active{background:var(--accent);color:#fff}.chat-channel-row.active .sub{color:#fffc}.chat-channel-label{display:flex;flex-direction:column;flex:1;min-width:0}.chat-channel-label .name{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chat-channel-label .sub{font-size:10px;color:var(--text-dim)}.chat-dot{width:8px;height:8px;border-radius:999px;flex-shrink:0}.chat-pill{background:var(--accent);color:#fff;font-size:10px;font-weight:700;padding:1px 6px;border-radius:999px}.chat-channel-row.active .chat-pill{background:#ffffff40}.chat-empty-hint{color:var(--text-dim);font-size:11px;padding:4px 8px}.chat-mini-btn{all:unset;padding:2px 8px;border-radius:6px;border:1px solid var(--border);background:var(--surface);color:var(--text);font-size:12px;cursor:pointer;line-height:1.4}.chat-mini-btn:hover:not(:disabled){background:var(--surface-2)}.chat-mini-btn:disabled{opacity:.5;cursor:not-allowed}.chat-mini-btn.danger{border-color:var(--error);color:var(--error)}.chat-group-bar{display:flex;align-items:center;gap:6px;padding:6px 10px;font-size:11px;color:var(--text-dim);border-bottom:1px solid var(--border);background:var(--surface-2)}.chat-group-bar .members{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chat-member-picker{display:flex;flex-wrap:wrap;gap:6px;max-height:160px;overflow-y:auto;padding:4px 0}.chat-member-chip{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;border:1px solid var(--border);background:var(--surface);font-size:12px;cursor:pointer;-webkit-user-select:none;user-select:none}.chat-member-chip input{margin:0}.chat-invitations{padding:12px;overflow-y:auto;display:flex;flex-direction:column;gap:8px}.chat-invitations h4{margin:0 0 4px;font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--text-dim)}.chat-invite-card{border:1px solid var(--border);border-radius:8px;padding:10px 12px;background:var(--surface-2);display:flex;flex-direction:column;gap:6px}.chat-invite-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px}.chat-invite-head strong{font-size:14px;color:var(--text);word-break:break-word}.chat-invite-meta{font-size:11px;color:var(--text-dim)}.chat-invite-members{font-size:12px;color:var(--text-dim);word-break:break-word}.chat-invite-actions{display:flex;gap:6px}.chat-invite-actions button{flex:1;padding:6px 10px;font-size:12px}.chat-header{display:flex;align-items:center;height:36px;padding:0 10px;background:var(--surface-2);cursor:pointer;border-bottom:1px solid var(--border);-webkit-user-select:none;user-select:none}.chat-header .title{flex:1;font-size:12px;color:var(--text-dim)}.chat-header .badge{background:var(--accent);color:#06121f;font-weight:700;font-size:11px;padding:1px 6px;border-radius:999px}.chat-body{flex:1;min-height:120px;overflow-y:auto;padding:8px 10px;font-size:13px;display:flex;flex-direction:column;gap:4px}.chat-body .row{display:flex;gap:6px;align-items:baseline}.chat-body .row .who{font-weight:600;flex-shrink:0}.chat-body .row .text{color:var(--text);word-break:break-word}.chat-input{border-top:1px solid var(--border);display:flex;padding:6px;gap:6px}.chat-input input{flex:1}.chat-input button{padding:6px 10px;font-size:12px}.toast-stack{position:absolute;left:50%;transform:translate(-50%);bottom:20px;display:flex;flex-direction:column;gap:8px;pointer-events:none}.toast{background:var(--surface);border:1px solid var(--border);padding:8px 14px;border-radius:8px;font-size:12px;color:var(--text-dim);box-shadow:0 4px 16px #0006}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--scrim);display:grid;place-items:center;z-index:100}.overlay .card{background:var(--surface);border:1px solid var(--border);padding:24px 28px;border-radius:12px;text-align:center;max-width:380px}.overlay .card h2{margin:0 0 8px;font-size:16px}.overlay .card p{margin:0;color:var(--text-dim);font-size:13px}.overlay .card .row{display:flex;gap:8px;margin-top:16px}.overlay .card .row button{flex:1}.popover{position:absolute;top:44px;background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:8px;min-width:200px;box-shadow:0 8px 28px #0006;z-index:20}.popover button{width:100%;text-align:left;margin-bottom:4px;font-size:13px}.popover button:last-child{margin-bottom:0}.free-card.selected{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px;box-shadow:0 0 0 4px #5aa0ff38,0 6px 18px #00000073}.box-select{position:fixed;border:1.5px dashed rgba(140,200,255,.9);background:#5aa0ff1f;pointer-events:none;z-index:300;border-radius:2px}.playground.box-selecting{cursor:crosshair}.action-pill{position:fixed;display:flex;align-items:center;gap:4px;padding:4px 6px 4px 10px;background:var(--surface);border:1px solid var(--border);border-radius:999px;box-shadow:0 8px 24px #00000080;z-index:600;font-size:12px;-webkit-user-select:none;user-select:none}.action-pill .count{color:var(--text-dim);font-weight:600;margin-right:4px}.action-pill button{padding:4px 10px;font-size:12px;border-radius:999px;background:var(--bg);border:1px solid var(--border);color:var(--text);cursor:pointer}.action-pill button:hover{background:var(--surface-2, rgba(255,255,255,.06))}.action-pill button.ghost{background:transparent;border:none;color:var(--text-dim);padding:4px 8px}.drag-ghost-badge{position:absolute;top:-8px;right:-10px;background:var(--accent, #5aa0ff);color:#fff;border-radius:999px;font-size:11px;font-weight:700;padding:2px 7px;box-shadow:0 2px 6px #0006}.modal-scrim{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--scrim);display:grid;place-items:center;z-index:250}.modal{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:16px 18px;min-width:320px;max-width:440px;box-shadow:0 16px 48px #0000008c;color:var(--text)}.modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;font-weight:600;font-size:14px}.modal-head .close{background:transparent;border:none;color:var(--text-dim);font-size:16px;cursor:pointer;padding:2px 6px}.modal-hint{font-size:12px;color:var(--text-dim);margin-bottom:12px}.modal-foot{margin-top:14px;display:flex;justify-content:flex-end}.modal-foot .primary{background:var(--accent, #5aa0ff);color:#fff;border:none;padding:8px 14px;border-radius:8px;font-size:13px;cursor:pointer}.confirm-scrim{background:#06090ca6;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}.confirm-dialog{min-width:340px;max-width:460px;padding:18px 20px 16px;animation:confirm-in .14s cubic-bezier(.2,.8,.2,1)}@keyframes confirm-in{0%{opacity:0;transform:translateY(4px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.confirm-dialog .confirm-head h3{margin:0 0 8px;font-size:15px;font-weight:600;color:var(--text);letter-spacing:.01em}.confirm-dialog .confirm-body{font-size:13px;line-height:1.5;color:var(--text-dim);margin-bottom:18px}.confirm-dialog .confirm-body strong{color:var(--text)}.confirm-dialog .confirm-foot{display:flex;justify-content:flex-end;gap:8px}.confirm-dialog .confirm-foot button{padding:8px 14px;border-radius:8px;font-size:13px;font-weight:500;cursor:pointer;border:1px solid var(--border);background:transparent;color:var(--text);transition:background .12s ease-out,border-color .12s ease-out}.confirm-dialog .confirm-foot button:hover{background:var(--surface-2)}.confirm-dialog .confirm-foot .primary{background:var(--accent, #5aa0ff);color:#fff;border-color:transparent}.confirm-dialog .confirm-foot .primary:hover{filter:brightness(1.08);background:var(--accent, #5aa0ff)}.confirm-dialog .confirm-foot .danger{background:var(--error, #e05c5c);color:#fff;border-color:transparent}.confirm-dialog .confirm-foot .danger:hover{filter:brightness(1.08);background:var(--error, #e05c5c)}.confirm-dialog .confirm-foot button:focus-visible{outline:2px solid var(--accent, #5aa0ff);outline-offset:2px}.filter-picker .preset-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:6px}.filter-picker .preset-btn{text-align:left;padding:10px 12px;border-radius:8px;border:1px solid var(--border);background:var(--bg);color:var(--text);font-size:13px;cursor:pointer}.filter-picker .preset-btn:hover{background:var(--surface-2, rgba(255,255,255,.06));border-color:var(--accent, #5aa0ff)}.sample-picker .sample-row{display:flex;align-items:center;gap:8px;margin-bottom:10px}.sample-picker .step{width:34px;height:34px;border-radius:8px;background:var(--bg);border:1px solid var(--border);color:var(--text);font-size:18px;cursor:pointer}.sample-picker .num{width:80px;padding:8px 10px;text-align:center;background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:8px;font-size:16px;-moz-appearance:textfield}.sample-picker .num::-webkit-outer-spin-button,.sample-picker .num::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.sample-picker .of{font-size:12px;color:var(--text-dim)}.sample-picker .quick-picks{display:flex;gap:6px;flex-wrap:wrap}.sample-picker .quick{padding:6px 12px;border-radius:999px;background:var(--bg);color:var(--text);border:1px solid var(--border);font-size:12px;cursor:pointer}.sample-picker .quick.active{background:var(--accent, #5aa0ff);border-color:var(--accent, #5aa0ff);color:#fff}@keyframes shuffle-jitter{0%{transform:translate(0) rotate(0)}20%{transform:translate(-6px) rotate(-3deg)}40%{transform:translate(5px) rotate(2deg)}60%{transform:translate(-3px) rotate(-1deg)}80%{transform:translate(2px) rotate(1deg)}to{transform:translate(0) rotate(0)}}.slot.shuffling .slot-card-stack{animation:shuffle-jitter .6s ease-out}.slot-card-stack,.free-card,.deckview-card{perspective:720px}@keyframes card-flip-in{0%{transform:rotateY(90deg);opacity:.15}60%{opacity:1}to{transform:rotateY(0);opacity:1}}.card-img{animation:card-flip-in .28s cubic-bezier(.2,.6,.2,1);backface-visibility:hidden;will-change:transform}.mute-toggle{padding:4px 10px;font-size:12px;background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:8px;cursor:pointer}.mute-toggle.muted{color:var(--text-dim)}@media (prefers-reduced-motion: reduce){.playground .slot,.playground .free-card{transition:none}.card-img,.slot.shuffling .slot-card-stack{animation:none}}.modal .field{margin-bottom:12px}.modal .field label{display:block;color:var(--text-dim);font-size:12px;margin-bottom:4px}.modal .field input[type=text],.modal .field input[type=number]{width:100%}.modal .field.check label{display:flex;align-items:center;gap:8px;color:var(--text);font-size:13px;cursor:pointer;margin-bottom:0}.modal .field.check input{width:auto}.modal .form-error{color:var(--error);font-size:12px;margin-top:4px;margin-bottom:10px}.modal .modal-foot{display:flex;gap:8px;justify-content:flex-end}.owner-picker .owner-list{display:flex;flex-direction:column;gap:4px;max-height:60vh;overflow:auto}.owner-picker .owner-opt{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:8px;border:1px solid var(--border);background:var(--bg);color:var(--text);text-align:left;cursor:pointer}.owner-picker .owner-opt:hover{background:var(--surface-2);border-color:var(--accent)}.owner-picker .owner-opt.public{border-style:dashed}.owner-picker .owner-opt.current{opacity:.6}.owner-picker .owner-opt .dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}.owner-picker .owner-opt .current-tag{margin-left:auto;color:var(--text-dim);font-size:11px}.visibility-picker{min-width:340px;max-width:420px}.visibility-picker .vis-modes{display:flex;flex-direction:column;gap:6px;margin-bottom:10px}.visibility-picker .vis-mode{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:8px;border:1px solid var(--border);background:var(--bg);color:var(--text);cursor:pointer}.visibility-picker .vis-mode:hover{background:var(--surface-2)}.visibility-picker .vis-mode.on{border-color:var(--accent);background:var(--surface-2)}.visibility-picker .vis-mode input{accent-color:var(--accent)}.visibility-picker .vis-mode .dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}.visibility-picker .vis-presets{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}.visibility-picker .vis-presets .chip{padding:4px 10px;border-radius:999px;border:1px solid var(--border);background:var(--bg);color:var(--text);font-size:12px;cursor:pointer}.visibility-picker .vis-presets .chip:hover:not(:disabled){border-color:var(--accent);background:var(--surface-2)}.visibility-picker .vis-presets .chip:disabled{opacity:.4;cursor:not-allowed}.visibility-picker .vis-players{display:flex;flex-direction:column;gap:4px;max-height:40vh;overflow:auto;padding:4px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);margin-bottom:10px}.visibility-picker .vis-player{display:flex;align-items:center;gap:10px;padding:6px 10px;border-radius:6px;cursor:pointer;color:var(--text)}.visibility-picker .vis-player:hover,.visibility-picker .vis-player.on{background:var(--surface-2)}.visibility-picker .vis-player input{accent-color:var(--accent)}.visibility-picker .vis-player .dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}.remote-cursors{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:50}.remote-cursor{position:absolute;transform:translate(-2px,-2px);transition:left 80ms linear,top 80ms linear;will-change:left,top;display:flex;align-items:flex-start;gap:2px}.remote-cursor.spectator{opacity:.45;filter:saturate(.5) brightness(1.2)}.remote-cursor.spectator .remote-cursor-arrow{filter:drop-shadow(0 0 3px rgba(255,255,255,.25))}.remote-cursor.spectator .remote-cursor-name:before{content:"👁 ";opacity:.8}.remote-cursor-arrow{filter:drop-shadow(0 1px 2px rgba(0,0,0,.4));display:block}.remote-cursor-name{margin-top:10px;padding:2px 6px;border-radius:4px;font-size:11px;font-weight:600;color:#0c0c10;white-space:nowrap;box-shadow:0 1px 2px #0006;line-height:1.2}.remote-card-ghost{position:absolute;left:-10px;top:-10px;transform:translate(-100%,-100%) rotate(-4deg);filter:drop-shadow(0 4px 10px rgba(0,0,0,.45));opacity:.92;pointer-events:none}.remote-card-ghost-badge{position:absolute;right:-6px;top:-6px;background:#f0b458;color:#1b150b;font-size:10px;font-weight:700;padding:2px 5px;border-radius:10px;box-shadow:0 1px 2px #0006}.remote-slot-ghost{position:absolute;left:0;top:0;width:88px;height:120px;transform:translate(-50%,-50%);border:2px dashed;border-radius:10px;background:#ffffff0a;box-shadow:0 0 0 2px #00000040;opacity:.85;pointer-events:none}.remote-slot-ghost-label{position:absolute;left:50%;bottom:-18px;transform:translate(-50%);font-size:11px;color:var(--text-dim);white-space:nowrap}@media (prefers-reduced-motion: reduce){.remote-cursor{transition:none}.slot.snap-target{animation:none}}.drag-hint{position:fixed;left:50%;bottom:20px;transform:translate(-50%);padding:6px 14px;border-radius:999px;font-size:12px;font-weight:500;letter-spacing:.02em;pointer-events:none;z-index:600;box-shadow:0 2px 8px #00000073;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);animation:drag-hint-in .12s ease-out}.drag-hint.snap{background:#f0b458eb;color:#1b150b;border:1px solid rgba(255,210,140,.65)}.drag-hint.free{background:#1c222ce0;color:var(--text);border:1px solid var(--border)}.drag-hint.cancel{background:#8ab0ffe6;color:#0b1220;border:1px solid rgba(180,210,255,.65)}@keyframes drag-hint-in{0%{opacity:0;transform:translate(-50%,6px)}to{opacity:1;transform:translate(-50%)}}
