:root{--navy:#071329;--ink:#0a1630;--paper:#f4f7fb;--line:#cbd8e8;--blue:#1757e8;--cyan:#24c7dc;--muted:#63758e;--white:#fff;--shadow:0 28px 80px rgba(7,19,41,.16)}
[hidden]{display:none!important}
.mobile-lesson-picker{display:none}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:"Avenir Next","PingFang SC","Microsoft YaHei",sans-serif;letter-spacing:0}button,input{font:inherit}a{color:inherit;text-decoration:none}.topbar{height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 4vw;background:var(--navy);color:#fff}.brand{display:flex;align-items:center;gap:12px}.brand span{width:38px;height:38px;display:grid;place-items:center;background:#fff;color:var(--blue);border-radius:8px;font-size:12px;font-weight:950}.brand b{font-size:17px}.top-actions{display:flex;align-items:center;gap:18px;font-size:13px}.top-actions a{color:#cbdcff}.top-actions button{border:1px solid #385273;background:transparent;color:#fff;padding:8px 12px;border-radius:7px;cursor:pointer}
.gate{min-height:calc(100vh - 72px);display:grid;grid-template-columns:minmax(300px,.85fr) minmax(420px,1.15fr);background:var(--navy);color:#fff}.gate-visual{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;padding:8vw 5vw;background:linear-gradient(180deg,rgba(5,14,32,.05),rgba(5,14,32,.9)),url("../../wotu-ai/assets/hero-ai-studio-desktop.jpg") center/cover}.gate-visual:after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 40%,rgba(36,199,220,.18));pointer-events:none}.gate-visual span{position:relative;z-index:1;font-size:clamp(90px,15vw,220px);font-weight:950;line-height:.8;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.48)}.gate-visual strong{position:relative;z-index:1;font-size:clamp(44px,7vw,104px);line-height:.9}.gate-visual i{position:relative;z-index:1;margin-top:20px;color:#9feef7;font-style:normal;font-weight:800}.access-form{align-self:center;width:min(620px,84%);margin:0 auto}.eyebrow{color:#65d8e7;font-size:12px;font-weight:900}.access-form h1{margin:18px 0;font-size:clamp(40px,5vw,78px);line-height:1.02}.access-form>p:not(.eyebrow){max-width:570px;color:#b8c9df;line-height:1.8}.access-form label{display:block;margin-top:18px;color:#d7e3f2;font-size:13px;font-weight:800}.access-form input{width:100%;height:56px;margin-top:8px;padding:0 16px;border:1px solid #385273;border-radius:8px;background:#0d203e;color:#fff;outline:none}.access-form input:focus{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(36,199,220,.14)}.access-form button{width:100%;height:58px;margin-top:20px;border:0;border-radius:8px;background:var(--blue);color:#fff;font-weight:950;cursor:pointer}.access-form button:disabled{opacity:.5}.access-form small,.access-form #accessStatus{display:block;margin-top:14px;color:#9cb0c9}.access-form small a{color:#fff;text-decoration:underline}.access-form #accessStatus{min-height:22px;color:#ffcb67}
.classroom{min-height:calc(100vh - 72px);display:grid;grid-template-columns:360px minmax(0,1fr)}.course-nav{padding:28px 22px;background:#09172e;color:#fff;overflow:auto;max-height:calc(100vh - 72px);position:sticky;top:72px}.course-meta p{margin:0;color:#6cdce9;font-size:11px;font-weight:900}.course-meta h1{margin:8px 0;font-size:28px}.course-meta span{color:#9db0c8;font-size:12px}.progress{margin:24px 0}.progress>div{display:flex;justify-content:space-between;color:#b8c9df;font-size:12px}.progress i{display:block;height:5px;margin-top:9px;background:#203756;border-radius:5px;overflow:hidden}.progress em{display:block;width:0;height:100%;background:var(--cyan);transition:width .3s}.day-group{margin-top:24px}.day-label{display:flex;justify-content:space-between;margin-bottom:8px;color:#6f8aab;font-size:11px;font-weight:900}.lesson-button{width:100%;display:grid;grid-template-columns:38px 1fr auto;gap:9px;align-items:center;padding:11px 8px;border:0;border-top:1px solid #1e3554;background:transparent;color:#dce7f5;text-align:left;cursor:pointer}.lesson-button:hover,.lesson-button.active{background:#142a49}.lesson-button .number{color:#69d9e7;font-size:11px}.lesson-button b{font-size:13px;line-height:1.4}.lesson-button small{color:#6f89a9}.lesson-button.done small{color:#6fe3b6}
.lesson-stage{min-width:0;padding:42px clamp(24px,5vw,76px) 64px}.stage-head{display:flex;align-items:end;justify-content:space-between;gap:20px}.stage-head span{color:var(--blue);font-size:12px;font-weight:950}.stage-head h2{margin:8px 0 0;font-size:clamp(26px,3vw,46px);line-height:1.15}.stage-head button{height:42px;padding:0 16px;border:1px solid var(--line);border-radius:7px;background:#fff;color:var(--ink);font-weight:850;cursor:pointer}.video-shell{position:relative;aspect-ratio:16/9;margin-top:26px;background:#050b17;box-shadow:var(--shadow);overflow:hidden}.video-shell video{width:100%;height:100%;display:block;background:#000}.video-shell #videoEmpty{position:absolute;inset:0;display:grid;place-content:center;text-align:center;color:#fff}.video-shell #videoEmpty b{font-size:24px}.video-shell #videoEmpty span{margin-top:8px;color:#8195af;font-size:12px}.task-strip{display:grid;grid-template-columns:100px 1fr;gap:22px;margin-top:20px;padding:22px 0;border-bottom:1px solid var(--line)}.task-strip span{color:var(--blue);font-size:12px;font-weight:950}.task-strip p{margin:0;line-height:1.7}.day-results{display:grid;grid-template-columns:repeat(5,1fr);margin-top:34px;border-top:1px solid var(--line);border-left:1px solid var(--line)}.day-results div{min-height:96px;padding:18px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:#fff}.day-results small{display:block;color:var(--blue);font-size:10px}.day-results b{display:block;margin-top:9px;font-size:14px;line-height:1.35}#toast{position:fixed;left:50%;bottom:30px;z-index:30;transform:translate(-50%,20px);padding:11px 16px;border-radius:7px;background:#071329;color:#fff;opacity:0;pointer-events:none;transition:.2s}#toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:900px){.gate{grid-template-columns:1fr}.gate-visual{min-height:34vh;padding:36px 24px}.gate-visual span{font-size:88px}.gate-visual strong{font-size:48px}.access-form{width:auto;margin:0;padding:38px 22px 70px}.access-form h1{font-size:42px}.classroom{grid-template-columns:1fr}.course-nav{display:none}.lesson-stage{padding:24px 16px 56px}.mobile-lesson-picker{display:grid;gap:8px;margin-bottom:20px;color:var(--muted);font-size:11px;font-weight:900}.mobile-lesson-picker select{width:100%;min-height:52px;padding:0 12px;border:1px solid var(--line);border-radius:7px;background:#fff;color:var(--ink);font:inherit}.stage-head{align-items:flex-start;flex-direction:column}.day-results{grid-template-columns:1fr 1fr}.task-strip{grid-template-columns:1fr;gap:8px}.topbar{padding:0 16px}.brand b{font-size:14px}.top-actions{gap:10px}.top-actions a{display:none}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}