/* ───────── tokens:9 档字阶(收口,无野字号)+ 单强调色 ───────── */
@property --wl { syntax:'<percentage>'; inherits:false; initial-value:68%; }
@property --gh { syntax:'<number>'; inherits:false; initial-value:0; }
@property --fill { syntax:'<percentage>'; inherits:false; initial-value:0%; }
:root{
  --paper:#F7F6F2; --ink:#1E1E1C;
  --ink-60:rgba(30,30,28,.66); --ink-38:rgba(30,30,28,.52); --ink-deco:rgba(30,30,28,.34);
  --teal:#1E6A78; --cyan:#5FCFF2; --shallow:#BFDDE8;
  --water-10:#E4F3F8;
  --deep-bg:#0F2830; --deep-ink:#E9F3F5; --deep-dim:rgba(233,243,245,.62);
  --line:rgba(30,30,28,.22); --line-soft:rgba(30,30,28,.13);
  --fs-1:11px; --fs-2:12.5px; --fs-3:14px; --fs-4:16.5px; --fs-5:21px; --fs-6:30px;
  --fs-7:clamp(38px,4.2vw,54px);
  --fs-8:clamp(56px,7vw,96px);
  --fs-9:min(8vw,112px);
  --measure:1120px; --spine:64px;
}
*{margin:0;padding:0;box-sizing:border-box}
::selection{background:var(--cyan);color:var(--ink)}
html{scroll-behavior:smooth;overflow-x:hidden}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  font-family:"Noto Sans SC","Archivo",sans-serif;
  font-size:var(--fs-4);line-height:1.75;color:var(--ink);
  background:var(--paper);overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
.en{font-family:"Archivo",sans-serif}
.mono{font-family:"IBM Plex Mono",monospace;letter-spacing:.08em;font-variant-numeric:tabular-nums}
.disp{
  font-family:"Archivo",sans-serif;font-variation-settings:"wdth" 122;
  font-weight:260;letter-spacing:-.015em;line-height:.94;text-transform:uppercase;
}
:focus-visible{outline:2px solid var(--teal);outline-offset:3px}
a:active,button:active,[role="link"]:active{translate:0 1px}

.wlink{position:relative;display:inline-block}
.wlink::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:1px;background:var(--ink-38);transition:transform .3s,background .3s}
.wlink:hover::after{transform:translateY(-3px);background:var(--teal)}

/* 筹备中态:没有落地页的东西不装成链接,hover/focus 露出诚实小签 */
[data-soon]{cursor:default}
.soonchip{
  position:absolute;right:0;bottom:8px;
  font-family:"IBM Plex Mono",monospace;font-size:var(--fs-1);letter-spacing:.14em;
  color:var(--teal);border:1px solid currentColor;border-radius:99px;padding:2px 9px;
  opacity:0;translate:0 4px;transition:opacity .3s,translate .3s;pointer-events:none;
}
[data-soon]:hover .soonchip,[data-soon]:focus-visible .soonchip{opacity:1;translate:0 0}

/* 编辑按:朱批体 */
.an{display:flex;gap:10px;margin-top:2vh;font-size:var(--fs-2);color:var(--ink-60);align-items:baseline}
.an b{flex:none;font-weight:700;color:var(--teal);rotate:-1deg;letter-spacing:.06em}

/* ───────── masthead ───────── */
.mast{
  position:fixed;inset:0 0 auto 0;z-index:40;
  display:flex;align-items:center;gap:24px;
  padding:14px 32px;
  font-size:var(--fs-2);font-weight:500;
  background:color-mix(in srgb,var(--paper) 82%,transparent);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
  overflow:hidden;
  transition:background .6s,border-color .6s,color .6s,box-shadow .35s ease,transform .35s ease;
}
.mast.scrolled{
  background:color-mix(in srgb,var(--paper) 94%,transparent);
  box-shadow:0 8px 24px rgba(30,30,28,.08);
}
body.in-deep .mast{background:color-mix(in srgb,var(--deep-bg) 82%,transparent);border-color:rgba(233,243,245,.2);color:var(--deep-ink)}
body.in-deep .mast .mast__issue{color:var(--deep-dim)}
body.in-deep .mast .mast__nav a i{color:var(--deep-dim)}
.mast__logo{display:flex;align-items:center;gap:10px;font-weight:700;letter-spacing:.02em;white-space:nowrap}
.mast__logo svg{display:block;flex:none}
.mast__issue{color:var(--ink-60);white-space:nowrap;font-weight:600}
.mast__issue .d{display:inline}
.mast__nav{margin-left:auto;display:flex;gap:24px;min-width:0;overflow-x:auto;scrollbar-width:none}
.mast__nav::-webkit-scrollbar{display:none}
.mast__nav a{font-weight:600;letter-spacing:.04em;white-space:nowrap}
.mast__nav a i{font-style:normal;color:var(--ink-38);font-weight:400;margin-left:5px;font-size:var(--fs-1)}

/* ───────── 量水计(右缘,≥1280 才显示) ───────── */
.gauge{
  position:fixed;right:26px;top:50%;translate:0 -50%;z-index:41;
  height:38vh;display:none;flex-direction:column;align-items:center;gap:10px;
  color:var(--ink);pointer-events:none;transition:color .5s;
}
@media (min-width:1440px){.gauge{display:flex}}
body.in-deep .gauge{color:var(--deep-ink)}
.gauge__read{font-size:var(--fs-1);font-weight:500}
.gauge__tube{position:relative;flex:1;width:3px;background:color-mix(in srgb,currentColor 24%,transparent);overflow:visible}
.gauge__fill{position:absolute;left:0;right:0;bottom:0;height:0%;background:var(--teal);transition:background .5s}
body.in-deep .gauge__fill{background:var(--cyan)}
.gauge__tick{position:absolute;left:-4px;width:11px;height:1px;background:currentColor;opacity:.4}
.gauge__cap{font-size:var(--fs-1);opacity:.6}

/* ───────── 版心 + 脊线 + 刻度(已归位杯壁) ───────── */
.vessel{position:relative;max-width:calc(var(--measure) + var(--spine));margin:0 auto;padding:0 24px 0 var(--spine)}
.vessel::before{content:"";position:absolute;left:24px;top:0;bottom:0;width:1px;background:var(--line)}
.zone .vessel::before{top:-12vh}
.abyss .vessel::before{top:-14vh}
.tick{position:absolute;left:24px;translate:-5.5px 0;display:flex;align-items:center;gap:10px}
.tick::before{content:"";width:11px;height:11px;border:1px solid var(--ink);border-radius:50%;background:linear-gradient(to top,var(--cyan) 50%,transparent 50%);flex:none;transition:scale .3s cubic-bezier(.34,1.56,.64,1)}
.tick b{font-family:"IBM Plex Mono",monospace;font-weight:500;font-size:var(--fs-2);letter-spacing:.1em;white-space:nowrap}
.abyss .tick{color:var(--deep-dim)}
.abyss .tick::before{border-color:var(--deep-dim);background:linear-gradient(to top,var(--cyan) 50%,transparent 50%)}

.waterline{position:relative;height:1px;background:var(--line)}
.waterline::before{content:"";position:absolute;left:calc(-1 * (var(--spine) - 24px) - 4.5px);top:-4px;width:9px;height:9px;border-radius:50%;border:1px solid var(--ink-60);background:linear-gradient(to top,var(--cyan) 50%,var(--paper) 50%)}

/* ───────── 半淹大字(母题) ───────── */
.hsub{position:relative;display:block;--wl:68%}
.hsub>span{display:block}
.hsub__top{clip-path:inset(0 0 calc(100% - var(--wl) + 1px) 0)}
.hsub__bot{position:absolute;inset:0;color:var(--teal);clip-path:inset(var(--wl) 0 0 0)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
@media (prefers-reduced-motion:no-preference){
  .hsub--bob .hsub__bot{animation:bob 6s ease-in-out infinite}
  @keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(2px)}}
}

/* ───────── hero ───────── */
.hero{position:relative;padding:16vh 0 8vh;min-height:100vh;display:flex;flex-direction:column;justify-content:center}
.hero__eyebrow{display:flex;gap:22px;align-items:center;font-size:var(--fs-2);font-weight:500;color:var(--ink-60);margin-bottom:4vh;flex-wrap:wrap}
.hero__eyebrow b{color:var(--ink);font-weight:700}
.hero__title{font-size:var(--fs-9);position:relative;z-index:1}
.hero__title .hsub{white-space:nowrap}
.hero__title .hsub+.hsub{margin-top:.02em}
.hero__cols{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:40px;align-items:end;margin-top:4.5vh}
.hero__cn{max-width:30em;font-size:var(--fs-4);color:var(--ink-60)}
.hero__cn b{color:var(--ink);font-weight:700}
.hero__toc{margin-top:3.5vh;border-top:1px solid var(--line);padding-top:2vh}
.hero__toc dt{font-size:var(--fs-1);font-weight:600;letter-spacing:.24em;color:var(--teal);margin-bottom:1vh}
.hero__toc dd{font-size:var(--fs-3);color:var(--ink-60);margin:4px 0}
.hero__toc dd b{color:var(--ink);font-weight:700;margin-right:6px}
/* 量杯:主视觉,可倾斜可按住注水 */
.hero__ringwrap{perspective:800px;width:min(28vw,360px);flex:none}
.hero__ring{width:100%;aspect-ratio:1;display:block;cursor:grab;touch-action:none}
.hero__ring:active{cursor:grabbing}
.hero__ringnote{text-align:center;margin-top:8px;font-size:var(--fs-1);color:var(--ink-38);letter-spacing:.14em}
.hero__meta{margin-top:5vh;display:flex;gap:30px;font-size:var(--fs-2);font-weight:500;color:var(--ink-60);flex-wrap:wrap}
.hero__meta span b{display:block;font-family:"IBM Plex Mono",monospace;font-size:var(--fs-3);font-weight:600;color:var(--ink);margin-bottom:2px;letter-spacing:.06em}
.hero__meta span b.tl{color:var(--teal)}

/* ───────── 主编的话(-0.3M 半格) ───────── */
.ednote{position:relative;padding:12vh 0 0}
.ednote__body{max-width:36em;font-size:var(--fs-5);line-height:2;font-weight:400}
.ednote__body::before{content:"“";display:block;font-family:"Archivo",sans-serif;font-size:var(--fs-7);line-height:.5;color:var(--cyan);margin-bottom:.2em}
.ednote__kicker{font-size:var(--fs-1);font-weight:600;letter-spacing:.24em;color:var(--teal);margin-bottom:2.5vh}
.ednote__sig{margin-top:3vh;font-size:var(--fs-2);color:var(--ink-38);display:flex;gap:14px;align-items:center}
.ednote__sig::before{content:"";width:34px;height:1px;background:var(--ink-38)}
.ednote .waterline{margin-top:9vh}

/* ───────── 章节骨架 ───────── */
.zone{position:relative;padding:12vh 0 0}
.zone__head{margin-bottom:7vh}
.zone__title{font-size:var(--fs-8);white-space:nowrap}
#faq .zone__title{font-size:min(6.4vw,88px)}
.zone__sub{display:flex;align-items:baseline;gap:18px;margin-top:2.2vh;flex-wrap:wrap}
.zone__sub b{font-size:var(--fs-5);font-weight:700;letter-spacing:.02em}
.zone__sub span{font-size:var(--fs-3);color:var(--ink-60);max-width:40em}
.zone .waterline{margin-top:8vh}

/* ── Calendar · AI 日历(一天一页,日期为主角) ── */
.calwrap{display:grid;grid-template-columns:minmax(0,10fr) minmax(0,11fr);gap:80px;align-items:start}
.calstack{position:relative;max-width:400px}
.calstack__sheet{position:absolute;inset:0;border:1px solid var(--line);background:var(--paper)}
.calstack__sheet:nth-child(1){transform:rotate(1.4deg) translate(7px,5px)}
.calstack__sheet:nth-child(2){transform:rotate(-.9deg) translate(-5px,2px)}
.calcard{position:relative;background:var(--paper);border:1px solid rgba(30,30,28,.45);padding:24px 24px 16px;--ctilt:-.3deg;transform:rotate(var(--ctilt))}
/* 磨砂纸纹:整卡叠一层噪点(multiply),配合 SVG 内的纤维纹 = 纸感 */
.calcard::after{content:"";position:absolute;inset:0;pointer-events:none;mix-blend-mode:multiply;opacity:.17;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.6 0'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23n)'/%3E%3C/svg%3E")}
.calcard__mast{display:flex;justify-content:space-between;font-size:10px;font-weight:500;letter-spacing:.08em;color:var(--ink-38);padding-bottom:8px;border-bottom:1px solid var(--line)}
/* 画全出血:与卡框共用边界;金句并入画内(白),纸面只留「宜」 */
.calcard__artwrap{position:relative;margin:16px -24px 24px}
.calcard__art{width:100%;height:auto;display:block}
.calcard__quote{position:absolute;left:24px;right:24px;bottom:58px;font-size:21px;line-height:1.6;font-weight:400;letter-spacing:.01em;color:#F7F6F2;cursor:pointer}
.calcard__quote::before{content:"「";color:rgba(247,246,242,.75);margin-left:-.55em}
.calcard__quote::after{content:"」";color:rgba(247,246,242,.75)}
.calcard__from{position:absolute;left:24px;right:24px;bottom:24px;font-size:var(--fs-2);font-weight:500;color:rgba(247,246,242,.72)}
.calhint{margin-top:14px;text-align:center;font-size:var(--fs-1);letter-spacing:.12em;color:var(--ink-38)}
/* 安检式印章 */
.ccstamp{position:absolute;width:170px;pointer-events:none;z-index:5;mix-blend-mode:multiply;opacity:.85;transform:translate(-50%,-50%) rotate(var(--srot,-11deg)) translateZ(48px)}
.calcard__do{margin-top:8px}
.calcard__do i::before{background:var(--teal)}
.calcard__foot{margin-top:24px;padding-top:8px;border-top:1px solid var(--line);font-size:10px;letter-spacing:.22em;color:var(--ink-38);text-align:center}
/* 卡片 3D:父级透视 + 子层视差(日期/画/金句各在不同深度) */
.calstack{perspective:900px}
.calcard{transform-style:preserve-3d}
.calcard__artwrap{transform:translateZ(30px)}
.calcard__do{transform:translateZ(10px)}
.calback__k{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-1);font-weight:600;letter-spacing:.24em;color:var(--teal);margin-bottom:1.8vh}
.calback__body{font-size:var(--fs-4);line-height:2;color:var(--ink-60);max-width:34em}
.calback__note{margin-top:2.4vh;font-size:var(--fs-2);color:var(--ink-38)}
.chips{display:flex;gap:10px;flex-wrap:wrap}
.chip{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-2);letter-spacing:.06em;border:1px solid var(--line);background:none;color:var(--ink-60);padding:7px 13px;cursor:pointer;transition:border-color .3s,color .3s,translate .3s cubic-bezier(.22,2.2,.36,1)}
.chip:hover{border-color:var(--teal);color:var(--teal);translate:0 -2px}
.chip.is-on{background:var(--water-10);border-color:var(--teal);color:var(--teal)}
/* ── Signals · 每日资讯版面 ── */
.siglead{border-top:2px solid var(--ink);border-bottom:1px solid var(--line);padding:3vh 0 3.6vh}
.siglead__k{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;font-size:var(--fs-1);letter-spacing:.18em;color:var(--teal);font-weight:600;margin-bottom:1.8vh}
.siglead__t{font-size:var(--fs-6);font-weight:700;line-height:1.4;letter-spacing:.01em;max-width:26em}
.siglead__sum{margin-top:1.6vh;font-size:var(--fs-3);color:var(--ink-60);max-width:44em}
.siglead__src{margin-top:1.8vh;font-size:var(--fs-1);letter-spacing:.14em;color:var(--ink-38)}
.sigrest{margin-top:5vh;max-width:52em}
.sigmore{display:block;width:100%;padding:14px;border:0;border-top:1px solid var(--line);background:none;font:inherit;font-size:var(--fs-3);font-weight:600;color:var(--teal);cursor:pointer;transition:background .3s}
.sigmore:hover{background:var(--water-10)}
.today__do{margin-top:1vh;display:flex;gap:16px;align-items:flex-start;cursor:pointer;user-select:none;border:0;background:none;text-align:left;font:inherit;color:inherit}
.today__do i{flex:none;width:22px;height:22px;margin-top:3px;border-radius:50%;border:1.5px solid var(--ink);position:relative;overflow:hidden;transition:border-color .3s}
.today__do i::before{content:"";position:absolute;inset:auto 0 0 0;height:0%;background:var(--cyan);transition:height .5s cubic-bezier(.34,1.56,.64,1)}
.today__do.done i::before{height:50%}
.today__do.done i{border-color:var(--teal)}
.today__do p{font-weight:500}
.today__do p em{font-style:normal;display:block;font-size:var(--fs-2);letter-spacing:.18em;color:var(--teal);font-weight:600;margin-bottom:4px}
.today__do p small{display:block;font-size:var(--fs-2);color:var(--ink-38);margin-top:4px;opacity:0;transition:opacity .4s}
.today__do.done p small{opacity:1}
.today__note{margin-top:5vh;padding-top:2.5vh;font-size:var(--fs-2);color:var(--ink-60);max-width:34em}
.today__note b{color:var(--teal);font-weight:700}

.signals__head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:1.6vh;font-size:var(--fs-2);font-weight:600;letter-spacing:.2em;color:var(--ink-60)}
.signals__head span{letter-spacing:.06em;font-weight:500;color:var(--ink-38)}
.sig{position:relative;display:grid;grid-template-columns:64px 44px minmax(0,1fr) 18px;gap:14px;align-items:baseline;padding:15px 10px 15px 2px;border-top:1px solid var(--line);isolation:isolate}
.sig:last-of-type{border-bottom:1px solid var(--line)}
.sig::before{content:"";position:absolute;inset:0 -8px;background:var(--water-10);opacity:0;transform:translateY(4px);transition:opacity .35s ease,transform .35s cubic-bezier(.16,1,.3,1);z-index:-1}
.sig:hover::before{opacity:.7;transform:translateY(0)}
.sig__d{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-2);font-weight:500;color:var(--ink-60)}
.sig__t{font-size:var(--fs-1);font-weight:600;letter-spacing:.12em;color:var(--teal)}
.sig__h{font-size:var(--fs-3);font-weight:500;line-height:1.5}
.sig__h small{color:var(--ink-38);font-weight:400;margin-left:8px;font-size:var(--fs-2)}
.sig__a{font-family:"Archivo",sans-serif;color:var(--ink-38);transition:translate .5s cubic-bezier(.22,2.2,.36,1),rotate .5s cubic-bezier(.22,2.2,.36,1),color .3s}
.sig:hover .sig__a{color:var(--teal);translate:1px -5px;rotate:-8deg}
.signals__all{display:block;margin-top:2.6vh;font-size:var(--fs-3);color:var(--ink-60)}
.signals__all b{color:var(--ink);font-weight:700}

/* ── 金句谷 ── */
.valley{position:relative;padding:13vh 0 11vh}
.valley .disp{font-size:min(5.2vw,72px);white-space:nowrap}
.valley p{margin-top:2.6vh;color:var(--ink-60);max-width:30em}
.valley__drop{position:absolute;width:9px;height:9px;border-radius:50%;background:var(--cyan);opacity:0;pointer-events:none}
.valley__ripple{position:absolute;border:1px solid var(--teal);opacity:0;pointer-events:none}

/* ── Notes 半桶笔记墙 ── */
.notes{display:grid;grid-template-columns:repeat(3,1fr);gap:0 56px;border-top:1px solid var(--line)}
.note{position:relative;padding:3.2vh 4px 3.6vh 0;border-bottom:1px solid var(--line);isolation:isolate}
.note{transition:background .35s ease,box-shadow .35s ease,translate .35s cubic-bezier(.16,1,.3,1)}
.note::before{content:"";position:absolute;inset:0 -8px;background:var(--water-10);opacity:0;transform:translateY(4px);transition:opacity .35s ease,transform .35s cubic-bezier(.16,1,.3,1);z-index:-1}
.note:hover{translate:0 -2px;box-shadow:0 10px 22px rgba(30,106,120,.06)}
.note:hover::before{opacity:.7;transform:translateY(0)}
.note__no{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-1);font-weight:500;letter-spacing:.14em;color:var(--ink-38);display:flex;justify-content:space-between}
.note__no em{font-style:normal;color:var(--teal);font-weight:600}
.note h4{font-size:var(--fs-4);font-weight:700;margin:1.2vh 0 .6vh;line-height:1.5}
.note p{font-size:var(--fs-2);color:var(--ink-60)}
.notes__foot{grid-column:1/-1;padding:2.5vh 0 0;font-size:var(--fs-2);color:var(--ink-38);border-bottom:0}

/* ── Toolkit 台账:编号沉水折射 ── */
.tgroup{font-size:var(--fs-1);font-weight:600;letter-spacing:.24em;color:var(--teal);padding:3.5vh 0 1.2vh;border-bottom:1px solid var(--line)}
.tgroup:first-of-type{padding-top:0}
.tool{position:relative;display:grid;grid-template-columns:56px minmax(0,5fr) minmax(0,6fr) 96px;gap:20px;align-items:baseline;padding:20px 8px 20px 2px;border-bottom:1px solid var(--line);isolation:isolate;transition:background .35s ease,box-shadow .35s ease,border-color .35s ease,translate .35s cubic-bezier(.16,1,.3,1)}
.tool::before{content:"";position:absolute;inset:0;background:var(--water-10);opacity:0;transform:translateY(4px);transition:opacity .35s ease,transform .35s cubic-bezier(.16,1,.3,1);z-index:-1}
.tool:hover{translate:0 -2px;border-color:var(--teal);box-shadow:0 12px 28px rgba(30,106,120,.08)}
.tool:hover::before{opacity:.7;transform:translateY(0)}
.tno{font-family:"Archivo",sans-serif;font-variation-settings:"wdth" 122;font-weight:260;font-size:var(--fs-6);line-height:1;color:var(--ink-deco);--wl:100%;transition:color .35s ease,translate .35s cubic-bezier(.16,1,.3,1)}
.tno .hsub__bot{transition:none}
.tool:hover .tno{--wl:100%;translate:0;color:var(--teal)}
.tool:hover .tno .hsub__bot{transform:none}
.tool__logo{align-self:center;width:42px;height:42px;object-fit:contain;border:1px solid var(--line);background:var(--water-10);transition:transform .35s cubic-bezier(.16,1,.3,1),border-color .35s ease,box-shadow .35s ease}
.tool:hover .tool__logo{border-color:var(--teal);transform:translateY(-2px);box-shadow:0 10px 18px rgba(30,106,120,.1)}
.tool__name{font-size:var(--fs-4);font-weight:700}
.tool__name small{display:block;font-size:var(--fs-2);color:var(--ink-60);font-weight:400;margin-top:2px}
.tool__an{font-size:var(--fs-2);color:var(--ink-60)}
.tool__an b{color:var(--teal);font-weight:700;rotate:-1deg;display:inline-block;margin-right:6px}
.tool__st{justify-self:end;display:flex;align-items:center;gap:7px;font-size:var(--fs-1);font-weight:600;letter-spacing:.12em;color:var(--ink-60)}
.cup{width:12px;height:14px;border:1.5px solid var(--ink-60);border-top:0;border-radius:0 0 3px 3px;position:relative;overflow:hidden;flex:none}
.cup::before{content:"";position:absolute;inset:auto 0 0 0;background:var(--cyan);height:var(--cl,50%)}

/* ── Learn:输水管 ── */
.steps{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:56px}
.steps__pipe{position:absolute;top:0;left:0;right:0;height:2px;background:var(--cyan);transform:scaleX(0);transform-origin:left;z-index:1}
.step{position:relative;padding-top:3vh;border-top:1px solid var(--line);--fill:0%}
.step::before{content:"";position:absolute;top:-6px;left:0;width:11px;height:11px;border-radius:50%;border:1px solid var(--ink);background:linear-gradient(to top,var(--cyan) var(--fill),var(--paper) var(--fill));z-index:2}
.step__no{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-2);font-weight:500;letter-spacing:.16em;color:var(--teal)}
.step h4{font-size:var(--fs-5);font-weight:700;margin:1.6vh 0 1vh}
.step p{font-size:var(--fs-3);color:var(--ink-60)}
.step__gap{margin-top:1.6vh;font-family:"IBM Plex Mono",monospace;font-size:var(--fs-1);letter-spacing:.12em;color:var(--teal);opacity:0}
.sources{margin-top:7vh;border-top:1px solid var(--line);padding-top:3.5vh}
.sources__k{font-size:var(--fs-1);font-weight:600;letter-spacing:.24em;color:var(--teal);margin-bottom:2vh}
.sources__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.src b{display:block;font-size:var(--fs-3);font-weight:700;margin-bottom:.6vh}
.src p{font-size:var(--fs-2);color:var(--ink-60)}
.sources__note{margin-top:2.5vh;font-size:var(--fs-2);color:var(--ink-38);max-width:40em}

/* ── FAQ ── */
.faqs{max-width:44em}
.faq{border-top:1px solid var(--line)}
.faq:last-of-type{border-bottom:1px solid var(--line)}
.faq summary{display:flex;gap:16px;align-items:baseline;padding:2.6vh 4px;cursor:pointer;list-style:none;font-size:var(--fs-4);font-weight:700}
.faq summary::-webkit-details-marker{display:none}
.faq summary i{flex:none;width:11px;height:11px;border-radius:50%;border:1px solid var(--ink);background:linear-gradient(to top,var(--cyan) 0%,transparent 0%);transition:background .35s,rotate .35s;font-style:normal;translate:0 -1px}
.faq summary{position:relative;transition:background .35s ease,color .35s ease,transform .35s cubic-bezier(.16,1,.3,1),padding-left .35s cubic-bezier(.16,1,.3,1)}
.faq summary:hover,.faq summary:focus-visible{background:color-mix(in srgb,var(--water-10) 44%,transparent);color:var(--teal);transform:translateX(4px);padding-left:12px}
.faq[open] summary i{background:linear-gradient(to top,var(--cyan) 50%,transparent 50%)}
.faq[open] summary i{rotate:180deg}
.faq__a{padding:0 4px 3vh 27px;font-size:var(--fs-3);color:var(--ink-60);max-width:38em}
.faq__a b{color:var(--ink)}
.faq[open] .faq__a{animation:faqReveal .46s cubic-bezier(.16,1,.3,1) both}
@keyframes faqReveal{
  from{opacity:0;transform:translateY(-8px)}
  to{opacity:1;transform:translateY(0)}
}

/* ───────── 深水收尾 ───────── */
.abyss{position:relative;margin-top:16vh;background:var(--deep-bg);color:var(--deep-ink);padding:14vh 0 8vh;overflow:hidden}
.abyss .vessel::before{background:rgba(233,243,245,.22)}
.abyss__grid{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:64px;align-items:center}
.abyss__title{font-size:min(6.8vw,94px);white-space:nowrap}
.abyss__title .hsub__bot{color:var(--cyan)}
.abyss__cn{margin-top:4vh;color:var(--deep-dim);max-width:32em}
.abyss__cn b{color:var(--deep-ink);font-weight:700}
.abyss__hint{margin-top:2vh;font-family:"IBM Plex Mono",monospace;font-size:var(--fs-1);letter-spacing:.14em;color:var(--deep-dim)}
.abyss__cyl{width:150px;flex:none}
.abyss__cyl svg{display:block;width:100%}
/* 往期带 */
.issues{margin-top:12vh;border-top:1px solid rgba(233,243,245,.22);padding-top:4vh}
.issues__k{font-size:var(--fs-1);font-weight:600;letter-spacing:.24em;color:var(--cyan);margin-bottom:1vh}
.issues__lede{font-size:var(--fs-3);color:var(--deep-dim);margin-bottom:3.5vh}
.issues__row{display:flex;gap:26px;align-items:flex-end;flex-wrap:wrap}
.iss{position:relative;text-align:center;transition:translate .4s cubic-bezier(.22,2.2,.36,1)}
.iss:hover{translate:0 -4px}
.iss i{display:block;width:34px;height:72px;border:1px solid rgba(233,243,245,.4);position:relative;overflow:hidden;margin:0 auto 8px}
.iss i::before{content:"";position:absolute;inset:auto 0 0 0;height:50%;background:var(--cyan);opacity:.85}
.iss--today i{border-color:var(--cyan)}
@media (prefers-reduced-motion:no-preference){
  .iss--today i::before{animation:fillbreath 4s ease-in-out infinite}
  @keyframes fillbreath{0%,100%{height:48%}50%{height:52%}}
}
.iss b{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-1);font-weight:500;letter-spacing:.1em;display:block;color:var(--deep-ink)}
.iss span{font-size:var(--fs-1);color:var(--deep-dim)}
.issues__note{margin-top:2.5vh;font-size:var(--fs-2);color:var(--deep-dim)}
/* 订阅/回访 */
.comeback{margin-top:11vh;border-top:1px solid rgba(233,243,245,.22);padding-top:6vh}
.comeback__title{font-size:min(4.6vw,54px);white-space:nowrap}
.comeback__title .hsub__bot{color:var(--cyan)}
.comeback__cn{margin-top:2vh;color:var(--deep-dim)}
.comeback__ways{margin-top:4vh;display:grid;grid-template-columns:repeat(3,1fr);gap:28px;max-width:52em}
.way{position:relative;padding:2.2vh 0;border-top:1px solid rgba(233,243,245,.22)}
.way b{display:block;font-size:var(--fs-3);font-weight:700;margin-bottom:.5vh}
.way p{font-size:var(--fs-2);color:var(--deep-dim)}
.way p kbd{font-family:"IBM Plex Mono",monospace;border:1px solid rgba(233,243,245,.35);border-radius:4px;padding:0 5px;font-size:var(--fs-1)}
/* 版权页 */
.colophon{margin-top:12vh;border-top:1px solid rgba(233,243,245,.22);padding-top:4vh;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:40px;align-items:end}
.colophon__lines{font-size:var(--fs-2);color:var(--deep-dim);line-height:2.1}
.colophon__lines b{color:var(--deep-ink);font-weight:700}
.colophon__lines .mono{font-size:var(--fs-1)}
.seal{width:74px;height:74px;border:2px solid rgba(95,207,242,.75);border-radius:50%;display:grid;place-items:center;rotate:-6deg;opacity:.85;flex:none}
.seal span{font-size:var(--fs-2);font-weight:700;color:var(--cyan);letter-spacing:.1em;text-align:center;line-height:1.5}

/* ───────── SVG 图示(母题图形语言:水面/水位/水深) ───────── */
figure.chart{margin:0}
figure.chart svg{width:100%;height:auto;display:block}
figure.chart figcaption{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-1);letter-spacing:.18em;color:var(--teal);font-weight:600;margin-bottom:1.6vh}
.chart text{font-family:"IBM Plex Mono",monospace;font-size:11px;fill:var(--ink-60);letter-spacing:.06em}
.chart text.cn{font-family:"Noto Sans SC",sans-serif;font-size:12px;font-weight:600;fill:var(--ink);letter-spacing:.02em}
.chart .axis{fill:var(--ink-38);font-size:10px}
/* A · 本期结构剖面图(hero) */
.depthmap{margin-top:7vh}
.depthmap a text{transition:fill .25s}
.depthmap a:hover text.cn,.depthmap a:focus-visible text.cn{fill:var(--teal)}
.depthmap a:hover .dm-dot{stroke:var(--teal)}
/* B · 今日主题教学图(Daily):对话对比,内容本身 */
.promptdemo{margin-top:8vh}
.pd{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line)}
.pd__col{background:var(--paper);padding:3vh 26px 2.6vh}
.pd__tag{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-2);font-weight:600;letter-spacing:.16em;margin-bottom:2vh;color:var(--ink-38)}
.pd__col--good .pd__tag{color:var(--teal)}
.pd__bub{max-width:30em;padding:12px 16px;font-size:var(--fs-3);line-height:1.7;margin-bottom:12px}
.pd__bub--me{border:1px solid var(--ink-60);margin-left:14%;color:var(--ink)}
.pd__bub--ai{background:var(--water-10);margin-right:14%;color:var(--ink-60)}
.pd__bub--ai em{font-style:normal;color:var(--ink-38)}
.pd__verdict{margin-top:1.6vh;font-size:var(--fs-2);color:var(--ink-38)}
.pd__verdict--good{color:var(--teal);font-weight:600}
/* C · 渠道决策矩阵(Start):省心×价格,一眼定位 */
/* D · 学习量杯(Learn) */
.step__vessel{position:absolute;right:0;top:2.6vh;width:38px;height:auto}
/* E · 场景速查(Toolkit):想做什么→拿哪件,hover 联动台账 */
.pick{margin-top:7vh}
.pick__grid{border-top:1px solid var(--line)}
.pk{display:grid;grid-template-columns:minmax(0,1fr) 30px minmax(0,1fr);gap:14px;align-items:baseline;padding:14px 8px;border-bottom:1px solid var(--line);cursor:default;transition:background .35s ease,translate .35s cubic-bezier(.16,1,.3,1),box-shadow .35s ease}
.pk:hover{background:color-mix(in srgb,var(--water-10) 72%,transparent);translate:0 -2px;box-shadow:0 10px 22px rgba(30,106,120,.06)}
.pk__q{font-size:var(--fs-3);font-weight:500}
.pk__arrow{font-family:"Archivo",sans-serif;color:var(--ink-38);text-align:center;transition:translate .3s,color .3s}
.pk:hover .pk__arrow{translate:4px 0;color:var(--teal)}
.pk__t{font-size:var(--fs-3);color:var(--ink-60)}
.pk__t b{font-family:"IBM Plex Mono",monospace;color:var(--teal);font-weight:600;margin-right:8px}
.tool.is-hot::before{opacity:.7;transform:translateY(0)}
.tool.is-hot .tno{--wl:100%;translate:0;color:var(--teal)}

/* ───────── 动效初始态 ───────── */
@media (prefers-reduced-motion:no-preference){
  .js [data-rise]{
    opacity:0;
    transform:translateY(24px) scale(.985);
    filter:blur(3px);
    transition:opacity .6s cubic-bezier(.16,1,.3,1),
               transform .6s cubic-bezier(.16,1,.3,1),
               filter .6s cubic-bezier(.16,1,.3,1);
  }
  .js [data-rise].is-visible{
    opacity:1;
    transform:translateY(0) scale(1);
    filter:blur(0);
  }
  .js .hsub--in{--wl:100%}
}
@media (max-width:1100px){
  .notes{grid-template-columns:1fr 1fr}
}
@media (max-width:960px){
  .calwrap,.abyss__grid{grid-template-columns:1fr}
  .calstack{margin:0 auto}
  .steps,.sources__grid{grid-template-columns:1fr;gap:32px}
  .notes{grid-template-columns:1fr;gap:0}
  .tool{grid-template-columns:44px minmax(0,1fr) 84px}
  .tool__an{display:none}
  .comeback__ways{grid-template-columns:1fr}
  .colophon{grid-template-columns:1fr}
  .mast{gap:14px;padding:12px 18px}
  .mast__issue .d{display:none}
  .mast__nav{gap:16px;max-width:100%;-webkit-mask-image:linear-gradient(90deg,#000 82%,transparent);mask-image:linear-gradient(90deg,#000 82%,transparent)}
  .mast__nav a i{display:none}
  .hero__cols{grid-template-columns:1fr}
  .hero__ringwrap{width:min(52vw,260px)}
  :root{--spine:40px}
}
@media print{
  .mast,.gauge,.hero__ringnote{display:none}
  body{background:#fff;color:#000}
  .abyss{background:#fff;color:#000}
  a::after{content:""}
}

/* ───────── 多页架构新增(2026-07-07 结构升级) ───────── */
.mast__nav a.is-here{color:var(--teal)}
.mast__nav a.is-here::after{transform:translateY(-3px);background:var(--teal)}
.zone--hero{padding-top:20vh}
.zone--hero .zone__title{font-size:min(8vw,112px)}
#skills.zone--hero .zone__title{font-size:min(8vw,112px);line-height:1}
#skills .zone__sub{display:block;margin-top:3.2vh;max-width:600px;padding-top:16px;border-top:1px solid var(--line)}
#skills .zone__sub b{display:block;font-size:clamp(21px,1.9vw,27px);line-height:1.25;margin-bottom:8px}
#skills .zone__sub span{display:block;font-size:var(--fs-3);line-height:1.75;max-width:35em;color:var(--ink-60)}
#classroom .zone__sub,#toolspage .zone__sub,#linkspage .zone__sub{display:block;margin-top:3vh;max-width:720px;padding-top:16px;border-top:1px solid var(--line)}
#classroom .zone__sub b,#toolspage .zone__sub b,#linkspage .zone__sub b{display:block;font-size:clamp(21px,1.9vw,27px);line-height:1.25;margin-bottom:8px}
#classroom .zone__sub span,#toolspage .zone__sub span,#linkspage .zone__sub span{display:block;font-size:13.5px;line-height:1.7;max-width:52em;color:var(--ink-60)}
/* 门户卡:教程站/工具/资源的资产卡 */
.pcards{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.pcards--wide{grid-template-columns:repeat(2,minmax(0,1fr))}
.pcard{position:relative;display:block;border:1px solid var(--line);background:var(--paper);padding-bottom:18px;isolation:isolate;transition:translate .35s cubic-bezier(.16,1,.3,1),border-color .35s ease,box-shadow .35s ease,background .35s ease}
.pcard:hover{translate:0 -4px;border-color:var(--teal);background:color-mix(in srgb,var(--water-10) 44%,var(--paper));box-shadow:0 14px 28px rgba(30,106,120,.08)}
.pcard__art{width:100%;aspect-ratio:34/15;height:auto;object-fit:cover;display:block;background:var(--water-10);border-bottom:1px solid var(--line-soft);transition:filter .35s ease,transform .35s cubic-bezier(.16,1,.3,1)}
.pcard__art--logo{height:clamp(148px,16vw,194px);aspect-ratio:auto;object-fit:contain;box-sizing:border-box;padding:26px;background:linear-gradient(180deg,var(--paper),var(--water-10))}
.pcard:hover .pcard__art{filter:saturate(1.06) contrast(1.02);transform:translateY(-1px)}
.pcard h4{font-size:var(--fs-5);font-weight:700;padding:16px 18px 0;display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap}
.pcard__host{font-size:var(--fs-1);font-weight:500;letter-spacing:.08em;color:var(--ink-38)}
.pcard p{font-size:var(--fs-3);color:var(--ink-60);padding:8px 18px 0;max-width:30em}
.pcard__go{display:inline-block;margin:14px 18px 0;font-size:var(--fs-2);font-weight:600;color:var(--teal)}
.pcard .soonchip{right:14px;bottom:14px}
#relay .zone__head{text-align:center;margin-bottom:5.5vh}
#relay .zone__sub{display:block;margin:2.4vh auto 0;max-width:560px;padding-top:14px;border-top:1px solid var(--line);text-align:center}
#relay .zone__sub b{display:block;font-size:clamp(21px,1.9vw,27px);line-height:1.25;margin-bottom:8px}
#relay .zone__sub span{display:block;font-size:13.5px;line-height:1.7;max-width:none;color:var(--ink-60)}
#relay .pcards--wide{grid-template-columns:minmax(0,1fr);justify-items:center}
#relay .pcard--feature{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);grid-template-rows:1fr auto auto auto 1fr;width:min(100%,1000px);min-height:390px;padding-bottom:0;overflow:hidden;background:#fff;border-color:rgba(30,106,120,.24);box-shadow:0 18px 44px rgba(30,106,120,.08);transition:translate .45s cubic-bezier(.16,1,.3,1),border-color .35s ease,box-shadow .45s ease,background .35s ease}
#relay .pcard--feature::after{content:"";position:absolute;inset:0;width:36%;background:linear-gradient(105deg,transparent,rgba(255,255,255,.48),transparent);opacity:0;transform:translateX(-130%) skewX(-12deg);transition:opacity .35s ease,transform .8s cubic-bezier(.16,1,.3,1);pointer-events:none;z-index:2}
#relay .pcard--feature:hover,#relay .pcard--feature:focus-visible{translate:0 -6px;background:#fff;border-color:rgba(30,106,120,.48);box-shadow:0 28px 70px rgba(30,106,120,.16),0 0 0 1px rgba(95,207,242,.14)}
#relay .pcard--feature:hover::after,#relay .pcard--feature:focus-visible::after{opacity:1;transform:translateX(315%) skewX(-12deg)}
#relay .pcard--feature .pcard__art{grid-column:1;grid-row:1/6;width:100%;height:100%;aspect-ratio:auto;object-fit:cover;border-right:1px solid var(--line-soft);border-bottom:0;background:var(--water-10);transform:scale(1.01);transition:filter .45s ease,transform .6s cubic-bezier(.16,1,.3,1)}
#relay .pcard--feature:hover .pcard__art,#relay .pcard--feature:focus-visible .pcard__art{filter:saturate(1.08) contrast(1.03);transform:scale(1.045)}
#relay .pcard--feature h4,#relay .pcard--feature p,#relay .pcard--feature .pcard__go{grid-column:2;position:relative;z-index:1;transition:transform .35s cubic-bezier(.16,1,.3,1),color .28s ease}
#relay .pcard--feature h4{grid-row:2;padding:0 34px;font-size:var(--fs-6)}
#relay .pcard--feature p{grid-row:3;padding:14px 34px 0;max-width:28em}
#relay .pcard--feature .pcard__go{grid-row:4;margin:24px 34px 0}
#relay .pcard--feature:hover h4,#relay .pcard--feature:focus-visible h4{transform:translateY(-3px)}
#relay .pcard--feature:hover .pcard__go,#relay .pcard--feature:focus-visible .pcard__go{color:var(--ink);transform:translateX(5px)}
#market .zone__head{text-align:center}
#original .zone__head{text-align:center}
#original .zone__sub{display:block;margin:2.8vh auto 0;max-width:600px;padding-top:16px;border-top:1px solid var(--line);text-align:center}
#original .zone__sub b{display:block;font-size:clamp(21px,1.9vw,27px);line-height:1.25;margin-bottom:8px}
#original .zone__sub span{display:block;font-size:var(--fs-3);line-height:1.75;max-width:none;color:var(--ink-60)}
#original .skillcards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-top:18px;counter-reset:skill-card}
#original .skillcards .tool{counter-increment:skill-card;display:flex;flex-direction:column;align-items:stretch;gap:0;min-width:0;height:164px;box-sizing:border-box;padding:12px 13px 11px;border:1px solid var(--line-soft);border-radius:2px;background:color-mix(in srgb,var(--paper) 88%,#fff);overflow:hidden;transition:translate .28s cubic-bezier(.16,1,.3,1),background .28s ease,border-color .28s ease,box-shadow .28s ease}
#original .skillcards .tool::before{content:"";position:absolute;inset:auto 13px 0;height:1px;background:var(--teal);opacity:0;transform:scaleX(0);transform-origin:left;z-index:1;transition:opacity .28s ease,transform .28s cubic-bezier(.16,1,.3,1)}
#original .skillcards .tool::after{content:counter(skill-card,decimal-leading-zero);position:absolute;top:12px;left:13px;font-family:"IBM Plex Mono",monospace;font-size:9px;font-weight:600;line-height:1;letter-spacing:.12em;color:var(--ink-38)}
#original .skillcards .tool:hover,#original .skillcards .tool:focus-visible{translate:0 -2px;background:var(--water-10);border-color:rgba(30,106,120,.3);box-shadow:0 8px 18px rgba(30,106,120,.06)}
#original .skillcards .tool:hover::before,#original .skillcards .tool:focus-visible::before{opacity:.8;transform:scaleX(1)}
#original .skillcards .tool__logo{position:absolute;top:7px;right:10px;width:46px;height:46px;box-sizing:border-box;object-fit:contain;padding:0;border:0;background:transparent;box-shadow:none;opacity:.94;transform-origin:right center;backface-visibility:hidden;transition:opacity .24s ease,transform .32s cubic-bezier(.16,1,.3,1)}
#original .skillcards .tool:hover .tool__logo,#original .skillcards .tool:focus-visible .tool__logo{border-color:transparent;transform:perspective(180px) rotateY(88deg);box-shadow:none;opacity:0}
#original .skillcards .tool__name{padding:0;margin-top:42px;font-size:15px;line-height:1.3}
#original .skillcards .tool__name::after{content:"";position:absolute;top:20px;right:22px;width:22px;height:22px;background:var(--teal);-webkit-mask:url("../visuals/icons/download.svg") center/contain no-repeat;mask:url("../visuals/icons/download.svg") center/contain no-repeat;opacity:0;transform:perspective(180px) rotateY(-88deg);transform-origin:right center;pointer-events:none;transition:opacity .2s ease .06s,transform .32s cubic-bezier(.16,1,.3,1)}
#original .skillcards .tool:hover .tool__name::after,#original .skillcards .tool:focus-visible .tool__name::after{opacity:1;transform:perspective(180px) rotateY(0)}
#original .skillcards .tool__name small{margin-top:3px;font-size:10px;line-height:1.4}
#original .skillcards .tool__an{display:block;margin-top:auto;padding:7px 0 0;border-top:1px solid var(--line-soft);font-size:10px;line-height:1.48;color:var(--ink-60)}
#original .skillcards .soonchip{display:none}
@media (prefers-reduced-motion:reduce){#original .skillcards .tool__logo,#original .skillcards .tool__name::after{transition:none}}
#market .zone__sub{display:block;margin:2.4vh auto 0;max-width:560px;padding-top:14px;border-top:1px solid var(--line);text-align:center}
#market .zone__sub b{display:block;font-size:clamp(21px,1.9vw,27px);line-height:1.25;margin-bottom:8px}
#market .zone__sub span{display:block;font-size:var(--fs-3);line-height:1.75;max-width:none;color:var(--ink-60)}
#market .pcards{grid-template-columns:repeat(2,minmax(260px,360px));justify-content:center}
.sourcecards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.sources-visual{grid-column:1/-1;position:relative;height:clamp(240px,28vw,360px);overflow:hidden;border:1px solid var(--line);background:var(--water-10);isolation:isolate}
.sources-visual::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,40,48,0) 46%,rgba(15,40,48,.62));z-index:1;pointer-events:none}
.sources-visual img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 52%;filter:saturate(.96) contrast(1.02)}
.sources-visual figcaption{position:absolute;left:22px;right:22px;bottom:18px;z-index:2;display:flex;align-items:end;justify-content:space-between;gap:20px;color:#fff}
.sources-visual b{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-1);font-weight:600;letter-spacing:.18em}
.sources-visual span{font-size:var(--fs-2);line-height:1.6;max-width:36em;text-align:right}
.sourcecard{position:relative;display:flex;min-height:210px;flex-direction:column;border:1px solid var(--line);background:var(--paper);padding:22px 18px;isolation:isolate;overflow:hidden;transition:translate .35s cubic-bezier(.16,1,.3,1),border-color .35s ease,box-shadow .35s ease,background .35s ease}
.sourcecard::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(95,207,242,.14),transparent 58%);opacity:.75;z-index:-1;transition:opacity .35s ease,transform .35s cubic-bezier(.16,1,.3,1)}
.sourcecard:hover{translate:0 -4px;border-color:var(--teal);box-shadow:0 14px 28px rgba(30,106,120,.08);background:color-mix(in srgb,var(--water-10) 36%,var(--paper))}
.sourcecard:hover::before{opacity:1;transform:scale(1.04)}
.sourcecard__tag{font-family:"IBM Plex Mono",monospace;font-size:var(--fs-1);font-weight:600;letter-spacing:.16em;color:var(--teal)}
.sourcecard h3{font-size:var(--fs-4);line-height:1.35;font-weight:700;margin:2.4vh 0 1vh}
.sourcecard p{font-size:var(--fs-2);color:var(--ink-60);line-height:1.8}
.sourcecard__url{margin-top:auto;padding-top:2vh;font-family:"IBM Plex Mono",monospace;font-size:var(--fs-1);letter-spacing:.04em;color:var(--teal)}
.sourcecards__note{grid-column:1/-1;margin-top:1.4vh;font-size:var(--fs-2);color:var(--ink-60)}
.sourcecards__note b{color:var(--ink)}
#sites .pcards{gap:30px}
#sites .pcard{min-height:430px;padding-bottom:20px;overflow:hidden}
#sites .pcard__media{display:block;height:clamp(230px,22vw,285px);overflow:hidden;border-bottom:1px solid var(--line-soft);background:var(--water-10)}
#sites .pcard__media .pcard__art{width:100%;height:100%;aspect-ratio:auto;object-fit:cover;border-bottom:0;background:var(--water-10)}
#sites .pcard__media .pcard__art--zoom{object-fit:cover;object-position:center 46%;transform:scale(1.1);transform-origin:center;background:#061923}
#sites .pcard:hover .pcard__media .pcard__art--zoom{transform:scale(1.13)}
#sites .pcard__media .pcard__art--white{background:#fff;object-position:center 38%}
#sites .pcard h4{padding-top:20px}
#sites .pcard p{padding-top:10px}
#apps .pcards{gap:30px;align-items:stretch;perspective:1200px}
#apps .pcard{overflow:hidden;min-height:360px;background:linear-gradient(180deg,var(--paper),color-mix(in srgb,var(--water-10) 18%,var(--paper)));box-shadow:0 1px 0 rgba(30,106,120,.05);transition:translate .42s cubic-bezier(.16,1,.3,1),border-color .35s ease,box-shadow .42s ease,background .35s ease}
#apps .pcard::before{content:"";position:absolute;inset:0 0 auto;height:52%;background:radial-gradient(circle at 50% 38%,rgba(95,207,242,.32),transparent 42%),linear-gradient(180deg,rgba(95,207,242,.18),rgba(255,255,255,0));opacity:.72;transition:opacity .35s ease,transform .42s cubic-bezier(.16,1,.3,1);z-index:0;pointer-events:none}
#apps .pcard::after{content:"";position:absolute;top:0;left:0;width:38%;height:54%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.58),transparent);opacity:0;transform:translateX(-130%) skewX(-12deg);transition:opacity .35s ease,transform .7s cubic-bezier(.16,1,.3,1);z-index:2;pointer-events:none}
#apps .pcard:hover,#apps .pcard:focus-visible{translate:0 -8px;border-color:rgba(30,106,120,.46);background:linear-gradient(180deg,#fff,color-mix(in srgb,var(--water-10) 28%,var(--paper)));box-shadow:0 22px 46px rgba(30,106,120,.15),0 0 0 1px rgba(95,207,242,.18)}
#apps .pcard:hover::before,#apps .pcard:focus-visible::before{opacity:1;transform:scale(1.04)}
#apps .pcard:hover::after,#apps .pcard:focus-visible::after{opacity:1;transform:translateX(285%) skewX(-12deg)}
#apps .pcard__art--logo{position:relative;z-index:1;height:clamp(158px,16vw,204px);padding:32px 34px 26px;border-bottom:0;background:transparent;filter:drop-shadow(0 13px 18px rgba(30,106,120,.12));transform-origin:center;will-change:transform,filter}
#apps .pcard:hover .pcard__art--logo,#apps .pcard:focus-visible .pcard__art--logo{transform:translateY(-7px) scale(1.06);filter:saturate(1.08) contrast(1.04) drop-shadow(0 20px 24px rgba(30,106,120,.2))}
#apps .pcard h4,#apps .pcard p,#apps .pcard__go,#apps .pcard .soonchip{position:relative;z-index:1}
#apps .pcard h4{border-top:1px solid var(--line-soft);padding-top:18px;background:linear-gradient(180deg,rgba(255,255,255,.72),rgba(255,255,255,0))}
#apps .pcard__go{transition:color .28s ease,transform .28s cubic-bezier(.16,1,.3,1)}
#apps .pcard:hover .pcard__go,#apps .pcard:focus-visible .pcard__go{color:var(--ink);transform:translateX(4px)}
.notes__rail{position:absolute;left:0;bottom:0;height:2px;width:0;background:var(--teal);pointer-events:none;transition:width .25s ease}
.scroll-progress{
  position:fixed;left:0;top:0;height:3px;width:100%;
  background:linear-gradient(90deg,var(--cyan),var(--teal));
  transform:scaleX(0);transform-origin:left;z-index:90;pointer-events:none;
}
.scroll-top-btn{
  position:fixed;right:32px;bottom:32px;width:48px;height:48px;
  border:2px solid var(--teal);border-radius:50%;
  background:var(--paper);color:var(--teal);
  font-family:"Archivo",sans-serif;font-size:24px;font-weight:300;line-height:1;
  display:grid;place-items:center;cursor:pointer;z-index:70;
  opacity:0;transform:translateY(20px);
  box-shadow:0 4px 12px rgba(30,106,120,.15);
  transition:opacity .3s ease,transform .3s ease,box-shadow .3s ease;
}
.scroll-top-btn:hover{transform:translateY(-4px);box-shadow:0 8px 20px rgba(30,106,120,.2)}
.scroll-top-btn.visible{opacity:1;transform:translateY(0)}
@media (prefers-reduced-motion:reduce){
  .faq summary,.faq__a,.notes__rail,.scroll-progress,.scroll-top-btn,#apps .pcard,#apps .pcard::before,#apps .pcard::after,#apps .pcard__art--logo,#apps .pcard__go,#relay .pcard--feature,#relay .pcard--feature::after,#relay .pcard--feature .pcard__art,#relay .pcard--feature h4,#relay .pcard--feature .pcard__go{transition:none;animation:none}
  #apps .pcard:hover .pcard__art--logo,#apps .pcard:focus-visible .pcard__art--logo{transform:none}
}
/* 文章列表与详情 */
.arts__empty{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:3.5vh 4px;font-size:var(--fs-3);color:var(--ink-38)}
.artdoc{max-width:38em;margin:0 auto;padding:2vh 0 6vh}
.artdoc__k{font-size:var(--fs-1);letter-spacing:.22em;color:var(--teal);font-weight:600}
.artdoc__title{font-size:clamp(26px,2.4vw,34px);font-weight:700;line-height:1.35;margin:2.5vh 0 1.5vh}
.artdoc__meta{font-size:var(--fs-2);color:var(--ink-38);font-weight:500;padding-bottom:3vh;border-bottom:1px solid var(--line)}
.artdoc__body{padding-top:3.5vh;font-size:var(--fs-4);line-height:2}
.artdoc__body h2{font-size:var(--fs-6);font-weight:700;margin:5vh 0 1.5vh}
.artdoc__body h3{font-size:var(--fs-5);font-weight:700;margin:4vh 0 1vh}
.artdoc__body p{margin:1.6vh 0}
.artdoc__body blockquote{border-left:2px solid var(--teal);padding:4px 0 4px 18px;color:var(--ink-60);margin:2.5vh 0}
.artdoc__body img{max-width:100%;display:block;margin:3vh 0}
.artdoc__body code{font-family:"IBM Plex Mono",monospace;font-size:.9em;background:var(--water-10);padding:2px 6px}
.artdoc__body ul{padding-left:1.4em;margin:1.6vh 0}
.artdoc__body a{color:var(--teal);text-decoration:underline;text-underline-offset:3px}
.artdoc__back{margin-top:6vh;font-size:var(--fs-3);font-weight:600}
/* 子页页脚 */
.pagefoot{padding:10vh 0 8vh}
.pagefoot p{margin-top:2.5vh;font-size:var(--fs-3);color:var(--ink-60)}
.pagefoot b{color:var(--ink)}
@media (max-width:960px){
  .pcards,.pcards--wide{grid-template-columns:1fr}
  #market .pcards{grid-template-columns:1fr}
  #original .skillcards{grid-template-columns:repeat(2,minmax(0,1fr))}
  #original .skillcards .tool{height:152px}
  #relay .pcard--feature{grid-template-columns:1fr;grid-template-rows:auto auto auto auto}
  #relay .pcard--feature .pcard__art{grid-column:1;grid-row:auto;height:auto;aspect-ratio:16/9;border-right:0;border-bottom:1px solid var(--line-soft)}
  #relay .pcard--feature h4,#relay .pcard--feature p,#relay .pcard--feature .pcard__go{grid-column:1}
  #relay .pcard--feature h4{padding:18px 18px 0;font-size:var(--fs-5)}
  #relay .pcard--feature p{padding:8px 18px 0}
  #relay .pcard--feature .pcard__go{margin:14px 18px 18px}
  .sourcecards{grid-template-columns:1fr 1fr}
}
@media (max-width:620px){
  #skills.zone--hero .zone__title{font-size:min(8vw,112px)}
  #skills .zone__sub{margin-top:2.4vh;padding-top:14px}
  #original .skillcards{grid-template-columns:1fr;gap:14px}
  #original .skillcards .tool{height:150px}
  .sourcecards{grid-template-columns:1fr}
  .sources-visual{height:220px}
  .sources-visual figcaption{display:block}
  .sources-visual span{display:block;margin-top:8px;text-align:left}
}

/* CMS 附加板块(logo 变体走 contain,不受此兜底影响) */
img.pcard__art:not(.pcard__art--logo){width:100%;aspect-ratio:34/15;object-fit:cover;display:block}

/* ── 2026-07-11 设计审查落地 ── */
/* 子页页脚:简化版 colophon(MOREWATER 视觉锤),替代两行小字+双 waterline */
.pagefoot p.pagefoot__brand{font-size:var(--fs-7);line-height:.94;color:var(--ink);margin-top:0}
.pagefoot__brand i{font-style:normal;color:var(--teal)}
.pagefoot p.pagefoot__cn{margin-top:1.6vh;font-size:var(--fs-3)}
.pagefoot p.pagefoot__meta{margin-top:2.4vh;font-size:10px;letter-spacing:.22em;color:var(--ink-38)}
/* 文章页:下一篇 */
.artdoc__next{margin-top:5vh;padding-top:2.5vh;border-top:1px solid var(--line);font-size:var(--fs-2);letter-spacing:.06em}
/* skills 15 卡:触屏设备无 hover,SOON 签常显在编号旁 */
@media (hover:none){
  #original .skillcards .soonchip{opacity:1;translate:0 0;right:auto;left:38px;bottom:auto;top:9px;border:0;padding:0;font-size:9px;color:var(--ink-38)}
}
/* tools 发布卡:筹备中降饱和,可用/不可用一眼可分 */
#apps .pcard[data-soon]{opacity:.82}
#apps .pcard[data-soon] .pcard__art{filter:saturate(.55)}
#apps .pcard[data-soon]:hover{opacity:1}
#apps .pcard[data-soon]:hover .pcard__art{filter:none}
/* class 三站卡:统一底色与色温 + STEP 序号章(顺序承诺可视化) */
#sites .pcard__media{position:relative;display:block;background:var(--deep-bg)}
#sites .pcard__art{filter:saturate(.82) contrast(1.03)}
.stepchip{position:absolute;top:12px;left:12px;z-index:2;font-size:9px;font-weight:600;letter-spacing:.18em;color:#F7F6F2;background:rgba(15,40,48,.72);padding:4px 8px;pointer-events:none}

/* links 六卡:hover 时极缓的蓝色水波在卡底涌动(呼应水母题) */
.sourcecard::after{content:"";position:absolute;inset:-35%;z-index:-1;pointer-events:none;opacity:0;
  background:
    radial-gradient(42% 34% at 26% 80%, rgba(95,207,242,.26), transparent 70%),
    radial-gradient(48% 40% at 78% 22%, rgba(30,106,120,.16), transparent 72%),
    radial-gradient(36% 32% at 56% 56%, rgba(95,207,242,.14), transparent 70%);
  transition:opacity 1.4s ease;
  animation:srcwater 11s ease-in-out infinite alternate;animation-play-state:paused}
.sourcecard:hover::after{opacity:1;animation-play-state:running}
@keyframes srcwater{
  0%{transform:translate3d(-5%,3%,0) scale(1) rotate(0deg)}
  50%{transform:translate3d(4%,-4%,0) scale(1.08) rotate(2deg)}
  100%{transform:translate3d(-3%,5%,0) scale(1.03) rotate(-2deg)}}
@media (prefers-reduced-motion:reduce){.sourcecard::after{animation:none}}
/* 子页页脚已按用户要求清空,空壳只留作 CMS 附加板块的插入锚点 */
.pagefoot:empty{display:none}