
/* 布局：设计院展板。左侧窄栏放图号与注记，右侧主栏放内容；模型照片作为横向图版贯穿全页 */
:root{
  --paper:#f6f7f5; --ink:#1d2421; --mute:#68716d; --line:#d9dedb;
  --coral:#c8553d; --glass:#3f8f88; --tint:#e8efec; --card:#ffffff;
  --display:"Noto Serif SC","Source Han Serif SC","Songti SC","STSong","SimSun",serif;
  --body:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC","Source Han Sans SC",sans-serif;
  --mono:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --paper:#141917;--ink:#e6ebe8;--mute:#9aa49f;--line:#2d3532;--coral:#e0765f;--glass:#6cbdb4;--tint:#1d2624;--card:#1a201e;color-scheme:dark}}
:root[data-theme="dark"]{--paper:#141917;--ink:#e6ebe8;--mute:#9aa49f;--line:#2d3532;--coral:#e0765f;--glass:#6cbdb4;--tint:#1d2624;--card:#1a201e;color-scheme:dark}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:64px}
html,body{overflow-x:clip}
body{background:var(--paper);color:var(--ink);font-family:var(--body);font-size:15px;line-height:1.75}
.wrap{max-width:1160px;margin:0 auto;padding-inline:clamp(16px,4vw,40px);padding-block:0 64px}
h1,h2,h3{font-family:var(--display);text-wrap:balance;margin:0}
p{margin:0}
a{color:inherit}
.mono{font-family:var(--mono);font-size:12px;letter-spacing:.08em;color:var(--mute);text-transform:uppercase}
:focus-visible{outline:2px solid var(--glass);outline-offset:3px}

/* 导航 */
nav.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;border-bottom:1px solid var(--line)}
/* 毛玻璃放到伪元素：祖先 backdrop-filter 会成为 fixed 抽屉的包含块，导致抽屉高度只剩顶栏高度 */
nav.top::before{content:"";position:absolute;inset:0;z-index:-1;background:color-mix(in srgb,var(--paper) 88%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);pointer-events:none}
nav.top .in{max-width:1160px;margin:0 auto;padding-inline:clamp(16px,4vw,40px);display:flex;align-items:center;gap:20px;height:56px}
nav.top .brand{font-family:var(--display);font-weight:900;font-size:17px;white-space:nowrap;text-decoration:none}
nav.top .brand i{font-style:normal;color:var(--coral)}
nav.top .nav-toggle{display:none;flex:none;align-items:center;justify-content:center;width:44px;height:44px;margin-left:auto;padding:0;border:1px solid var(--line);background:var(--card);color:var(--ink);cursor:pointer;border-radius:8px}
nav.top .nav-toggle-bars{display:flex;flex-direction:column;gap:5px;width:18px}
nav.top .nav-toggle-bars i{display:block;height:2px;background:currentColor;border-radius:1px;transition:transform .25s,opacity .2s}
nav.top.is-open .nav-toggle-bars i:nth-child(1){transform:translateY(7px) rotate(45deg)}
nav.top.is-open .nav-toggle-bars i:nth-child(2){opacity:0}
nav.top.is-open .nav-toggle-bars i:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
nav.top .nav-panel{display:contents}
nav.top .links{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;margin-left:auto}
nav.top .links::-webkit-scrollbar{display:none}
nav.top .links a{position:relative;text-decoration:none;font-size:14px;padding:6px 10px;color:var(--mute);white-space:nowrap;transition:color .2s}
nav.top .links a::after{content:"";position:absolute;left:10px;right:10px;bottom:0;height:2px;background:var(--coral);transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.2,.7,.2,1)}
nav.top .links a:hover,nav.top .links a.on{color:var(--ink)}
nav.top .links a.on::after{transform:scaleX(1)}
.nav-scrim{position:fixed;inset:0;z-index:25;background:rgba(20,25,23,.42);border:0;padding:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
.nav-scrim[hidden]{display:none!important}
html.nav-lock,html.nav-lock body{overflow:hidden}

/* 主视觉 */
.hero{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(20px,4vw,48px);align-items:end;padding-block:48px 28px}
.hero h1{font-weight:900;font-size:clamp(44px,7.4vw,92px);line-height:1.04;letter-spacing:.02em}
.hero h1 span{display:block;animation:rise .9s cubic-bezier(.2,.7,.2,1) both}
.hero h1 span:nth-child(2){animation-delay:.12s;color:var(--glass)}
.hero .lede{max-width:32em;color:var(--mute);margin-top:18px;animation:rise .9s .25s cubic-bezier(.2,.7,.2,1) both}
.hero .lede b{color:var(--ink);font-weight:500}
.hero .cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px;animation:rise .9s .35s cubic-bezier(.2,.7,.2,1) both}
@keyframes rise{from{transform:translateY(18px)}to{transform:none}}
.btn{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border:1px solid var(--ink);text-decoration:none;font-size:14px;background:transparent;color:var(--ink);cursor:pointer;font-family:var(--body);transition:background .2s,color .2s}
.btn:hover{background:var(--ink);color:var(--paper)}
.btn.solid{background:var(--ink);color:var(--paper)}
.btn.solid:hover{background:var(--coral);border-color:var(--coral)}
.btn .ar{transition:transform .25s}
.btn:hover .ar{transform:translateX(3px)}

.plate{position:relative;overflow:hidden;border-radius:2px;background:var(--tint);margin:0}
.plate img{display:block;width:100%;height:auto}
.plate.drift img{animation:drift 18s ease-in-out infinite alternate}
@keyframes drift{from{transform:scale(1.05) translateX(-1.2%)}to{transform:scale(1.05) translateX(1.2%)}}
.plate figcaption{position:absolute;left:12px;bottom:10px;background:var(--paper);padding:2px 8px;font-family:var(--mono);font-size:11px;color:var(--mute)}

.facts{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-top:1px solid var(--ink);border-bottom:1px solid var(--line);margin-top:8px}
.facts div{padding:14px 12px 12px;border-right:1px solid var(--line)}
.facts div:last-child{border-right:0}
.facts strong{display:block;font-family:var(--display);font-weight:900;font-size:32px;line-height:1.1;font-variant-numeric:tabular-nums}
.facts span{font-size:12px;color:var(--mute)}

/* 章节 */
section.sec{display:grid;grid-template-columns:170px minmax(0,1fr);gap:clamp(16px,3vw,40px);padding-block:72px 8px}
.sec > aside{border-top:2px solid var(--ink);padding-top:10px;align-self:start;position:sticky;top:calc(env(safe-area-inset-top,0px) + 72px)}
.sec > aside .mono{display:block}
.sec > aside .zh{display:block;font-family:var(--display);font-weight:900;font-size:15px;margin-top:4px}
.sec h2{font-size:clamp(28px,3.6vw,40px);font-weight:900;margin-bottom:12px}
.sec .intro{color:var(--mute);max-width:44em;margin-bottom:32px}
.sub{font-size:20px;font-weight:900;margin:48px 0 16px;display:flex;align-items:baseline;gap:12px}
.sub .mono{font-size:11px}

/* 滚动显现：静止时可见；只有首屏以下的元素在进入时上浮 */
.js .rv.pre{transform:translateY(36px) scale(.985)}
.rv{transition:transform 1s cubic-bezier(.2,.7,.2,1)}

/* 框架 */
.frame{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:36px;align-items:center}
.frame svg{width:100%;height:auto;max-width:480px;justify-self:center;overflow:visible}
.frame svg text{font-family:var(--body);fill:var(--ink)}
.ring{transform-origin:240px 240px;animation:spin 60s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.radar-draw{stroke-dasharray:1000;stroke-dashoffset:1000}
.radar-draw.go{animation:draw 2.2s ease-out forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.dim-label{cursor:pointer}
.dim-label circle{fill:var(--card);stroke:var(--line);transition:fill .2s,stroke .2s}
.dim-label:hover circle,.dim-label.on circle{fill:var(--glass);stroke:var(--glass)}
.dim-label.on text,.dim-label:hover text{fill:var(--paper)}
.dimtabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px}
.dimtabs button{font:inherit;font-size:13px;padding:4px 12px;border:1px solid var(--line);background:transparent;color:var(--ink);cursor:pointer;transition:all .2s}
.dimtabs button.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.dimcard{border-top:1px solid var(--ink);padding-top:14px;min-height:230px}
.dimcard h3{font-size:24px;font-weight:900}
.dimcard .pts{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0}
.dimcard .pts span{font-size:13px;padding:2px 10px;background:var(--tint);color:var(--glass)}
.dimcard dl{display:grid;grid-template-columns:5.5em 1fr;gap:6px 12px;margin:0;font-size:14px}
.dimcard dt{color:var(--mute)}
.dimcard dd{margin:0}
.fadein{animation:fi .45s ease both}
@keyframes fi{from{transform:translateY(8px);opacity:.2}to{transform:none;opacity:1}}

.concepts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line);margin-top:40px}
.concepts div{padding:18px 16px 18px 0;border-bottom:1px solid var(--line)}
.concepts div + div{padding-left:16px;border-left:1px solid var(--line)}
.concepts strong{font-family:var(--display);font-weight:900;font-size:26px;display:block;line-height:1.2}
.concepts p{color:var(--mute);font-size:14px;margin-top:6px}

.chain{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));margin-top:8px;counter-reset:c}
.chain div{position:relative;padding:16px 14px 14px;border:1px solid var(--line);margin-left:-1px;background:var(--card)}
.chain div::before{counter-increment:c;content:counter(c);font-family:var(--mono);font-size:11px;color:var(--mute);display:block}
.chain div strong{display:block;font-family:var(--display);font-size:17px;font-weight:900}
.chain div span{font-size:13px;color:var(--mute)}
.chain div.h{border-color:var(--coral);z-index:1}
.chain div.h strong{color:var(--coral)}
.chain .pulse{position:absolute;top:-1px;left:0;height:2px;background:var(--glass);width:0}
.chain.go .pulse{animation:pulse 5s linear infinite}
.chain.go div:nth-child(2) .pulse{animation-delay:1s}.chain.go div:nth-child(3) .pulse{animation-delay:2s}.chain.go div:nth-child(4) .pulse{animation-delay:3s}.chain.go div:nth-child(5) .pulse{animation-delay:4s}
@keyframes pulse{0%{width:0}18%{width:100%;opacity:1}20%,100%{width:100%;opacity:0}}
.note{font-size:13px;color:var(--mute);margin-top:12px}

/* 课程 */
.course-head{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:32px;align-items:start}
.course-head .kv{display:grid;grid-template-columns:5em 1fr;gap:8px 16px;margin:0;border-top:1px solid var(--ink);padding-top:14px}
.course-head .kv dt{color:var(--mute);font-size:14px}
.course-head .kv dd{margin:0}
.weight{margin-top:18px}
.weight .bar{display:flex;height:40px;border:1px solid var(--ink)}
.weight .bar div{display:flex;align-items:center;padding-inline:12px;font-size:13px;white-space:nowrap;overflow:hidden;width:0;transition:width 1.4s cubic-bezier(.2,.7,.2,1)}
.weight .bar .a{background:var(--glass);color:var(--paper)}
.weight .bar .b{background:var(--tint)}
.weight.go .a{width:30%}.weight.go .b{width:70%}

.timeline{position:relative;display:grid;grid-template-columns:repeat(9,minmax(0,1fr));margin-top:8px}
.timeline::before{content:"";position:absolute;left:0;right:0;top:15px;height:1px;background:var(--line)}
.timeline .line{position:absolute;left:0;top:15px;height:2px;background:var(--coral);width:0;transition:width 2.4s cubic-bezier(.2,.7,.2,1)}
.timeline.go .line{width:100%}
.timeline div{position:relative;padding-top:34px;padding-right:8px}
.timeline div::before{content:"";position:absolute;top:10px;left:0;width:11px;height:11px;border-radius:50%;background:var(--paper);border:2px solid var(--coral)}
.timeline b{display:block;font-family:var(--display);font-size:16px;font-weight:900}
.timeline span{display:block;font-family:var(--mono);font-size:11px;color:var(--mute)}
.outputs{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.outputs span{border:1px solid var(--line);padding:3px 10px;font-size:13px}

.explainer{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:28px;align-items:center;margin-top:40px;padding:24px;background:var(--tint);position:relative;z-index:1;cursor:pointer;-webkit-tap-highlight-color:rgba(200,85,61,.12)}
.explainer h3{font-size:24px;font-weight:900}
.explainer p{color:var(--mute);margin:8px 0 16px}
.explainer .stack{position:relative;aspect-ratio:16/9;max-width:100%;background:color-mix(in srgb,var(--line) 55%,var(--tint));overflow:hidden;pointer-events:none}
.explainer .stack img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;box-shadow:0 10px 30px -12px rgba(0,0,0,.35);transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.explainer .stack img:nth-child(1){transform:rotate(-4deg) translate(-4%,2%)}
.explainer .stack img:nth-child(2){transform:rotate(2deg) translate(3%,-1%)}
.explainer:hover .stack img:nth-child(1){transform:rotate(-7deg) translate(-8%,3%)}
.explainer:hover .stack img:nth-child(2){transform:rotate(4deg) translate(6%,-3%)}

/* 培养方案 */
.plan-lede{font-family:var(--display);font-size:clamp(18px,2vw,22px);line-height:1.6;max-width:36em;border-left:3px solid var(--coral);padding-left:16px}
.goals{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid var(--line);margin-top:24px}
.goals div{padding:14px 14px 14px 0;border-bottom:1px solid var(--line);font-size:14px}
.goals b{font-family:var(--mono);font-size:11px;color:var(--coral);display:block;font-weight:500}
.mapgrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:24px;margin-top:8px}
.mapgrid .dims,.mapgrid .reqs{display:grid;gap:6px}
.mapgrid button{font:inherit;text-align:left;border:1px solid var(--line);background:var(--card);color:var(--ink);padding:10px 14px;cursor:pointer;transition:all .25s}
.mapgrid .dims button.on{background:var(--glass);border-color:var(--glass);color:var(--paper)}
.mapgrid .reqs div{border:1px solid var(--line);padding:8px 14px;font-size:14px;transition:all .3s;background:var(--card)}
.mapgrid .reqs div b{font-family:var(--mono);font-size:11px;color:var(--mute);margin-right:8px;font-weight:500}
.mapgrid .reqs div.hit{border-color:var(--glass);box-shadow:inset 4px 0 0 var(--glass);transform:translateX(6px)}
.mapgrid .reqs div.hit b{color:var(--glass)}

/* 学生 */
.stu-tools{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin-bottom:16px}
.stu-tools input{font:inherit;padding:8px 12px;border:1px solid var(--line);background:var(--card);color:var(--ink);width:220px;max-width:100%}
.legend-chips{display:flex;gap:12px;font-size:13px;color:var(--mute);flex-wrap:wrap}
.legend-chips i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:5px;vertical-align:middle}
.class-strip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;border-top:1px solid var(--ink);border-bottom:1px solid var(--line);margin-bottom:24px}
.class-strip div{padding:12px;border-right:1px solid var(--line)}
.class-strip div:last-child{border-right:0}
.class-strip span{font-size:12px;color:var(--mute);display:block}
.class-strip .bar{height:4px;background:var(--line);margin-top:8px;position:relative;overflow:hidden}
.class-strip .bar i{position:absolute;left:0;top:0;bottom:0;background:var(--glass);width:0;transition:width 1.4s cubic-bezier(.2,.7,.2,1)}
.class-strip strong{font-family:var(--display);font-weight:900;font-size:24px;font-variant-numeric:tabular-nums}
.stu-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.stu{background:var(--card);border:0;padding:12px 12px 10px;text-align:left;cursor:pointer;font:inherit;color:var(--ink);display:grid;grid-template-columns:1fr auto;gap:2px 8px;align-items:center;transition:background .2s}
.stu:hover,.stu.on{background:var(--tint)}
.stu svg{grid-row:span 2;width:52px;height:52px}
.stu svg polygon.g{fill:none;stroke:var(--line)}
.stu svg polygon.v{fill:var(--glass);fill-opacity:.25;stroke:var(--glass);stroke-width:1.5;transition:transform .4s;transform-origin:26px 26px}
.stu:hover svg polygon.v{transform:scale(1.08)}
.stu b{font-family:var(--display);font-size:17px;font-weight:900}
.stu small{font-size:11px;color:var(--mute);font-family:var(--mono)}
.st-dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:4px}
.s-ok{background:var(--glass)}.s-wait{background:var(--coral)}.s-need{background:var(--mute)}

.detail{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:28px;margin-top:24px;border:1px solid var(--ink);padding:24px;background:var(--card)}
.detail svg{width:100%;max-width:380px;height:auto;justify-self:center;overflow:visible}
.detail svg text{font-family:var(--body);fill:var(--ink);font-size:13px}
.detail h3{font-size:30px;font-weight:900}
.detail .meta{font-family:var(--mono);font-size:12px;color:var(--mute)}
.detail .avg{display:flex;align-items:baseline;gap:8px;margin:14px 0}
.detail .avg strong{font-family:var(--display);font-size:48px;font-weight:900;line-height:1;font-variant-numeric:tabular-nums}
.detail .bars{display:grid;gap:8px;margin-top:8px}
.detail .bars div{display:grid;grid-template-columns:7.5em 1fr 2.5em;gap:10px;align-items:center;font-size:13px}
.detail .bars .t{height:6px;background:var(--line);position:relative}
.detail .bars .t i{position:absolute;left:0;top:0;bottom:0;background:var(--glass);transition:width .8s cubic-bezier(.2,.7,.2,1)}
.detail .bars b{font-variant-numeric:tabular-nums;text-align:right;font-weight:500}
.detail .sum{margin-top:16px;font-size:14px;padding-top:12px;border-top:1px solid var(--line)}
.detail .sum p + p{margin-top:6px}
.detail .sum b{color:var(--glass);font-weight:500}
.detail .sum b.w{color:var(--coral)}

/* 工具 */
.tools{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:32px;align-items:start}
.screen{border:1px solid var(--line);padding:10px 10px 0;background:var(--card);box-shadow:0 30px 60px -40px rgba(0,0,0,.4)}
.screen .dots{display:flex;gap:6px;margin-bottom:8px}
.screen .dots i{width:9px;height:9px;border-radius:50%;background:var(--line)}
.screen img{display:block;width:100%;height:auto}
.feat{display:grid;gap:0;border-top:1px solid var(--line);margin-bottom:20px}
.feat div{padding:12px 0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:2.2em minmax(0,1fr);gap:4px}
.feat b{font-family:var(--mono);font-size:12px;color:var(--coral);font-weight:500;padding-top:3px}
.feat strong{font-weight:700;display:block}
.feat span{font-size:13px;color:var(--mute);grid-column:2}

/* 作品 */
.works{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.works button{all:unset;cursor:zoom-in;position:relative;overflow:hidden;background:var(--tint)}
.works button:focus-visible{outline:2px solid var(--glass);outline-offset:3px}
.works img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.works button:hover img{transform:scale(1.06)}
.works .cap{position:absolute;left:0;right:0;bottom:0;padding:24px 12px 10px;background:linear-gradient(transparent,rgba(10,14,12,.6));color:#fff;font-size:13px;transform:translateY(100%);transition:transform .35s}
.works button:hover .cap,.works button:focus-visible .cap{transform:none}
.works .cap .mono{color:rgba(255,255,255,.75)}
.works .w-a{grid-column:span 4;height:300px}
.works .w-b{grid-column:span 2;height:300px}
.works .w-c{grid-column:span 3;height:250px}
.works .w-d{grid-column:span 2;height:210px}
.lb{position:fixed;inset:0;z-index:50;background:rgba(10,14,12,.92);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px 16px;gap:12px}
.lb img{max-height:80vh;width:auto;max-width:100%;animation:fi .4s ease both}
.lb p{color:#e6ebe8;font-size:14px}
.lb button{position:absolute;top:calc(env(safe-area-inset-top,0px) + 12px);right:16px;font:inherit;color:#e6ebe8;background:transparent;border:1px solid rgba(255,255,255,.4);padding:4px 12px;cursor:pointer}
.lb .nv{top:50%;transform:translateY(-50%)}
.lb .pv{left:16px;right:auto}

/* 进展 */
.stages{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--ink)}
.stages div{padding:16px 16px 16px 0;position:relative}
.stages div + div{padding-left:16px;border-left:1px solid var(--line)}
.stages .now{position:absolute;top:-1px;left:0;right:0;height:3px;background:var(--coral)}
.stages .tag{font-family:var(--mono);font-size:11px;color:var(--coral)}
.stages h3{font-size:19px;font-weight:900;margin:4px 0}
.stages .d{font-family:var(--mono);font-size:12px;color:var(--mute)}
.stages p{font-size:14px;color:var(--mute);margin-top:6px}
table.out{width:100%;border-collapse:collapse;font-size:14px}
table.out th,table.out td{text-align:left;padding:10px 12px 10px 0;border-bottom:1px solid var(--line);vertical-align:top}
table.out th{font-weight:500;color:var(--mute);font-size:12px}
table.out td.dt{font-family:var(--mono);font-size:12px;white-space:nowrap}
table.out td.k{color:var(--mute);white-space:nowrap}
.tbl{overflow-x:auto}
.team{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border-top:1px solid var(--line)}
.team div{padding:14px 14px 14px 0;border-bottom:1px solid var(--line)}
.team strong{font-family:var(--display);font-size:18px;font-weight:900;display:block}
.team span{font-size:13px;color:var(--mute);display:block}
.team em{font-style:normal;font-size:12px;color:var(--glass)}

footer{margin-top:72px;padding-top:16px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:10px}
footer .footer-title,footer .footer-school{display:block}
footer .footer-meta{display:flex;flex-wrap:wrap;gap:6px 16px;max-width:100%}
footer .footer-meta span{display:inline}

@media (max-width:860px){
  .hero,.frame,.course-head,.explainer,.mapgrid,.detail,.tools{grid-template-columns:minmax(0,1fr)}
  section.sec{grid-template-columns:minmax(0,1fr)}
  .sec > aside{position:static}
  .facts,.class-strip{grid-template-columns:repeat(3,minmax(0,1fr))}
  .facts div:nth-child(3),.class-strip div:nth-child(3){border-right:0}
  .facts div:nth-child(n+4),.class-strip div:nth-child(n+4){border-top:1px solid var(--line)}
  .concepts,.goals,.team{grid-template-columns:repeat(2,minmax(0,1fr))}
  .concepts div + div{padding-left:0;border-left:0}
  .chain{grid-template-columns:minmax(0,1fr)}
  .chain div{margin-left:0;margin-top:-1px}
  .timeline{grid-template-columns:1fr;gap:4px}
  .timeline::before,.timeline .line{left:5px;right:auto;top:0;bottom:0;width:1px;height:auto}
  .timeline .line{width:2px;height:0;transition:height 2.4s}
  .timeline.go .line{width:2px;height:100%}
  .timeline div{padding:0 0 10px 28px}
  .timeline div::before{top:6px}
  .works{grid-template-columns:repeat(2,minmax(0,1fr))}
  .works .w-a,.works .w-c{grid-column:span 2;height:auto;aspect-ratio:2}
  .works .w-b,.works .w-d{grid-column:span 1;height:auto;aspect-ratio:1.1}
  .stages{grid-template-columns:minmax(0,1fr)}
  .stages div + div{padding-left:0;border-left:0;border-top:1px solid var(--line)}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.radar-draw{stroke-dashoffset:0}}

/* 课程库 */
.lib-tools{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:20px}
.lib-tools button{font:inherit;font-size:13px;padding:4px 12px;border:1px solid var(--line);background:transparent;color:var(--ink);cursor:pointer;transition:all .2s}
.lib-tools button.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.pilot{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:0;border:1px solid var(--ink);text-decoration:none;color:inherit;margin-bottom:28px;background:var(--card);overflow:hidden}
.pilot .plate{border-radius:0}
.pilot .plate img{height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.pilot:hover .plate img{transform:scale(1.05)}
.pilot .txt{padding:24px;display:flex;flex-direction:column;gap:10px}
.pilot .txt h3{font-size:34px;font-weight:900}
.pilot .txt p{color:var(--mute);font-size:14px}
.pilot .badge{align-self:flex-start;font-size:12px;padding:2px 10px;background:var(--coral);color:var(--paper)}
.pilot .stats{display:flex;gap:20px;margin-top:auto;padding-top:12px;border-top:1px solid var(--line)}
.pilot .stats strong{font-family:var(--display);font-size:22px;font-weight:900;display:block;line-height:1.1}
.pilot .stats span{font-size:12px;color:var(--mute)}
.grp{margin-top:28px}
.grp h3{font-size:17px;font-weight:900;display:flex;align-items:baseline;gap:10px;padding-bottom:8px;border-bottom:1px solid var(--ink)}
.grp h3 .mono{font-size:11px}
.clist{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:0}
.citem{display:grid;grid-template-columns:3.6em minmax(0,1fr) auto;gap:10px;align-items:baseline;padding:11px 8px 11px 0;border-bottom:1px solid var(--line);text-decoration:none;color:inherit;transition:background .2s,padding .25s}
.citem:hover{background:var(--tint);padding-left:8px}
.citem .sem{font-family:var(--mono);font-size:11px;color:var(--mute)}
.citem b{font-weight:500;font-size:14px}
.citem small{font-family:var(--mono);font-size:11px;color:var(--mute);white-space:nowrap}
.citem.live b{color:var(--coral)}
.back{font-size:14px;text-decoration:none;color:var(--mute);white-space:nowrap}
.back:hover{color:var(--ink)}
.blank{border:1px dashed var(--line);padding:28px;color:var(--mute);font-size:14px;background:var(--card)}
.blank strong{display:block;font-family:var(--display);font-size:18px;color:var(--ink);margin-bottom:6px}
@media (max-width:860px){.pilot{grid-template-columns:minmax(0,1fr)}}
.lb[hidden],[hidden]{display:none!important}

/* 优化版：≤860px 汉堡抽屉导航；≤640px 统计与页脚 */
@media (max-width:860px){
  nav.top{z-index:20}
  nav.top.is-open{z-index:30}
  nav.top .in{gap:12px}
  nav.top .brand{display:block;font-size:15px;flex:1 1 auto;white-space:nowrap;min-width:0;overflow:hidden;text-overflow:ellipsis}
  nav.top .nav-toggle{display:inline-flex}
  nav.top .nav-panel{
    display:flex;flex-direction:column;gap:8px;
    position:fixed;top:0;right:0;bottom:0;
    width:min(320px,88vw);z-index:30;
    padding:calc(env(safe-area-inset-top,0px) + 64px) 20px calc(env(safe-area-inset-bottom,0px) + 24px);
    background:var(--paper);border-left:1px solid var(--line);
    box-shadow:-18px 0 40px -28px rgba(0,0,0,.45);
    transform:translateX(105%);visibility:hidden;transition:transform .32s cubic-bezier(.2,.7,.2,1),visibility 0s linear .32s;
    overflow-y:auto;-webkit-overflow-scrolling:touch;
  }
  nav.top.is-open .nav-panel{transform:none;visibility:visible;transition:transform .32s cubic-bezier(.2,.7,.2,1),visibility 0s}
  nav.top .links{
    display:flex;flex-direction:column;align-items:stretch;gap:0;
    margin:0;overflow:visible;flex:0 0 auto;
  }
  nav.top .links a{
    padding:14px 4px;font-size:16px;color:var(--ink);
    border-bottom:1px solid var(--line);
  }
  nav.top .links a::after{display:none}
  nav.top .links a.on{color:var(--coral)}
  nav.top .loginbtn{
    flex:none;align-self:stretch;justify-content:center;
    margin-top:12px;border-radius:10px;padding:12px 14px;font-size:14px;
  }
}
@media (max-width:640px){
  .facts{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .facts div{border-right:1px solid var(--line)!important;border-top:1px solid var(--line)}
  .facts div:nth-child(2n){border-right:0!important}
  .facts div:nth-child(-n+2){border-top:0}
  .facts div:last-child{
    grid-column:1/-1;display:flex;align-items:baseline;gap:12px;
    border-right:0!important;
  }
  .facts div:last-child strong{display:inline;font-size:28px}
  .facts div:last-child span{display:inline}
  footer .footer-meta{flex-direction:column;gap:4px}
  footer .footer-meta span{display:block;line-height:1.6}
}
