/* jyddai.com 预览样式 v2（草稿 / 未上线）—— 纯本地，无外网资源 */
:root{
  --bg0:#172744; --bg1:#203458; --bg2:#2b4269;
  --fg:#f3f7ff; --fg2:#d8e3f2; --muted:#c6d3e6; --dim:#a6b4cb;
  --line:rgba(210,226,255,.12); --line2:rgba(210,226,255,.22);
  --accent:#62dcc0; --accent-soft:rgba(98,220,192,.12); --coral:#ec8a74;
  --r:22px; --r-sm:14px; --max:1160px;
  --shadow:0 1px 0 rgba(255,255,255,.05) inset, 0 30px 60px -36px rgba(0,0,0,.9);
  --font:"Inter","SF Pro Text",-apple-system,"PingFang SC","HarmonyOS Sans SC","HarmonyOS_Sans_SC","Noto Sans SC","Noto Sans CJK SC","Source Han Sans SC","Microsoft YaHei UI","Microsoft YaHei",sans-serif;
  --mono:"JetBrains Mono","SF Mono",ui-monospace,Menlo,Consolas,monospace;
  --ease:cubic-bezier(.2,.7,.2,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-snap-type:y proximity;scroll-padding-top:68px;-webkit-text-size-adjust:100%}
body{background:var(--bg0);color:var(--fg);font-family:var(--font);font-size:16px;line-height:1.85;
  letter-spacing:.01em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;overflow-x:hidden;position:relative}
a{color:inherit;text-decoration:none}
::selection{background:rgba(98,220,192,.28)}

/* —— 深空背景：固定星云、稀疏星场与流星 —— */
.bg{position:fixed;inset:0;height:100vh;height:100svh;z-index:-1;pointer-events:none;overflow:hidden}
.bg .nebula{position:absolute;inset:-7%;
  background:
    radial-gradient(900px 700px at 78% 8%,rgba(83,160,255,.43),rgba(62,122,233,.24) 38%,transparent 74%),
    radial-gradient(850px 700px at 7% 45%,rgba(163,103,240,.34),rgba(123,80,207,.17) 44%,transparent 75%),
    radial-gradient(900px 700px at 48% 35%,rgba(105,153,239,.23),transparent 72%),
    radial-gradient(850px 700px at 96% 85%,rgba(50,186,224,.28),transparent 72%),
    linear-gradient(118deg,transparent 32%,rgba(127,119,226,.2) 44%,rgba(164,150,247,.3) 50%,rgba(127,119,226,.2) 56%,transparent 68%),
    linear-gradient(180deg,#20375b 0%,#192d4d 55%,#142440 100%);
  filter:blur(24px);transform-origin:center;animation:ambient-glow 45s ease-in-out infinite alternate;will-change:transform,opacity}
body::after{content:"";position:fixed;inset:0;z-index:100;pointer-events:none;opacity:.045;mix-blend-mode:soft-light;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 .9 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}

/* 星点由 background.js 随机绘制；银河尘带只轻微提亮斜向区域 */
.bg .stars{position:absolute;inset:0;width:100%;height:100%;opacity:.82;pointer-events:none}
.bg .meteors{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.scroll-progress{position:fixed;inset:0 0 auto;height:2px;z-index:120;pointer-events:none;background:rgba(255,255,255,.035)}
.scroll-progress span{display:block;width:100%;height:100%;transform:scaleX(var(--scroll-progress,0));transform-origin:left center;
  background:linear-gradient(90deg,#62dcc0 0%,#7fc9ff 54%,#b89cff 100%);box-shadow:0 0 10px rgba(98,220,192,.72);will-change:transform}
.bg .meteor{position:absolute;left:110%;display:block;height:1px;border-radius:50%;opacity:0;
  background:linear-gradient(270deg,transparent 0%,rgba(180,205,255,.22) 48%,rgba(220,237,255,.82) 82%,#fff 100%)}
.bg .meteor::after{content:"";position:absolute;left:0;top:50%;width:2px;height:2px;border-radius:50%;background:#fff;transform:translate(-50%,-50%);
  box-shadow:0 0 5px 2px rgba(210,230,255,.9),0 0 14px 4px rgba(120,181,255,.52)}
.bg .meteor.m1{top:9%;width:360px;filter:drop-shadow(0 0 5px rgba(150,190,255,.72));animation:meteor-one 13s linear -9s infinite}
.bg .meteor.m2{top:35%;width:300px;background:linear-gradient(270deg,transparent 0%,rgba(203,184,255,.22) 48%,rgba(238,225,255,.82) 82%,#fff 100%);
  filter:drop-shadow(0 0 5px rgba(180,150,255,.62));animation:meteor-two 16s linear -12s infinite}
.bg .meteor.m3{top:58%;width:420px;filter:drop-shadow(0 0 5px rgba(150,190,255,.62));animation:meteor-three 20s linear -16s infinite}
@keyframes ambient-glow{from{transform:translate3d(0,0,0) scale(1);opacity:.85}to{transform:translate3d(-2%,1.5%,0) scale(1.08);opacity:1}}
@keyframes meteor-one{0%,60%{transform:translate3d(0,0,0) rotate(-35deg);opacity:0}62%{opacity:1}100%{transform:translate3d(-145vw,101.5vw,0) rotate(-35deg);opacity:0}}
@keyframes meteor-two{0%,68%{transform:translate3d(0,0,0) rotate(-35deg);opacity:0}70%{opacity:.96}100%{transform:translate3d(-145vw,101.5vw,0) rotate(-35deg);opacity:0}}
@keyframes meteor-three{0%,72%{transform:translate3d(0,0,0) rotate(-35deg);opacity:0}74%{opacity:.92}100%{transform:translate3d(-145vw,101.5vw,0) rotate(-35deg);opacity:0}}
@keyframes orbital-turn{to{transform:rotate(360deg)}}
@keyframes orbit-sway{from{transform:rotate(-27deg) scaleY(.48)}to{transform:rotate(-18deg) scaleY(.56)}}
@keyframes orb-breathe{from{transform:scale(.985)}to{transform:scale(1.015)}}
@keyframes point-float{from{transform:translate3d(0,0,0)}to{transform:translate3d(-4px,-8px,0)}}
.orb .r3{transform-origin:center;animation:orbital-turn 54s linear infinite}
.orb .r2{transform-origin:center;animation:orbit-sway 18s ease-in-out infinite alternate}
.orb .core{animation:orb-breathe 9s ease-in-out infinite alternate}
.orb .dot{animation:point-float 6s ease-in-out infinite alternate}
.orb .dot.d2{animation-delay:-3s}

/* 内容随滚动进入视野；独立 translate 不会覆盖卡片悬停位移 */
.motion-ready .motion-reveal{opacity:0;translate:0 28px;scale:.985;filter:blur(2px);
  transition:opacity .75s cubic-bezier(.2,.8,.2,1),translate .75s cubic-bezier(.16,1,.3,1),
    scale .75s cubic-bezier(.16,1,.3,1),filter .75s var(--ease);
  transition-delay:var(--reveal-delay,0ms);will-change:opacity,translate,filter}
.motion-ready .motion-reveal.is-visible{opacity:1;translate:0 0;scale:1;filter:blur(0);will-change:auto}
.orb{translate:var(--parallax-x,0px) var(--parallax-y,0px);transition:translate .35s var(--ease)}
.card.pointer-glow:not(.feature):not(.quote):not(.faq){transform-style:preserve-3d;}
.card.pointer-glow:not(.feature):not(.quote):not(.faq):hover{
  transform:perspective(1100px) rotateX(var(--tilt-y,0deg)) rotateY(var(--tilt-x,0deg)) translate3d(0,-9px,0) scale(1.012);
  border-color:rgba(151,238,220,.36);
  box-shadow:0 28px 70px -42px rgba(98,220,192,.84),0 0 28px rgba(98,220,192,.09),inset 0 1px 0 rgba(255,255,255,.12);
}
.card.pointer-glow:not(.feature):not(.quote):not(.faq):focus-within{
  transform:translateY(-6px);border-color:rgba(151,238,220,.36);
  box-shadow:0 24px 58px -40px rgba(98,220,192,.75),inset 0 1px 0 rgba(255,255,255,.12);
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;scroll-snap-type:none}
  .bg .nebula,.bg .meteor,.orb .r2,.orb .r3,.orb .core,.orb .dot{animation:none!important;will-change:auto}
  .motion-ready .motion-reveal{opacity:1;translate:none;scale:1;filter:none;transition:none;will-change:auto}
  .orb{translate:none;transition:none}
  .card.pointer-glow::after,.card.pointer-glow{transition:none!important}
  .card.pointer-glow:hover,.card.pointer-glow:focus-within{transform:none!important}
}
.wrap{max-width:var(--max);margin:0 auto;padding:0 40px}

/* —— 草稿条：细、淡 —— */
.draft{height:28px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:11.5px;letter-spacing:.08em;
  color:rgba(236,200,140,.72);background:rgba(236,200,140,.045);border-bottom:1px solid rgba(236,200,140,.1)}
.draft::before{content:"";width:5px;height:5px;border-radius:50%;background:rgba(236,200,140,.75)}

/* —— 导航 —— */
.nav{position:sticky;top:0;z-index:50;background:rgba(18,31,56,.78);backdrop-filter:saturate(160%) blur(18px);
  -webkit-backdrop-filter:saturate(160%) blur(18px);border-bottom:1px solid var(--line)}
.nav .wrap{height:68px;display:flex;align-items:center;justify-content:space-between}
.logo{display:flex;align-items:center;gap:12px}
.logo .mk{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;font-size:15px;font-weight:700;color:var(--accent);
  background:linear-gradient(160deg,rgba(98,220,192,.22),rgba(98,220,192,.04));border:1px solid rgba(98,220,192,.32);
  box-shadow:0 0 0 1px rgba(0,0,0,.4),0 6px 18px -8px rgba(98,220,192,.55),inset 0 1px 0 rgba(255,255,255,.12)}
.logo .nm{font-size:16px;font-weight:650;letter-spacing:.08em}
.logo .dm{font-family:var(--mono);font-size:11px;color:var(--dim);letter-spacing:.06em;padding-left:12px;border-left:1px solid var(--line2)}
.nav ul{list-style:none;display:flex;gap:6px}
.nav ul a{display:block;padding:7px 14px;border-radius:999px;font-size:14px;color:var(--muted);transition:.25s var(--ease)}
.nav ul a:hover{color:var(--fg);background:rgba(255,255,255,.04)}
.nav ul a.on{color:var(--fg);background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px var(--line)}

/* —— 区块 —— */
section{padding:136px 0;position:relative}
.hero,.chero,section,footer{scroll-snap-align:start;scroll-snap-stop:normal}
.band{background:linear-gradient(180deg,rgba(255,255,255,.012),rgba(255,255,255,.022) 50%,rgba(255,255,255,.012));
  border-top:1px solid rgba(255,255,255,.04);border-bottom:1px solid rgba(255,255,255,.04)}
.head{margin-bottom:56px;max-width:760px}
.kicker{display:flex;align-items:center;gap:12px;font-family:var(--mono);font-size:12px;letter-spacing:.16em;color:var(--muted);margin-bottom:22px}
.kicker b{color:var(--accent);font-weight:500}
.kicker::after{content:"";width:40px;height:1px;background:linear-gradient(90deg,var(--line2),transparent)}
h2{font-size:44px;line-height:1.22;font-weight:650;letter-spacing:-.005em;color:var(--fg)}
.head p{margin-top:18px;font-size:17px;line-height:1.9;color:var(--muted)}
h3{font-weight:600;letter-spacing:.01em}

/* —— 卡片 —— */
.card{position:relative;border-radius:var(--r);padding:32px;
  background:linear-gradient(145deg,rgba(61,111,205,.98),rgba(28,62,140,.99));
  border:1px solid rgba(190,216,255,.4);
  box-shadow:0 1px 0 rgba(255,255,255,.2) inset,0 28px 58px -38px rgba(0,0,0,.9),0 0 0 1px rgba(94,151,255,.24);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  transition:transform .45s var(--ease),border-color .45s var(--ease),background .45s var(--ease)}
.card::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:radial-gradient(120% 60% at 50% 0%,rgba(211,228,255,.11),transparent 62%)}
.card.pointer-glow:not(.feature):not(.quote)::after{content:"";position:absolute;inset:0;z-index:0;border-radius:inherit;pointer-events:none;opacity:0;
  background:radial-gradient(300px circle at var(--pointer-x,50%) var(--pointer-y,50%),rgba(98,220,192,.12),transparent 72%);
  transition:opacity .28s var(--ease)}
.card.pointer-glow:not(.feature):not(.quote):hover::after{opacity:1}
.card.pointer-glow:not(.feature):not(.quote)>*{position:relative;z-index:1}
a.card:hover,.card.hov:hover{transform:translateY(-3px);border-color:rgba(210,230,255,.55);
  background:linear-gradient(145deg,rgba(82,135,232,.99),rgba(34,78,168,.99))}
.trk.ac.hov:hover{border-color:rgba(98,220,192,.5);background:linear-gradient(145deg,rgba(45,111,105,.98),rgba(23,57,72,.99))}
.card h3{font-size:19px;line-height:1.5;margin-bottom:10px}
.card p{font-size:15px;line-height:1.85;color:var(--muted)}
.label{display:inline-flex;align-items:center;font-size:12px;letter-spacing:.06em;color:var(--fg2);margin-bottom:20px;
  padding:3px 11px;border-radius:999px;background:rgba(255,255,255,.035);border:1px solid var(--line)}
.label.ac{color:var(--accent);border-color:rgba(98,220,192,.22);background:var(--accent-soft)}
.link{display:inline-flex;align-items:center;gap:8px;margin-top:22px;font-size:14px;font-weight:550;color:var(--fg2);transition:.3s var(--ease)}
.link .ar{transition:transform .3s var(--ease);color:var(--accent)}
a:hover .link .ar,.link:hover .ar{transform:translateX(3px)}
.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.g2{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}

/* —— 按钮 —— */
.btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:40px}
.btn{display:inline-flex;align-items:center;gap:10px;height:48px;padding:0 24px;border-radius:999px;font-size:15px;font-weight:600;letter-spacing:.02em;
  transition:transform .3s var(--ease),background .3s var(--ease),box-shadow .3s var(--ease),border-color .3s}
.btn:hover{transform:translateY(-1px)}
.btn.light{background:linear-gradient(180deg,#f4faf8,#d9e6e3);color:#081210;box-shadow:0 10px 30px -14px rgba(180,255,235,.55),inset 0 1px 0 #fff}
.btn.ghost{color:var(--fg);background:rgba(255,255,255,.035);border:1px solid var(--line2);box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
.btn.ghost:hover{border-color:rgba(255,255,255,.22);background:rgba(255,255,255,.06)}
.btn.coral{background:linear-gradient(180deg,#f29a85,#e57d66);color:#1c0904;box-shadow:0 12px 32px -14px rgba(236,138,116,.8),inset 0 1px 0 rgba(255,255,255,.35)}
.note-s{margin-top:18px;font-size:13px;color:var(--dim);letter-spacing:.04em}

/* —— 占位：统一低调 —— */
.ph{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:500;letter-spacing:.04em;line-height:1;
  padding:5px 9px;border-radius:7px;color:rgba(255,255,255,.42);border:1px dashed rgba(255,255,255,.2);background:transparent;white-space:nowrap;vertical-align:middle}
.ph::before{content:"";width:4px;height:4px;border-radius:50%;background:rgba(236,200,140,.7)}
.phbox{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;
  border:1px dashed rgba(255,255,255,.16);border-radius:var(--r-sm);color:rgba(255,255,255,.4);font-size:12px;letter-spacing:.06em;
  background:repeating-linear-gradient(135deg,rgba(255,255,255,.012) 0 10px,transparent 10px 20px)}

/* —— Hero —— */
.hero{position:relative;padding:150px 0 170px;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:64px 64px;-webkit-mask-image:radial-gradient(70% 70% at 70% 40%,#000 0%,transparent 75%);mask-image:radial-gradient(70% 70% at 70% 40%,#000 0%,transparent 75%)}
.hero .wrap{position:relative;display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:40px}
.hero .eb{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:12px;letter-spacing:.2em;color:var(--muted);
  padding:6px 14px 6px 10px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.025);margin-bottom:36px}
.hero .eb i{width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px rgba(98,220,192,.14)}
.hero h1{font-size:clamp(58px,6.67vw,96px);line-height:1.02;font-weight:700;letter-spacing:.02em;
  background:linear-gradient(180deg,#ffffff 10%,#cfeee6 55%,#7fd9c2 100%);-webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 10px 40px rgba(98,220,192,.12))}
.hero .pos{margin-top:28px;font-size:26px;line-height:1.5;font-weight:550;letter-spacing:.02em;color:var(--fg)}
.hero .pos em{font-style:normal;color:var(--accent)}
.hero .intro{margin-top:20px;max-width:520px;font-size:16.5px;line-height:1.95;color:var(--muted)}
.tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:32px}
.tag{display:inline-flex;align-items:center;gap:9px;height:36px;padding:0 15px;border-radius:999px;font-size:13.5px;font-weight:550;color:var(--fg2);
  background:rgba(255,255,255,.03);border:1px solid var(--line);transition:.3s var(--ease)}
.tag i{width:5px;height:5px;border-radius:50%;background:var(--accent);opacity:.85}
.tag:hover{border-color:rgba(98,220,192,.35);color:var(--fg)}
/* 光球 */
.orb{position:relative;justify-self:center;width:460px;height:460px}
.orb .halo{position:absolute;inset:-34%;border-radius:50%;background:radial-gradient(circle,rgba(98,220,192,.3),rgba(78,135,255,.32) 34%,rgba(123,81,196,.2) 55%,transparent 72%);filter:blur(34px);mix-blend-mode:screen}
.orb .ring{position:absolute;border-radius:50%;border:1px solid rgba(132,170,255,.14)}
.orb .r1{inset:0}
.orb .r2{inset:18% -6%;transform:rotate(-24deg) scaleY(.52);border-color:rgba(172,205,255,.25);box-shadow:0 0 36px rgba(98,220,192,.08)}
.orb .r3{inset:30px;border:1px solid transparent;background:conic-gradient(from 210deg,transparent 0deg,rgba(98,220,192,.55) 50deg,transparent 120deg) border-box;
  -webkit-mask:linear-gradient(#000 0 0) padding-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.orb .core{position:absolute;inset:76px;border-radius:50%;
  background:
    radial-gradient(circle at 34% 28%,rgba(255,255,255,.55),rgba(255,255,255,0) 22%),
    radial-gradient(circle at 40% 36%,#9ef0da 0%,#3cb79c 28%,#14524a 58%,#0a1c1d 82%);
  box-shadow:inset -30px -40px 80px rgba(0,0,0,.48),inset 10px 14px 40px rgba(180,255,235,.2),0 40px 120px -20px rgba(98,220,192,.48),0 0 70px -24px rgba(104,170,255,.62)}
.orb .core::after{content:"";position:absolute;inset:0;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.orb .dot{position:absolute;width:8px;height:8px;border-radius:50%;background:#cffff1;box-shadow:0 0 14px 3px rgba(98,220,192,.8);top:12%;right:16%}
.orb .dot.d2{width:5px;height:5px;top:auto;bottom:4%;right:auto;left:26%;opacity:.7}

/* —— 横向时间线 —— */
.tl{position:relative;padding-top:12px}
.tl .track{position:relative;height:40px}
.tl .track::before{content:"";position:absolute;left:0;right:0;top:19px;height:1px;
  background:linear-gradient(90deg,rgba(98,220,192,.0) 0%,rgba(98,220,192,.65) 6%,rgba(98,220,192,.35) 30%,rgba(255,255,255,.08) 60%,transparent 100%)}
.tl .track::after{content:"";position:absolute;left:30%;right:6%;top:19px;height:1px;
  background:repeating-linear-gradient(90deg,rgba(255,255,255,.18) 0 4px,transparent 4px 12px);-webkit-mask-image:linear-gradient(90deg,#000,transparent);mask-image:linear-gradient(90deg,#000,transparent)}
.tl .pt{position:absolute;left:6%;top:12px;width:15px;height:15px;border-radius:50%;background:var(--bg0);border:1px solid rgba(98,220,192,.8);
  box-shadow:0 0 0 6px rgba(98,220,192,.08),0 0 22px rgba(98,220,192,.55)}
.tl .pt::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--accent)}
.tl .tbd{position:absolute;right:0;top:8px;font-size:12px;letter-spacing:.24em;color:var(--dim)}
.tl .item{margin-left:calc(6% - 32px);margin-top:28px;max-width:440px}
.tl .date{font-family:var(--mono);font-size:13px;letter-spacing:.14em;color:var(--accent);margin-bottom:12px}

/* —— 免费笔记：编辑式列表 —— */
.sub{margin:120px 0 40px;display:flex;align-items:flex-end;justify-content:space-between;gap:24px}
.sub h2{font-size:34px}
.sub p{margin-top:12px;color:var(--muted);font-size:16px}
.list{border-radius:var(--r);overflow:hidden;padding:0}
.row{display:grid;grid-template-columns:110px 1fr 1.3fr auto;align-items:center;gap:28px;padding:26px 32px;border-top:1px solid var(--line);transition:background .35s var(--ease)}
.row:first-child{border-top:none}
.row:hover{background:rgba(255,255,255,.025)}
.row .k{font-size:12.5px;letter-spacing:.12em;color:var(--dim)}
.row h3{font-size:18px}
.row p{font-size:15px;color:var(--muted)}
.row .go{display:flex;align-items:center;gap:12px;font-size:14px;color:var(--fg2)}
.row .go .ar{color:var(--accent);transition:transform .3s var(--ease)}
.row:hover .go .ar{transform:translateX(3px)}
.cta{margin-top:20px;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:26px 32px}
.cta p{font-size:15px;color:var(--fg2)}
.cta .btns{margin-top:0;flex:none}

/* —— 作品集 —— */
.work .phbox{aspect-ratio:16/10;margin-bottom:26px}
.work .play{width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.18);display:grid;place-items:center}
.work .play::after{content:"";border-left:11px solid rgba(255,255,255,.4);border-top:7px solid transparent;border-bottom:7px solid transparent;margin-left:3px}
.work{padding:18px 18px 28px}
.work h3,.work p,.work .ph{margin-left:14px;margin-right:14px}
.work .ph{margin-top:16px}

/* —— 星球 —— */
.feature{display:grid;grid-template-columns:1.4fr .6fr;gap:56px;align-items:center;padding:56px;overflow:hidden}
.feature::after{content:"";position:absolute;right:-120px;top:-160px;width:480px;height:480px;border-radius:50%;
  background:radial-gradient(circle,rgba(98,220,192,.12),transparent 65%);pointer-events:none}
.feature h3.big{font-size:32px;line-height:1.3;font-weight:650;margin-bottom:20px}
.feature .lead{font-size:17px;line-height:1.95;color:var(--fg2)}
.feature p.m{margin-top:14px;font-size:15px;color:var(--muted)}
.qr{width:100%;max-width:220px;aspect-ratio:1;justify-self:end;position:relative;z-index:1}
.qr .q{width:44px;height:44px;border-radius:10px;border:1px solid rgba(255,255,255,.16);
  background:linear-gradient(90deg,rgba(255,255,255,.14) 50%,transparent 50%) 0 0/11px 11px,linear-gradient(rgba(255,255,255,.14) 50%,transparent 50%) 0 0/11px 11px;opacity:.5}

/* —— 在哪看我 —— */
.g6{display:grid;grid-template-columns:repeat(6,1fr);gap:20px}
.g6 > .card{grid-column:span 2}
.g6 > .card.w{grid-column:span 3}
.who .meta{font-size:12.5px;letter-spacing:.08em;color:var(--dim);margin-bottom:14px}
.who h3{font-size:20px}
.strip{margin-top:20px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 28px;border-radius:var(--r-sm)}
.strip span{font-size:14.5px;color:var(--muted)} .strip b{color:var(--fg);font-weight:600;margin-right:10px}

/* —— 页脚 —— */
footer{padding:64px 0 72px;border-top:1px solid var(--line);background:rgba(0,0,0,.25)}
footer .wrap{display:grid;grid-template-columns:1fr auto;gap:28px 40px;align-items:end}
footer .fl p{margin-top:18px;font-size:13.5px;color:var(--muted);line-height:2}
footer .fl a{color:var(--fg2);border-bottom:1px solid var(--line2)}
footer .fr{font-size:13px;color:var(--dim);display:flex;align-items:center;gap:10px}

/* —— 课程页 —— */
.chero{position:relative;padding:150px 0 120px;overflow:hidden}
.chero::before{content:"";position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);
  background-size:64px 64px;-webkit-mask-image:radial-gradient(60% 80% at 80% 30%,#000,transparent 75%);mask-image:radial-gradient(60% 80% at 80% 30%,#000,transparent 75%)}
.chero::after{content:"";position:absolute;right:-6%;top:-10%;width:640px;height:640px;border-radius:50%;
  background:radial-gradient(circle at 42% 48%,rgba(92,160,255,.17),transparent 58%),radial-gradient(circle at 60% 58%,rgba(98,220,192,.11),transparent 66%),radial-gradient(circle at 75% 30%,rgba(126,91,220,.1),transparent 62%);filter:blur(10px);pointer-events:none}
.chero .wrap{position:relative;z-index:1}
.chero h1{font-size:84px;line-height:1.12;font-weight:700;letter-spacing:.01em;margin-top:4px}
.chero h1 em{font-style:normal;background:linear-gradient(180deg,#c9fff0,#62dcc0);-webkit-background-clip:text;background-clip:text;color:transparent}
.chero .sub2{margin-top:28px;font-size:20px;line-height:1.7;color:var(--fg2);max-width:640px}
.quote{padding:64px 72px}
.quote::after{content:"“";position:absolute;left:30px;top:6px;font-size:120px;line-height:1;color:rgba(98,220,192,.14);font-family:Georgia,serif}
.quote p{font-size:20px;line-height:2.05;color:var(--fg2);max-width:860px;position:relative}
.quote p+p{margin-top:22px}
.tracks{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.trk{padding:28px 24px;display:flex;flex-direction:column}
.trk .k{font-size:12.5px;letter-spacing:.1em;color:var(--dim);margin-bottom:28px}
.trk h3{font-size:24px;line-height:1.35;margin-bottom:14px}
.trk p{font-size:14px;line-height:1.85}
.trk .chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:16px}
.trk .chips span{font-size:12px;color:var(--fg2);padding:2px 9px;border-radius:999px;border:1px solid var(--line)}
.trk strong{color:var(--fg);font-weight:600}
.trk.ac{border-color:rgba(98,220,192,.4);background:linear-gradient(145deg,rgba(34,88,91,.98),rgba(21,48,67,.99))}
.route{padding:36px}
.route .t{display:flex;align-items:baseline;gap:14px;margin-bottom:28px}
.route .t h3{font-size:22px;margin:0}
.route .t span{font-size:14px;color:var(--muted)}
.steps{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.steps .s{font-size:14px;font-weight:550;color:var(--fg);padding:9px 16px;border-radius:12px;background:rgba(255,255,255,.035);border:1px solid var(--line)}
.steps .a{width:18px;height:1px;background:linear-gradient(90deg,var(--line2),rgba(98,220,192,.7));position:relative}
.steps .a::after{content:"";position:absolute;right:-1px;top:-3px;border-left:5px solid rgba(98,220,192,.7);border-top:3.5px solid transparent;border-bottom:3.5px solid transparent}
.fee{display:flex;align-items:center;gap:12px;margin-top:26px;padding-top:22px;border-top:1px solid var(--line);font-size:16px;font-weight:600}
.fee small{font-size:14px;font-weight:400;color:var(--muted)}
.faq{margin-top:20px;padding:0}
.faq .q{display:grid;grid-template-columns:280px 1fr;gap:32px;padding:28px 36px;border-top:1px solid var(--line)}
.faq .q:first-child{border-top:none}
.faq h3{font-size:17px}
.faq p{font-size:15px;color:var(--muted)}

/* —— 响应式 —— */
@media (max-width:1080px){
  .tracks{grid-template-columns:repeat(3,1fr)}
  .orb{width:360px;height:360px}
  .orb .core{inset:60px}
}
@media (max-width:760px){
  body{font-size:15px}
  .wrap{padding:0 22px}
  .draft{height:26px;font-size:10.5px}
  html{scroll-padding-top:58px}
  .nav .wrap{height:58px}
  .logo .dm{display:none}
  .logo .nm{font-size:15px}
  .logo .mk{width:28px;height:28px;font-size:14px}
  .nav ul{gap:0}
  .nav ul a{padding:6px 10px;font-size:13.5px}
  section{padding:88px 0}
  .head{margin-bottom:36px}
  .kicker{margin-bottom:16px;font-size:11px}
  h2{font-size:30px;line-height:1.3}
  .head p{font-size:15.5px;margin-top:14px}
  .card{padding:26px 24px;border-radius:18px}
  .g3,.g2{grid-template-columns:1fr;gap:14px}
  .g6{grid-template-columns:1fr;gap:14px}
  .g6>.card,.g6>.card.w{grid-column:auto}
  .hero{padding:72px 0 96px}
  .hero .wrap{grid-template-columns:1fr;gap:0}
  .hero .eb{margin-bottom:26px;font-size:11px}
  .hero h1{font-size:58px;letter-spacing:.03em}
  .hero .pos{margin-top:20px;font-size:20px}
  .hero .intro{font-size:15.5px;margin-top:14px}
  .tags{margin-top:26px;gap:8px}
  .tag{height:34px;font-size:13px;padding:0 13px}
  .btns{margin-top:30px;gap:10px}
  .btn{height:46px;padding:0 22px;font-size:14.5px}
  .orb{position:absolute;right:-150px;top:-40px;width:300px;height:300px;opacity:.45;z-index:-1}
  .orb .core{inset:50px}
  .orb .r2{display:none}
  .tl .item{margin-left:0}
  .tl .pt{left:0}
  .tl .track::before{background:linear-gradient(90deg,rgba(98,220,192,.65),rgba(98,220,192,.3) 30%,rgba(255,255,255,.08) 60%,transparent)}
  .sub{margin:88px 0 28px;flex-direction:column;align-items:flex-start}
  .sub h2{font-size:26px}
  .row{grid-template-columns:1fr;gap:6px;padding:22px 24px}
  .row .go{margin-top:8px}
  .cta{flex-direction:column;align-items:flex-start;padding:24px}
  .feature{grid-template-columns:1fr;gap:32px;padding:32px 26px}
  .feature h3.big{font-size:24px}
  .feature .lead{font-size:16px}
  .qr{justify-self:start;max-width:160px}
  .strip{flex-direction:column;align-items:flex-start;padding:18px 22px}
  footer .wrap{grid-template-columns:1fr}
  .chero{padding:80px 0 72px}
  .chero h1{font-size:46px;line-height:1.2}
  .chero .sub2{font-size:17px;margin-top:20px}
  .chero::after{width:380px;height:380px;right:-40%}
  .quote{padding:44px 26px 32px}
  .quote::after{left:16px;top:0;font-size:90px}
  .quote p{font-size:16.5px;line-height:2}
  .tracks{grid-template-columns:1fr;gap:12px}
  .trk .k{margin-bottom:12px}
  .trk h3{font-size:21px}
  .route{padding:26px 24px}
  .faq .q{grid-template-columns:1fr;gap:6px;padding:22px 24px}
}

/* 微调 */
.row h3{margin:0}
.tl .track::before{background:linear-gradient(90deg,rgba(98,220,192,.7) 0%,rgba(98,220,192,.35) 28%,rgba(255,255,255,.08) 58%,transparent 100%)}
.tl .pt{left:32px}
.tl .item{margin-left:0;margin-top:22px}
.feature .label{margin-bottom:22px}
.routes{display:grid;gap:20px}
.route{display:grid;grid-template-columns:300px 1fr;align-items:center;gap:32px}
.route .t{flex-direction:column;gap:6px;margin:0}
.pair{display:inline-flex;align-items:center;gap:10px}
.faq h3{margin:0}
.trk h3{font-size:22px}
@media (max-width:760px){.route{grid-template-columns:1fr;gap:20px}.route .t{flex-direction:row;gap:12px}}

/* —— 配色方向 v3：雾蓝底、钴蓝重点、少量暖金 —— */
:root{
  --bg0:#f1f6ff; --bg1:#e7effc; --bg2:#dce8fb;
  --fg:#1a2742; --fg2:#354765; --muted:#536783; --dim:#7587a5;
  --line:rgba(53,79,132,.13); --line2:rgba(53,79,132,.24);
  --accent:#3d5ee8; --accent-soft:rgba(61,94,232,.1); --coral:#e9785e;
  --shadow:0 1px 0 rgba(255,255,255,.9) inset,0 24px 54px -38px rgba(46,75,139,.3);
}
body{background:linear-gradient(145deg,#e4edfc 0%,#d9e6fa 44%,#e3e1fa 100%);color:var(--fg)}
::selection{background:rgba(88,104,232,.22)}
body::after{opacity:.03;mix-blend-mode:multiply}
.bg .nebula{background:
  radial-gradient(900px 680px at 78% 8%,rgba(94,146,252,.46),rgba(88,134,240,.23) 40%,transparent 74%),
  radial-gradient(820px 680px at 8% 45%,rgba(150,128,246,.38),rgba(138,122,231,.18) 44%,transparent 74%),
  radial-gradient(850px 700px at 48% 35%,rgba(110,164,240,.28),transparent 72%),
  radial-gradient(760px 640px at 96% 85%,rgba(88,194,212,.26),transparent 72%),
  linear-gradient(118deg,transparent 33%,rgba(118,130,226,.15) 46%,rgba(170,160,244,.23) 50%,rgba(118,130,226,.15) 54%,transparent 67%),
  linear-gradient(180deg,#e6effe 0%,#dae6fa 55%,#e4e2fa 100%);
  filter:blur(22px);opacity:.96}
.bg .stars{opacity:.58}
.bg .meteor{height:1.5px;background:linear-gradient(270deg,transparent 0%,rgba(71,101,224,.2) 38%,rgba(104,117,237,.8) 78%,#fff 100%)}
.bg .meteor::after{background:#fff;box-shadow:0 0 4px 2px rgba(82,105,226,.85),0 0 13px 4px rgba(116,124,246,.48)}
.bg .meteor.m1,.bg .meteor.m3{filter:drop-shadow(0 0 4px rgba(81,108,223,.5))}
.bg .meteor.m2{background:linear-gradient(270deg,transparent 0%,rgba(132,105,220,.18) 38%,rgba(167,132,239,.82) 78%,#fff 100%);filter:drop-shadow(0 0 4px rgba(132,105,220,.46))}
.scroll-progress{background:rgba(48,74,132,.08)}
.scroll-progress span{background:linear-gradient(90deg,#4c73f2 0%,#7662e7 62%,#f0a36e 100%);box-shadow:0 0 10px rgba(91,111,229,.42)}
.draft{color:#8b6435;background:rgba(244,190,105,.13);border-color:rgba(196,145,72,.2)}
.draft::before{background:#d49b4d}
.nav{background:rgba(240,246,255,.86);border-color:var(--line);box-shadow:0 8px 24px rgba(58,82,138,.055)}
.logo .mk{color:#fff;background:linear-gradient(145deg,#567af1,#6554d6);border-color:rgba(71,87,196,.35);box-shadow:0 5px 14px -6px rgba(69,91,203,.45),inset 0 1px 0 rgba(255,255,255,.4)}
.nav ul a{color:var(--muted)}
.nav ul a:hover{color:#2849bd;background:rgba(61,94,232,.07)}
.nav ul a.on{color:#294ac4;background:rgba(61,94,232,.09);box-shadow:inset 0 0 0 1px rgba(61,94,232,.12)}
.band{background:linear-gradient(180deg,rgba(208,224,250,.44),rgba(238,244,255,.62) 50%,rgba(208,224,250,.44));border-color:rgba(73,100,159,.12)}
.kicker{color:#61728e}
.kicker b{color:#435ee0}
.card{background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(225,236,255,.94));border-color:rgba(105,133,197,.26);
  box-shadow:0 1px 0 rgba(255,255,255,.95) inset,0 22px 48px -38px rgba(56,83,150,.34),0 0 0 1px rgba(95,125,197,.04)}
.card::before{background:radial-gradient(120% 60% at 50% 0%,rgba(255,255,255,.6),transparent 66%)}
.card.pointer-glow:not(.feature):not(.quote)::after{background:radial-gradient(300px circle at var(--pointer-x,50%) var(--pointer-y,50%),rgba(99,111,231,.12),transparent 72%)}
.card.pointer-glow:not(.feature):not(.quote):not(.faq):hover,.card.pointer-glow:not(.feature):not(.quote):not(.faq):focus-within{border-color:rgba(90,112,215,.42);box-shadow:0 24px 48px -34px rgba(79,100,192,.34),0 0 0 1px rgba(95,115,209,.08),inset 0 1px 0 #fff}
a.card:hover,.card.hov:hover{border-color:rgba(91,116,216,.42);background:linear-gradient(145deg,#fff,#dce7ff)}
.card h3{color:#1e2c4a}
.card p{color:#536783}
.label{color:#4d6185;background:rgba(255,255,255,.7);border-color:rgba(76,101,164,.15)}
.label.ac{color:#4156d4;border-color:rgba(74,91,211,.22);background:rgba(102,115,232,.09)}
.link{color:#3d5278}
.link .ar{color:#4c5fe0}
.btn.light{background:linear-gradient(135deg,#5278f1,#6757d9);color:#fff;box-shadow:0 10px 28px -14px rgba(77,94,209,.58),inset 0 1px 0 rgba(255,255,255,.4)}
.btn.ghost{color:#334768;background:rgba(255,255,255,.66);border-color:rgba(69,93,151,.22);box-shadow:0 1px 0 #fff inset}
.btn.ghost:hover{border-color:rgba(66,91,192,.35);background:#fff}
.btn.coral{background:linear-gradient(180deg,#ffd184,#f2a35f);color:#482b15;box-shadow:0 10px 28px -14px rgba(217,147,67,.6),inset 0 1px 0 rgba(255,255,255,.65)}
.note-s{color:#6d7d98}
.ph{color:#7382a0;border-color:rgba(73,93,145,.28)}
.ph::before{background:#d29d53}
.phbox{color:#7a89a5;border-color:rgba(76,99,156,.25);background:repeating-linear-gradient(135deg,rgba(93,121,185,.035) 0 10px,transparent 10px 20px)}
.hero::before,.chero::before{background-image:linear-gradient(rgba(92,119,181,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(92,119,181,.07) 1px,transparent 1px)}
.hero .eb{color:#60728f;background:rgba(255,255,255,.58);border-color:var(--line)}
.hero .eb i{background:#5269eb;box-shadow:0 0 0 4px rgba(82,105,235,.13)}
.hero h1{background:linear-gradient(145deg,#244bc7 8%,#4d60e5 56%,#7652ce 100%);-webkit-background-clip:text;background-clip:text;filter:drop-shadow(0 8px 30px rgba(88,104,218,.12))}
.hero .pos em{color:#4b5fe0}
.hero .intro{color:#566a88}
.tag{color:#405577;background:rgba(255,255,255,.68);border-color:rgba(75,100,162,.16)}
.tag i{background:#586de6}
.tag:hover{border-color:rgba(73,95,213,.34);color:#2e4bb9}
.orb .halo{background:radial-gradient(circle,rgba(104,132,244,.25),rgba(142,126,235,.2) 38%,rgba(104,187,220,.13) 58%,transparent 72%);mix-blend-mode:multiply}
.orb .ring{border-color:rgba(72,99,184,.2)}
.orb .r2{border-color:rgba(113,128,208,.32);box-shadow:0 0 36px rgba(103,119,230,.13)}
.orb .r3{background:conic-gradient(from 210deg,transparent 0deg,rgba(91,104,227,.7) 50deg,transparent 120deg) border-box}
.orb .core{background:radial-gradient(circle at 34% 28%,rgba(255,255,255,.8),rgba(255,255,255,0) 22%),radial-gradient(circle at 40% 36%,#bbcaff 0%,#7189ef 28%,#5148bf 60%,#292d72 84%);
  box-shadow:inset -30px -40px 80px rgba(24,30,91,.3),inset 10px 14px 40px rgba(255,255,255,.3),0 40px 120px -20px rgba(81,101,218,.38),0 0 70px -24px rgba(128,130,239,.42)}
.orb .dot{background:#fff;box-shadow:0 0 14px 3px rgba(123,135,238,.65)}
.tl .track::before{background:linear-gradient(90deg,rgba(72,102,217,0) 0%,rgba(72,102,217,.55) 6%,rgba(111,132,225,.32) 30%,rgba(75,98,157,.12) 60%,transparent 100%)}
.tl .track::after{background:repeating-linear-gradient(90deg,rgba(76,99,159,.22) 0 4px,transparent 4px 12px)}
.tl .pt{background:#f5f8ff;border-color:rgba(77,101,213,.8);box-shadow:0 0 0 6px rgba(86,109,226,.09),0 0 22px rgba(98,117,224,.35)}
.tl .pt::after{background:#5268e2}
.tl .tbd,.tl .date{color:#5868d4}
.row:hover{background:rgba(91,121,195,.06)}
.row .k{color:#7485a2}
.row .go{color:#435b83}
.row .go .ar{color:#5266df}
.feature{color:#fff;background:linear-gradient(125deg,#4771ed 0%,#535fe3 55%,#7754d7 100%);border-color:rgba(255,255,255,.42);box-shadow:0 1px 0 rgba(255,255,255,.3) inset,0 26px 60px -35px rgba(66,81,183,.5)}
.feature h3,.feature .lead,.feature p.m,.feature .label{color:#fff}
.feature .label{background:rgba(255,255,255,.15);border-color:rgba(255,255,255,.25)}
.feature .label.ac{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.32)}
.feature::after{background:radial-gradient(circle,rgba(255,255,255,.22),transparent 65%)}
.feature .qr .q{border-color:rgba(255,255,255,.34);background-color:rgba(255,255,255,.12)}
.strip{background:linear-gradient(100deg,rgba(255,251,243,.88),rgba(236,242,255,.82));border:1px solid var(--line)}
.strip span,.strip b{color:#3f567b}
footer{background:rgba(223,233,250,.68);border-color:var(--line)}
footer .fl a{color:#405883}
.chero::after{background:radial-gradient(circle at 42% 48%,rgba(92,139,247,.22),transparent 58%),radial-gradient(circle at 60% 58%,rgba(125,126,235,.17),transparent 66%),radial-gradient(circle at 75% 30%,rgba(102,189,214,.14),transparent 62%)}
.chero h1 em{background:linear-gradient(120deg,#4d6be8,#8659d5);-webkit-background-clip:text;background-clip:text;color:transparent}
.chero .sub2{color:#566a88}
.quote{background:linear-gradient(145deg,rgba(247,244,255,.96),rgba(224,216,252,.96))}
.tl .item{background:linear-gradient(145deg,#f6f3ff,#e2daff);border-color:rgba(124,99,215,.32)}
.quote::after{color:rgba(76,94,221,.19)}
.quote p{color:#415574}
.trk .k{color:#7283a0}
.trk .chips span{color:#455c82}
.trk strong,.fee{color:#263959}
.trk.ac{border-color:rgba(255,255,255,.4);background:linear-gradient(145deg,#5579ef,#6856d7);box-shadow:0 18px 42px -28px rgba(73,83,195,.48)}
.trk.ac h3,.trk.ac p,.trk.ac .k,.trk.ac strong,.trk.ac .chips span{color:#fff}
.trk.ac .chips span{border-color:rgba(255,255,255,.3);background:rgba(255,255,255,.1)}
.trk.ac.hov:hover{border-color:rgba(255,255,255,.68);background:linear-gradient(145deg,#6588fb,#755fe3)}
.steps .s{color:#3c5277;background:rgba(255,255,255,.72)}
.steps .a{background:linear-gradient(90deg,rgba(91,109,212,.3),rgba(91,109,212,.7))}
.steps .a::after{border-left-color:rgba(91,109,212,.7)}
.faq h3{color:#263957}
.faq p,.fee small{color:#5c6f8c}
@media (prefers-reduced-motion:reduce){.bg .nebula,.bg .meteor,.orb .r2,.orb .r3,.orb .core,.orb .dot{animation:none!important}}

/* 白卡加入同一冷色系的淡彩变化，避免大面积纯白 */
.card:not(.feature):not(.quote):not(.faq)::before{
  background:radial-gradient(115% 78% at 100% 0%,var(--card-glow,rgba(93,119,229,.17)),transparent 66%),
    linear-gradient(145deg,rgba(255,255,255,.4),transparent 58%);
}
/* 卡片五色循环：蓝 / 紫 / 青 / 薄荷 / 暖金；hover 只提亮起点，保留各自色相 */
.g3>.card,.g6>.card{--card-from:#f6faff;--card-to:#d3e1fc;--card-bd:rgba(86,124,214,.34);--card-glow:rgba(83,121,239,.22);
  background:linear-gradient(145deg,var(--card-from),var(--card-to));border-color:var(--card-bd)}
.g3>.card:nth-child(3n+1),.g6>.card:nth-child(3n+1){--card-from:#f4f9ff;--card-to:#c9d8fb;--card-bd:rgba(76,116,216,.38);--card-glow:rgba(72,113,236,.26)}
.g3>.card:nth-child(3n+2),.g6>.card:nth-child(3n+2){--card-from:#f8f4ff;--card-to:#d4c6ff;--card-bd:rgba(124,99,215,.36);--card-glow:rgba(131,111,228,.28)}
.g3>.card:nth-child(3n),.g6>.card:nth-child(3n){--card-from:#f1fcfe;--card-to:#bfe2ef;--card-bd:rgba(60,156,189,.36);--card-glow:rgba(78,167,201,.26)}
.g6>.card:nth-child(5n+4){--card-from:#f1fdf8;--card-to:#bfe8d6;--card-bd:rgba(44,164,139,.36);--card-glow:rgba(56,178,152,.26)}
.g6>.card:nth-child(5n){--card-from:#fffaf0;--card-to:#f8e3bd;--card-bd:rgba(196,146,70,.36);--card-glow:rgba(214,160,74,.26)}
.g3>a.card:hover,.g3>.card.hov:hover,.g6>a.card:hover,.g6>.card.hov:hover{background:linear-gradient(145deg,#fff,var(--card-to,#e6edff))}

/* 免费笔记列表：奇偶行淡彩交替 */
.card.list .row:nth-child(odd){background:linear-gradient(100deg,rgba(212,227,255,.62),rgba(212,227,255,0) 64%)}
.card.list .row:nth-child(even){background:linear-gradient(100deg,rgba(222,213,255,.56),rgba(222,213,255,0) 64%)}
.card.list .row:nth-child(4n){background:linear-gradient(100deg,rgba(202,236,243,.5),rgba(202,236,243,0) 64%)}
.card.list .row:hover{background:linear-gradient(100deg,rgba(196,216,255,.85),rgba(224,214,255,.5))}

/* 课程页：五类课程前四张走彩色循环，第五张保留钴蓝重点卡 */
.trk:nth-child(1){--card-to:#c9d8fb;background:linear-gradient(145deg,#f4f9ff,#c9d8fb);border-color:rgba(76,116,216,.36)}
.trk:nth-child(2){--card-to:#d4c6ff;background:linear-gradient(145deg,#f8f4ff,#d4c6ff);border-color:rgba(124,99,215,.34)}
.trk:nth-child(3){--card-to:#bfe2ef;background:linear-gradient(145deg,#f1fcfe,#bfe2ef);border-color:rgba(60,156,189,.34)}
.trk:nth-child(4){--card-to:#bfe8d6;background:linear-gradient(145deg,#f1fdf8,#bfe8d6);border-color:rgba(44,164,139,.34)}
.trk.hov:not(.ac):hover{background:linear-gradient(145deg,#fff,var(--card-to,#e6edff))}
.route:nth-child(1){background:linear-gradient(145deg,#f2fbfe,#d9ecf8);border-color:rgba(62,154,186,.3)}
.route:nth-child(2){background:linear-gradient(145deg,#f7f4ff,#d4c6ff);border-color:rgba(124,99,215,.3)}
.route:hover{background:linear-gradient(145deg,#fff,#eef3ff)}

/* 11/03 可读性与流星补强：保留 WB 五色色相，只压深文字并提高尾迹亮度 */
.card:not(.feature):not(.quote):not(.faq):not(.trk.ac){color:#1b2b48}
.card:not(.feature):not(.quote):not(.faq):not(.trk.ac) h3{color:#182744}
.card:not(.feature):not(.quote):not(.faq):not(.trk.ac) p{color:#304563}
.who .meta,.trk .k,.card.list .row .k{color:#3e5576}
.card:not(.feature):not(.quote):not(.faq):not(.trk.ac) .link,.card.list .row .go{color:#30496d}
.card:not(.feature):not(.quote):not(.faq):not(.trk.ac) .label{color:#354e74;background:rgba(255,255,255,.82);border-color:rgba(54,82,137,.24)}
.card:not(.feature):not(.quote):not(.faq):not(.trk.ac) .label.ac{color:#3d4fc5;background:rgba(255,255,255,.86);border-color:rgba(74,84,191,.32)}
.ph{color:#3e5576;border-color:rgba(51,77,126,.38);background:rgba(255,255,255,.56)}
.phbox{color:#455b7a;border-color:rgba(54,79,126,.36)}
.trk:not(.ac) .chips span{color:#2e4768;background:rgba(255,255,255,.54);border-color:rgba(53,81,135,.24)}
.trk.ac .chips span{color:#fff;background:rgba(255,255,255,.14)}
.card.list .row p{color:#354b69}
.card.list .row .go .ar{color:#3e53cc}
.bg .meteor{height:2px;background:linear-gradient(270deg,transparent 0%,rgba(54,79,218,.12) 24%,rgba(52,83,227,.54) 58%,rgba(62,91,239,.98) 84%,#fff 97%);
  filter:drop-shadow(0 0 4px rgba(59,82,222,.68))}
.bg .meteor::before{content:"";position:absolute;inset:-6px 0;border-radius:50%;pointer-events:none;
  background:linear-gradient(270deg,transparent 0%,rgba(58,83,226,.12) 25%,rgba(65,92,235,.46) 76%,rgba(255,255,255,.7) 100%);filter:blur(4px)}
.bg .meteor::after{z-index:1;width:3px;height:3px;box-shadow:0 0 2px 2px #fff,0 0 8px 5px rgba(53,79,229,.95),0 0 22px 9px rgba(82,108,247,.68)}
.bg .meteor.m2{filter:drop-shadow(0 0 5px rgba(124,81,212,.64))}
@media (max-width:400px){
  .nav .wrap{height:58px;padding-left:12px;padding-right:12px;gap:6px;justify-content:flex-start}
  .logo{flex:none;gap:7px;white-space:nowrap}
  .logo .mk{width:25px;height:25px;font-size:13px}
  .logo .nm{font-size:13.5px;white-space:nowrap}
  .nav ul{flex:1;min-width:0;justify-content:flex-end;gap:0}
  .nav ul li{flex:0 0 auto}
  .nav ul a{padding:6px 5px;font-size:11.5px;white-space:nowrap;letter-spacing:0}
}

/* 视觉收敛：降低星云对页面的染色，让卡片和文字成为第一层 */
@keyframes ambient-glow-refined{from{transform:translate3d(0,0,0) scale(1);opacity:.58}to{transform:translate3d(-1.5%,1%,0) scale(1.05);opacity:.76}}
.bg .nebula{background:
  radial-gradient(900px 680px at 78% 8%,rgba(94,146,252,.32),rgba(88,134,240,.16) 40%,transparent 74%),
  radial-gradient(820px 680px at 8% 45%,rgba(150,128,246,.26),rgba(138,122,231,.12) 44%,transparent 74%),
  radial-gradient(850px 700px at 48% 35%,rgba(110,164,240,.18),transparent 72%),
  radial-gradient(760px 640px at 96% 85%,rgba(88,194,212,.17),transparent 72%),
  linear-gradient(118deg,transparent 33%,rgba(118,130,226,.1) 46%,rgba(170,160,244,.15) 50%,rgba(118,130,226,.1) 54%,transparent 67%),
  linear-gradient(180deg,#e8f0fe 0%,#dce8fb 55%,#e7e5fb 100%);
  filter:blur(24px);animation-name:ambient-glow-refined}
.bg .stars{opacity:.56}
.hero .intro,.head p,.chero .sub2,.note-s{color:#304663}
.kicker{color:#526987}
.tl .tbd,.tl .date{color:#4859bc}
.hero h1{background:linear-gradient(145deg,#183fae 8%,#3a51cf 56%,#5d43ad 100%);-webkit-background-clip:text;background-clip:text}
@keyframes meteor-one-refined{0%,43%{transform:translate3d(0,0,0) rotate(-35deg);opacity:0}45%{opacity:1}86%{opacity:.94}100%{transform:translate3d(-145vw,101.5vw,0) rotate(-35deg);opacity:0}}
@keyframes meteor-two-refined{0%,47%{transform:translate3d(0,0,0) rotate(-35deg);opacity:0}49%{opacity:.98}88%{opacity:.92}100%{transform:translate3d(-145vw,101.5vw,0) rotate(-35deg);opacity:0}}
@keyframes meteor-three-refined{0%,53%{transform:translate3d(0,0,0) rotate(-35deg);opacity:0}55%{opacity:.96}90%{opacity:.9}100%{transform:translate3d(-145vw,101.5vw,0) rotate(-35deg);opacity:0}}
.bg .meteor{background:linear-gradient(270deg,transparent 0%,rgba(53,78,220,.18) 20%,rgba(55,82,229,.74) 62%,rgba(59,83,223,.98) 88%,#fff 98%);
  filter:drop-shadow(0 0 5px rgba(52,75,211,.72))}
.bg .meteor::before{background:linear-gradient(270deg,transparent 0%,rgba(58,83,226,.16) 24%,rgba(65,92,235,.58) 76%,rgba(255,255,255,.78) 100%);filter:blur(5px)}
.bg .meteor.m1{animation-name:meteor-one-refined}
.bg .meteor.m2{animation-name:meteor-two-refined;background:linear-gradient(270deg,transparent 0%,rgba(106,65,198,.18) 20%,rgba(131,75,211,.74) 62%,rgba(147,89,221,.98) 88%,#fff 98%)}
.bg .meteor.m3{animation-name:meteor-three-refined}
@media (max-width:760px){.orb{opacity:.22;width:250px;right:-160px}}
@media (max-width:400px){.nav ul a{padding:6px 5px;font-size:12px}}
@keyframes meteor-one-mobile{0%{transform:translate3d(0,0,0) rotate(-35deg);opacity:.96}28%{transform:translate3d(-145vw,101.5vw,0) rotate(-35deg);opacity:.88}30%,100%{transform:translate3d(-145vw,101.5vw,0) rotate(-35deg);opacity:0}}
@keyframes meteor-two-mobile{0%,33%{transform:translate3d(-145vw,101.5vw,0) rotate(-35deg);opacity:0}35%{transform:translate3d(0,0,0) rotate(-35deg);opacity:.96}61%{transform:translate3d(-145vw,101.5vw,0) rotate(-35deg);opacity:.88}63%,100%{transform:translate3d(-145vw,101.5vw,0) rotate(-35deg);opacity:0}}
@keyframes meteor-three-mobile{0%,64%{transform:translate3d(-145vw,101.5vw,0) rotate(-35deg);opacity:0}66%{transform:translate3d(0,0,0) rotate(-35deg);opacity:.94}94%{transform:translate3d(-145vw,101.5vw,0) rotate(-35deg);opacity:.86}96%,100%{transform:translate3d(-145vw,101.5vw,0) rotate(-35deg);opacity:0}}
@media (max-width:760px){
  .bg .meteor{left:94%}
  .bg .meteor{height:1.5px;filter:drop-shadow(0 0 3px rgba(52,75,211,.56))}
  .bg .meteor::before{inset:-4px 0;filter:blur(3px)}
  .bg .meteor::after{width:3.5px;height:3.5px}
  .bg .meteor.m1{width:260px;animation-name:meteor-one-mobile;animation-duration:24s;animation-delay:0s}
  .bg .meteor.m2{width:240px;animation-name:meteor-two-mobile;animation-duration:24s;animation-delay:0s}
  .bg .meteor.m3{width:290px;animation-name:meteor-three-mobile;animation-duration:24s;animation-delay:0s}
}

/* 最后一轮取舍：背景降饱和，留出流星、卡片与标题的对比空间 */
body{background-image:linear-gradient(145deg,#edf2fb 0%,#e5edf8 48%,#eeecf8 100%)}
@keyframes ambient-glow-refined{from{transform:translate3d(0,0,0) scale(1);opacity:.38}to{transform:translate3d(-1.5%,1%,0) scale(1.05);opacity:.56}}
.bg .nebula{background:
  radial-gradient(900px 680px at 78% 8%,rgba(94,146,252,.25),rgba(88,134,240,.12) 40%,transparent 74%),
  radial-gradient(820px 680px at 8% 45%,rgba(150,128,246,.2),rgba(138,122,231,.09) 44%,transparent 74%),
  radial-gradient(850px 700px at 48% 35%,rgba(110,164,240,.14),transparent 72%),
  radial-gradient(760px 640px at 96% 85%,rgba(88,194,212,.13),transparent 72%),
  linear-gradient(118deg,transparent 33%,rgba(118,130,226,.07) 46%,rgba(170,160,244,.11) 50%,rgba(118,130,226,.07) 54%,transparent 67%),
  linear-gradient(180deg,#eaf1fc 0%,#e3ebf8 55%,#eceafa 100%);
  animation-name:ambient-glow-refined}
.bg .stars{opacity:.62}
.bg .meteor::after{width:4px;height:4px;box-shadow:0 0 2px 2px #fff,0 0 10px 6px rgba(53,79,229,.98),0 0 26px 11px rgba(82,108,247,.72)}

/* 背景最终色：稍降亮度与纯蓝感，调整为浅灰蓝 */
body{background-image:linear-gradient(145deg,#e3eaf3 0%,#d8e1ed 48%,#e0dfee 100%)}
.bg .nebula{background:
  radial-gradient(900px 680px at 78% 8%,rgba(101,137,220,.2),rgba(99,129,207,.1) 40%,transparent 74%),
  radial-gradient(820px 680px at 8% 45%,rgba(139,124,207,.16),rgba(127,117,195,.08) 44%,transparent 74%),
  radial-gradient(850px 700px at 48% 35%,rgba(106,148,207,.12),transparent 72%),
  radial-gradient(760px 640px at 96% 85%,rgba(91,163,180,.1),transparent 72%),
  linear-gradient(118deg,transparent 33%,rgba(111,122,203,.06) 46%,rgba(158,151,224,.09) 50%,rgba(111,122,203,.06) 54%,transparent 67%),
  linear-gradient(180deg,#e0e8f3 0%,#d7e0ee 55%,#dfdeee 100%)}

/* 对标深空风格：深蓝灰底、青紫星云，保留彩色卡片作为前景 */
:root{
  --bg0:#121c30; --bg1:#18253b; --bg2:#202b43;
  --fg:#f1f5ff; --fg2:#d6e0f2; --muted:#c0cde2; --dim:#9cacc7;
  --line:rgba(204,220,255,.14); --line2:rgba(204,220,255,.24);
  --accent:#72d9df; --accent-soft:rgba(114,217,223,.13);
  --shadow:0 1px 0 rgba(255,255,255,.06) inset,0 30px 60px -36px rgba(0,0,0,.72);
}
body{background:var(--bg0);background-image:linear-gradient(145deg,#1a2943 0%,#121c30 48%,#201d38 100%);color:var(--fg)}
.bg .nebula{background:
  radial-gradient(900px 680px at 78% 8%,rgba(70,126,226,.35),rgba(54,91,168,.18) 40%,transparent 74%),
  radial-gradient(820px 680px at 8% 45%,rgba(143,106,214,.26),rgba(94,69,157,.13) 44%,transparent 74%),
  radial-gradient(850px 700px at 48% 35%,rgba(85,132,205,.2),transparent 72%),
  radial-gradient(760px 640px at 96% 85%,rgba(53,151,178,.17),transparent 72%),
  linear-gradient(118deg,transparent 33%,rgba(99,104,192,.12) 46%,rgba(125,113,211,.18) 50%,rgba(99,104,192,.12) 54%,transparent 67%),
  linear-gradient(180deg,#17243c 0%,#121c30 55%,#1e1b35 100%)}
.nav{background:rgba(11,18,32,.82);border-color:rgba(204,220,255,.14);box-shadow:0 8px 24px rgba(0,0,0,.14)}
.nav ul a{color:#c0cde2}
.nav ul a:hover{color:#fff;background:rgba(255,255,255,.08)}
.nav ul a.on{color:#dce9ff;background:rgba(99,126,224,.18);box-shadow:inset 0 0 0 1px rgba(166,185,255,.18)}
.band{background:linear-gradient(180deg,rgba(39,55,86,.2),rgba(18,28,48,.22) 50%,rgba(39,55,86,.2));border-color:rgba(204,220,255,.1)}
.draft{color:#ead39e;background:rgba(220,177,97,.1);border-color:rgba(220,177,97,.18)}
.draft::before{background:#d7b26c}
.hero .eb{color:#c0cde2;background:rgba(16,28,49,.62);border-color:rgba(204,220,255,.16)}
.hero .eb i{background:var(--accent);box-shadow:0 0 0 4px rgba(114,217,223,.15)}
.hero h1{background:linear-gradient(145deg,#dceaff 8%,#a9c4ff 56%,#d2b9ff 100%);-webkit-background-clip:text;background-clip:text;filter:drop-shadow(0 10px 36px rgba(106,137,232,.18))}
.hero .pos em{color:#83e0e2}
.hero .intro,.head p,.chero .sub2,.note-s{color:#c2cde0}
.kicker{color:#aab9d3}
.kicker b{color:#79dce0}
.tl .tbd{color:#b8c7e2}
.chero h1 em{background:linear-gradient(120deg,#9dc5ff,#c5a6ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.chero .sub2{color:#c2cde0}
footer{background:rgba(10,16,29,.88);border-color:rgba(204,220,255,.14)}
footer .fl a{color:#d6e0f2}
@media (prefers-reduced-motion:reduce){.bg .nebula{animation:none!important}}

