:root{color-scheme:dark;font-family:Space Grotesk,Avenir,Segoe UI,sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{background:radial-gradient(circle at 20% 20%,#1a2a4f,#0b0f1a 55%,#07090f);color:#e6edf6;min-height:100vh;overflow:hidden}#app{width:100vw;height:100vh}canvas{display:block}.overlay-header{position:absolute;inset:0 0 auto 0;display:flex;align-items:center;justify-content:space-between;padding:20px 28px;z-index:10;pointer-events:none;background:linear-gradient(180deg,#07090fbf,#07090f00)}.overlay-header .brand{display:flex;align-items:center;gap:10px;font-size:1.1rem;letter-spacing:.08em;text-transform:uppercase;color:#bcd5ff}.brand-logo{width:28px;height:28px;object-fit:contain;background:#fff;padding:3px;border-radius:8px;box-shadow:0 6px 14px #0cafd233}.login-button{pointer-events:auto;border:1px solid rgba(44,225,255,.45);background:#081828cc;color:#e6f7ff;display:inline-flex;padding:10px 16px;border-radius:999px;font-size:.9rem;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease}.login-button.google{border-color:#ffffff59;background:#12141ad9;color:#fff}.login-button.apple{border-color:#000000e6;background:#0c0c0cf2;color:#fff}#logout-button{display:none}.login-button:hover{transform:translateY(-1px);box-shadow:0 10px 24px #0cafd240;border-color:#2ce1ffbf}.login-button:active{transform:translateY(0);box-shadow:none}.auth-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:flex-end;pointer-events:auto}.user-avatar{width:36px;height:36px;border-radius:50%;object-fit:cover;border:1px solid rgba(44,225,255,.45);box-shadow:0 8px 18px #0cafd240;display:none}.dock-panel{position:absolute;right:20px;bottom:20px;width:min(430px,calc(100vw - 40px));max-height:min(430px,calc(100vh - 120px));overflow:auto;border:1px solid rgba(44,225,255,.35);border-radius:16px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#04080edb;z-index:12;padding:10px}.dock-header{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}.dock-tabs{display:flex;gap:6px}.dock-tab{border:1px solid rgba(44,225,255,.35);background:#081828bf;color:#b6d7ef;border-radius:8px;padding:6px 10px;font-size:.78rem;cursor:pointer}.dock-tab.active{color:#effbff;border-color:#2ce1ffbf}.dock-pane{display:none}.dock-pane.active{display:block}.dock-panel.minimized{width:190px;max-height:none;padding:8px}.dock-panel.minimized .dock-pane{display:none}.media-header{display:flex;align-items:center;justify-content:space-between;font-size:.9rem;color:#d9f2ff;margin-bottom:10px}.panel-close-button{border:1px solid rgba(44,225,255,.45);background:#081828cc;color:#e6f7ff;width:24px;height:24px;border-radius:8px;cursor:pointer;line-height:1;font-size:.85rem;padding:0}.media-access-card{border:1px solid rgba(44,225,255,.25);background:#07121ea6;border-radius:12px;padding:10px;margin-bottom:10px}.media-access-card.compact .media-access-actions{display:none}.media-access-card.blocked{border-color:#dc625699}.media-access-status{font-size:.75rem;color:#cae8ff;line-height:1.3}.media-access-card.blocked .media-access-status{color:#ffd3cd}.media-access-actions{margin-top:8px;display:flex;align-items:center;gap:8px}.media-link-button{border:none;background:transparent;color:#9fc3de;font-size:.75rem;text-decoration:underline;cursor:pointer;padding:0}.media-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:10px}.media-button{border:1px solid rgba(44,225,255,.45);background:#081828cc;color:#e6f7ff;border-radius:10px;padding:8px 10px;cursor:pointer}.media-button.off{opacity:.65}.media-selectors{display:grid;grid-template-columns:1fr;gap:6px;margin-bottom:12px}.media-label{font-size:.72rem;color:#9fc3de}.media-select{border:1px solid rgba(44,225,255,.35);background:#00000040;color:#effbff;border-radius:8px;padding:6px 8px}.volume-section{border-top:1px solid rgba(44,225,255,.2);padding-top:10px}.volume-title{font-size:.78rem;color:#d9f2ff;margin-bottom:8px}.volume-list{display:grid;gap:8px}.volume-row{display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px}.volume-name{font-size:.74rem;color:#d5e8f8;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.volume-slider{width:120px}.chat-panel{display:grid;grid-template-rows:auto 1fr auto;min-height:250px}.chat-header{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;border-bottom:1px solid rgba(44,225,255,.2);font-size:.85rem;color:#d9f2ff}.chat-status{color:#8dc8dc;font-size:.75rem}.chat-log{padding:10px 12px;overflow-y:auto;font-size:.8rem;line-height:1.45;color:#d6e8f5}.chat-row{padding:2px 0;white-space:pre-wrap;word-break:break-word}.chat-form{display:grid;grid-template-columns:1fr auto;gap:8px;padding:10px 12px;border-top:1px solid rgba(44,225,255,.2)}.chat-input{border:1px solid rgba(44,225,255,.4);border-radius:10px;background:#00000040;color:#effbff;padding:8px 10px;outline:none}.chat-input:disabled{opacity:.6;cursor:not-allowed}.chat-send{border:1px solid rgba(44,225,255,.55);border-radius:10px;background:#0c3a48b8;color:#effbff;padding:8px 12px;cursor:pointer}.chat-send:disabled{opacity:.5;cursor:not-allowed}@media (max-width: 700px){.dock-panel{left:10px;right:10px;width:auto;max-height:min(320px,calc(100vh - 140px))}.dock-panel.minimized{left:auto;right:10px;bottom:10px;width:190px;max-height:none}}