:root{color-scheme:dark;--bg: #0b0c10;--panel: #14161c;--panel-2: #1b1e26;--line: #242833;--text: #eef0f4;--muted: #8a90a0;--live: #ff3b4e;--warn: #f5b942;--accent: #7c5cff;--accent-2: #9a82ff;--radius: 12px;--chat-width: 340px;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:15px;-webkit-text-size-adjust:100%}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text)}button{font:inherit;color:var(--text);border:0;cursor:pointer}button:disabled{opacity:.45;cursor:default}.muted{color:var(--muted)}.notice-page{min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:24px 16px;text-align:center}.notice-page h1{margin:8px 0 0;text-wrap:balance;font-size:22px;font-weight:650;max-width:28ch}.notice-page p{margin:0;max-width:44ch;line-height:1.5}.notice-page .brand{font-size:40px;letter-spacing:-.03em}.notice-page .tagline{font-size:18px}.viewer{height:100%;height:100dvh;display:grid;grid-template-columns:minmax(0,1fr) var(--chat-width)}.player{display:flex;flex-direction:column;min-width:0;min-height:0}.stage{position:relative;flex:1;min-height:0;background:#000;display:grid;place-items:center;overflow:hidden}.video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#000}.video.hidden{visibility:hidden}.stage-card{position:absolute;display:flex;flex-direction:column;align-items:center;gap:10px;padding:24px;text-align:center;max-width:36ch}.stage-card strong{font-size:17px;font-weight:650}.spinner{width:28px;height:28px;border-radius:50%;border:3px solid var(--line);border-top-color:var(--accent-2);animation:spin .9s linear infinite}.waiting-dot{width:14px;height:14px;border-radius:50%;background:var(--accent-2);animation:breathe 1.8s ease-in-out infinite}@keyframes spin{to{transform:rotate(360deg)}}@keyframes breathe{0%,to{box-shadow:0 0 #9a82ff8c}50%{box-shadow:0 0 0 12px #9a82ff00}}@media(prefers-reduced-motion:reduce){.spinner,.waiting-dot{animation:none}}.stage-button{position:absolute;padding:12px 22px;border-radius:999px;background:#14161ce0;border:1px solid rgb(255 255 255 / .14);font-weight:600;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-shadow:0 8px 28px #00000073}.stage-button.center{font-size:20px;padding:14px 32px;background:var(--accent);border-color:transparent}.stage-button.corner{left:16px;bottom:16px}.viewer.theater .stage{position:fixed;inset:0;z-index:50;aspect-ratio:auto}@media(orientation:portrait){.viewer.theater.turned .stage{inset:0 auto auto;left:100vw;width:100vh;width:100dvh;height:100vw;transform:rotate(90deg);transform-origin:top left}}.stage-button.close,.stage-button.turn{top:12px;right:12px;width:44px;height:44px;padding:0;font-size:18px;display:grid;place-items:center}.stage-button.turn{right:68px}@media(orientation:landscape){.stage-button.turn{display:none}}.info{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--panel);border-top:1px solid var(--line)}.avatar{flex:none;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--accent),#c05cff);font-weight:700}.info-text{min-width:0;flex:1}.info-text h1{margin:0;font-size:16px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.info-meta{margin:3px 0 0;display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted)}.pill{padding:2px 7px;border-radius:5px;font-size:11px;font-weight:750;letter-spacing:.06em;background:var(--panel-2);color:var(--muted)}.pill.live{background:var(--live);color:#fff}.pill.warn{background:#f5b94229;color:var(--warn)}.info-actions{display:flex;gap:4px}.icon-button{width:40px;height:40px;border-radius:10px;background:transparent;font-size:18px}.icon-button:hover{background:var(--panel-2)}.chat{display:flex;flex-direction:column;min-height:0;background:var(--panel);border-left:1px solid var(--line)}.chat-header{padding:14px 16px;font-size:13px;font-weight:650;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;border-bottom:1px solid var(--line)}.messages-wrap{position:relative;flex:1;min-height:0;display:flex}.messages{flex:1;margin:0;padding:12px 10px;list-style:none;overflow-y:auto;display:flex;flex-direction:column;gap:2px;line-height:1.4;overflow-wrap:anywhere}.messages li{padding:5px 8px;border-radius:8px}.messages li.mine{background:#7c5cff0f;box-shadow:inset 2px 0 #7c5cff8c}.messages li.host{background:#b69cff1a}.host-badge{display:inline-block;margin-right:6px;padding:1px 5px;border-radius:4px;font-size:10px;font-weight:800;letter-spacing:.06em;vertical-align:1px;background:var(--accent);color:#fff}.messages .empty{margin:auto;text-align:center}.msg-name{font-weight:700;margin-right:6px}.new-messages{position:absolute;left:50%;bottom:10px;transform:translate(-50%);padding:6px 14px;border-radius:999px;background:var(--accent);font-size:13px;font-weight:600;box-shadow:0 6px 18px #0006}.composer{display:flex;flex-direction:column;gap:8px;padding:12px 12px calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--line)}.composer.closed{text-align:center;padding-block:18px calc(18px + env(safe-area-inset-bottom))}.composer input{font:inherit;color:var(--text);background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:10px 12px;min-width:0;outline:none}.composer input:focus{border-color:var(--accent)}.name-field{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--muted)}.composer-row{display:flex;gap:8px}.composer-row input{flex:1}.send{padding:0 16px;border-radius:10px;background:var(--accent);font-weight:650}.as-name{align-self:flex-start;padding:0;background:transparent;font-size:12px;color:var(--muted)}.as-name strong{color:var(--text)}.chat-notice{font-size:12px;color:var(--warn)}.counter{font-size:12px;text-align:right}.debug{position:absolute;top:8px;left:8px;margin:0;padding:8px 10px;font:12px/1.4 ui-monospace,Menlo,monospace;background:#000000a6;border-radius:6px;pointer-events:none}@media(max-width:1000px){:root{--chat-width: 290px}}@media(max-width:760px)and (min-height:501px){.viewer{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr)}.stage{flex:none;aspect-ratio:16 / 9}.info{padding:10px 12px}.avatar{width:32px;height:32px;font-size:14px}.chat{border-left:0}.chat-header{display:none}.composer input{font-size:16px}.stage-card{padding:12px;gap:6px}.stage-card strong{font-size:15px}.stage-button.center{font-size:17px;padding:11px 24px}.stage-button.corner{left:10px;bottom:10px;padding:8px 14px;font-size:14px}}@media(max-height:500px)and (orientation:landscape){:root{--chat-width: 240px}.viewer{grid-template-columns:minmax(0,1fr) var(--chat-width);grid-template-rows:none}.stage{flex:1;aspect-ratio:auto}.info{padding:4px 8px 4px calc(10px + env(safe-area-inset-left));gap:8px}.avatar{display:none}.info-text{display:flex;align-items:center;gap:10px}.info-text h1{font-size:14px}.info-meta{margin:0;font-size:12px}.icon-button{width:34px;height:34px;font-size:16px}.chat{padding-right:env(safe-area-inset-right)}.chat-header{display:none}.messages{padding:8px 6px;font-size:14px}.composer{gap:6px;padding:8px 8px calc(8px + env(safe-area-inset-bottom))}.composer input{font-size:16px;padding:7px 10px}.stage-card{padding:12px;gap:6px}.stage-button.corner{left:10px;bottom:10px;padding:8px 14px;font-size:14px}}