:root{color-scheme:dark;--bg:#101116;--panel:#191b22;--panel2:#20232c;--line:#2b2e38;--muted:#9296a6;--text:#f3f3f5;--accent:#d7f272;--amber:#eac88c;--side:250px;font:18px/1.5 Arial,Helvetica,sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text)}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button,a{transition:background .15s,transform .15s,outline-color .15s}button{border:1px solid var(--line);border-radius:10px;background:var(--panel2);color:var(--text);padding:12px 20px;cursor:pointer}button:hover{background:#303440}button:disabled{opacity:.45;cursor:default}a{color:inherit;text-decoration:none}button:focus,a:focus,input:focus,select:focus,[tabindex="0"]:focus{outline:3px solid var(--accent);outline-offset:5px}button.primary{background:var(--accent);border-color:var(--accent);color:#1b2110;font-weight:700}button.primary:hover{background:#e5ff91}button.quiet{background:transparent}button:active{transform:scale(.98)}[hidden]{display:none!important}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(38px,4vw,70px);letter-spacing:-2.5px;line-height:1.08;margin-bottom:22px}h2{font-size:27px;letter-spacing:-.6px}h3{font-size:20px}p{color:#b5b9c6}small{font-size:12px}.sidebar{position:fixed;inset:0 auto 0 0;width:var(--side);border-right:1px solid #24262e;background:#121319;padding:34px 22px;display:flex;flex-direction:column;z-index:5}.brand{display:flex;align-items:center;gap:14px;padding:0 14px 40px;font-size:19px;font-weight:800;letter-spacing:2px}.brand small{display:block;font-size:8px;letter-spacing:1.9px;color:var(--muted);margin-top:2px}.brand-mark{font-size:49px;line-height:1;color:var(--accent);letter-spacing:-7px}.brand-mark span{color:var(--text)}nav{display:flex;flex-direction:column;gap:5px}nav a{border-radius:9px;padding:11px 15px;color:#a7aab7;display:flex;align-items:center;gap:16px;font-size:15px}nav a.active{background:#262b21;color:var(--accent);font-weight:700}nav a:hover{background:#20222a}nav svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;flex-shrink:0}nav .nav-spacer{margin-top:24px}.sidebar-footer{margin-top:auto;padding:28px 12px 0;color:#afb3bf;font-size:9px;letter-spacing:1px}.sidebar-footer small{display:block;color:#696e7d;font-size:10px;letter-spacing:0;margin-top:8px}.device-dot{display:inline-block;width:5px;height:5px;background:var(--accent);border-radius:50%;margin-right:7px}.workspace{margin-left:var(--side)}.topbar{height:96px;padding:0 46px;display:flex;align-items:center;gap:16px}.topbar>span{font-size:11px;letter-spacing:2.5px;color:#8d919f;margin-right:auto}.status-chip{font-size:11px;color:var(--amber);background:#22221f;border-color:#35352d;padding:8px 13px;border-radius:30px}.avatar{border-radius:50%;width:36px;height:36px;padding:0;background:#333743;font-size:13px}main{padding:0 46px 80px;max-width:1800px;margin:auto;min-height:calc(100vh - 96px)}.hero{position:relative;overflow:hidden;border:1px solid #333a36;border-radius:18px;min-height:355px;padding:46px;display:flex;align-items:center;background:radial-gradient(ellipse at 85% 50%,#34433e 0%,#202a29 32%,#1a2024 67%,#191c23 100%)}.hero-copy{position:relative;max-width:620px;z-index:1}.eyebrow{font-size:10px;letter-spacing:2.4px;font-weight:700;color:var(--accent);margin-bottom:18px}.hero h1 em{font-style:normal;color:var(--accent)}.hero p.description{max-width:490px;font-size:15px;line-height:1.75;color:#adb7b8}.hero-art{position:absolute;right:-10px;top:30px;width:330px;height:330px;border:1px solid #9baf7f29;border-radius:50%;transform:rotate(-25deg)}.hero-art:before,.hero-art:after{content:"";position:absolute;border:1px solid #9baf7f29;border-radius:50%;inset:30px}.hero-art:after{inset:65px}.hero-art span{position:absolute;inset:100px;background:#c8de8733;border:1px solid #d7f27255;border-radius:30px;display:grid;place-items:center;color:var(--accent);font-size:55px;transform:rotate(25deg)}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:25px}.actions button{font-size:13px;padding:12px 19px}.section-header{display:flex;align-items:center;gap:15px;margin:32px 0 17px}.section-header h2{font-size:21px;margin:0}.section-header .tag{font-size:9px;letter-spacing:1.2px;border:1px solid var(--line);border-radius:4px;padding:3px 7px;color:var(--muted)}.section-header button{margin-left:auto;font-size:12px;border:0;background:transparent;padding:6px;color:var(--muted)}.empty{border:1px solid var(--line);border-radius:13px;padding:27px 30px;display:flex;align-items:center;gap:24px;background:linear-gradient(110deg,#1b1d25,#17191f)}.empty-icon{flex-shrink:0;width:52px;height:52px;border:1px solid #393d49;border-radius:50%;display:grid;place-items:center;font-size:24px;color:#a2a7b8}.empty h3{font-size:16px;margin-bottom:5px}.empty p{font-size:13px;margin:0;max-width:720px;color:var(--muted)}.empty button{margin-left:auto;white-space:nowrap;font-size:12px}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.info-card{border:1px solid var(--line);border-radius:12px;padding:24px;background:var(--panel)}.info-card .number{color:#6d7482;font-size:11px;letter-spacing:1.5px}.info-card h3{font-size:17px;margin:16px 0 10px}.info-card p{font-size:12px;line-height:1.8;color:var(--muted);margin-bottom:0}.info-card .cap-state{font-size:10px;color:var(--amber);display:block;margin-top:18px}.notice{border-left:3px solid var(--amber);padding:16px 20px;background:#25231e;color:#d6c9b0;border-radius:0 8px 8px 0;font-size:14px;line-height:1.8;margin:22px 0}.remote-hint{position:fixed;bottom:0;left:var(--side);right:0;min-height:47px;padding:14px 46px;border-top:1px solid #262832;background:#101116ed;display:flex;gap:25px;align-items:center;font-size:10px;color:#828797;z-index:6}kbd{font-family:inherit;background:#252833;color:#b9bdc7;border-radius:4px;padding:3px 5px;margin-right:5px;font-size:9px}.hint-right{margin-left:auto;color:#626878}.page-title{padding-top:22px}.page-title h1{font-size:43px;letter-spacing:-1.5px}.page-title p{max-width:780px;font-size:15px;line-height:1.8}.panel{padding:28px;border:1px solid var(--line);border-radius:13px;background:var(--panel);margin-bottom:18px}.setting{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:21px 0;border-bottom:1px solid var(--line)}.setting:last-child{border:0}.setting h3{font-size:16px;margin:0 0 6px}.setting p{font-size:12px;margin:0;color:var(--muted)}.setting button{min-width:100px;font-size:13px}select,input{background:#11141b;color:var(--text);border:1px solid #3a3e4c;border-radius:9px;padding:13px;max-width:100%}label{display:block;color:#b5bac7;font-size:13px;margin:20px 0 8px}.form-field{display:flex;gap:12px}.form-field input{flex:1}.modal{position:fixed;inset:0;background:#080a10e8;z-index:20;display:flex;align-items:center;justify-content:center;padding:32px}.modal-card{max-width:680px;width:100%;max-height:90vh;overflow:auto;background:#1c1f29;border:1px solid #414753;border-radius:20px;padding:35px}.modal-card h2{font-size:27px}.modal-card p{font-size:14px;line-height:1.8}.keyboard{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:7px;margin-top:22px}.keyboard button{padding:10px 0;font-size:15px}.keyboard .wide{grid-column:span 2}.keyboard .extra-wide{grid-column:span 4}.history-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.history-card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:22px;text-align:left;min-width:0}.history-card h3{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:16px}.history-card p{font-size:12px}.history-card progress{width:100%;height:5px;accent-color:var(--accent)}.history-card small{display:block;color:var(--muted);margin-top:10px}.player-screen{position:fixed;inset:0;background:black;z-index:25}.player-screen video{width:100%;height:100%;object-fit:contain}.player-shade{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;background:linear-gradient(#000b,transparent 30%,transparent 60%,#000e);pointer-events:none;padding:40px}.player-shade header{display:flex;justify-content:space-between;gap:30px}.player-shade button{pointer-events:auto}.player-shade h2{font-size:23px;max-width:75vw;overflow:hidden;text-overflow:ellipsis}.player-bottom{max-width:1000px;width:100%;margin:auto auto 0}.player-bottom p{font-size:14px}.timeline{display:flex;align-items:center;gap:20px;font-variant-numeric:tabular-nums}.timeline progress{flex:1;width:100%;height:5px;accent-color:var(--accent)}.player-controls{display:flex;justify-content:center;gap:20px;margin-top:24px}#toast{position:fixed;bottom:70px;left:50%;transform:translateX(-50%);padding:14px 25px;max-width:80vw;background:#d7f272;color:#15200e;border-radius:9px;z-index:50;font-size:14px}.skeleton{height:15px;background:linear-gradient(90deg,#282c35,#393e49,#282c35);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:4px;margin:15px 0;max-width:500px}@keyframes shimmer{to{background-position:-200% 0}}.reduced-motion *{animation:none!important;transition:none!important;scroll-behavior:auto!important}.error{color:var(--amber)}
@media(min-width:1800px){:root{--side:300px;font-size:23px}.sidebar{padding-top:50px}.brand{font-size:24px;padding-bottom:60px}.brand-mark{font-size:63px}nav a{font-size:20px;padding:15px 18px}.topbar{height:120px}.topbar>span,.status-chip{font-size:14px}.hero{min-height:490px;padding:65px}.hero-copy{max-width:850px}.hero p.description{font-size:21px;max-width:640px}.hero-art{right:50px;width:440px;height:440px}.hero-art span{inset:130px}.eyebrow{font-size:14px}.actions button,.empty p{font-size:18px}.section-header h2{font-size:28px}.empty h3{font-size:22px}.info-card{padding:35px}.info-card h3{font-size:25px}.info-card p{font-size:17px}.info-card .cap-state{font-size:14px}.remote-hint{font-size:14px}.remote-hint kbd{font-size:12px}.page-title h1{font-size:55px}.page-title p,.notice,.modal-card p{font-size:20px}.setting h3{font-size:23px}.setting p{font-size:17px}.setting button{font-size:18px}.history-card h3{font-size:23px}.history-card p{font-size:18px}}
@media(max-width:1050px){:root{--side:200px}.sidebar{padding:25px 12px}.brand{padding-left:7px;gap:10px;font-size:15px}nav a{font-size:13px;gap:10px}.topbar,main{padding-left:26px;padding-right:26px}.hero{padding:30px}.hero-art{right:-100px;opacity:.45}.hero-copy{max-width:90%}.hero h1{font-size:43px}.grid{grid-template-columns:1fr}.empty{align-items:flex-start;flex-wrap:wrap}.empty button{margin-left:76px}.remote-hint{padding-left:26px;padding-right:26px}.hint-right{display:none}.history-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){:root{--side:76px}.brand{padding:0 5px 30px}.brand>span:last-child,nav a span,.sidebar-footer{display:none}nav a{justify-content:center;padding:12px}.topbar{height:75px;padding:0 18px}.topbar>span{display:none}main{padding:0 18px 85px}.hero{padding:25px;min-height:350px}.hero h1{font-size:36px}.hero-art{opacity:.2}.hero-copy{max-width:100%}.hero .description{font-size:13px}.section-header{flex-wrap:wrap}.section-header h2{font-size:18px}.empty{padding:20px;gap:15px}.empty-icon{display:none}.empty button{margin-left:0}.remote-hint{padding:12px;font-size:9px;gap:8px}.history-grid{grid-template-columns:1fr}.page-title h1{font-size:32px}.modal{padding:14px}.modal-card{padding:22px}.keyboard{gap:4px}.keyboard button{font-size:12px}.player-shade{padding:20px}.player-controls button{padding:10px;font-size:13px}.setting{align-items:flex-start}.setting button{min-width:75px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.poster-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:20px;margin:20px 0}.poster-card{padding:0 0 15px;overflow:hidden;text-align:left;background:var(--panel);min-width:0}.poster-card img,.poster-placeholder{width:100%;aspect-ratio:2/3;object-fit:cover;background:#272b35;display:grid;place-items:center;font-size:45px}.poster-card h3{font-size:15px;padding:0 12px;margin:13px 0 6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.poster-card p,.poster-card small{font-size:11px;margin:5px 12px;color:var(--muted)}@media(max-width:1050px){.poster-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:640px){.poster-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}