:root{--ink:#20211e;--muted:#686a63;--green:#b83e20;--lime:#e5e1d7;--line:#d4d3ca;--paper:#f4f3ed;--white:#fff;--accent:#e2603e;--dark:#171715}
body{font-family:"Helvetica Neue",Arial,"Microsoft YaHei",sans-serif;background:var(--paper);color:var(--ink)}
.skip-link{position:absolute;left:20px;top:-100px;z-index:99;padding:12px;background:white;color:black}.skip-link:focus{top:10px}
.topbar{background:#a51f30;color:white;border-bottom:1px solid #8c1928;padding:18px 4%;gap:24px;min-height:110px;flex-wrap:wrap}
.school-brand{display:flex;align-items:center;gap:28px;flex-shrink:0}.school-logo{position:relative;display:block;width:210px;aspect-ratio:350/110;overflow:hidden;flex-shrink:0}.school-logo img{position:absolute;width:293.142857%;max-width:none;height:auto;left:-72.285714%;top:-194.545455%}
.academy-logo{display:block;width:148px;height:auto;flex:none}
.brand-project{font-size:15px;border-left:1px solid #ffffff66;padding-left:25px;letter-spacing:2px}.brand-project span{display:block;font-size:8px;letter-spacing:1.6px;margin-top:7px;color:#ffe7ea}
.topbar nav{gap:22px;margin-left:auto;color:#fff;flex-wrap:wrap}.topbar nav a{font-size:12px;white-space:nowrap}.topbar nav a:hover,.account a:hover{color:#ffe3d8}.account{color:#fff;flex-wrap:wrap}.account-entry{border:1px solid #ffffff99;padding:10px 14px}.account button{color:inherit}
main{max-width:1440px;padding:46px 5% 80px}.eyebrow{color:#7d4939;font-size:10px;font-weight:500;letter-spacing:1.8px}.primary,.secondary{border-radius:0;gap:40px;transition:background .2s,color .2s,transform .2s}.primary{background:#252620;color:#fff}.primary:hover{background:#b83e20}.secondary{border-color:#9d9e94}.secondary:hover{background:#e5e3d8}.pill{border-radius:2px;background:#e9e6dc;color:#605748}.step-card,.side-card,.login-card,.lesson,.run-row,.notice{border-radius:2px}.step-card{box-shadow:none}.side-card{background:#e9e7df}.progress>span{background:#b83e20}.step-nav li.current{color:#a43d24}.step-nav li.done{color:#6a704b}.rule{background:#f1f0e9}.score{color:#b83e20}.env-banner{background:#e9d2b4;color:#684a27}.notice.success{background:#e8eddf;color:#384633}.notice.error{background:#f8e5df;color:#9a311f}
.home-page main{max-width:none;padding:0}.home-page main>.notice{max-width:1180px;margin:20px auto}
.project-hero{background:var(--dark);color:#f1eee5;padding:24px 5% 0}.hero-meta{max-width:1320px;margin:auto;display:flex;justify-content:space-between;font-size:10px;letter-spacing:1.8px;color:#c8c5bb}.hero-intro{max-width:1100px;margin:auto;padding:64px 0 48px;text-align:center}.hero-overline{font-size:10px;letter-spacing:3px;display:flex;align-items:center;justify-content:center;gap:14px;color:#d9d4c7}.accent-star{font-size:30px;color:var(--accent);line-height:1}.project-hero h1{font-size:clamp(40px,6.5vw,86px);line-height:1.18;letter-spacing:-3px;font-weight:500;margin:30px 0;position:relative}.project-hero h1 em{color:var(--accent);font-style:normal}.title-dot{font-size:18px;vertical-align:top;display:inline-block;margin:10px 0 0 8px;color:#d6d2c5}.hero-description{font-size:14px;line-height:1.95;max-width:680px;margin:0 auto;color:#bcbdb2}.project-hero .hero-actions{justify-content:center;margin:30px 0}.project-hero .primary{background:#e4e1d4;color:#171715;min-width:190px}.project-hero .primary:hover{background:#eb7956}.project-hero .secondary{color:#e4e1d4;border-color:#64645b;min-width:170px}.project-hero .secondary:hover{background:#30312c}.hero-facts{display:flex;justify-content:center;gap:36px;flex-wrap:wrap;color:#898c80;font-size:10px}.hero-facts b{font-weight:400;color:#d8d7cd;margin-left:10px;font-size:11px}
.project-film{max-width:1180px;margin:auto}.film-label,.film-caption{display:flex;justify-content:space-between;font-size:9px;letter-spacing:1.5px;padding:15px 0;color:#bdbdb1}.film-label{border-top:1px solid #4a4b43}.project-film video{display:block;width:100%;aspect-ratio:16/9;object-fit:contain;background:#080a08}.film-caption{padding-bottom:34px;color:#8d9084}
.home-section{max-width:1320px;padding:85px 36px;margin:auto}.home-section h2{font-size:clamp(27px,3vw,42px);letter-spacing:-1.4px;line-height:1.4;font-weight:500}.section-head p{max-width:430px;font-size:13px;line-height:1.9}.editorial-heading{align-items:flex-end;margin-bottom:38px}.editorial-heading h2{margin-bottom:0}.feature-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}.feature-image{aspect-ratio:4/4.5;background:#d3d5c8;overflow:hidden;position:relative}.feature-image img{width:100%;height:100%;object-fit:cover;transition:transform .45s}.feature a:hover img{transform:scale(1.035)}.feature-image>span{position:absolute;bottom:12px;left:12px;font-size:9px;letter-spacing:1px;background:#f3f1e9;padding:5px 7px;color:#282a22}.feature h3{font-size:17px;font-weight:500;line-height:1.55;display:flex;justify-content:space-between;gap:12px;margin:17px 0 10px}.feature h3 span{flex-shrink:0}.feature p{font-size:12px;line-height:1.9;color:#6a6d61}.full-link{display:flex;align-items:center;justify-content:space-between;background:#24251f;color:#eeeade;padding:12px 18px;margin-top:30px;font-size:11px}.full-link span:last-child{font-size:22px}.full-link:hover{background:#b84426}
.learning-section{border-top:1px solid var(--line)}.editorial-lessons{border-top:1px solid #383a31;margin-top:32px}.editorial-lesson{border-bottom:1px solid var(--line)}.editorial-lesson summary{display:flex;align-items:center;gap:30px;padding:22px 8px;cursor:pointer;list-style:none}.editorial-lesson summary::-webkit-details-marker{display:none}.editorial-lesson h3{font-size:18px;font-weight:500;margin:0}.editorial-lesson .step-index{font-family:Georgia,serif;color:#8a8e79;font-size:25px;min-width:38px}.expand-mark{margin-left:auto;font-size:24px;font-weight:300}.editorial-lesson[open] .expand-mark{transform:rotate(45deg)}.editorial-lesson[open] summary{color:#a74429}.lesson-detail{padding:0 58px 20px 76px;max-width:1000px}.lesson-detail p{line-height:1.9;font-size:13px}.lesson-detail .micro{font-size:11px}
.access-section{display:grid;grid-template-columns:1fr 1fr;gap:90px;border-top:1px solid var(--line)}.access-section p{font-size:13px;line-height:1.9}.access-section .primary{margin-top:8px}.preparation-list{list-style:none;margin:0;padding:0}.preparation-list li{display:flex;gap:26px;border-top:1px solid var(--line);padding:22px 0 8px}.preparation-list li>span{font-family:Georgia,serif;font-size:22px;color:#8c907e}.preparation-list h3{font-size:16px;font-weight:500;margin:0 0 8px}.records-section{padding-bottom:20px}.records-section .run-row{background:#eae8df;border:0;border-bottom:1px solid var(--line)}
.experiment-introduction { max-width: 48em; margin: 0 auto clamp(32px, 5vw, 64px); font-size: 16px; line-height: 1.9; }
.experiment-introduction p + p { margin-top: 1em; }
.site-footer{display:block;max-width:none;margin:0;background:#a51f30;color:#fff;padding:50px 5% 24px;border:0}.footer-top{max-width:1250px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:40px}.footer-top p{font-size:29px;line-height:1.5;letter-spacing:-1px;margin:0;color:#fff}.footer-top em{font-style:normal;color:#ffe4de}.back-top{font-size:11px;border:1px solid #ffffff88;padding:11px 17px}.footer-bottom{max-width:1250px;margin:42px auto 0;border-top:1px solid #ffffff55;padding-top:20px;display:flex;justify-content:space-between;gap:20px;font-size:9px;letter-spacing:1px;color:#ffe7ea}
@media(min-width:1500px){.topbar{padding-left:max(5%,calc((100vw - 1440px)/2));padding-right:max(5%,calc((100vw - 1440px)/2))}}
@media(max-width:1100px){.brand-project{display:none}.topbar{gap:15px}.school-logo{width:180px}.topbar nav{gap:16px}.topbar nav a{font-size:11px}.account{font-size:11px}.feature-grid{gap:18px}.feature h3{font-size:15px}.access-section{gap:40px}}
@media(max-width:760px){.topbar{padding:15px 20px;min-height:0;justify-content:space-between}.topbar .school-brand{gap:12px}.topbar .school-logo{width:clamp(110px,28vw,168px)}.topbar .academy-logo{width:clamp(80px,20vw,118px)}.topbar nav{order:3;width:100%;margin:0;border-top:1px solid #ffffff55;padding-top:14px;gap:19px}.account{max-width:45%;justify-content:flex-end}.hero-meta{font-size:8px;letter-spacing:.8px;gap:14px}.hero-intro{padding:45px 0 30px}.project-hero h1{font-size:clamp(34px,7.9vw,58px);letter-spacing:-1.8px;margin:25px 0}.hero-overline{font-size:8px;letter-spacing:2px}.hero-description{font-size:12px;padding:0 10px}.title-dot{font-size:12px}.project-hero .hero-actions{gap:12px}.project-hero .primary,.project-hero .secondary{min-width:140px;padding:11px 16px;gap:20px;font-size:12px}.hero-facts{gap:10px 18px;font-size:9px}.hero-facts b{font-size:9px}.film-label,.film-caption{font-size:8px;letter-spacing:.3px;gap:16px}.film-label span:last-child{display:none}.home-section{padding:48px 22px}.feature-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 16px}.feature h3{font-size:14px}.feature p{font-size:11px}.section-head p{font-size:12px;margin-bottom:0}.editorial-heading{gap:18px}.feature-image{aspect-ratio:4/4.3}.feature-image>span{font-size:7px;left:7px;bottom:7px}.access-section{grid-template-columns:1fr;gap:30px}.editorial-lesson summary{gap:15px;padding:19px 0}.editorial-lesson h3{font-size:15px}.editorial-lesson .step-index{font-size:23px;min-width:28px}.lesson-detail{padding:0 10px 16px 43px}.footer-top{flex-wrap:wrap;gap:28px}.footer-top p{font-size:24px}.footer-top .school-logo{width:180px}.footer-bottom{flex-direction:column;gap:8px;margin-top:28px}.site-footer{padding:36px 22px 25px}.home-section h2{font-size:28px}.project-hero{padding-left:20px;padding-right:20px}main{padding:28px 20px 50px}}
.film-stage{position:relative}.film-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:100px;height:100px;border:1px solid #eee7d8;border-radius:50%;background:#191b16b3;backdrop-filter:blur(6px);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}.film-play[hidden]{display:none}.film-play span{font-size:23px;padding-left:5px}.film-play small{font-size:9px;letter-spacing:1px}.film-play:hover{background:#b74326dd}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.feature-image img,.primary,.secondary{transition:none}}
