@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;600;700;800&display=swap');
:root{color-scheme:dark;--bg:#0b1115;--card:#141e24;--muted:#9eaeb6;--teal:#74e2c5;--border:#2c3b43}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:#f4f4e9;font:15px/1.6 'DM Sans',sans-serif}button,input,textarea{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer;border:0;border-radius:8px;background:var(--teal);color:#092b25;font-weight:700;padding:13px 19px}button:disabled{opacity:.5;cursor:default}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #f0c56c;outline-offset:4px}[hidden]{display:none!important}header{padding:23px 5vw;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff10}.brand{display:flex;gap:12px;align-items:center;font:800 15px 'Manrope',sans-serif;letter-spacing:1.2px}.brand-symbol{color:var(--teal);font-size:34px;line-height:1}.brand small{display:block;font-size:8px;letter-spacing:3px;color:var(--muted);margin-top:6px}nav{display:flex;align-items:center;gap:25px}.hero{min-height:560px;background:linear-gradient(90deg,#0b1115 5%,#0b1115d9 37%,#0b11151c 75%),linear-gradient(0deg,#0b1115,transparent 35%),url('assets/hero.jpg') center right/cover;padding:72px 6vw}.hero-content{max-width:630px}.eyebrow{font-size:10px;font-weight:800;color:var(--teal);letter-spacing:2.3px}h1,h2,h3{font-family:'Manrope',sans-serif;line-height:1.15}h1{font-size:clamp(42px,5.5vw,75px);letter-spacing:-3px;margin:23px 0}h1 em{font-style:normal;color:var(--teal)}.intro{max-width:445px;color:#bdc7cb;font-size:16px}.actions{display:flex;gap:14px;align-items:center;margin:30px 0}.actions span{padding-left:20px}.secondary{background:transparent;color:#edf4f1;border:1px solid var(--border);border-radius:8px;padding:12px 19px}.hero-foot{font-size:11px;color:var(--muted)}.library{padding:20px 6vw 54px}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:20px}h2{font-size:29px;margin:12px 0}.section-heading>p{font-size:12px;color:var(--muted)}.filters{display:flex;gap:12px;margin:24px 0}.filters button{background:#162127;color:var(--muted);font-size:12px;padding:9px 17px;border-radius:30px}.filters button.active{background:var(--teal);color:#092b25}.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}.card{min-width:0;border:1px solid var(--border);border-radius:14px;background:#121b20;overflow:hidden;transition:transform .25s,border-color .25s}.card:hover{transform:translateY(-5px);border-color:#74e2c588}.card img{width:100%;aspect-ratio:6/5;object-fit:cover;display:block}.card-info{padding:19px}.card h3{font-size:19px;margin:12px 0}.card p{font-size:12px;color:var(--muted);min-height:40px}.tag{font-size:10px;font-weight:700;letter-spacing:1px;color:#a9bbc3}.tag.owned{color:var(--teal)}.card button{width:100%;font-size:12px}.how{display:grid;grid-template-columns:repeat(3,1fr);gap:25px;margin:15px 6vw 75px;border-top:1px solid var(--border);padding-top:35px}.how span{color:var(--teal);font-size:12px}.how h3{font-size:18px}.how p{color:var(--muted);font-size:13px}footer{border-top:1px solid var(--border);padding:25px 6vw;font-size:10px;letter-spacing:2px;color:var(--muted)}footer span{float:right}dialog{background:#131d23;color:#f4f4e9;border:1px solid var(--border);border-radius:18px;width:min(95vw,530px);max-height:90dvh;padding:36px;box-shadow:0 30px 100px #0008}dialog::backdrop{background:#030a10d9;backdrop-filter:blur(7px)}dialog p{color:var(--muted)}.close{position:absolute;right:12px;top:9px;background:transparent;color:#dbe6e4;font-size:27px;padding:2px 10px}label{display:block;margin:18px 0 9px;color:#bdcbd0;font-size:13px}input[type=email],textarea{width:100%;background:#0d151a;border:1px solid var(--border);border-radius:8px;color:#fff;padding:14px}#send-link{width:100%;margin-top:18px}.hint{font-size:11px}#auth-status{font-size:13px}#product-details>img{width:100%;border-radius:9px}.material{display:flex;align-items:center;justify-content:space-between;gap:15px;background:#19262e;border:1px solid var(--border);padding:15px;border-radius:10px;margin:12px 0}.material span{font-size:13px}.material button{font-size:12px;white-space:nowrap}#classroom{width:min(1400px,96vw);padding:0}.class-layout{display:grid;grid-template-columns:270px 1fr}.class-layout aside{padding:40px 25px;background:#0e171c;border-right:1px solid var(--border)}.class-layout>section{padding:40px;min-width:0}.class-layout aside h2{font-size:25px;margin-bottom:30px}#lesson-menu button{background:transparent;color:#aebfc5;width:100%;text-align:left;font-size:12px;border-bottom:1px solid #ffffff10;border-radius:0;padding:15px 0}#lesson-menu button.selected{color:var(--teal)}.player-title>span{font-size:10px;color:var(--teal);letter-spacing:2px}video{width:100%;aspect-ratio:16/9;background:#070c10;border-radius:12px}.lesson-nav{display:flex;justify-content:space-between;margin:20px 0}.lesson-nav button{font-size:12px}#lesson-content h3{margin-top:30px;font-size:20px}#lesson-content p,#lesson-content li{color:#bac7cb;font-size:14px}pre{white-space:pre-wrap;word-break:break-word;background:#0a1217;padding:20px;border:1px solid #284149;border-radius:10px;font:13px/1.6 'DM Sans',sans-serif}.prompt button{font-size:11px;padding:8px 15px}.practice{border-top:1px solid var(--border);margin-top:30px;padding-top:10px}.practice label input{accent-color:var(--teal);margin-right:7px}.practice>button{margin-top:15px;margin-right:8px;font-size:12px}#toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:#20392f;border:1px solid var(--teal);padding:12px 22px;border-radius:9px;z-index:9999;max-width:90vw}#catalog-status,#save-status,#player-status{font-size:13px;color:var(--muted)}@media(max-width:1000px){.cards{grid-template-columns:repeat(2,1fr)}.hero{background-position:65% center}.class-layout{grid-template-columns:210px 1fr}.class-layout>section{padding:35px 22px}}@media(max-width:600px){header{padding:20px}.brand{font-size:11px}.brand-symbol{font-size:28px}nav{gap:12px}nav a{display:none}.hero{min-height:560px;padding:48px 23px;background:linear-gradient(90deg,#0b1115ed,#0b111575),linear-gradient(0deg,#0b1115,transparent 45%),url('assets/hero.jpg') 66% center/cover}h1{letter-spacing:-2px;font-size:43px}.intro{font-size:14px}.actions{flex-direction:column;align-items:start}.library{padding:20px}.section-heading{display:block}.cards{gap:12px}.card-info{padding:12px}.card h3{font-size:16px}.card p{font-size:11px;min-height:60px}.tag{font-size:8px}.how{grid-template-columns:1fr;margin:20px;gap:5px}footer span{float:none;display:block;margin-top:10px}.class-layout{display:block}.class-layout aside{padding:24px;border-right:none}.class-layout aside h2{display:none}#lesson-menu{display:flex;overflow-x:auto;gap:15px}#lesson-menu button{min-width:170px}.class-layout>section{padding:24px 15px}.player-title h2{font-size:22px}.material{display:block}.material button{margin-top:10px}dialog{padding:32px 22px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
