:root{color-scheme:dark;--sidebar-width: 240px;--player-height: 92px;--topbar-height: 76px;--shell-gutter: 24px;--bg: #0b1326;--panel-low: #131b2e;--panel: #171f33;--panel-high: #222a3d;--line: rgba(255, 255, 255, .08);--text: #dae2fd;--muted: #99a4c9;--accent: #4cd7f6;--accent-soft: #7c3aed}*{box-sizing:border-box}html,body{height:100%}body{margin:0;background:radial-gradient(1200px 600px at 20% -10%,rgba(76,215,246,.12),transparent 55%),radial-gradient(900px 500px at 90% 10%,rgba(124,58,237,.18),transparent 60%),var(--bg);background-repeat:no-repeat,no-repeat,repeat;color:var(--text);font-family:Inter,sans-serif;overflow:hidden}.material-symbols-outlined{font-variation-settings:"FILL" 0,"wght" 400,"GRAD" 0,"opsz" 24}.material-symbols-outlined.filled{font-variation-settings:"FILL" 1,"wght" 400,"GRAD" 0,"opsz" 24}.app-shell{min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:var(--sidebar-width);padding:24px 16px;background:color-mix(in srgb,var(--panel-low) 92%,transparent);border-right:1px solid var(--line);display:flex;flex-direction:column;gap:22px;z-index:30}.main-shell{margin-left:var(--sidebar-width)}.brand-block h1{margin:0;font-family:Montserrat,sans-serif;font-weight:800;letter-spacing:-.02em;color:#d2bbff;font-size:2.1rem}.brand-block p{margin:2px 0 0;font-family:Geist,sans-serif;font-size:.78rem;color:var(--muted)}.sidebar-nav,.sidebar-footer{display:flex;flex-direction:column;gap:6px}.sidebar-nav a,.sidebar-footer a{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--muted);padding:10px 12px;border-radius:10px;font-family:Geist,sans-serif;font-size:.9rem}.sidebar-nav a:hover,.sidebar-footer a:hover{color:var(--text);background:#ffffff0d}.sidebar-nav a.active{color:#d2bbff;background:#ffffff0f;border-right:2px solid #d2bbff}.create-btn{border:0;border-radius:12px;background:var(--accent-soft);color:#ede0ff;font-family:Geist,sans-serif;font-size:.88rem;font-weight:600;padding:10px 12px;display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer}.sidebar-footer{margin-top:auto;padding-top:14px;border-top:1px solid var(--line)}.content-area{position:fixed;top:var(--topbar-height);right:0;bottom:var(--player-height);left:var(--sidebar-width);padding:0 var(--shell-gutter) var(--shell-gutter)}.top-bar{position:fixed;top:0;left:var(--sidebar-width);right:0;padding:0 var(--shell-gutter);z-index:10;display:flex;justify-content:space-between;gap:12px;align-items:center;min-height:var(--topbar-height);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#0b1326b8}.content-frame{display:block;width:100%;height:100%;border:0;background:transparent}.top-left,.top-right{display:flex;align-items:center;gap:12px}.history-buttons{display:flex;gap:6px}.history-buttons button,.ghost-icon{border:0;color:var(--muted);background:var(--panel);width:34px;height:34px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}.history-buttons button:disabled{opacity:.45;cursor:default}.ghost-icon:hover,.history-buttons button:hover:not(:disabled){color:var(--text);background:var(--panel-high)}.search-wrap{position:relative;width:min(440px,52vw)}.search-wrap span{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:var(--muted)}.search-wrap input{width:100%;border:0;border-radius:999px;background:var(--panel-low);color:var(--text);padding:9px 14px 9px 38px;outline:none}.search-wrap input:focus{box-shadow:inset 0 0 0 1px var(--accent-soft)}.avatar{width:34px;height:34px;border-radius:999px;background:linear-gradient(145deg,#d2bbff,#7c3aed);color:#22035a;font-family:Geist,sans-serif;font-weight:700;display:grid;place-items:center}.player-host{padding:0;border-top:1px solid var(--line);background:#0b1326eb;position:fixed;left:var(--sidebar-width);right:0;bottom:0;z-index:20;height:var(--player-height)}.player-host iframe{display:block;width:100%;height:100%;border:0}@media (max-width: 960px){.sidebar{display:none}.main-shell{margin-left:0}.content-area{left:0;padding:0 16px 20px}.top-bar{left:0}.search-wrap{width:min(56vw,340px)}.player-host{left:0;height:96px}}@media (max-width: 700px){:root{--topbar-height: 64px}.top-bar{min-height:56px;padding:0 16px}.history-buttons{display:none}.content-area{padding-left:0;padding-right:0}.search-wrap{width:min(64vw,280px)}}