.code-slots{--cs-accent: #f5f5f5;--cs-ink: #f5f5f5;--cs-slot: #27272a;--cs-digit: #18181b;--cs-danger: #ff3b30;--cs-size: 44px;--cs-height: 52px;--cs-gap: 8px;--cs-radius: 12px;--cs-font: 22px;position:relative;display:inline-block}.code-slots__row{position:relative;display:inline-flex;gap:var(--cs-gap);cursor:text;touch-action:manipulation;-webkit-tap-highlight-color:transparent;transition:opacity .2s ease}.code-slots__row[data-disabled]{opacity:.5;cursor:not-allowed}.code-slots__input{position:absolute;top:0;right:0;bottom:0;left:0;z-index:4;margin:0;padding:0;border:0;outline:0;background:transparent;color:transparent;caret-color:transparent;font-size:16px;opacity:0;cursor:inherit;-webkit-appearance:none;-moz-appearance:none;appearance:none}.code-slots__wash{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;display:grid;place-items:center;border-radius:var(--cs-radius);background:var(--cs-accent);color:var(--cs-digit);pointer-events:none}.code-slots__check{display:grid;place-items:center}.code-slots__slot{position:relative;width:var(--cs-size);height:var(--cs-height);border-radius:var(--cs-radius);overflow:hidden;background:var(--cs-slot);transition:background-color .2s ease;user-select:none;-webkit-user-select:none}.code-slots__fill{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;background:var(--cs-accent);transform-origin:center;transition:background-color .2s ease}@media (hover: hover) and (pointer: fine){.code-slots__row[data-status=idle]:not([data-disabled]):hover .code-slots__slot:not([data-active]){background:color-mix(in srgb,var(--cs-ink) 4%,var(--cs-slot))}}.code-slots__slot[data-active]{background:color-mix(in srgb,var(--cs-ink) 8%,var(--cs-slot))}.code-slots__row[data-status=error] .code-slots__slot{background:color-mix(in srgb,var(--cs-danger) 20%,var(--cs-slot))}.code-slots__row[data-status=error] .code-slots__fill{background:var(--cs-danger)}.code-slots__digit{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;display:grid;place-items:center;color:var(--cs-digit);font-family:inherit;font-size:var(--cs-font);font-weight:600;line-height:1;font-variant-numeric:tabular-nums}.code-slots__caret{position:absolute;z-index:3;top:25%;left:calc(var(--cs-size) / 2 - .75px);width:1.5px;height:50%;opacity:0;pointer-events:none}.code-slots__caret[data-show]{opacity:1}.code-slots__caret-line{display:block;width:100%;height:100%;background:var(--cs-ink);animation:code-slots-blink 1s linear infinite}@keyframes code-slots-blink{0%,49.9%{opacity:1}50%,to{opacity:0}}.code-slots__sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}@media (prefers-reduced-motion: reduce){.code-slots__digit,.code-slots__check{transform:none!important;transition:opacity .15s ease}.code-slots__caret-line{animation:none}.code-slots__wash{opacity:0;transition:opacity .2s ease}.code-slots__row[data-status=success] .code-slots__wash{opacity:1}}:root{--primary: #f7f6f2;--surface: #ffffff;--surface-raised: #eceee4;--secondary: #e4e8ac;--secondary-strong: #a9ab8a;--text: #2a2d24;--muted: #7a7d6e;--ink: #2a2d24;--on-accent: #2a2d24;--video-bg: #141612;--thumb-stripe-a: #eceee4;--thumb-stripe-b: #dfe2cf;--dashed-edge: #c5c8b4;--radius-lg: 20px;--radius-md: 12px;--radius-sm: 10px;--border: 2.5px solid var(--ink);--shadow-soft: 4px 4px 0 0 var(--ink);--shadow-hover: 6px 6px 0 0 var(--ink);--shadow-press: 2px 2px 0 0 var(--ink)}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;width:100%;overflow:hidden}body{font-family:DM Sans,system-ui,-apple-system,sans-serif;background:var(--primary);color:var(--text);-webkit-font-smoothing:antialiased}.shell{display:grid;grid-template-columns:minmax(200px,16vw) minmax(0,1fr) minmax(200px,16vw);gap:14px;height:100dvh;min-height:100vh;padding:14px;background:var(--primary)}.shell>*{min-height:0;min-width:0}.center-stack{display:grid;grid-template-rows:auto minmax(0,1fr);gap:14px;height:100%;min-height:0}.neo-surface{background:var(--primary);border:var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft)}.panel{background:var(--primary);border:var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);overflow:hidden;display:flex;flex-direction:column;min-height:0;transition:box-shadow .15s ease,transform .15s ease}.panel-left,.panel-right{height:100%}.panel-head{padding:14px 16px;font-weight:800;font-size:13px;letter-spacing:.06em;text-transform:uppercase;border-bottom:var(--border);background:var(--surface);color:var(--text)}.users-list{list-style:none;padding:10px 12px;max-height:130px;overflow-y:auto;border-bottom:var(--border);flex-shrink:0;color:var(--muted);background:var(--primary)}.users-list li{padding:6px 10px;margin-bottom:6px;font-size:13px;font-weight:500;border:2px solid transparent;border-radius:var(--radius-sm)}.users-list li:not(.is-self){background:var(--surface);border-color:var(--ink);box-shadow:2px 2px 0 0 var(--ink)}.users-list li.is-self{color:var(--secondary-strong);font-weight:800;background:var(--primary);border:var(--border);box-shadow:3px 3px 0 0 var(--secondary)}.chat-messages{flex:1;overflow-y:auto;padding:12px;font-size:13px;min-height:0;color:var(--text);display:flex;flex-direction:column;gap:10px;background:var(--primary)}.chat-empty{margin:auto;text-align:center;font-size:13px;font-weight:600;color:var(--muted);padding:24px 12px;line-height:1.5}.chat-bubble{max-width:92%;align-self:flex-start;background:var(--surface);border:var(--border);border-radius:var(--radius-md);padding:10px 12px;box-shadow:3px 3px 0 0 var(--ink)}.chat-bubble.is-self{align-self:flex-end;background:var(--surface-raised);border-color:var(--secondary-strong);box-shadow:3px 3px 0 0 var(--secondary-strong)}.chat-bubble-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:4px}.chat-bubble-head strong{color:var(--secondary-strong);font-weight:800;font-size:11px;letter-spacing:.04em;text-transform:uppercase}.chat-bubble-head time{font-size:10px;font-weight:600;color:var(--muted);flex-shrink:0}.chat-bubble-body{font-size:13px;line-height:1.5;word-break:break-word;margin:0}.chat-form{display:flex;gap:8px;align-items:flex-end;padding:12px;border-top:var(--border);background:var(--surface)}.chat-compose{flex:1;min-height:40px;max-height:120px;resize:none;border:var(--border);border-radius:var(--radius-sm);padding:10px 12px;font-size:13px;font-family:inherit;font-weight:500;line-height:1.45;background:var(--primary);color:var(--text);box-shadow:var(--shadow-soft);transition:box-shadow .12s ease}.chat-compose::placeholder{color:var(--muted)}.chat-compose:focus{outline:none;box-shadow:var(--shadow-soft),0 0 0 2px var(--secondary)}.chat-send{flex-shrink:0;padding:10px 14px}.input-bar{background:var(--surface);border:var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-hover);padding:12px 14px;display:flex;flex-wrap:wrap;gap:10px;align-items:center}.input-bar input[type=text],.input-bar input[type=url]{flex:1;min-width:160px;border:var(--border);border-radius:var(--radius-sm);padding:10px 12px;font-size:13px;font-family:inherit;font-weight:500;background:var(--primary);color:var(--text);box-shadow:var(--shadow-soft)}.input-bar input::placeholder{color:var(--muted)}.input-bar input:focus{outline:none;box-shadow:var(--shadow-soft),0 0 0 2px var(--secondary)}.btn{border:var(--border);border-radius:var(--radius-sm);padding:10px 16px;font-size:13px;font-weight:800;font-family:inherit;letter-spacing:.03em;cursor:pointer;background:var(--secondary);color:var(--on-accent);box-shadow:var(--shadow-soft);transition:transform .1s ease,box-shadow .1s ease}.btn:hover{box-shadow:var(--shadow-hover);transform:translate(-1px,-1px)}.btn:active{transform:translate(2px,2px);box-shadow:var(--shadow-press)}.btn-secondary{background:var(--primary);color:var(--text)}.btn-secondary:hover{border-color:var(--ink);box-shadow:var(--shadow-hover)}.btn-secondary:active{transform:translate(2px,2px);box-shadow:var(--shadow-press)}.player-panel{flex:1;display:flex;flex-direction:column;min-height:0;background:var(--primary)}.share-row{display:flex;justify-content:flex-end;padding:6px 8px;border-bottom:var(--border);background:var(--surface)}.share-row-toolbar{justify-content:space-between;align-items:center;gap:8px}.share-row-left{display:flex;align-items:center;gap:8px;min-width:0;flex:1}.btn-icon-tool{flex-shrink:0;width:34px;height:34px;border:2px solid var(--ink);border-radius:8px;background:var(--primary);font-size:16px;line-height:1;cursor:pointer;box-shadow:2px 2px 0 0 var(--ink)}.btn-icon-tool.active{background:var(--secondary);box-shadow:2px 2px 0 0 var(--secondary-strong)}.btn-icon-tool:disabled{opacity:.45;cursor:not-allowed;transform:none}.shell.theater-mode{grid-template-columns:0 minmax(0,1fr) 0}.shell.theater-mode .panel-left,.shell.theater-mode .panel-right{overflow:hidden;visibility:hidden;pointer-events:none;opacity:0;width:0;min-width:0;padding:0;border:none}.theater-exit-pill{position:fixed;top:14px;left:14px;z-index:150;border:var(--border);border-radius:999px;padding:8px 14px;font-size:12px;font-weight:800;font-family:inherit;cursor:pointer;background:var(--surface);box-shadow:var(--shadow-soft)}.settings-range-field{display:flex;flex-direction:column;gap:8px;font-size:13px;font-weight:700}.settings-range-field input[type=range]{width:100%;accent-color:var(--secondary-strong)}.reduce-motion .panel,.reduce-motion .btn,.reduce-motion .library-card,.reduce-motion .palette-swatch-core,.reduce-motion .btn-icon-copy,.reduce-motion .btn-icon-tool{transition:none!important}.reduce-motion .btn:hover,.reduce-motion .library-card:hover,.reduce-motion .btn-icon-copy:hover,.reduce-motion .palette-swatch:hover .palette-swatch-core{transform:none}.reduce-motion .panel,.reduce-motion .btn,.reduce-motion .library-card,.reduce-motion .nickname-card,.reduce-motion .settings-dialog,.reduce-motion .btn:hover,.reduce-motion .library-card:hover{box-shadow:2px 2px 0 0 var(--ink)!important}.btn-icon-copy{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;padding:0;border:2px solid var(--ink);border-radius:8px;background:var(--primary);color:var(--text);box-shadow:2px 2px 0 0 var(--ink);cursor:pointer;transition:transform .1s ease,box-shadow .1s ease,color .12s ease}.btn-icon-copy:hover{transform:translate(-1px,-1px);box-shadow:3px 3px 0 0 var(--ink);color:var(--secondary-strong)}.btn-icon-copy:active{transform:translate(1px,1px);box-shadow:1px 1px 0 0 var(--ink)}.btn-icon-copy.is-copied{color:var(--secondary-strong);border-color:var(--secondary-strong);box-shadow:2px 2px 0 0 var(--secondary-strong)}.btn-icon-copy.is-offline{opacity:.45;pointer-events:none}.notice-local{color:var(--secondary-strong);font-size:12px;font-weight:700;padding:4px 14px 10px;background:var(--primary)}.video-wrap{flex:1;display:flex;flex-direction:column;align-items:stretch;background:var(--primary);min-height:0;padding:10px 12px 12px}.video-stage{display:flex;flex-direction:column;flex:1;min-height:0;height:100%;gap:10px}.video-stage:fullscreen{width:100vw;height:100vh;max-height:100vh;padding:12px;gap:12px;background:var(--primary);box-sizing:border-box}.video-stage:fullscreen .video-viewport{flex:1;min-height:0;border-radius:var(--radius-md)}.video-stage:fullscreen .video-viewport video{max-height:none;height:100%}.ctrl-fullscreen{flex-shrink:0}.video-viewport{position:relative;flex:1 1 auto;min-height:0;width:100%;display:flex;align-items:center;justify-content:center;background:var(--video-bg);border-radius:var(--radius-md);border:var(--border);box-shadow:6px 6px 0 0 var(--ink);overflow:hidden}.video-viewport video{width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;display:block;cursor:pointer;image-rendering:auto}.play-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;pointer-events:none;background:#121212b8}.play-overlay-btn{pointer-events:auto;font-size:15px;padding:14px 28px}.play-overlay-btn:disabled{opacity:.55;cursor:not-allowed;transform:none;box-shadow:var(--shadow-soft)}.play-overlay-hint{pointer-events:none;font-size:12px;font-weight:600;color:var(--muted)}.buffer-sync-overlay{position:absolute;top:14px;left:50%;transform:translate(-50%);z-index:4;max-width:min(92%,420px);padding:10px 14px;text-align:center;pointer-events:none;background:#0c0e0ae0;border:1.5px solid rgba(255,255,255,.28);border-radius:10px}.buffer-sync-title{font-size:12px;font-weight:800;color:#f7f6f2;letter-spacing:.02em}.buffer-sync-hint{margin-top:4px;font-size:11px;font-weight:600;color:#ffffffb8}.video-viewport .player-controls{position:absolute;left:0;right:0;bottom:0;z-index:5;display:flex;flex-direction:column;gap:10px;padding:28px 14px 12px;background:linear-gradient(180deg,#0c0e0a00,#0c0e0ab8 42%,#0c0e0af0);border:none;border-radius:0;box-shadow:none;pointer-events:auto;opacity:1;transform:translateY(0);transition:opacity .32s ease,transform .32s ease}.video-stage.player-chrome-hidden,.video-stage.player-chrome-hidden .video-viewport,.video-stage.player-chrome-hidden .video-viewport video{cursor:none}.video-stage.player-chrome-hidden .player-controls,.video-stage.player-chrome-hidden .viewport-fs{opacity:0;pointer-events:none;transform:translateY(10px)}.video-stage.player-chrome-hidden .viewport-fs{transform:translateY(-6px)}.reduce-motion .video-viewport .player-controls,.reduce-motion .video-stage.player-chrome-hidden .viewport-fs{transition:none}.video-viewport .player-time{color:#ffffffc7}.video-viewport .player-sync-btn,.video-viewport .player-icon-btn{border-color:#ffffff59;box-shadow:2px 2px #00000073}.player-controls{display:flex;flex-direction:column;gap:10px;flex-shrink:0}.player-seek{display:flex;align-items:center;gap:10px;width:100%}.player-seek-fixed{display:block;width:100%}.seek-track-wrap{position:relative;width:100%;padding-top:2px}.seek-time-row{display:flex;align-items:center;justify-content:space-between;width:100%;margin-bottom:6px;pointer-events:none}.seek-time-fixed{min-width:44px;font-size:11px;font-weight:800;font-variant-numeric:tabular-nums}.seek-time-end{text-align:right}.seek-hover-time{position:absolute;bottom:24px;transform:translate(-50%);padding:3px 9px;font-size:12px;font-weight:800;font-variant-numeric:tabular-nums;color:#f7f6f2;background:#0c0e0aeb;border:1.5px solid rgba(255,255,255,.35);border-radius:6px;white-space:nowrap;pointer-events:none;z-index:6}.seek-track-wrap .seek-slider{width:100%;display:block}.player-time{font-size:11px;font-weight:800;font-variant-numeric:tabular-nums;color:var(--muted);min-width:40px;flex-shrink:0}.player-seek .player-time:last-child{text-align:right}.player-bar{display:flex;align-items:center;gap:10px;width:100%}.player-bar-group{display:flex;align-items:center;gap:8px;flex:1;min-width:0;max-width:200px}.player-icon-btn{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;padding:0;border:2px solid var(--ink);border-radius:10px;background:var(--surface);color:var(--text);box-shadow:2px 2px 0 0 var(--ink);cursor:pointer;transition:transform .1s ease,box-shadow .1s ease,background .1s ease}.player-icon-btn:hover:not(:disabled){transform:translate(-1px,-1px);box-shadow:3px 3px 0 0 var(--ink);background:var(--surface-raised)}.player-icon-btn:active:not(:disabled){transform:translate(1px,1px);box-shadow:1px 1px 0 0 var(--ink)}.player-icon-btn:disabled{opacity:.45;cursor:not-allowed}.player-sync-btn{display:inline-flex;align-items:center;gap:8px;margin-left:auto;padding:9px 16px;border:2px solid var(--ink);border-radius:10px;font-family:inherit;font-size:12px;font-weight:800;letter-spacing:.02em;cursor:pointer;box-shadow:3px 3px 0 0 var(--ink);transition:transform .1s ease,box-shadow .1s ease}.player-sync-btn.is-play{background:var(--secondary);color:var(--on-accent)}.player-sync-btn.is-pausing{background:var(--surface);color:var(--text)}.player-sync-btn:hover:not(:disabled){transform:translate(-1px,-1px);box-shadow:4px 4px 0 0 var(--ink)}.player-sync-btn:active:not(:disabled){transform:translate(1px,1px);box-shadow:2px 2px 0 0 var(--ink)}.player-sync-btn:disabled{opacity:.45;cursor:not-allowed}.player-sync-icon{display:inline-flex;line-height:0}.player-sync-text{white-space:nowrap}.volume-slider{flex:1;min-width:72px}.seek-slider{flex:1;min-width:0}.player-range{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:10px;margin:0;border-radius:999px;border:2px solid var(--ink);background:var(--surface);box-shadow:inset 0 1px color-mix(in srgb,var(--ink) 8%,transparent);cursor:pointer}.player-range:disabled{opacity:.4;cursor:not-allowed}.player-range::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;margin-top:0;border-radius:50%;border:2px solid var(--ink);background:var(--secondary);box-shadow:2px 2px 0 0 var(--ink);cursor:pointer}.player-range::-moz-range-thumb{width:16px;height:16px;border-radius:50%;border:2px solid var(--ink);background:var(--secondary);box-shadow:2px 2px 0 0 var(--ink);cursor:pointer}.player-range::-moz-range-track{height:10px;border-radius:999px;border:2px solid var(--ink);background:var(--surface)}.library-list{list-style:none;flex:1;overflow-y:auto;padding:12px;min-height:0;background:var(--primary)}.library-card{width:100%;display:flex;align-items:center;gap:10px;text-align:left;border:var(--border);border-radius:var(--radius-sm);padding:8px;margin-bottom:10px;font-family:inherit;font-weight:600;background:var(--surface);color:var(--text);cursor:pointer;font-size:12px;box-shadow:3px 3px 0 0 var(--ink);transition:transform .1s ease,box-shadow .1s ease,color .1s ease}.library-card:hover{transform:translate(-1px,-1px);box-shadow:5px 5px 0 0 var(--ink)}.library-card:active{transform:translate(2px,2px);box-shadow:var(--shadow-press)}.library-card.active{background:var(--primary);color:var(--secondary-strong);box-shadow:4px 4px 0 0 var(--secondary-strong)}.library-thumb-wrap{flex-shrink:0;width:72px;height:44px}.library-thumb{width:72px;height:44px;object-fit:cover;display:block;border-radius:6px;border:2px solid var(--ink);background:var(--video-bg)}.library-thumb-placeholder{background:repeating-linear-gradient(-45deg,var(--thumb-stripe-a),var(--thumb-stripe-a) 6px,var(--thumb-stripe-b) 6px,var(--thumb-stripe-b) 12px)}.library-card-title{flex:1;min-width:0;line-height:1.35;word-break:break-word}.library-empty{padding:12px;font-size:12px;font-weight:600;color:var(--muted);border:2px dashed var(--dashed-edge);border-radius:var(--radius-sm);text-align:center}.status-dot{display:inline-block;width:10px;height:10px;border-radius:4px;margin-right:8px;background:var(--muted);border:2px solid var(--ink);box-shadow:1px 1px 0 0 var(--ink);vertical-align:middle}.status-dot.on{background:var(--secondary);box-shadow:2px 2px 0 0 var(--ink)}.chat-messages,.users-list,.library-list,.settings-panel,.settings-nav{scrollbar-width:none;-ms-overflow-style:none}.chat-messages::-webkit-scrollbar,.users-list::-webkit-scrollbar,.library-list::-webkit-scrollbar,.settings-panel::-webkit-scrollbar,.settings-nav::-webkit-scrollbar{display:none;width:0;height:0}@media (max-width: 1100px){.shell{grid-template-columns:minmax(180px,22vw) minmax(0,1fr) minmax(180px,22vw);padding:10px;gap:10px}}@media (max-width: 900px){body,html,#root{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}body::-webkit-scrollbar,html::-webkit-scrollbar,#root::-webkit-scrollbar{display:none;width:0;height:0}.shell{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto auto;height:auto;min-height:100dvh;overflow:visible}.center-stack{grid-row:1;min-height:min(72dvh,720px)}.panel-left{grid-row:2;max-height:36dvh}.panel-right{grid-row:3;max-height:28dvh}}@media (max-width: 560px){.shell{padding:8px;gap:8px}.input-bar{padding:10px}.input-bar input[type=url]{width:100%;flex:1 1 100%}.input-bar .btn{flex:1 1 auto}.center-stack{min-height:min(68dvh,600px)}.player-bar{flex-wrap:wrap}.player-bar-group{max-width:none;width:100%}.player-sync-btn{margin-left:0;width:100%;justify-content:center}.play-overlay-btn{padding:12px 22px;font-size:14px}}.nickname-screen{min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:24px;background:var(--primary)}.nickname-card{width:min(420px,100%);padding:28px 24px;background:var(--surface);border:var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-hover)}.nickname-title{font-size:28px;font-weight:800;letter-spacing:.04em;margin-bottom:8px}.nickname-sub{font-size:14px;color:var(--muted);margin-bottom:20px;line-height:1.5}.nickname-form{display:flex;flex-direction:column;gap:12px}.nickname-input{border:var(--border);border-radius:var(--radius-sm);padding:12px 14px;font-size:15px;font-family:inherit;background:var(--primary);color:var(--text);box-shadow:var(--shadow-soft)}.nickname-input:focus{outline:none;box-shadow:var(--shadow-soft),0 0 0 2px var(--secondary)}.nickname-enter{width:100%;padding:12px 16px}.room-mode-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.room-mode-btn{width:100%;padding:10px 12px;font-size:12px}.nickname-hint{font-size:12px;color:var(--muted);line-height:1.4}.panel-head-split{display:flex;align-items:center;justify-content:space-between;gap:8px}.head-badge{font-size:11px;font-weight:700;padding:4px 8px;border:2px solid var(--ink);border-radius:6px;color:var(--muted);max-width:50%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.head-badge.on{color:var(--secondary-strong);box-shadow:2px 2px 0 0 var(--secondary-strong)}.video-viewport{position:relative}.wake-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:400;display:flex;align-items:center;justify-content:center;padding:24px;pointer-events:none;background:color-mix(in srgb,var(--ink) 35%,transparent);animation:wake-fade-in .2s ease}.wake-card{pointer-events:auto;max-width:min(420px,92vw);padding:28px 24px;text-align:center;background:var(--surface);border:var(--border);border-radius:var(--radius-lg);box-shadow:10px 10px 0 0 var(--ink);animation:wake-pop .35s cubic-bezier(.2,1.1,.3,1)}.wake-horn{display:flex;justify-content:center;margin-bottom:10px;color:var(--secondary-strong)}.btn-horn{display:inline-flex;align-items:center;justify-content:center}.wake-line{font-size:26px;font-weight:900;letter-spacing:.02em;line-height:1.2;margin:0 0 8px;text-transform:uppercase}.wake-sub{margin:0;font-size:12px;font-weight:700;color:var(--muted)}@keyframes wake-fade-in{0%{opacity:0}to{opacity:1}}@keyframes wake-pop{0%{opacity:0;transform:scale(.92) translateY(8px)}to{opacity:1;transform:scale(1)}}.reduce-motion .wake-overlay,.reduce-motion .wake-card{animation:none}.neo-dropdown{position:relative;display:flex;flex-direction:column;gap:6px}.neo-dropdown.is-disabled{opacity:.55}.neo-dropdown-trigger{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;padding:11px 12px;border:var(--border);border-radius:var(--radius-sm);font-family:inherit;font-size:14px;font-weight:700;text-align:left;background:var(--primary);color:var(--text);box-shadow:var(--shadow-soft);cursor:pointer}.neo-dropdown-trigger:hover:not(:disabled){transform:translate(-1px,-1px);box-shadow:var(--shadow-hover)}.neo-dropdown-trigger:disabled{cursor:not-allowed}.neo-dropdown-value{flex:1;min-width:0}.neo-dropdown-caret{font-size:12px;color:var(--muted)}.neo-dropdown-menu{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:20;margin:0;padding:6px;list-style:none;background:var(--surface);border:var(--border);border-radius:var(--radius-sm);box-shadow:var(--shadow-hover);max-height:220px;overflow-y:auto;scrollbar-width:none}.neo-dropdown-menu::-webkit-scrollbar{display:none}.neo-dropdown-option{width:100%;display:block;padding:10px 12px;border:2px solid transparent;border-radius:8px;font-family:inherit;font-size:13px;font-weight:700;text-align:left;background:transparent;color:var(--text);cursor:pointer}.neo-dropdown-option:hover{background:var(--surface-raised)}.neo-dropdown-option.active{background:var(--secondary);color:var(--on-accent);border-color:var(--ink);box-shadow:2px 2px 0 0 var(--ink)}.viewport-fs{position:absolute;top:10px;right:10px;z-index:3;padding:6px 10px;font-size:14px;line-height:1;min-width:36px;pointer-events:auto;opacity:1;transform:translateY(0);transition:opacity .32s ease,transform .32s ease}.reduce-motion .viewport-fs{transition:none}.welcome-shell{min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:24px;background:var(--primary);position:relative}.welcome-card{width:min(440px,100%);padding:28px 26px;background:var(--surface);border:var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-hover)}.welcome-title{font-size:30px;font-weight:800;letter-spacing:.04em;margin-bottom:8px}.welcome-sub{font-size:14px;color:var(--muted);margin-bottom:18px;line-height:1.55}.welcome-form{display:flex;flex-direction:column;gap:12px}.welcome-submit{width:100%;margin-top:4px}.field-label{font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}.mono{font-family:ui-monospace,monospace;font-size:.95em}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:500;display:flex;align-items:center;justify-content:center;padding:20px;background:color-mix(in srgb,var(--ink) 55%,transparent);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.settings-dialog{--settings-w: 680px;--settings-h: 520px;--settings-head-h: 56px;width:var(--settings-w);height:var(--settings-h);max-width:calc(100vw - 32px);flex-shrink:0;display:flex;flex-direction:column;background:var(--surface);border:var(--border);border-radius:16px;box-shadow:12px 12px 0 0 var(--ink);overflow:hidden}.settings-dialog-head{flex:0 0 var(--settings-head-h);height:var(--settings-head-h);display:flex;align-items:center;justify-content:space-between;padding:0 18px;border-bottom:var(--border);background:var(--primary)}.settings-dialog-head h2{font-size:18px;font-weight:800}.settings-dialog-body{flex:1 1 auto;height:calc(var(--settings-h) - var(--settings-head-h));max-height:calc(var(--settings-h) - var(--settings-head-h));display:grid;grid-template-columns:168px minmax(0,1fr);min-height:0;overflow:hidden}.settings-nav{display:flex;flex-direction:column;gap:4px;padding:12px;border-right:var(--border);background:var(--primary);height:100%;overflow-y:auto}.settings-nav-btn{text-align:left;border:2px solid transparent;border-radius:10px;padding:10px 12px;font-size:13px;font-weight:700;font-family:inherit;background:transparent;color:var(--muted);cursor:pointer;transition:background .12s ease,color .12s ease,border-color .12s ease}.settings-nav-btn:hover{color:var(--text);background:var(--surface-raised)}.settings-nav-btn.active{color:var(--text);background:var(--surface);border-color:var(--ink);box-shadow:2px 2px 0 0 var(--ink)}.settings-panel{padding:18px 20px 22px;height:100%;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:12px}.settings-toggle-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 14px;border:var(--border);border-radius:var(--radius-sm);background:var(--primary);box-shadow:var(--shadow-soft);cursor:pointer}.settings-toggle-copy{display:flex;flex-direction:column;gap:4px;min-width:0}.settings-toggle-label{font-size:13px;font-weight:800}.neo-check{position:relative;flex-shrink:0;width:26px;height:26px;display:inline-flex;align-items:center;justify-content:center}.neo-check-input{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer;z-index:2}.neo-check-face{display:flex;align-items:center;justify-content:center;width:26px;height:26px;border:2.5px solid var(--ink);border-radius:7px;background:var(--surface);box-shadow:2px 2px 0 0 var(--ink);color:var(--on-accent);pointer-events:none;transition:background .12s ease,box-shadow .12s ease,transform .1s ease}.neo-check-mark{opacity:0;transform:scale(.6);transition:opacity .12s ease,transform .12s ease}.neo-check-input:checked+.neo-check-face{background:var(--secondary);box-shadow:2px 2px 0 0 var(--secondary-strong);border-color:var(--ink)}.neo-check-input:checked+.neo-check-face .neo-check-mark{opacity:1;transform:scale(1)}.neo-check-input:focus-visible+.neo-check-face{outline:2px solid var(--secondary-strong);outline-offset:2px}.settings-toggle-row:active .neo-check-face{transform:translate(1px,1px);box-shadow:1px 1px 0 0 var(--ink)}.reduce-motion .neo-check-face,.reduce-motion .neo-check-mark{transition:none}.settings-ideas{list-style:none;display:flex;flex-direction:column;gap:8px;margin:0;padding:0}.settings-ideas li{font-size:13px;font-weight:600;line-height:1.4;padding:10px 12px;border:2px dashed var(--dashed-edge);border-radius:var(--radius-sm);background:var(--primary);color:var(--muted)}.panel-left.chat-compact .users-chips li{padding:3px 7px;font-size:10px}.panel-left.chat-compact .chat-bubble{padding:7px 10px}.panel-left.chat-compact .chat-bubble-body{font-size:12px}.panel-left.chat-compact .users-strip{padding:6px 10px}.settings-section-title{font-size:14px;font-weight:800;margin-top:4px}.settings-hint{font-size:13px;color:var(--muted);line-height:1.5}.settings-hint.subtle{font-size:12px}.settings-input,.settings-textarea{width:100%;border:var(--border);border-radius:var(--radius-sm);padding:11px 12px;font-size:14px;font-family:inherit;background:var(--primary);color:var(--text);box-shadow:var(--shadow-soft)}.settings-textarea{resize:none;height:112px;min-height:112px;max-height:112px;line-height:1.45}.settings-input:focus,.settings-textarea:focus{outline:none;box-shadow:var(--shadow-soft),0 0 0 2px var(--secondary)}.settings-save{align-self:flex-start}.settings-error{font-size:12px;font-weight:700;color:#b42318}.theme-pick-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.theme-pick{padding:12px;border:var(--border);border-radius:var(--radius-sm);font-family:inherit;font-size:13px;font-weight:800;cursor:pointer;background:var(--primary);box-shadow:var(--shadow-soft)}.theme-pick.active{background:var(--secondary);color:var(--on-accent);box-shadow:var(--shadow-hover)}.palette-grid{display:flex;flex-wrap:wrap;gap:14px 16px;padding:4px 0 8px}.palette-swatch{display:flex;flex-direction:column;align-items:center;gap:6px;width:56px;padding:0;border:none;background:transparent;cursor:pointer;font-family:inherit}.palette-swatch-core{display:block;width:44px;height:44px;border-radius:50%;border:2.5px solid var(--ink);box-shadow:3px 3px 0 0 var(--ink);transition:transform .1s ease,box-shadow .1s ease}.palette-swatch:hover .palette-swatch-core{transform:translate(-1px,-1px);box-shadow:4px 4px 0 0 var(--ink)}.palette-swatch.active .palette-swatch-core{box-shadow:4px 4px 0 0 var(--secondary-strong);outline:3px solid var(--secondary);outline-offset:2px}.palette-swatch-label{font-size:10px;font-weight:800;letter-spacing:.03em;color:var(--muted);text-transform:uppercase}.palette-swatch.active .palette-swatch-label{color:var(--text)}.btn-icon-plain{width:36px;height:36px;border:2px solid var(--ink);border-radius:10px;background:var(--primary);font-size:22px;line-height:1;cursor:pointer;box-shadow:2px 2px 0 0 var(--ink)}.btn-icon-gear{position:absolute;top:16px;right:16px;width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;border:2px solid var(--ink);border-radius:10px;background:var(--surface);color:var(--text);box-shadow:var(--shadow-soft);cursor:pointer}.btn-icon-gear.subtle{position:static;width:32px;height:32px;font-size:16px;padding:0;display:inline-flex;align-items:center;justify-content:center}.panel-head-actions{display:flex;align-items:center;gap:6px;min-width:0}.room-chip{font-size:10px;font-weight:800;letter-spacing:.04em;padding:4px 6px;border:2px solid var(--ink);border-radius:6px;background:var(--surface-raised);white-space:nowrap}.users-strip{padding:10px 12px;border-bottom:var(--border);background:var(--surface);flex-shrink:0}.users-strip-label{display:block;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}.users-chips{list-style:none;display:flex;flex-wrap:wrap;gap:6px}.users-chips li{font-size:11px;font-weight:700;padding:5px 9px;border:2px solid var(--ink);border-radius:999px;background:var(--primary);box-shadow:2px 2px 0 0 var(--ink)}.users-chips li.is-self{border-color:var(--secondary-strong);box-shadow:2px 2px 0 0 var(--secondary-strong);color:var(--secondary-strong)}.users-chips .muted-chip{color:var(--muted);border-style:dashed;box-shadow:none}@media (max-width: 640px){.settings-dialog{--settings-w: calc(100vw - 24px) ;--settings-h: 520px}.settings-dialog-body{grid-template-columns:1fr}.settings-nav{flex-direction:row;flex-wrap:wrap;border-right:none;border-bottom:var(--border)}.settings-nav-btn{flex:1;min-width:90px;text-align:center}.reaction-btn{min-width:44px;min-height:44px}.library-vote{min-height:44px}}.pinned-bar{margin:0 12px 8px;padding:8px 10px;font-size:11px;font-weight:700;border:var(--border);border-radius:var(--radius-sm);background:var(--secondary)}.left-compact-tools{display:flex;flex-direction:column;gap:8px;padding:0 10px 10px;border-bottom:1px solid color-mix(in srgb,var(--ink) 12%,transparent)}.ready-row{display:flex;align-items:center;justify-content:space-between;gap:8px}.ready-label{font-size:11px;font-weight:700;color:var(--muted)}.ready-label strong{color:var(--text);font-weight:900}.ready-row-btn{flex:1;max-width:9.5rem;padding:7px 10px;font-size:11px}.force-play-link{width:100%;padding:6px 10px;font-size:10px}.presence-inline,.roster-inline{display:flex;flex-wrap:wrap;align-items:center;gap:6px}.presence-inline-label{font-size:9px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);width:100%}.presence-inline .presence-chip{flex:1;min-width:0;text-align:center;padding:5px 6px;font-size:9px}.users-chips-dense li{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px;cursor:default}.users-chips-dense li.is-self{outline:1.5px solid var(--ink);outline-offset:1px}.user-chip-name{font-weight:800}.user-chip-meta,.user-chip-afk{font-size:9px;font-weight:700;color:var(--muted)}.reaction-toolbar-compact{padding:0!important;gap:4px}.reaction-toolbar-compact .reaction-btn{flex:1;min-width:0;padding:3px 0;font-size:16px;border-width:1.5px}.lobby-strip{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:0 12px 8px}.lobby-strip-in-card{padding:0;flex-direction:column;align-items:stretch}.lobby-ready-btn.full-width,.lobby-force-btn.full-width{width:100%;justify-content:center}.welcome-error{color:#c62828;font-size:12px;font-weight:600;margin:0}.link-btn{border:none;background:none;padding:0;font:inherit;font-weight:700;color:var(--ink);text-decoration:underline;cursor:pointer}.otp-input{letter-spacing:.2em;font-variant-numeric:tabular-nums}.welcome-otp-form{align-items:center}.welcome-otp-wrap{display:flex;justify-content:center;width:100%;padding:6px 0 4px}.welcome-code-slots{max-width:100%}.welcome-otp-hint{width:100%;margin:4px 0 0;text-align:center;font-size:11px;font-weight:600;color:var(--muted)}.welcome-resend-btn{width:100%;margin-top:8px;font-size:11px;padding:8px 10px}.profile-username{margin-bottom:8px}.lobby-count{font-size:11px;font-weight:800;color:var(--muted)}.lobby-ready-btn.is-ready{background:var(--secondary)}.reaction-toolbar{display:flex;flex-wrap:wrap;gap:6px;padding:0 12px 8px}.reaction-btn{border:2px solid var(--ink);border-radius:8px;background:var(--surface);font-size:18px;cursor:pointer;padding:4px 8px}.presence-pick{padding:0 12px 8px}.presence-segment{display:flex;gap:6px;margin-top:4px}.presence-chip{font-size:10px;font-weight:800;padding:5px 8px;border:2px solid var(--ink);border-radius:999px;background:var(--primary);cursor:pointer}.presence-chip.active{background:var(--secondary)}.user-mod-actions{margin-left:4px}.user-mod-btn{border:none;background:transparent;cursor:pointer;font-size:10px;padding:0 2px}.sync-health-badge{font-size:10px;font-weight:800;padding:4px 8px;border-radius:999px;border:1.5px solid var(--ink)}.sync-health-badge.ok{background:var(--secondary)}.sync-health-badge.wait{background:#f0d9a8}.sync-health-badge.drift{background:var(--surface-raised)}.source-warn,.bandwidth-hint{font-size:11px;font-weight:600;color:var(--muted);padding:0 4px 6px}.reaction-overlay{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden;z-index:6}.reaction-float{position:absolute;bottom:28%;font-size:36px;animation:reaction-rise 2s ease-out forwards}@keyframes reaction-rise{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(-80px) scale(1.2)}}.subtitle-overlay{position:absolute;left:0;right:0;bottom:22%;text-align:center;pointer-events:none;z-index:5;padding:0 12px}.subtitle-line{display:inline-block;padding:6px 12px;background:#000000c7;color:#fff;font-size:15px;font-weight:600;border-radius:6px}.resume-banner{position:fixed;top:12px;left:50%;transform:translate(-50%);z-index:50;display:flex;align-items:center;gap:12px;padding:10px 14px;background:var(--surface);border:var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-soft)}.resume-banner-actions{display:flex;gap:8px}.invite-qr-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:120;display:flex;align-items:center;justify-content:center;padding:24px;background:color-mix(in srgb,var(--ink) 35%,transparent);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.invite-qr-card{width:min(100%,340px);padding:20px 18px;background:var(--surface);border:var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center}.invite-qr-title{font-size:1.1rem;font-weight:900}.invite-qr-sub{font-size:12px;color:var(--muted);margin:0}.invite-qr-url{font-size:10px;word-break:break-all;color:var(--muted);max-width:100%}.invite-qr-actions{display:flex;gap:8px;width:100%}.invite-qr-actions .btn{flex:1}.ctx-menu{position:fixed;z-index:200;min-width:168px;margin:0;padding:6px;list-style:none;background:var(--surface);border:var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-soft)}.ctx-menu-item{display:block;width:100%;text-align:left;padding:8px 10px;font-size:12px;font-weight:700;border:none;border-radius:var(--radius-sm);background:transparent;cursor:pointer;color:var(--text)}.ctx-menu-item:hover:not(:disabled){background:var(--secondary)}.ctx-menu-item.is-danger{color:#b3261e}.ctx-menu-item.is-disabled,.ctx-menu-item:disabled{opacity:.45;cursor:default}.library-hint{font-size:10px;color:var(--muted);padding:0 12px 6px;margin:0}.library-card-meta{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:0;flex:1}.library-vote-pill{font-size:9px;font-weight:800;color:var(--muted)}.panel-right .library-list li{display:block}.library-vote-legacy{flex-shrink:0;font-size:10px;font-weight:800;padding:6px 8px;border:2px solid var(--ink);border-radius:8px;background:var(--primary);cursor:pointer}.library-vote.has-votes{background:var(--secondary)}.queue-top-btn{font-size:10px;padding:4px 8px}.marker-list{list-style:none;margin:8px 0;padding:0}.marker-list li{font-size:12px;margin-bottom:6px}.btn-text{border:none;background:none;font:inherit;font-weight:700;cursor:pointer;text-decoration:underline}