@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');
:root{color-scheme:dark;--bg:#0b0d14;--panel:#121622;--panel2:#191f2d;--line:#262d3e;--text:#f4f5fb;--muted:#929bb0;--purple:#7959ff;--purple2:#a48cff}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:15px Manrope,Segoe UI,Arial,sans-serif}button,input{font:inherit}button{cursor:pointer}.topbar{height:72px;display:flex;align-items:center;gap:36px;padding:0 30px;background:#0e111a;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}.brand{font-size:20px;letter-spacing:-.8px;font-weight:800;color:white;text-decoration:none;white-space:nowrap}.brand b,.modal-brand b{color:var(--purple2)}.search{display:flex;align-items:center;gap:10px;width:min(540px,45vw);padding:0 15px;background:#191f2c;border:1px solid var(--line);border-radius:11px;color:var(--muted)}.search input{width:100%;height:42px;background:transparent;border:0;outline:0;color:white}.top-actions{margin-left:auto;display:flex;gap:10px}.btn{border:0;border-radius:10px;padding:11px 17px;font-weight:800}.primary{background:var(--purple);color:white}.primary:hover{background:#6848f2}.ghost,.user-chip{background:#202638;color:#e8eaff;border:1px solid #30384d}.shell{display:grid;grid-template-columns:220px minmax(0,1fr);max-width:1600px;margin:auto}.sidebar{padding:25px 14px;border-right:1px solid var(--line);min-height:calc(100vh - 72px)}.nav-item{width:100%;display:flex;align-items:center;gap:13px;padding:13px 14px;margin:3px 0;background:transparent;color:#b8c0d2;border:0;border-radius:10px;text-align:left;font-weight:700}.nav-item:hover,.nav-item.active{background:#211d3d;color:white}.side-caption{font-size:10px;font-weight:800;letter-spacing:1.2px;color:#707a91;padding:27px 13px 8px}.content{padding:30px;min-width:0}.hero{min-height:270px;padding:34px 42px;border:1px solid #40366d;border-radius:20px;background:radial-gradient(circle at 78% 40%,#47358a 0,#28204e 24%,transparent 55%),linear-gradient(110deg,#211b42,#151a2c);display:flex;align-items:center;justify-content:space-between;overflow:hidden}.eyebrow{font-size:10px;letter-spacing:1.5px;font-weight:800;color:#c4b7ff}.eyebrow i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#9a7cff;margin-right:7px}.hero h1{font-size:36px;line-height:1.2;letter-spacing:-1.4px;margin:13px 0}.hero h1 em{font-style:normal;color:#b6a4ff}.hero p{color:#c0bfd4;margin:0 0 22px}.hero-symbol{font-size:155px;font-weight:800;color:#ffffff18;position:relative;margin-right:55px}.hero-symbol span{font-size:47px;color:#c1b2ff;position:absolute;left:62px;top:58px}.section-heading{display:flex;justify-content:space-between;align-items:center;margin:31px 0 17px}.section-heading h2{font-size:21px;margin:0 0 5px}.section-heading p{font-size:13px;color:var(--muted);margin:0}.demo-label{font-size:10px;letter-spacing:1px;color:#b7a7ff;border:1px solid #45386d;padding:7px 9px;border-radius:7px}.video-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px 17px}.video-card{min-width:0;cursor:pointer}.thumbnail{height:165px;border-radius:13px;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden}.thumbnail strong{font-size:48px}.thumbnail small{font-size:10px;letter-spacing:1.6px;font-weight:800;color:#ffffffa8;margin-top:7px}.thumb-purple{background:linear-gradient(135deg,#422c79,#1e4266)}.thumb-blue{background:linear-gradient(135deg,#1e4771,#292454)}.thumb-pink{background:linear-gradient(135deg,#71334f,#30244e)}.thumb-orange{background:linear-gradient(135deg,#79502c,#47264e)}.thumb-green{background:linear-gradient(135deg,#1f644e,#26395c)}.thumb-indigo{background:linear-gradient(135deg,#344a80,#542c63)}.live-label{position:absolute;top:10px;left:10px;padding:5px 8px;background:#d9365c;border-radius:5px;font-size:9px;font-weight:900}.duration{position:absolute;right:9px;bottom:9px;background:#080a10d9;padding:4px 7px;border-radius:5px;font-size:10px}.video-meta{display:flex;gap:10px;padding-top:11px}.channel-avatar{width:36px;height:36px;flex:none;border-radius:50%;display:grid;place-items:center;background:#3d326a;font-weight:800}.channel-avatar.blue{background:#24547b}.channel-avatar.pink{background:#71334f}.channel-avatar.orange{background:#79502c}.channel-avatar.green{background:#1f644e}.video-meta h3{font-size:13px;line-height:1.4;margin:0 0 5px}.video-meta p{font-size:11px;color:var(--muted);margin:0}.notice{margin-top:25px;padding:13px 15px;border:1px dashed #343c50;border-radius:10px;color:var(--muted);font-size:12px;line-height:1.6}.modal-backdrop{position:fixed;inset:0;background:#05060bdc;display:grid;place-items:center;padding:18px;z-index:20}.modal-backdrop[hidden]{display:none}.modal{width:min(430px,100%);background:#151a27;border:1px solid #30384b;border-radius:18px;padding:27px;position:relative;box-shadow:0 25px 90px #0009}.modal-close{position:absolute;right:17px;top:12px;background:transparent;border:0;color:#aab2c4;font-size:27px}.modal-brand{font-weight:900;letter-spacing:-.5px}.modal h2{margin:20px 0 5px}.modal-subtitle{font-size:13px;color:var(--muted);margin:0 0 18px}.auth-tabs{display:flex;background:#0d111b;padding:4px;border-radius:9px;margin:12px 0}.auth-tabs button{flex:1;padding:9px;border:0;border-radius:7px;background:transparent;color:var(--muted)}.auth-tabs button.selected{background:#292344;color:white}.modal form label{display:block;font-size:12px;color:#cbd1df;margin:13px 0}.modal form input{display:block;width:100%;padding:12px;margin-top:7px;border-radius:9px;border:1px solid #30384b;background:#0d111b;color:white;outline:0}.modal form input:focus{border-color:var(--purple)}.full{width:100%;margin-top:9px}.form-message{font-size:12px;color:#ff9aab;min-height:16px}.security-note{font-size:10px;line-height:1.5;color:#818ba1;margin:8px 0 0}
@media(max-width:1050px){.video-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.shell{grid-template-columns:190px minmax(0,1fr)}}
@media(max-width:700px){.topbar{height:62px;padding:0 13px;gap:12px}.search{display:none}.top-actions .ghost{display:none}.shell{display:block}.sidebar{min-height:0;display:flex;overflow:auto;padding:7px;border:0;border-bottom:1px solid var(--line);position:sticky;top:62px;background:var(--bg);z-index:4}.nav-item{width:auto;white-space:nowrap;padding:10px}.nav-item span{display:none}.side-caption{display:none}.content{padding:17px 13px}.hero{min-height:240px;padding:23px}.hero h1{font-size:28px}.hero-symbol{font-size:95px;margin:0}.hero-symbol span{font-size:30px;left:39px;top:35px}.video-grid{grid-template-columns:1fr}.thumbnail{height:190px}.section-heading{align-items:flex-start;gap:10px}.demo-label{white-space:nowrap}}
