:root{--bg: #0f1115;--surface: #171a21;--surface-2: #1f232c;--border: #2a2f3a;--text: #f2f4f8;--text-muted: #9aa3b2;--accent: #5b8cff;--accent-hover: #4a7bf0;--success: #2d8b5f;--danger: #e5484d;--radius: 12px;--radius-sm: 8px;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--space-6: 32px;--shadow: 0 4px 20px rgba(0,0,0,.35);--font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font-family:var(--font);-webkit-font-smoothing:antialiased}a{color:var(--accent);text-decoration:none}h1,h2,h3{margin:0 0 var(--space-3)}.btn{background:var(--accent);color:#fff;border:none;cursor:pointer;padding:10px 16px;border-radius:var(--radius-sm);font-size:15px;font-weight:600}.btn:hover{background:var(--accent-hover)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-ghost{background:transparent;border:1px solid var(--border);color:var(--text)}.btn-danger{background:var(--danger)}.input{width:100%;padding:10px 12px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);font-size:15px}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:var(--space-5)}.muted{color:var(--text-muted)}.error{color:var(--danger)}.row{display:flex;gap:var(--space-3);align-items:center}.stack{display:flex;flex-direction:column;gap:var(--space-3)}.grid{display:grid;gap:var(--space-4);grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}.app-shell{display:flex;min-height:100vh}.sidebar{width:240px;flex-shrink:0;position:sticky;top:0;height:100vh;border-right:1px solid var(--border);background:var(--surface);display:flex;flex-direction:column;padding:16px;gap:8px;z-index:60}.mobile-topbar{display:none}@media (max-width: 768px){.sidebar{position:fixed;left:0;top:0;transform:translate(-100%);transition:transform .25s ease;box-shadow:var(--shadow)}.sidebar.open{transform:translate(0)}.sidebar-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:55}.mobile-topbar{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--border);background:var(--surface);position:sticky;top:0;z-index:50}.main-content{padding:16px!important}.grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}}.video-modal-overlay{position:fixed;top:0;right:0;bottom:0;left:240px;background:#000000f5;display:grid;place-items:center;padding:24px;z-index:50;overflow-y:auto}.video-modal-card{width:min(1080px,100%);max-width:100%;box-sizing:border-box}@media (max-width: 768px){.video-modal-overlay{left:0;padding:12px}}.dialog-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:70;background:#0009;display:grid;place-items:center;padding:16px;overflow-y:auto}.video-modal-close{position:absolute;top:16px;right:16px;z-index:60;width:40px;height:40px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:#12121499;color:#fff;border:1px solid rgba(255,255,255,.18);cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.video-modal-close:hover{background:#121214e0}.vp{position:relative;line-height:0;background:#000;border-radius:var(--radius);overflow:hidden}.vp-video{width:100%;max-height:70vh;display:block;background:#000}.vp:fullscreen{border-radius:0}.vp:fullscreen .vp-video{max-height:100vh;height:100vh}.vp-hide-cursor{cursor:none}.vp-spinner{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;pointer-events:none;color:#fff}.vp-spin{animation:vp-spin 1s linear infinite}@keyframes vp-spin{to{transform:rotate(360deg)}}.vp-bigplay{position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;width:76px;height:76px;display:grid;place-items:center;border-radius:50%;background:#00000073;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:#fff;border:1px solid rgba(255,255,255,.2);cursor:pointer}.vp-bigplay:hover{background:#000000a6}.vp-bar{position:absolute;left:0;right:0;bottom:0;z-index:3;display:flex;align-items:center;gap:10px;padding:26px 22px 16px;line-height:normal;background:linear-gradient(transparent,#000000b8);opacity:0;transform:translateY(8px);pointer-events:none;transition:opacity .2s ease,transform .2s ease}.vp-bar.show{opacity:1;transform:none;pointer-events:auto}.vp-btn{background:transparent;border:none;color:#fff;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:5px;border-radius:var(--radius-sm);flex-shrink:0}.vp-btn:hover,.vp-btn-active{background:#ffffff2e}.vp-time{color:#fff;font-size:13px;font-variant-numeric:tabular-nums;white-space:nowrap;flex-shrink:0}.vp-vol{display:flex;align-items:center;gap:4px}.vp-volrange{width:78px}.vp-range{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:5px;border-radius:3px;cursor:pointer;outline:none}.vp-scrub{flex:1;min-width:60px}.vp-range::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:13px;height:13px;border-radius:50%;background:#fff;border:none;box-shadow:0 1px 3px #0006}.vp-range::-moz-range-thumb{width:13px;height:13px;border:none;border-radius:50%;background:#fff}.vp-menu{position:absolute;right:12px;bottom:60px;z-index:4;min-width:190px;max-height:60vh;overflow-y:auto;padding:6px;line-height:normal;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);box-shadow:var(--shadow)}.vp-menu-label{font-size:11px;color:var(--text-muted);padding:6px 8px 2px;text-transform:uppercase;letter-spacing:.05em}.vp-menu-item{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:8px;background:transparent;border:none;cursor:pointer;color:var(--text);font-size:14px;border-radius:var(--radius-sm);text-align:left}.vp-menu-item:hover{background:var(--surface-2)}.vp-menu-divider{height:1px;background:var(--border);margin:4px 0}.player-menu-label{font-size:11px;color:var(--text-muted);padding:6px 8px 2px;text-transform:uppercase;letter-spacing:.05em}.player-menu-item{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:8px;background:transparent;border:none;cursor:pointer;color:var(--text);font-size:14px;border-radius:var(--radius-sm);text-align:left}.player-menu-item:hover{background:var(--surface-2)}.player-menu-divider{height:1px;background:var(--border);margin:4px 0}
