/* ============================================================
   MyPeScore · 体测计分
   视觉体系：墨绿（ink）× 香槟金（gold）× 米白（paper）
   ============================================================ */
:root{
  --ink:#17231e;
  --ink-2:#243329;
  --ink-3:#31423a;
  --muted:#6d7c73;
  --muted-2:#8d9a91;
  --gold:#c9a24a;
  --gold-2:#e9cd93;
  --gold-3:#f7e9c8;
  --gold-glow:rgba(201,162,74,.18);
  --lime:#d3ec7c;
  --lime-deep:#a9c955;
  --olive:#5d7a44;
  --line:rgba(23,35,30,.10);
  --line-2:rgba(23,35,30,.06);
  --paper:#f2f1ec;
  --white:#fff;
  --shadow-s:0 1px 2px rgba(20,32,26,.05), 0 2px 8px rgba(20,32,26,.04);
  --shadow-m:0 2px 6px rgba(20,32,26,.05), 0 14px 40px -14px rgba(20,32,26,.18);
  --shadow-l:0 30px 80px -30px rgba(15,25,20,.45);
  --r-s:10px;--r-m:16px;--r-l:24px;
  --serif:"Songti SC","Noto Serif SC","Source Han Serif SC","STSong",ui-serif,Georgia,serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:96px;-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:Inter,-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;
  font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;
  transition:filter .7s cubic-bezier(.4,0,.2,1), transform .7s cubic-bezier(.4,0,.2,1);
}
/*纸面纹理：极细噪点，避免大色块发"塑料"*/
body::before{
  content:'';position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.5;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.045'/%3E%3C/svg%3E");
}
body>*{position:relative;z-index:1}
/* 庆祝时把「页面内容」推远——只模糊内容，绝不波及庆祝层本身 */
body.celebrating .top,
body.celebrating main,
body.celebrating .mobile-score{
  filter:blur(14px) saturate(.7);transform:scale(1.012);
  transition:filter .7s cubic-bezier(.4,0,.2,1), transform .7s cubic-bezier(.4,0,.2,1);
}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0}
button,a,select,input,summary{-webkit-tap-highlight-color:transparent}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:6px}

/* ---------- 顶部 ---------- */
.top{
  height:88px;max-width:1240px;margin:auto;display:flex;align-items:center;justify-content:space-between;
  padding:0 34px;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20;
  background:rgba(242,241,236,.82);backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4);
}
.brand{display:flex;align-items:center;gap:12px;font-size:18px;font-weight:700;letter-spacing:.2px}
.brand small{font-size:10px;font-weight:500;display:block;line-height:1;letter-spacing:2.4px;color:var(--muted-2);text-transform:uppercase;margin-top:3px}
.logo{
  width:42px;height:42px;border-radius:13px;display:flex;align-items:center;justify-content:center;
  font-size:26px;font-weight:800;line-height:1;position:relative;overflow:hidden;
  background:linear-gradient(150deg,#1d2b24,#0e1512);color:var(--gold-3);
  box-shadow:0 6px 18px -6px rgba(15,25,20,.5), inset 0 1px 0 rgba(247,233,200,.22);
}
.logo span{font-size:15px;align-self:flex-start;margin:7px 0 0 -1px;color:var(--gold)}
.source-link{font-size:13px;color:var(--muted);display:flex;align-items:center;gap:8px;padding:8px 14px;border-radius:99px;border:1px solid var(--line);transition:.25s}
.source-link:hover{color:var(--ink);border-color:var(--gold);background:rgba(201,162,74,.07)}
.source-link span{color:var(--gold)}

/* ---------- 主区 ---------- */
main{max-width:1180px;margin:auto;padding:46px 34px 0}
.heading{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:34px;gap:20px}
.eyebrow{font-size:11px;letter-spacing:2.6px;font-weight:600;color:var(--gold);text-transform:uppercase}
h1{
  font-family:var(--serif);font-size:44px;font-weight:600;letter-spacing:-.5px;margin:12px 0 10px;line-height:1.28;
  background:linear-gradient(170deg,#22302a,#0f1814);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.heading p{color:var(--muted);margin:0;font-size:15px}
.live{
  border:1px solid var(--line);background:rgba(255,255,255,.7);border-radius:99px;font-size:12px;padding:7px 14px;
  display:flex;align-items:center;gap:8px;white-space:nowrap;color:var(--muted);letter-spacing:.4px;
}
.live:before{content:'';width:6px;height:6px;border-radius:50%;background:var(--olive);box-shadow:0 0 0 0 rgba(93,122,68,.45);animation:pulse 2.4s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(93,122,68,.4)}70%{box-shadow:0 0 0 8px rgba(93,122,68,0)}100%{box-shadow:0 0 0 0 rgba(93,122,68,0)}}

.workspace{display:grid;grid-template-columns:minmax(0,1fr) 368px;gap:26px;align-items:start}
.form-panel,.summary,.distribution,details{
  background:var(--white);border:1px solid var(--line);box-shadow:var(--shadow-s);
}
.form-panel{border-radius:var(--r-l);padding:30px}

/* ---------- 性别 / 年级 ---------- */
.profile{display:flex;justify-content:space-between;align-items:start;gap:24px;padding-bottom:26px;border-bottom:1px solid var(--line-2)}
.label,.year-label{font-size:12px;color:var(--muted);display:block;letter-spacing:1px;font-weight:600}
.segmented{display:flex;background:#f0f0eb;border-radius:12px;padding:4px;margin-top:9px;gap:4px;border:1px solid var(--line-2)}
.segmented button{border-radius:9px;width:88px;height:42px;font-size:15px;color:var(--muted);transition:.28s cubic-bezier(.22,1,.36,1)}
.segmented .selected{
  background:var(--ink);color:var(--gold-3);font-weight:600;
  box-shadow:0 4px 14px -4px rgba(23,35,30,.5), inset 0 1px 0 rgba(247,233,200,.2);
}
.year-label{min-width:184px}
select{
  display:block;margin-top:9px;height:50px;border:1px solid var(--line);border-radius:12px;background:var(--white);
  padding:0 34px 0 15px;width:100%;font-size:15px;appearance:none;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%236d7c73' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;transition:.22s;
}
select:hover{border-color:var(--gold)}

.section-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:26px 0 16px}
h2{font-size:18px;margin:0;font-weight:650;letter-spacing:.2px}
.section-title button{color:var(--muted-2);font-size:13px;min-height:44px;padding:0 8px;transition:.2s}
.section-title button:hover{color:var(--ink)}
.section-title>span{font-size:12px;color:var(--muted-2)}

/* ---------- 单项卡片 ---------- */
.metric{
  padding:20px;background:#fbfbf9;border:1px solid var(--line-2);border-radius:var(--r-m);margin-bottom:12px;
  transition:border-color .3s, box-shadow .3s, background .3s;
}
.metric:focus-within,.metric.filled{background:var(--white);border-color:rgba(201,162,74,.34);box-shadow:0 6px 24px -12px rgba(23,35,30,.22)}
.metric-head{display:flex;justify-content:space-between;gap:8px;align-items:center;margin-bottom:16px}
.metric-head>div{display:flex;gap:9px;align-items:center;flex-wrap:wrap}
.metric-icon{
  color:var(--gold);font-size:18px;line-height:1;width:30px;height:30px;border-radius:9px;
  display:grid;place-items:center;background:rgba(201,162,74,.1);flex-shrink:0;
}
.metric h3{font-size:15px;font-weight:600;margin:0}
.weight{font-size:11px;color:var(--muted-2);background:#f0f0ea;border-radius:5px;padding:2px 6px;letter-spacing:.4px}
.metric-score{white-space:nowrap;color:#a8b0a7;font-size:12px;display:inline-flex;align-items:baseline;font-variant-numeric:tabular-nums;gap:2px}
.metric-score.done{color:var(--olive);font-weight:600}
.double{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.double label{font-size:12px;color:var(--muted);font-weight:600;letter-spacing:.6px}
.input-wrap{
  background:var(--white);border:1px solid var(--line);border-radius:12px;height:52px;display:flex;align-items:center;
  margin-top:6px;overflow:hidden;transition:border-color .22s, box-shadow .22s;
}
.input-wrap:hover{border-color:rgba(23,35,30,.2)}
.input-wrap:focus-within{border-color:var(--gold);box-shadow:0 0 0 4px var(--gold-glow)}
.input-wrap input{
  border:0;outline:0;background:transparent;min-width:0;width:100%;padding:11px 15px;
  font-size:18px;font-weight:500;font-variant-numeric:tabular-nums;appearance:textfield;letter-spacing:.4px;
}
.input-wrap input::-webkit-inner-spin-button{appearance:none}
.input-wrap>span{padding:0 15px 0 5px;color:var(--muted-2);font-size:13px}
.input-wrap input::placeholder{color:#bcc2b8;font-size:15px;font-weight:400}
.hint{font-size:12px;color:var(--muted-2);margin:10px 0 0;min-height:19px;letter-spacing:.2px}
.hint.error{color:#b4553f}
.input-wrap:has(input[aria-invalid="true"]){border-color:#c0705a;box-shadow:0 0 0 4px rgba(192,112,90,.13)}
.privacy{text-align:center;font-size:11.5px;color:var(--muted-2);margin:22px 0 0;letter-spacing:.6px}

/* ---------- 单项进度条 ---------- */
.metric-progress{margin-top:16px;padding-top:14px;border-top:1px solid var(--line-2)}
.progress-caption{display:flex;justify-content:space-between;gap:8px;font-size:11.5px;color:var(--muted-2);margin-bottom:9px;letter-spacing:.5px}
.bar-track{height:7px;background:#eeeee8;border-radius:99px;position:relative;overflow:hidden}
.bar-fill{height:100%;border-radius:99px;background:var(--olive);transition:width .6s cubic-bezier(.22,1,.36,1), background .3s}

/* ---------- 成绩卡 ---------- */
.results{position:sticky;top:112px}
.summary{
  border-radius:var(--r-l);padding:26px;text-align:center;overflow:hidden;position:relative;color:var(--gold-3);
  background:linear-gradient(165deg,#22302a 0%,#16211c 52%,#101814 100%);
  box-shadow:var(--shadow-l), inset 0 1px 0 rgba(247,233,200,.16);
  border:1px solid rgba(201,162,74,.22);
}
/* 极光晕染 */
.summary::before{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(420px 300px at 78% 12%, rgba(201,162,74,.26), transparent 70%),
    radial-gradient(380px 320px at 8% 62%, rgba(211,236,124,.13), transparent 70%);
}
.summary>*{position:relative}
.summary.passed{box-shadow:0 30px 90px -28px rgba(140,105,40,.62), inset 0 1px 0 rgba(247,233,200,.3), 0 0 0 1px rgba(233,205,147,.5)}
.summary.passed::before{opacity:1;animation:breathe 4.5s ease-in-out infinite}
@keyframes breathe{0%,100%{opacity:.85}50%{opacity:1}}
.summary-top{display:flex;justify-content:space-between;font-size:13.5px;font-weight:600;letter-spacing:.4px}
.summary-top>span+span{
  font-size:11px;font-weight:500;border:1px solid rgba(233,205,147,.3);border-radius:99px;padding:3px 10px;
  color:rgba(247,233,200,.8);font-variant-numeric:tabular-nums;
}
.score-orbit{
  height:216px;width:216px;border-radius:50%;margin:26px auto 20px;display:grid;place-items:center;position:relative;
  border:1px solid rgba(233,205,147,.28);
  background:radial-gradient(circle at 50% 34%, rgba(247,233,200,.09), transparent 66%);
  box-shadow:inset 0 0 40px -12px rgba(247,233,200,.22);
}
.score-orbit:before{
  content:'';position:absolute;inset:9px;border:1px dashed rgba(233,205,147,.24);border-radius:50%;
  animation:orbit 34s linear infinite;
}
@keyframes orbit{to{transform:rotate(360deg)}}
.score-orbit strong{
  font-size:64px;font-weight:300;letter-spacing:-2.5px;line-height:1.15;display:block;font-variant-numeric:tabular-nums;
  white-space:nowrap;justify-self:center;position:relative;
  background:linear-gradient(165deg,#fff8e9,#e9cd93 55%,#c9a24a);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
/* 光晕用伪元素做：text-shadow 对 background-clip:text 的透明填充文字无效，
   filter:drop-shadow 又会让渐变整体失效 —— 两者都不能用在这里。 */
.score-orbit strong:after{
  content:'';position:absolute;left:50%;top:52%;width:160px;height:70px;z-index:-1;
  transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;
  background:radial-gradient(closest-side,rgba(201,162,74,.3),transparent 72%);
  filter:blur(16px);
}
/* 只作用于「总分 / 120」那行说明文字。
   历史上这条选择器写得太宽，会把数字滚动用的 .digit-slot / .digit-strip 也变成 block，
   导致每个数字各占一行、整列高度暴涨（视觉上像"分数突然变小"）。故改为精确匹配。 */
.score-orbit > div > span:last-child{
  font-size:11.5px;color:rgba(247,233,200,.55);display:block;margin-top:6px;letter-spacing:1.4px;
}
.status{
  display:inline-block;padding:5px 17px;border-radius:99px;font-size:13px;letter-spacing:1px;font-weight:600;
  background:rgba(211,236,124,.13);color:var(--lime);border:1px solid rgba(211,236,124,.3);
}
.summary>p{font-size:12px;color:rgba(247,233,200,.6);margin:10px 0 24px;line-height:1.7}
.breakdown{border-top:1px solid rgba(233,205,147,.2);padding-top:20px;display:grid;grid-template-columns:1fr 1fr}
.breakdown>div+div{border-left:1px solid rgba(233,205,147,.2)}
.breakdown>div>span{display:block;font-size:11.5px;color:rgba(247,233,200,.55);letter-spacing:.6px}
.breakdown strong{font-size:24px;font-weight:500;display:block;margin-top:5px;color:var(--gold-3);font-variant-numeric:tabular-nums;white-space:nowrap}
.breakdown small{font-size:12px;font-weight:400;color:rgba(247,233,200,.45)}

/* 及格提示（常驻） */
.pass-message{
  margin:18px 0 0;padding:16px 14px;border-radius:14px;text-align:center;position:relative;overflow:hidden;
  background:linear-gradient(120deg,rgba(201,162,74,.2),rgba(211,236,124,.11));
  border:1px solid rgba(233,205,147,.34);
}
.pass-message[hidden]{display:none}
.pass-message strong{display:block;font-size:19px;color:var(--gold-3);letter-spacing:.5px}
.pass-message span{display:block;font-size:12.5px;margin-top:4px;color:rgba(247,233,200,.72)}
.pass-message.just-passed{animation:pass-pop .5s cubic-bezier(.34,1.56,.64,1)}
@keyframes pass-pop{0%{transform:scale(.9);opacity:0}100%{transform:scale(1);opacity:1}}
/* 重看庆祝 */
.replay{
  display:block;width:100%;margin-top:11px;padding:8px 12px;border-radius:99px;font-size:12px;letter-spacing:.6px;
  color:rgba(247,233,200,.72);border:1px solid rgba(233,205,147,.3);background:rgba(255,255,255,.04);
  transition:.24s cubic-bezier(.34,1.56,.64,1);
}
.replay:hover{color:var(--gold-3);border-color:rgba(233,205,147,.6);background:rgba(255,255,255,.1);transform:translateY(-1px)}
.mobile-score.passed{background:linear-gradient(100deg,#1d2a24,#2c3f28)}
.mobile-score.passed>span{color:var(--lime);font-weight:600}

.note{display:flex;gap:11px;margin:20px 6px;color:var(--muted);font-size:12px;line-height:1.75}
.note>span{
  font-size:11px;border:1px solid rgba(23,35,30,.28);border-radius:50%;width:17px;height:17px;flex-shrink:0;
  text-align:center;line-height:15px;margin-top:4px;font-family:var(--serif);
}
.note p{margin:0}

/* ---------- 标准说明 ---------- */
.standards{margin-top:56px;padding:36px 0 40px;border-top:1px solid var(--line)}
.standards .section-title{margin:0 0 28px;align-items:flex-end}
.standards h2{font-family:var(--serif);font-size:28px;font-weight:600;margin-top:10px;letter-spacing:-.2px}
.standard-tag{border:1px solid rgba(201,162,74,.4);background:rgba(201,162,74,.07);border-radius:99px;padding:7px 14px;color:var(--olive);font-size:12px}
.rules{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.rules b{font-size:11px;color:var(--gold);font-weight:600;letter-spacing:2px;font-family:var(--serif)}
.rules h3{font-size:16px;margin:10px 0 8px;font-weight:600}
.rules p{font-size:13.5px;color:var(--muted);margin:0;line-height:1.8}
details{margin:28px 0;border-radius:var(--r-m);padding:18px 20px}
summary{cursor:pointer;font-size:14px;font-weight:600;list-style:none;display:flex;align-items:center;gap:9px}
summary::-webkit-details-marker{display:none}
summary:after{content:'＋';margin-left:auto;color:var(--gold);font-weight:400;font-size:16px}
details[open] summary:after{content:'−'}
details p{font-size:12px;color:var(--muted)}
.table-scroll{overflow:auto;margin-top:16px;-webkit-overflow-scrolling:touch}
table{width:100%;border-collapse:collapse;min-width:680px;font-size:13px}
th,td{text-align:center;padding:10px;border-bottom:1px solid var(--line-2)}
th{background:#f4f4ef;font-weight:600;font-size:12px;letter-spacing:.4px}
tbody tr:hover{background:rgba(201,162,74,.045)}
.source-note{font-size:12px;color:var(--muted-2);line-height:2}
.source-note a{text-underline-offset:3px;color:var(--olive);border-bottom:1px solid rgba(93,122,68,.3)}
footer{display:flex;justify-content:space-between;padding:26px 0;border-top:1px solid var(--line);font-size:12px;color:var(--muted-2)}
.footer-dot{padding:0 10px;color:var(--gold)}
.mobile-only,.mobile-score{display:none}

/* ============================================================
   全屏庆祝层
   ============================================================ */
.celebrate{position:fixed;inset:0;z-index:200;isolation:isolate}
.celebrate[hidden]{display:none}
.celebrate-backdrop{
  position:absolute;inset:0;
  background:
    radial-gradient(120% 90% at 50% 8%, rgba(38,54,45,.97) 0%, rgba(16,24,20,.985) 46%, rgba(8,13,10,.995) 100%);
  opacity:0;transition:opacity .85s cubic-bezier(.4,0,.2,1);
}
.celebrate.open .celebrate-backdrop{opacity:1}
.celebrate-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none}

/* 中央卡：玻璃 + 金边 */
.celebrate-card{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:min(620px,calc(100% - 36px));
  max-height:calc(100dvh - 40px);overflow-y:auto;overscroll-behavior:contain;
  padding:38px 40px 34px;text-align:center;color:var(--gold-3);
  border-radius:28px;border:1px solid rgba(233,205,147,.3);
  background:linear-gradient(168deg,rgba(36,51,41,.9),rgba(14,21,17,.93));
  backdrop-filter:blur(22px) saturate(1.3);-webkit-backdrop-filter:blur(22px) saturate(1.3);
  box-shadow:0 50px 120px -40px rgba(0,0,0,.85), inset 0 1px 0 rgba(247,233,200,.2);
  opacity:0;scale:.94;transition:opacity .7s cubic-bezier(.22,1,.36,1), scale .7s cubic-bezier(.22,1,.36,1);
  scrollbar-width:none;-ms-overflow-style:none;
}
.celebrate-card::-webkit-scrollbar{display:none}
.celebrate.open .celebrate-card{opacity:1;scale:1}

/* 卡片顶部一道金线 */
.celebrate-card:before{
  content:'';position:absolute;left:50%;top:0;width:120px;height:1px;transform:translateX(-50%);
  background:linear-gradient(90deg,transparent,var(--gold-2),transparent);
}
/* 四角细金线 */
.celebrate-card:after{
  content:'';position:absolute;inset:12px;border-radius:20px;pointer-events:none;
  background:
    linear-gradient(var(--gold-2),var(--gold-2)) left top/1px 34px no-repeat,
    linear-gradient(var(--gold-2),var(--gold-2)) left top/34px 1px no-repeat,
    linear-gradient(var(--gold-2),var(--gold-2)) right top/1px 34px no-repeat,
    linear-gradient(var(--gold-2),var(--gold-2)) right top/34px 1px no-repeat,
    linear-gradient(var(--gold-2),var(--gold-2)) left bottom/1px 34px no-repeat,
    linear-gradient(var(--gold-2),var(--gold-2)) left bottom/34px 1px no-repeat,
    linear-gradient(var(--gold-2),var(--gold-2)) right bottom/1px 34px no-repeat,
    linear-gradient(var(--gold-2),var(--gold-2)) right bottom/34px 1px no-repeat;
  opacity:.5;
}

/* 分阶段揭示：容器负责位移淡入，chip 负责自身依次点亮 */
.celebrate-kicker,.celebrate-score,.celebrate-grade,.celebrate-title,.celebrate-line,.celebrate-stats,.celebrate-notes,.celebrate-actions{
  opacity:0;transform:translateY(14px);filter:blur(6px);
  transition:opacity .62s cubic-bezier(.22,1,.36,1), transform .62s cubic-bezier(.22,1,.36,1), filter .62s;
}
.celebrate-chip{
  opacity:0;transform:translateY(10px) scale(.94);filter:blur(4px);
  transition:opacity .5s cubic-bezier(.22,1,.36,1), transform .5s cubic-bezier(.22,1,.36,1), filter .5s;
}
.celebrate-kicker.in,.celebrate-score.in,.celebrate-grade.in,.celebrate-title.in,.celebrate-line.in,.celebrate-stats.in,.celebrate-notes.in,.celebrate-actions.in{
  opacity:1;transform:none;filter:none;
}
.celebrate-chip.in{opacity:1;transform:none;filter:none}

.celebrate-kicker{font-size:11.5px;letter-spacing:2.6px;color:var(--gold);margin:0 0 6px;font-weight:600;text-transform:uppercase}
.celebrate-score{margin:14px 0 0}
.celebrate-number{display:flex;align-items:baseline;justify-content:center;gap:6px}
.celebrate-number strong{
  font-size:clamp(74px,17vw,112px);font-weight:200;letter-spacing:-4px;line-height:1;font-variant-numeric:tabular-nums;
  background:linear-gradient(168deg,#fffaf0 0%,#f0dcae 42%,#c9a24a 78%,#a8802f 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 10px 42px rgba(201,162,74,.45));
}
.celebrate-number em{font-style:normal;font-size:19px;color:rgba(247,233,200,.62);letter-spacing:1px}
.celebrate-max{font-size:11.5px;color:rgba(247,233,200,.45);letter-spacing:3px;margin-top:8px}

.celebrate-grade{
  display:inline-block;margin:20px auto 0;padding:5px 18px;border-radius:99px;font-size:12.5px;font-weight:600;letter-spacing:2px;
  background:rgba(211,236,124,.12);color:var(--lime);border:1px solid rgba(211,236,124,.3);
}
.celebrate-title{
  font-family:var(--serif);font-size:clamp(23px,5.6vw,30px);font-weight:600;line-height:1.5;margin:20px 0 0;
  color:#fdf8ec;letter-spacing:.6px;text-wrap:balance;
}
.celebrate-line{
  font-size:14px;line-height:1.95;color:rgba(247,233,200,.74);margin:16px auto 0;max-width:430px;letter-spacing:.3px;
  text-wrap:pretty;
}
.celebrate-stats{
  display:grid;grid-template-columns:repeat(3,1fr);margin-top:28px;
  border-top:1px solid rgba(233,205,147,.2);border-bottom:1px solid rgba(233,205,147,.2);padding:18px 0;
}
.celebrate-stats>div+div{border-left:1px solid rgba(233,205,147,.2)}
.celebrate-stats span{display:block;font-size:11px;color:rgba(247,233,200,.5);letter-spacing:1.4px}
.celebrate-stats b{display:block;font-size:22px;font-weight:400;margin-top:5px;color:var(--gold-3);font-variant-numeric:tabular-nums}

.celebrate-notes{display:flex;flex-wrap:wrap;gap:9px;justify-content:center;margin-top:22px}
.celebrate-chip{
  display:inline-flex;align-items:center;gap:7px;padding:7px 14px;border-radius:99px;font-size:12.5px;letter-spacing:.3px;
  background:rgba(255,255,255,.05);border:1px solid rgba(233,205,147,.24);color:rgba(247,233,200,.88);
  transition-delay:var(--d,0ms);
}
.celebrate-chip i{font-style:normal;font-size:11px;color:var(--gold)}
.celebrate-chip.glow{background:rgba(211,236,124,.09);border-color:rgba(211,236,124,.28)}
.celebrate-chip.glow i{color:var(--lime)}
.celebrate-chip.work{background:rgba(255,255,255,.04);border-color:rgba(233,205,147,.2)}
.celebrate-chip.tip{background:rgba(201,162,74,.1);color:rgba(247,233,200,.9)}

.celebrate-actions{display:flex;flex-wrap:wrap;gap:11px;justify-content:center;margin-top:30px}
.celebrate-btn{
  min-height:46px;padding:0 24px;border-radius:99px;font-size:14px;font-weight:500;letter-spacing:.6px;
  border:1px solid rgba(233,205,147,.32);color:rgba(247,233,200,.9);background:rgba(255,255,255,.05);
  transition:transform .22s cubic-bezier(.34,1.56,.64,1), background .22s, border-color .22s, box-shadow .22s;
}
.celebrate-btn:hover{transform:translateY(-2px);background:rgba(255,255,255,.1);border-color:rgba(233,205,147,.55)}
.celebrate-btn.primary{
  background:linear-gradient(135deg,#f2dfae,#c9a24a);color:#16201b;border-color:transparent;font-weight:650;
  box-shadow:0 10px 30px -10px rgba(201,162,74,.7);
}
.celebrate-btn.primary:hover{box-shadow:0 16px 38px -12px rgba(201,162,74,.85)}
.celebrate-btn.ghost{border-color:transparent;color:rgba(247,233,200,.6);background:transparent}
.celebrate-btn.ghost:hover{color:var(--gold-3);background:rgba(255,255,255,.06)}

.celebrate-flash{
  position:absolute;left:50%;bottom:calc(20px + env(safe-area-inset-bottom));transform:translate(-50%,14px);
  padding:11px 22px;border-radius:99px;font-size:13px;letter-spacing:.5px;
  background:rgba(14,21,17,.92);border:1px solid rgba(233,205,147,.35);color:var(--gold-3);
  opacity:0;transition:.4s cubic-bezier(.22,1,.36,1);pointer-events:none;backdrop-filter:blur(10px);
  box-shadow:0 14px 40px -14px rgba(0,0,0,.8);
}
.celebrate-flash.show{opacity:1;transform:translate(-50%,0)}

/* ============================================================
   长跑决策条
   算分的落点不是分数，是「要不要跑」这个决定。
   所以它必须比分数更醒目：三种状态各有明确的色彩与语气。
   ============================================================ */
.run-advice{
  margin:16px 0 0;padding:15px 16px;border-radius:14px;text-align:left;
  border:1px solid rgba(233,205,147,.28);
  background:linear-gradient(135deg,rgba(233,205,147,.11),rgba(233,205,147,.04));
  animation:advice-in .45s cubic-bezier(.22,1,.36,1);
}
.run-advice[hidden]{display:none}
@keyframes advice-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.run-advice-head{
  display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:700;letter-spacing:.6px;
  color:var(--gold-3);margin-bottom:5px;
}
.run-advice-head i{font-style:normal;font-size:14px}
.run-advice-body{font-size:12.5px;line-height:1.8;color:rgba(247,233,200,.76);letter-spacing:.2px}
.run-advice-body b{color:var(--gold-2);font-weight:600}
/* 时间门槛是这份提示里最有价值的信息，给它最大视觉权重 */
.run-limit{
  display:inline-flex;align-items:baseline;gap:5px;margin:9px 0 3px;padding:7px 14px;border-radius:10px;
  background:rgba(201,162,74,.16);border:1px solid rgba(233,205,147,.34);
}
.run-limit span{font-size:11.5px;color:rgba(247,233,200,.6);letter-spacing:.6px}
.run-limit strong{
  font-size:26px;font-weight:500;letter-spacing:-.5px;line-height:1.1;font-variant-numeric:tabular-nums;
  color:var(--gold-3);text-shadow:0 4px 18px rgba(201,162,74,.3);
}
.run-advice-sub{font-size:11.5px;color:rgba(247,233,200,.55);line-height:1.7}

/* 状态一：不用跑 —— 用绿意传达轻松、可以放心 */
.run-advice.no-run{
  border-color:rgba(211,236,124,.34);
  background:linear-gradient(135deg,rgba(211,236,124,.14),rgba(160,200,90,.05));
}
.run-advice.no-run .run-advice-head{color:var(--lime)}
.run-advice.no-run .run-limit{background:rgba(211,236,124,.13);border-color:rgba(211,236,124,.3)}
.run-advice.no-run .run-limit strong{color:var(--lime);text-shadow:0 4px 20px rgba(160,200,90,.28)}

/* 状态二：必须跑 —— 用琥珀色加紧迫感，但不恐吓 */
.run-advice.must-run{
  border-color:rgba(233,160,90,.42);
  background:linear-gradient(135deg,rgba(233,160,90,.17),rgba(200,120,60,.06));
}
.run-advice.must-run .run-advice-head{color:#f5b980}

/* 状态三：跑满也救不回 —— 用克制的暗红，说明得靠别的项目 */
.run-advice.hopeless{
  border-color:rgba(214,138,120,.36);
  background:linear-gradient(135deg,rgba(214,138,120,.13),rgba(150,80,66,.05));
}
.run-advice.hopeless .run-advice-head{color:#e8a595}

@media(max-width:480px){
  .run-limit strong{font-size:23px}
  .run-advice{padding:13px 14px}
}

/* ============================================================
   全屏「必须跑」时刻
   与免跑庆祝刻意做出完全不同的视觉语言：
     庆祝 = 金色纸屑 + 光爆（松弛、庆祝）
     必须跑 = 跑道暖橙 + 透视线 + 脉冲（紧迫、蓄势、出发）
   情绪不是"恭喜"而是"该出发了"。
   ============================================================ */
.mustrun{position:fixed;inset:0;z-index:210;isolation:isolate}
.mustrun[hidden]{display:none}
.mustrun-backdrop{
  position:absolute;inset:0;
  background:
    radial-gradient(110% 70% at 50% 108%, rgba(196,88,32,.32) 0%, transparent 58%),
    radial-gradient(90% 60% at 50% -10%, rgba(150,60,24,.3) 0%, transparent 62%),
    linear-gradient(180deg,#170f0a 0%,#1d130c 40%,#241609 100%);
  opacity:0;transition:opacity .8s cubic-bezier(.4,0,.2,1);
}
.mustrun.open .mustrun-backdrop{opacity:1}
/* 跑道透视线：从底部向前汇聚，强化「往前冲」的纵深 */
.mustrun-backdrop:after{
  content:'';position:absolute;inset:0;pointer-events:none;opacity:.5;
  background:
    repeating-linear-gradient(90deg, rgba(255,196,140,.11) 0 2px, transparent 2px 96px),
    linear-gradient(180deg, transparent 62%, rgba(255,170,100,.09) 100%);
  transform:perspective(560px) rotateX(64deg);
  transform-origin:bottom center;
  animation:lane-drift 3.4s linear infinite;
}
@keyframes lane-drift{from{background-position:0 0,0 0}to{background-position:0 192px, 0 0}}
.mustrun-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none}

.mustrun-card{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:min(580px,calc(100% - 36px));
  max-height:calc(100dvh - 40px);overflow-y:auto;overscroll-behavior:contain;
  padding:32px 36px 28px;text-align:center;color:#f7e6cf;
  border-radius:26px;border:1px solid rgba(255,180,120,.3);
  background:linear-gradient(168deg,rgba(48,28,16,.9),rgba(24,15,9,.94));
  backdrop-filter:blur(22px) saturate(1.2);-webkit-backdrop-filter:blur(22px) saturate(1.2);
  box-shadow:0 46px 110px -40px rgba(0,0,0,.85), inset 0 1px 0 rgba(255,205,160,.2);
  opacity:0;scale:.94;transition:opacity .65s cubic-bezier(.22,1,.36,1), scale .65s cubic-bezier(.22,1,.36,1);
  scrollbar-width:none;-ms-overflow-style:none;
}
.mustrun-card::-webkit-scrollbar{display:none}
.mustrun.open .mustrun-card{opacity:1;scale:1}
.mustrun-card:before{
  content:'';position:absolute;left:50%;top:0;width:130px;height:1px;transform:translateX(-50%);
  background:linear-gradient(90deg,transparent,#ffb877,transparent);
}
/* 呼吸脉冲：营造蓄势的心跳 */
.mustrun-card:after{
  content:'';position:absolute;inset:11px;border-radius:18px;pointer-events:none;
  border:1px solid rgba(255,170,110,.16);
  animation:mr-breathe 2.6s ease-in-out infinite;
}
@keyframes mr-breathe{0%,100%{opacity:.35}50%{opacity:.9}}

/* 分段揭示 */
.mustrun-kicker,.mustrun-gap,.mustrun-title,.mustrun-line,.mustrun-target,.mustrun-target-sub,.mustrun-cheer,.mustrun-actions{
  opacity:0;transform:translateY(14px);filter:blur(6px);
  transition:opacity .6s cubic-bezier(.22,1,.36,1), transform .6s cubic-bezier(.22,1,.36,1), filter .6s;
}
.mustrun-kicker.in,.mustrun-gap.in,.mustrun-title.in,.mustrun-line.in,.mustrun-target.in,.mustrun-target-sub.in,.mustrun-cheer.in,.mustrun-actions.in{
  opacity:1;transform:none;filter:none;
}

.mustrun-kicker{font-size:11.5px;letter-spacing:2.4px;color:#ffb877;font-weight:600;margin:0 0 4px;text-transform:uppercase}

/* 缺口数字：视觉上要像"还差这么多"，用暖橙强调 */
.mustrun-gap{margin:16px 0 0;display:flex;align-items:baseline;justify-content:center;gap:7px}
.mustrun-gap-label{font-size:15px;color:rgba(247,230,207,.7);letter-spacing:1px}
#mustrun-gap-num{
  font-size:clamp(40px,10vw,58px);font-weight:300;letter-spacing:-2px;line-height:1;font-variant-numeric:tabular-nums;
  background:linear-gradient(168deg,#ffd9ae,#ff9d4d 62%,#e06a22);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  animation:mr-beat 1.5s ease-in-out infinite;
}
.mustrun-gap{
  position:relative;
}
.mustrun-gap-unit{font-size:14px;color:rgba(247,230,207,.65);letter-spacing:.5px}

.mustrun-title{
  font-family:var(--serif);font-size:clamp(21px,5.2vw,27px);font-weight:600;line-height:1.5;margin:16px 0 0;
  color:#fff5e9;letter-spacing:.6px;text-wrap:balance;
}
.mustrun-line{
  font-size:13.5px;line-height:1.85;color:rgba(247,230,207,.78);margin:12px auto 0;max-width:420px;letter-spacing:.3px;
  text-wrap:pretty;
}

/* 时间门槛：整个页面的主角，给它最强视觉重量。
   用 grid 让「跑进 / 数字 / 以内即可过线」三段在基线上对齐，
   否则数字字号大、行盒高，会把两侧小字挤到上下不居中。 */
.mustrun-target{
  margin:24px auto 0;display:inline-grid;
  grid-template-columns:auto auto auto;
  align-items:baseline;gap:10px;
  padding:14px 24px;border-radius:16px;
  background:linear-gradient(135deg,rgba(255,157,77,.2),rgba(224,106,34,.1));
  border:1px solid rgba(255,180,120,.4);
  box-shadow:0 14px 40px -18px rgba(224,106,34,.7), inset 0 1px 0 rgba(255,210,170,.18);
}
.mustrun-target-label,.mustrun-target-unit{font-size:13px;color:rgba(247,230,207,.8);letter-spacing:1px;white-space:nowrap}
#mustrun-limit{
  font-size:clamp(42px,11vw,62px);font-weight:500;letter-spacing:-1px;line-height:1;font-variant-numeric:tabular-nums;
  background:linear-gradient(168deg,#fff6e8,#ffc48a 52%,#ff9d4d);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  animation:mr-beat 1.5s ease-in-out infinite;
}
@keyframes mr-beat{0%,100%{transform:scale(1)}50%{transform:scale(1.045)}}
.mustrun-target-sub{font-size:12.5px;color:rgba(247,230,207,.62);margin:11px 0 0;line-height:1.7;letter-spacing:.2px}
.mustrun-target-sub b{color:#ffc48a;font-weight:600}

/* 鼓励区：这是「必须跑」场景真正需要的东西 */
.mustrun-cheer{
  margin:20px 0 0;padding:14px 16px;border-radius:14px;text-align:left;
  background:rgba(255,255,255,.045);border:1px solid rgba(255,180,120,.2);
}
.mustrun-cheer-line{
  font-size:13.5px;line-height:1.9;color:rgba(247,230,207,.85);letter-spacing:.2px;
  display:flex;gap:9px;align-items:flex-start;
}
.mustrun-cheer-line+.mustrun-cheer-line{margin-top:9px;padding-top:9px;border-top:1px solid rgba(255,180,120,.14)}
.mustrun-cheer-line i{font-style:normal;color:#ffb877;flex-shrink:0;font-size:13px;line-height:1.7}

.mustrun-actions{display:flex;flex-wrap:wrap;gap:11px;justify-content:center;margin-top:28px}
.mustrun-btn{
  min-height:46px;padding:0 24px;border-radius:99px;font-size:14px;font-weight:500;letter-spacing:.6px;
  border:1px solid rgba(255,180,120,.34);color:rgba(247,230,207,.92);background:rgba(255,255,255,.05);
  transition:transform .22s cubic-bezier(.34,1.56,.64,1), background .22s, border-color .22s, box-shadow .22s;
}
.mustrun-btn:hover{transform:translateY(-2px);background:rgba(255,255,255,.1);border-color:rgba(255,180,120,.6)}
.mustrun-btn.primary{
  background:linear-gradient(135deg,#ffcb92,#ef7f30);color:#2a1508;border-color:transparent;font-weight:650;
  box-shadow:0 10px 30px -10px rgba(239,127,48,.75);
}
.mustrun-btn.primary:hover{box-shadow:0 16px 38px -12px rgba(239,127,48,.9)}
.mustrun-btn.ghost{border-color:transparent;color:rgba(247,230,207,.6);background:transparent}
.mustrun-btn.ghost:hover{color:#ffd0a3;background:rgba(255,255,255,.06)}

.mustrun-flash{
  position:absolute;left:50%;bottom:calc(20px + env(safe-area-inset-bottom));transform:translate(-50%,14px);
  padding:11px 22px;border-radius:99px;font-size:13px;letter-spacing:.5px;
  background:rgba(24,15,9,.94);border:1px solid rgba(255,180,120,.36);color:#ffd0a3;
  opacity:0;transition:.4s cubic-bezier(.22,1,.36,1);pointer-events:none;backdrop-filter:blur(10px);
  box-shadow:0 14px 40px -14px rgba(0,0,0,.8);
}
.mustrun-flash.show{opacity:1;transform:translate(-50%,0)}

@media(max-width:860px){
  .mustrun-card{width:calc(100% - 28px);max-height:calc(100dvh - 28px);padding:30px 22px 26px;border-radius:24px}
  .mustrun-card:after{inset:9px;border-radius:16px}
  .mustrun-actions{gap:9px}
  .mustrun-btn{padding:0 19px;font-size:13px;min-height:44px}
}
@media(max-width:480px){
  .mustrun-actions{flex-direction:column;align-items:stretch}
  .mustrun-btn{width:100%}
  .mustrun-target{padding:12px 16px;width:100%}
}

/* ---------- 数字滚动 ----------
 * 拆成 slot 后有三个坑，逐一处理：
 *
 * 1) 竖排：容器不加 white-space:nowrap，slot 会被挤成竖排，
 *    整列高度暴涨 4 倍 —— 视觉上就是"分数突然变小"。必须 nowrap。
 *
 * 2) 字形被裁：slot 用 1ch 宽小于真实字形 advance width（约 38.16px vs 37.17px），
 *    配合 overflow:hidden 会把数字左右削掉一截。改用 --digit-w（JS 实测的字形宽度）。
 *
 * 3) 渐变失效：大分数靠 background-clip:text 显示金属渐变，
 *    拆成 slot 后渐变按各自小盒裁切而不显示。滚动期间把同一渐变补到 slot 上。
 *
 * 字距：拆成 slot 后父级 letter-spacing 不再参与 slot 宽度计算，
 * 用 --track 补偿，保证动画前后整串宽度一致、不左右跳。
 */
.metric-score,.score-orbit strong,.breakdown strong,.mobile-score strong{
  white-space:nowrap;
  /* nowrap 仍可能因父级为 grid/flex 且被压到 min-content 宽度而换行，
     min-width:max-content 保证内容永不折行 */
  min-width:max-content;
}
.digit-slot{
  display:inline-block;position:relative;
  width:calc(var(--digit-w, 1ch) + var(--track, 0px));
  height:var(--digit-h, 1.15em);
  line-height:var(--digit-h, 1.15em);
  overflow:hidden;text-align:center;
  /* slot 比行高低，需按行盒把字形垂直居中，否则整串数字会整体上移 */
  vertical-align:calc((1.15em - var(--digit-h, 1.15em)) / 2 - 0.16em);
  font-variant-numeric:inherit;
}
/* 小数点、负号等窄字符：宽度自适应（否则会占满一个字位），
   但高度、行高、基线、overflow 必须与数字 slot 完全一致 ——
   只要有一处不同，它的 y 就会偏几像素，视觉上像在上下抖。
   overflow 用 hidden（而非 visible）是为了和数字 slot 的行盒计算保持统一。 */
.digit-slot.narrow{width:auto}
/* 注意：这里刻意「不」给 .digit-slot / .digit-strip > span 单独加渐变。
   试过，结果是每个格子各自算一遍渐变，接缝处出现色带与暗块。
   正确做法是：让单元格文字用不透明色（#f7e9c8，与大分数金色同一系），
   这样无论格子如何裁切都不会露出接缝，视觉上是一串统一的浅金数字。 */
.score-orbit strong > .digit-slot,
.score-orbit strong > .digit-slot > .digit-strip > span{
  background:none;
  -webkit-text-fill-color:#f4e3ba;
  color:#f4e3ba;
  text-shadow:0 8px 34px rgba(201,162,74,.28);
}
.digit-strip{display:flex;flex-direction:column;will-change:transform}
.digit-strip>span{height:var(--digit-h, 1.15em);line-height:var(--digit-h, 1.15em);flex-shrink:0}
.score-orbit strong span,.breakdown strong span,.mobile-score strong span{font-size:inherit;margin:0}
.item-bonus{color:var(--olive)}

/* ============================================================
   响应式
   ============================================================ */
@media(min-width:801px){
  #dynamic-metrics{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  #dynamic-metrics .metric{margin:0;padding:18px}
  .metric-head{gap:8px}
  .metric-head .metric-icon{font-size:15px;width:26px;height:26px}
  .metric-head .weight{font-size:10.5px}
  .metric h3{font-size:14px}
  .metric-score{font-size:11px}
}
@media(max-width:1240px){main{margin:0 30px}.top{margin:0 0;padding:0 30px}}
@media(max-width:860px){
  .top{height:72px;padding:0 22px}
  .brand{font-size:16px}.logo{width:37px;height:37px;border-radius:11px;font-size:23px}
  main{margin:0 20px;padding-top:30px}
  .heading{margin-bottom:26px;align-items:flex-start}
  .heading h1{font-size:31px}
  .heading p{font-size:13.5px}
  .live{font-size:11px;padding:5px 11px;margin-top:4px}
  .eyebrow{font-size:10px;letter-spacing:1.8px}
  .workspace{grid-template-columns:1fr;gap:18px}
  .form-panel{padding:20px;border-radius:var(--r-m)}
  .profile{gap:15px}.year-label{min-width:0;flex:1}.segmented button{width:66px}
  .results{position:static}
  .summary{padding:22px}
  .score-orbit{width:184px;height:184px;margin:22px auto}
  .score-orbit strong{font-size:54px}
  .note{margin:16px 4px}
  .standards{margin-top:34px}
  .rules{gap:22px}
  .standards h2{font-size:23px}
  .standards .standard-tag{font-size:10.5px}
  .mobile-score{
    display:flex;align-items:center;justify-content:space-between;position:fixed;bottom:0;left:0;right:0;z-index:30;
    padding:11px 24px calc(11px + env(safe-area-inset-bottom));color:#f7e9c8;
    background:rgba(20,31,25,.94);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
    border-top:1px solid rgba(233,205,147,.22);box-shadow:0 -8px 30px -12px rgba(15,25,20,.5);
    transition:background .5s;
  }
  .mobile-score>span{font-size:12.5px;color:rgba(247,233,200,.65);letter-spacing:.4px}
  .mobile-score a{display:flex;gap:6px;align-items:baseline;flex-shrink:0}
  .mobile-score strong{font-size:26px;font-weight:400;color:var(--gold-2);line-height:1.2;font-variant-numeric:tabular-nums;white-space:nowrap}
  .mobile-score a>span:last-child{font-size:11.5px;color:rgba(247,233,200,.45)}
  footer{margin-bottom:78px}
  .celebrate-card{padding:32px 24px 28px;border-radius:24px}
  .celebrate-stats b{font-size:20px}
  .celebrate-actions{gap:9px}
  .celebrate-btn{padding:0 19px;font-size:13px;min-height:44px}
}
@media(max-width:480px){
  .mobile-only{display:block}
  .source-link{font-size:11.5px;padding:6px 11px}
  /* 窄屏：heading 改为纵向堆叠，避免标题被挤成多行 */
  .heading{flex-direction:column;align-items:flex-start;gap:12px}
  .heading h1{font-size:29px;line-height:1.38;margin-top:10px}
  .heading p{font-size:12.5px;max-width:22em}
  .live{margin-top:0;align-self:flex-start}
  .eyebrow{font-size:9.5px;letter-spacing:1.6px;white-space:nowrap}
  /* profile 在窄屏改为纵向，性别与年级各自成行，下拉不被挤窄 */
  .profile{flex-direction:column;gap:14px}
  .profile>div{width:100%}
  .segmented{width:100%}
  .segmented button{flex:1;width:auto;height:40px;font-size:14.5px}
  .year-label{width:100%;flex:none}
  select{font-size:14.5px;padding:0 34px 0 14px;background-position:right 13px center}
  /* 权重徽章不换行 */
  .metric-head .weight{flex-shrink:0;white-space:nowrap}
  .metric{padding:17px}
  .summary{padding:24px}
  .score-orbit{width:196px;height:196px}
  .score-orbit strong{font-size:60px}
  .rules{grid-template-columns:1fr;gap:24px}
  .rules>div{padding-left:40px;position:relative}
  .rules b{position:absolute;left:0;top:5px}
  .standards .section-title{align-items:flex-end}
  .standard-tag{max-width:104px;text-align:center}
  .double{gap:10px}
  .footer{gap:16px}
  .celebrate-number strong{letter-spacing:-2.5px}
  .celebrate-stats{padding:15px 0}
  .celebrate-actions{flex-direction:column;align-items:stretch}
  .celebrate-btn{width:100%}
}
/* 移动端庆祝层：留足边距，卡片不贴屏边 */
@media(max-width:860px){
  .celebrate-card{
    width:calc(100% - 28px);max-height:calc(100dvh - 28px);
    padding:30px 22px 26px;border-radius:26px;
  }
  .celebrate-card:after{inset:10px;border-radius:18px}
}

/* ---------- 减少动态效果 ---------- */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  body.celebrating .top,body.celebrating main,body.celebrating .mobile-score{filter:none;transform:none}
  .score-orbit:before{animation:none}
}