/* ==========================================================================
   KaoYanPDF — Design System
   纸本档案 / Editorial Archive
   ========================================================================== */

/* ---------- tokens ---------- */
:root{
  --paper:#F4F1E8;
  --paper-2:#FAF7EE;
  --paper-3:#EDE8DA;
  --ink:#15140F;
  --ink-2:#4A4639;
  --ink-3:#8B8471;
  --rule:#DBD4C1;
  --rule-2:#E8E2D0;
  --accent:#A33A21;
  --accent-2:#C2552F;
  --gold:#A98A4E;
  --ok:#3D7D57;
  --shadow:rgba(21,20,15,.10);
  --grain:.30;
  --halo:rgba(163,58,33,.055);
  --halo-blend:multiply;
  --sheet:#FCFAF3;
  --sheet-2:#F3EEE0;
  --sheet-ink:#12110D;
  --sheet-rule:#D9D2BE;

  --serif:"Source Han Serif SC","Noto Serif SC","Songti SC","STSong",Georgia,"Times New Roman","SimSun",serif;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei UI","Microsoft YaHei",sans-serif;
  --mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;

  --wrap:1180px;
  --r:2px;
  --ease:cubic-bezier(.22,.68,.18,1);
}

[data-theme="dark"]{
  --paper:#100F0C;
  --paper-2:#17160F;
  --paper-3:#1D1B14;
  --ink:#F2EDE0;
  --ink-2:#BCB5A3;
  --ink-3:#847D6B;
  --rule:#2B2820;
  --rule-2:#211F18;
  --accent:#DE6740;
  --accent-2:#EB8358;
  --gold:#C4A265;
  --shadow:rgba(0,0,0,.5);
  --grain:.20;
  --halo:rgba(243,239,228,.05);
  --halo-blend:screen;
  --sheet:#F5F1E4;
  --sheet-2:#EAE4D2;
  --sheet-ink:#12110D;
  --sheet-rule:#D3CBB5;
}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--sans);font-size:16px;line-height:1.8;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  transition:background-color .5s var(--ease),color .5s var(--ease);
}
::selection{background:var(--ink);color:var(--paper)}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
h1,h2,h3,h4,p,figure{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
input{font:inherit;color:inherit}
:focus-visible{outline:1.5px solid var(--accent);outline-offset:3px}

.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 32px}
section[id],main[id]{scroll-margin-top:92px}
.serif{font-family:var(--serif)}
.mono{font-family:var(--mono)}

/* paper grain + light halo */
.grain{
  position:fixed;inset:0;z-index:900;pointer-events:none;opacity:var(--grain);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.40'/%3E%3C/svg%3E");
  mix-blend-mode:multiply;transition:opacity .5s var(--ease);
}
[data-theme="dark"] .grain{mix-blend-mode:screen}
.halo{
  position:fixed;left:0;top:0;z-index:0;width:640px;height:640px;border-radius:50%;
  pointer-events:none;opacity:0;will-change:transform;transition:opacity .9s var(--ease);
  background:radial-gradient(circle closest-side,var(--halo) 0%,transparent 68%);
  mix-blend-mode:var(--halo-blend);
}
body.has-cursor .halo{opacity:1}
@media (pointer:coarse),(prefers-reduced-motion:reduce){.halo{display:none}}

/* ---------- topbar ---------- */
.topbar{
  position:fixed;top:0;left:0;right:0;z-index:100;
  border-bottom:1px solid transparent;
  transition:background-color .45s var(--ease),border-color .45s var(--ease),backdrop-filter .45s;
}
.topbar.stuck{
  background:color-mix(in srgb,var(--paper) 84%,transparent);
  -webkit-backdrop-filter:saturate(1.3) blur(16px);
  backdrop-filter:saturate(1.3) blur(16px);
  border-bottom-color:var(--rule-2);
}
.tb-in{
  max-width:var(--wrap);margin:0 auto;padding:0 32px;height:74px;
  display:flex;align-items:center;gap:28px;
}
.brand{display:flex;align-items:center;gap:11px;flex-shrink:0}
.brand-mark{
  width:30px;height:30px;border-radius:3px;background:var(--ink);color:var(--paper);
  display:grid;place-items:center;font-family:var(--serif);font-size:17px;font-weight:700;
  line-height:1;letter-spacing:-.02em;position:relative;
  transition:background-color .4s var(--ease),transform .5s var(--ease);
}
.brand-mark::after{
  content:"";position:absolute;right:-3px;bottom:-3px;width:6px;height:6px;
  background:var(--accent);border-radius:1px;
}
.brand:hover .brand-mark{transform:rotate(-4deg)}
.brand-txt{display:flex;flex-direction:column;line-height:1.15}
.brand-txt b{
  font-family:var(--serif);font-size:17px;font-weight:700;letter-spacing:.01em;
}
.brand-txt b em{font-style:normal;color:var(--accent)}
.brand-txt i{
  font-family:var(--mono);font-style:normal;font-size:9px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--ink-3);margin-top:3px;
}
.nav{display:flex;align-items:center;gap:26px;margin-left:14px}
.nav a{
  position:relative;font-size:13.5px;color:var(--ink-3);letter-spacing:.04em;
  padding:3px 0;transition:color .3s var(--ease);
}
.nav a::after{
  content:"";position:absolute;left:0;right:0;bottom:-2px;height:1px;background:var(--accent);
  transform:scaleX(0);transform-origin:right;transition:transform .45s var(--ease);
}
.nav a:hover{color:var(--ink)}
.nav a.on{color:var(--ink)}
.nav a.on::after{transform:scaleX(1);transform-origin:left}
.tb-act{margin-left:auto;display:flex;align-items:center;gap:10px}
.tb-cta{
  display:inline-flex;align-items:center;gap:8px;
  height:36px;padding:0 18px;background:var(--ink);color:var(--paper);
  font-size:12.5px;letter-spacing:.08em;border-radius:var(--r);
  transition:background-color .3s var(--ease),gap .3s var(--ease);
}
.tb-cta:hover{background:var(--accent);gap:11px}
.tb-cta svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:1.6}
.icon-btn{
  width:36px;height:36px;border:1px solid var(--rule);border-radius:50%;
  display:grid;place-items:center;color:var(--ink-2);
  transition:border-color .3s,color .3s,transform .5s var(--ease);
}
.icon-btn:hover{border-color:var(--ink);color:var(--ink)}
.icon-btn svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.i-sun{display:none}
[data-theme="dark"] .i-sun{display:block}
[data-theme="dark"] .i-moon{display:none}
.menu-btn{display:none}
.mobile-menu{
  display:none;border-top:1px solid var(--rule-2);
  background:color-mix(in srgb,var(--paper) 96%,transparent);
  -webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);
}
.mobile-menu.open{display:block}
.mobile-menu a{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 32px;border-bottom:1px solid var(--rule-2);font-size:15px;
}
.mobile-menu a span{font-family:var(--mono);font-size:10px;color:var(--ink-3);letter-spacing:.16em}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  height:50px;padding:0 30px;border-radius:var(--r);
  font-size:14px;letter-spacing:.06em;font-weight:500;
  transition:background-color .3s var(--ease),color .3s var(--ease),gap .3s var(--ease),border-color .3s;
}
.btn svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.6}
.btn-solid{background:var(--ink);color:var(--paper)}
.btn-solid:hover{background:var(--accent);gap:14px}
.btn-line{border:1px solid var(--rule);color:var(--ink-2)}
.btn-line:hover{border-color:var(--ink);color:var(--ink);gap:14px}
.btn-accent{background:var(--accent);color:#FBF7EC}
.btn-accent:hover{background:var(--accent-2);gap:14px}
.btn[disabled]{opacity:.5;pointer-events:none}

/* ---------- layout helpers ---------- */
.sec{padding:96px 0 0}
.sec-head{
  display:flex;align-items:baseline;gap:18px;
  border-top:1px solid var(--rule);padding-top:16px;
}
.idx{
  font-family:var(--mono);font-size:10px;letter-spacing:.22em;color:var(--accent);
  text-transform:uppercase;white-space:nowrap;
}
.idx-n{font-family:var(--mono);font-size:10px;letter-spacing:.18em;color:var(--ink-3);text-transform:uppercase}
.sec-head .idx-n{margin-left:auto}
.sec-title{
  font-family:var(--serif);font-size:clamp(1.6rem,3.1vw,2.15rem);font-weight:700;
  letter-spacing:-.01em;line-height:1.45;margin-top:26px;
}
.sec-title em{font-style:normal;color:var(--accent)}
.sec-lede{margin-top:14px;max-width:36em;font-size:14.5px;color:var(--ink-3);line-height:1.95}
.sec-title-row{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;flex-wrap:wrap}

/* ---------- hero ---------- */
.hero{position:relative;padding:150px 0 0;overflow:hidden}
.hero::before{
  content:"";position:absolute;left:50%;top:-260px;width:min(1100px,110vw);height:820px;
  transform:translateX(-50%);pointer-events:none;
  background:radial-gradient(ellipse at center,color-mix(in srgb,var(--accent) 7%,transparent) 0%,transparent 62%);
}
.hero-in{position:relative;display:grid;grid-template-columns:1.06fr .94fr;gap:64px;align-items:center}
.hero-aside{
  position:absolute;right:30px;top:206px;z-index:2;
  display:flex;align-items:center;gap:14px;
  writing-mode:vertical-rl;
  font-family:var(--mono);font-size:9px;letter-spacing:.34em;text-transform:uppercase;
  color:var(--ink-3);
}
.hero-aside i{width:1px;height:64px;background:linear-gradient(var(--rule),transparent)}
@media (max-width:1280px){.hero-aside{display:none}}
.eyebrow{
  display:inline-flex;align-items:center;gap:11px;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--ink-3);
}
.eyebrow .ln{width:38px;height:1px;background:var(--rule);display:block}
.eyebrow b{color:var(--ink);font-weight:500}
.hero h1{
  font-family:var(--serif);font-weight:700;
  font-size:clamp(2.3rem,4.6vw,3.7rem);line-height:1.28;letter-spacing:-.02em;
  margin:24px 0 0;
}
.hero h1 em{font-style:normal;color:var(--accent);position:relative;white-space:nowrap}
.hero h1 em::after{
  content:"";position:absolute;left:2px;right:2px;bottom:.06em;height:.06em;
  background:color-mix(in srgb,var(--accent) 34%,transparent);
}
.hero-lede{
  margin-top:26px;max-width:33em;font-size:15.5px;line-height:2;color:var(--ink-2);
}
.hero-lede b{color:var(--ink);font-weight:600}
.hero-act{display:flex;align-items:center;gap:14px;margin-top:38px;flex-wrap:wrap}
.hero-note{
  margin-top:22px;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;
  color:var(--ink-3);display:flex;align-items:center;gap:9px;
}
.hero-note i{
  width:5px;height:5px;border-radius:50%;background:var(--ok);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--ok) 16%,transparent);
  animation:pulse 2.8s ease-in-out infinite;
}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.8)}}

/* dossier / exam paper stack */
.dossier{
  position:relative;width:100%;max-width:392px;margin-left:auto;
  aspect-ratio:1/1.06;
  /* 老内核不支持 aspect-ratio 时的兜底高度，现代浏览器下不生效 */
  min-height:338px;
}
.sheet{
  position:absolute;inset:0;border:1px solid var(--sheet-rule);background:var(--sheet);
  box-shadow:0 26px 54px -34px rgba(21,20,15,.45);
}
.sheet.b1{transform:rotate(-4.2deg) translate(-14px,10px);background:var(--sheet-2);box-shadow:none;border-color:color-mix(in srgb,var(--sheet-rule) 70%,transparent)}
.sheet.b2{transform:rotate(2.4deg) translate(12px,4px);background:color-mix(in srgb,var(--sheet) 88%,var(--sheet-2));box-shadow:none;border-color:color-mix(in srgb,var(--sheet-rule) 80%,transparent)}
.paper{
  position:relative;z-index:2;display:flex;flex-direction:column;height:100%;
  padding:26px 28px 22px;color:var(--sheet-ink);overflow:hidden;
  transition:transform .7s var(--ease);
}
.dossier:hover .paper{transform:translateY(-6px)}
.p-top{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding-bottom:11px;border-bottom:1.5px solid var(--sheet-ink);
  font-family:var(--mono);font-size:9px;letter-spacing:.18em;text-transform:uppercase;
  color:color-mix(in srgb,var(--sheet-ink) 55%,var(--sheet));
}
.p-top b{color:var(--sheet-ink);font-weight:600;letter-spacing:.16em}
.p-kicker{
  margin-top:26px;font-family:var(--mono);font-size:9px;letter-spacing:.2em;
  text-transform:uppercase;color:color-mix(in srgb,var(--sheet-ink) 46%,var(--sheet));
}
/* 标题字号只跟卡片宽度走（不用 rem），避免浏览器默认字号被调大后
   字撑破卡片、在 Chrome 里被折成三行；容器查询不可用时回退到 vw */
.p-title{
  font-family:var(--serif);font-weight:700;
  font-size:clamp(19px,2.45vw,27.5px);
  line-height:1.5;letter-spacing:.01em;margin:12px 0 0;
  word-break:normal;overflow-wrap:break-word;
}
@supports (container-type:inline-size){
  .dossier{container-type:inline-size}
  .p-title{font-size:clamp(19px,6.9cqw,27.5px)}
}
.p-sub{
  margin-top:8px;font-size:11.5px;letter-spacing:.04em;
  color:color-mix(in srgb,var(--sheet-ink) 52%,var(--sheet));
}
.p-rule{flex:none;margin-top:16px;border-top:1px solid var(--sheet-rule);border-bottom:1px solid var(--sheet-rule);height:5px}
/* 装饰横线可伸缩：极端情况下压缩它，而不是把页脚挤出卡片 */
.p-lines{margin-top:22px;display:grid;gap:9px;align-content:start;flex:1 1 auto;min-height:12px;overflow:hidden}
.p-lines i{display:block;height:1px;background:color-mix(in srgb,var(--sheet-rule) 86%,transparent)}
.p-lines i:nth-child(2){width:94%}
.p-lines i:nth-child(3){width:99%}
.p-lines i:nth-child(4){width:72%}
.p-lines i:nth-child(5){width:88%}
.p-lines i:nth-child(6){width:60%}
.p-foot{
  flex:none;margin-top:auto;padding-top:12px;border-top:1px solid var(--sheet-rule);
  display:flex;align-items:flex-end;justify-content:space-between;gap:10px;
  font-family:var(--mono);font-size:8.5px;letter-spacing:.14em;text-transform:uppercase;
  color:color-mix(in srgb,var(--sheet-ink) 50%,var(--sheet));
}
.p-foot b{color:var(--sheet-ink);font-weight:600}
.seal{
  position:absolute;right:-16px;bottom:46px;z-index:3;
  width:92px;height:92px;border-radius:50%;border:2px solid var(--accent);
  color:var(--accent);display:grid;place-items:center;transform:rotate(-11deg);
  background:color-mix(in srgb,var(--sheet) 78%,transparent);
  box-shadow:0 12px 24px -18px rgba(163,58,33,.8);
}
.seal::before{content:"";position:absolute;inset:6px;border:1px solid currentColor;border-radius:50%;opacity:.5}
.seal .t{display:flex;flex-direction:column;align-items:center;line-height:1;gap:5px}
.seal .t b{font-family:var(--serif);font-size:19px;font-weight:700;letter-spacing:.1em}
.seal .t span{font-family:var(--mono);font-size:7px;letter-spacing:.26em}
.doc-tag{
  position:absolute;left:-10px;top:-11px;z-index:4;
  background:var(--ink);color:var(--paper);
  font-family:var(--mono);font-size:8.5px;letter-spacing:.22em;text-transform:uppercase;
  padding:7px 10px;border-radius:1px;
  transition:background-color .4s var(--ease);
}
.dossier:hover .doc-tag{background:var(--accent)}

/* hero stats */
.hero-stats{
  display:grid;grid-template-columns:repeat(4,1fr);gap:0;
  border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
  margin-top:86px;
}
.hstat{padding:26px 26px 24px;border-left:1px solid var(--rule-2);position:relative}
.hstat:first-child{border-left:0;padding-left:0}
.hstat b{
  display:block;font-family:var(--serif);font-size:2rem;font-weight:700;line-height:1;
  letter-spacing:-.02em;
}
.hstat b span{font-size:.55em;color:var(--ink-3);margin-left:2px}
.hstat p{
  margin-top:10px;font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink-3);
}

/* ticker */
.ticker{
  border-bottom:1px solid var(--rule);overflow:hidden;position:relative;
  background:color-mix(in srgb,var(--paper-3) 42%,var(--paper));
}
.ticker::before,.ticker::after{
  content:"";position:absolute;top:0;bottom:0;width:90px;z-index:2;pointer-events:none;
}
.ticker::before{left:0;background:linear-gradient(90deg,var(--paper),transparent)}
.ticker::after{right:0;background:linear-gradient(270deg,var(--paper),transparent)}
.tk-track{display:flex;width:max-content;animation:tk 64s linear infinite}
.ticker:hover .tk-track{animation-play-state:paused}
@keyframes tk{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.tk-row{display:flex;align-items:center;flex-shrink:0}
.tk-item{
  display:inline-flex;align-items:center;gap:16px;padding:13px 0 13px 26px;
  font-size:12.5px;color:var(--ink-3);white-space:nowrap;
}
.tk-item::after{content:"✳";color:var(--accent);font-size:9px;opacity:.55;margin-left:10px}
@media (prefers-reduced-motion:reduce){.tk-track{animation:none}}

/* ---------- archive cards ---------- */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--rule-2);margin-top:40px;border:1px solid var(--rule-2)}
.card{
  position:relative;isolation:isolate;overflow:hidden;background:var(--paper);
  padding:26px 24px 22px;display:flex;flex-direction:column;min-height:190px;
  transition:background-color .45s var(--ease),color .45s var(--ease);
}
.card::before{
  content:"";position:absolute;inset:0;z-index:-1;background:var(--ink);
  opacity:0;transition:opacity .45s var(--ease);
}
.card:hover,.card:focus-visible{color:var(--paper)}
.card:hover::before,.card:focus-visible::before{opacity:1}
.card-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.card-code{
  font-family:var(--mono);font-size:10px;letter-spacing:.18em;color:var(--accent);
  transition:color .45s var(--ease);
}
.card:hover .card-code,.card:focus-visible .card-code{color:color-mix(in srgb,var(--paper) 66%,var(--ink))}
.card-ico{
  font-family:var(--mono);font-size:11px;line-height:1;color:var(--ink-3);
  opacity:0;transform:translate(-3px,3px);
  transition:opacity .45s var(--ease),transform .45s var(--ease),color .45s;
}
.card:hover .card-ico{opacity:1;transform:translate(0,0);color:color-mix(in srgb,var(--paper) 62%,var(--ink))}
.card h3{
  margin-top:20px;font-family:var(--serif);font-size:1.32rem;font-weight:700;
  letter-spacing:0;line-height:1.5;
  display:flex;align-items:center;gap:9px;
}
.card h3 .arw{
  font-size:.62em;opacity:0;transform:translateX(-5px);
  transition:opacity .4s var(--ease),transform .4s var(--ease);
}
.card:hover h3 .arw{opacity:1;transform:translateX(0)}
.card-sub{
  margin-top:7px;font-family:var(--mono);font-size:10px;letter-spacing:.12em;
  color:var(--ink-3);transition:color .45s var(--ease);
}
.card:hover .card-sub{color:color-mix(in srgb,var(--paper) 52%,var(--ink))}
.card-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto;padding-top:20px}
.card-tags span{
  font-family:var(--mono);font-size:9.5px;letter-spacing:.06em;
  padding:3px 8px;border:1px solid var(--rule);border-radius:100px;color:var(--ink-3);
  transition:border-color .45s var(--ease),color .45s var(--ease);
}
.card:hover .card-tags span{border-color:color-mix(in srgb,var(--paper) 22%,transparent);color:color-mix(in srgb,var(--paper) 62%,var(--ink))}

/* ---------- all subjects band (ink slab) ---------- */
.pro-band{
  position:relative;isolation:isolate;overflow:hidden;
  display:grid;grid-template-columns:1.04fr .96fr;gap:48px;align-items:center;
  margin-top:20px;padding:42px 46px;
  background:var(--ink);color:var(--paper);
  transition:box-shadow .55s var(--ease),transform .55s var(--ease);
}
.pro-band::after{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(78% 130% at 104% -10%,color-mix(in srgb,var(--accent) 30%,transparent),transparent 62%),
    repeating-linear-gradient(115deg,transparent 0 22px,color-mix(in srgb,currentColor 4%,transparent) 22px 23px);
  opacity:.85;transition:opacity .55s var(--ease);
}
.pro-band:hover{box-shadow:0 30px 64px -40px rgba(21,20,15,.72)}
.pro-band:hover::after{opacity:1}
[data-theme="dark"] .pro-band::after{
  background:
    radial-gradient(64% 110% at 104% -14%,color-mix(in srgb,var(--accent) 15%,transparent),transparent 56%),
    repeating-linear-gradient(115deg,transparent 0 22px,color-mix(in srgb,currentColor 3%,transparent) 22px 23px);
  opacity:.7;
}
.pb-k{
  display:flex;align-items:center;gap:10px;
  font-family:var(--mono);font-size:9px;letter-spacing:.22em;text-transform:uppercase;
  color:color-mix(in srgb,currentColor 56%,transparent);
}
.pb-k i{font-style:normal;width:5px;height:5px;background:var(--accent);display:block}
.pb-main h3{
  margin-top:15px;font-family:var(--serif);font-size:clamp(1.45rem,2.3vw,1.82rem);
  font-weight:700;line-height:1.42;letter-spacing:-.01em;
}
.pb-main h3 em{font-style:normal;color:var(--accent-2);padding:0 2px}
[data-theme="dark"] .pb-main h3 em{color:var(--accent)}
.pb-main p{
  margin-top:13px;max-width:33em;font-size:13px;line-height:2;
  color:color-mix(in srgb,currentColor 60%,transparent);
}
.pb-side{display:flex;flex-direction:column;align-items:flex-start;gap:24px;width:100%}
.pb-codes{display:grid;grid-template-columns:repeat(auto-fit,minmax(104px,1fr));gap:8px;width:100%}
.pb-codes span{
  font-family:var(--mono);font-size:10.5px;letter-spacing:.02em;text-align:center;
  padding:7px 8px;
  border:1px solid color-mix(in srgb,currentColor 22%,transparent);
  color:color-mix(in srgb,currentColor 74%,transparent);
  transition:border-color .45s var(--ease),color .45s var(--ease);
}
.pro-band:hover .pb-codes span{
  border-color:color-mix(in srgb,currentColor 34%,transparent);
  color:color-mix(in srgb,currentColor 88%,transparent);
}
.pb-go{
  display:flex;width:100%;justify-content:center;align-items:center;gap:11px;
  background:var(--paper);color:var(--ink);
  padding:13px 25px;font-size:13px;font-weight:600;letter-spacing:.02em;
  transition:gap .4s var(--ease),background-color .4s var(--ease),color .4s var(--ease);
}
.pb-go svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.7}
.pro-band:hover .pb-go{gap:17px;background:var(--accent-2);color:#FCFAF3}
[data-theme="dark"] .pro-band:hover .pb-go{background:var(--accent);color:#12110D}

/* ---------- steps ---------- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:44px;border-top:1px solid var(--rule)}
.step{padding:30px 32px 34px 0;border-right:1px solid var(--rule-2);position:relative}
.step:last-child{border-right:0}
.step:not(:first-child){padding-left:32px}
.step-n{
  font-family:var(--mono);font-size:10px;letter-spacing:.2em;color:var(--accent);
}
.step h3{
  margin-top:16px;font-family:var(--serif);font-size:1.2rem;font-weight:700;line-height:1.5;
}
.step p{margin-top:10px;font-size:13.8px;line-height:1.95;color:var(--ink-3)}
.step-note{
  margin-top:18px;font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink-3);opacity:.85;
}

/* ---------- big entry rows ---------- */
.entries{margin-top:40px;border-top:1px solid var(--rule)}
.entry{
  display:grid;grid-template-columns:70px 1fr auto 34px;gap:24px;align-items:center;
  padding:26px 6px;border-bottom:1px solid var(--rule-2);
  transition:padding-left .45s var(--ease),color .3s;
}
.entry:hover{padding-left:16px}
.entry-n{font-family:var(--mono);font-size:10px;letter-spacing:.16em;color:var(--ink-3)}
.entry-t{font-family:var(--serif);font-size:1.32rem;font-weight:700;line-height:1.4}
.entry-t span{
  display:block;font-family:var(--sans);font-size:12.8px;font-weight:400;
  color:var(--ink-3);margin-top:6px;letter-spacing:0;
}
.entry-m{
  font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-3);white-space:nowrap;
}
.entry-ar{font-size:15px;color:var(--accent);opacity:0;transform:translateX(-6px);transition:opacity .4s,transform .4s}
.entry:hover .entry-ar{opacity:1;transform:translateX(0)}

/* ---------- faq ---------- */
.faq{margin-top:38px;border-top:1px solid var(--rule)}
.faq details{border-bottom:1px solid var(--rule-2)}
.faq summary{
  display:flex;align-items:center;gap:16px;padding:20px 4px;cursor:pointer;
  font-size:15px;list-style:none;transition:color .3s;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{
  content:"";width:7px;height:7px;flex-shrink:0;border-right:1px solid var(--ink-3);
  border-bottom:1px solid var(--ink-3);transform:rotate(-45deg);transition:transform .4s var(--ease),border-color .3s;
}
.faq details[open] summary::before{transform:rotate(45deg);border-color:var(--accent)}
.faq summary:hover{color:var(--accent)}
.faq .a{padding:0 4px 24px 27px;font-size:14px;line-height:2;color:var(--ink-3);max-width:62em}
.faq .a b{color:var(--ink-2);font-weight:600}

/* ---------- footer ---------- */
.foot{margin-top:104px;border-top:1px solid var(--rule);padding:52px 0 40px}
.foot-top{display:grid;grid-template-columns:1.3fr 1fr;gap:48px}
.foot-brand{display:flex;gap:14px;align-items:flex-start}
.fb-mark{
  width:42px;height:42px;border-radius:3px;background:var(--ink);color:var(--paper);
  display:grid;place-items:center;font-family:var(--serif);font-size:22px;font-weight:700;
  flex-shrink:0;
}
.fb-name{font-family:var(--serif);font-size:17px;font-weight:700;letter-spacing:.02em}
.fb-sub{margin-top:8px;font-size:12.5px;color:var(--ink-3);max-width:22em;line-height:1.9}
.foot-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.foot-cols h4{
  font-family:var(--mono);font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--ink-3);font-weight:400;margin-bottom:14px;
}
.foot-cols a,.foot-cols span{display:block;font-size:13px;color:var(--ink-2);padding:5px 0;transition:color .3s}
.foot-cols a:hover{color:var(--accent)}
.foot-bot{
  margin-top:44px;padding-top:22px;border-top:1px solid var(--rule-2);
  display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;
  font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-3);
}
.foot-bot .sp{margin-left:auto}
.foot-bot .ok{color:var(--ok)}

/* ==========================================================================
   inner pages
   ========================================================================== */
.page{padding:132px 0 0}
.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;flex-wrap:wrap}
.page-head .eyebrow{margin-bottom:20px}
.page h1{
  font-family:var(--serif);font-size:clamp(2rem,3.8vw,2.9rem);font-weight:700;
  line-height:1.3;letter-spacing:-.02em;
}
.page h1 em{font-style:normal;color:var(--accent)}
.page-lede{margin-top:18px;max-width:40em;font-size:14.5px;line-height:2;color:var(--ink-3)}
.crumb{
  display:flex;align-items:center;gap:8px;margin-bottom:22px;
  font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-3);
}
.crumb a{transition:color .3s}
.crumb a:hover{color:var(--accent)}
.crumb i{font-style:normal;opacity:.5}

/* ---------- find panel (shared by 3 index pages) ---------- */
.findbar{
  position:relative;margin-top:42px;padding:19px 26px 17px;
  border:1px solid var(--rule);
  background:color-mix(in srgb,var(--paper-2) 92%,transparent);
  box-shadow:0 24px 48px -42px var(--shadow);
  transition:box-shadow .5s var(--ease),border-color .5s var(--ease);
}
.findbar::before{
  content:"";position:absolute;left:-1px;top:-1px;bottom:-1px;width:2px;
  background:var(--accent);
}
.findbar:focus-within{box-shadow:0 28px 56px -40px var(--shadow);border-color:var(--rule-2)}
.fb-head{display:flex;align-items:center;justify-content:space-between;gap:16px}
.fb-k{
  display:inline-flex;align-items:center;gap:9px;
  font-family:var(--mono);font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-3);
}
.fb-k b{color:var(--accent);font-weight:500}
.fb-k i{font-style:normal;opacity:.45}
.cnt{font-family:var(--mono);font-size:10px;letter-spacing:.13em;color:var(--ink-3);white-space:nowrap}
.cnt b{color:var(--accent);font-weight:500}
.fb-field{display:flex;align-items:center;gap:14px;padding:14px 0 12px;border-bottom:1px solid var(--rule);transition:border-color .4s var(--ease)}
.fb-field:focus-within{border-bottom-color:var(--accent)}
.fb-ico{width:20px;height:20px;flex-shrink:0;stroke:var(--ink-3);fill:none;stroke-width:1.55;transition:stroke .4s}
.fb-field:focus-within .fb-ico{stroke:var(--accent)}
.fb-field input{
  flex:1;min-width:0;border:0;outline:none;background:transparent;
  font-family:var(--serif);font-size:19px;letter-spacing:.01em;color:var(--ink);
}
.fb-field input::placeholder{font-family:var(--sans);font-size:14px;color:color-mix(in srgb,var(--ink-3) 76%,transparent)}
/* 回车提示：告诉用户「输入完按回车/点搜索」——输入过程中不再自动请求 */
.fb-kbd{
  flex-shrink:0;font-family:var(--mono);font-size:8.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink-3);border:1px solid var(--rule-2);border-bottom-width:2px;border-radius:2px;
  padding:3px 7px;background:color-mix(in srgb,var(--paper-3) 55%,transparent);
  transition:color .35s var(--ease),border-color .35s var(--ease);
}
.fb-field:focus-within .fb-kbd{color:var(--accent);border-color:color-mix(in srgb,var(--accent) 38%,var(--rule-2))}
.fb-btn{
  flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;gap:8px;
  height:38px;padding:0 24px;border-radius:1px;
  background:var(--ink);color:var(--paper);
  font-size:12.5px;font-weight:600;letter-spacing:.06em;
  transition:background-color .35s var(--ease),color .35s var(--ease),gap .35s var(--ease);
}
.fb-btn:hover{background:var(--accent);color:#FCFAF3;gap:12px}
.fb-btn svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.8}
.fb-hint{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-top:13px}
.fb-hint>span{
  font-family:var(--mono);font-size:8.5px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--ink-3);opacity:.75;margin-right:2px;
}
.fb-hint button{
  font-family:var(--mono);font-size:10px;letter-spacing:.03em;color:var(--ink-2);
  border:1px solid var(--rule-2);padding:4px 10px;
  transition:border-color .3s,color .3s,background-color .3s;
}
.fb-hint button:hover{border-color:var(--accent);color:var(--accent);background:color-mix(in srgb,var(--accent) 5%,transparent)}
.fb-load{position:absolute;left:-1px;right:-1px;bottom:-1px;height:2px;overflow:hidden;opacity:0;transition:opacity .28s}
.fb-load i{display:block;width:32%;height:100%;background:var(--accent);animation:fbSlide 1.1s var(--ease) infinite}
@keyframes fbSlide{0%{transform:translateX(-105%)}100%{transform:translateX(350%)}}
.findbar.loading .fb-load{opacity:1}
.spin{
  display:inline-block;width:9px;height:9px;margin-right:7px;vertical-align:-1px;border-radius:50%;
  border:1px solid color-mix(in srgb,var(--ink-3) 40%,transparent);border-top-color:var(--accent);
  animation:rot .75s linear infinite;
}
@keyframes rot{to{transform:rotate(360deg)}}

/* ---------- subject cards ---------- */
.subj-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1px;
  background:var(--rule-2);border:1px solid var(--rule-2);margin-top:38px;
}
.subj-grid .empty{grid-column:1/-1;margin:0;border:0;background:var(--paper)}
.subj-card{min-height:178px;padding:24px 24px 20px}
.subj-card h3{margin-top:16px;font-size:1.16rem;line-height:1.55;display:block}
.subj-card h3 .arw{display:inline-block;margin-left:5px;font-size:.72em;opacity:0}
.subj-card .card-sub{font-size:9px;letter-spacing:.1em;margin-top:6px}
.subj-card .card-tags{padding-top:16px}
.subj-card .card-tags span{font-size:9px;padding:2px 7px}

/* empty / skeleton */
.empty{
  text-align:center;padding:80px 20px;border:1px dashed var(--rule);margin-top:40px;
  background:color-mix(in srgb,var(--paper-3) 26%,transparent);
}
.empty b{display:block;font-family:var(--serif);font-size:1.15rem;margin-bottom:10px}
.empty p{font-size:13.5px;color:var(--ink-3)}
.sk{background:linear-gradient(90deg,var(--rule-2) 25%,var(--paper-3) 50%,var(--rule-2) 75%);background-size:200% 100%;animation:sh 1.4s infinite linear}
@keyframes sh{from{background-position:200% 0}to{background-position:-200% 0}}
.sk-row{height:52px;border-bottom:1px solid var(--paper);opacity:.75}
.doc-empty{padding:26px 0;font-size:13px;color:var(--ink-3);line-height:1.9}

/* ---------- details page ---------- */
.subject-head{
  display:flex;align-items:flex-end;justify-content:space-between;gap:40px;
  padding-bottom:28px;border-bottom:1px solid var(--rule);flex-wrap:wrap;
}
.subject-head .code-lg{
  font-family:var(--mono);font-size:11px;letter-spacing:.2em;color:var(--accent);
  display:block;margin-bottom:16px;
}
.subject-head h1{
  font-family:var(--serif);font-size:clamp(2.1rem,4.2vw,3.1rem);font-weight:700;
  line-height:1.2;letter-spacing:-.02em;
}
.subject-meta{display:flex;gap:34px;flex-wrap:wrap}
.smeta{display:flex;flex-direction:column;gap:6px}
.smeta span{font-family:var(--mono);font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-3)}
.smeta b{font-family:var(--serif);font-size:1.15rem;font-weight:700}
.doc-grid{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-top:52px;border-top:1px solid var(--rule)}
.doc-col{padding:26px 0 0;border-right:1px solid var(--rule-2);padding-right:36px}
.doc-col:last-child{border-right:0;padding-right:0;padding-left:36px}
.doc-col-h{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:20px}
.doc-col-h h2{
  font-family:var(--serif);font-size:1.18rem;font-weight:700;display:flex;align-items:center;gap:9px;
}
.doc-col-h h2 .dot{width:6px;height:6px;border-radius:50%;background:var(--accent)}
.doc-col-h .n{font-family:var(--mono);font-size:10px;color:var(--ink-3);letter-spacing:.14em}
.doc-list{display:flex;flex-direction:column}
.doc-row{
  display:grid;grid-template-columns:56px 1fr auto;gap:14px;align-items:center;
  padding:15px 8px 15px 0;border-top:1px solid var(--rule-2);
  text-align:left;width:100%;transition:background-color .4s var(--ease),color .4s var(--ease),padding-left .4s var(--ease);
}
.doc-row:hover{background:var(--ink);color:var(--paper);padding-left:12px;padding-right:12px}
.doc-year{font-family:var(--mono);font-size:11.5px;letter-spacing:.01em;color:var(--accent);transition:color .4s}
.doc-row:hover .doc-year{color:color-mix(in srgb,var(--paper) 70%,var(--accent))}
.doc-name{font-size:13.8px;line-height:1.5;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.doc-badge{
  font-family:var(--mono);font-size:8.5px;letter-spacing:.12em;text-transform:uppercase;
  border:1px solid var(--rule);border-radius:100px;padding:2px 7px;color:var(--ink-3);
  transition:border-color .4s,color .4s;
}
.doc-row:hover .doc-badge{border-color:color-mix(in srgb,var(--paper) 30%,transparent);color:color-mix(in srgb,var(--paper) 72%,var(--ink))}
.doc-scope{
  margin-top:24px;font-family:var(--mono);font-size:9px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink-3);
}
.doc-note{
  margin-top:56px;display:grid;grid-template-columns:1fr auto;gap:32px;align-items:center;
  border:1px solid var(--rule);padding:26px 30px;background:color-mix(in srgb,var(--paper-3) 30%,transparent);
}
.doc-note p{font-size:13.5px;color:var(--ink-2);line-height:1.9}
.doc-note p b{color:var(--ink)}
.doc-note .mono{margin-top:8px;font-size:9.5px;color:var(--ink-3);letter-spacing:.14em;text-transform:uppercase}

/* ==========================================================================
   download page — document access
   ========================================================================== */

/* step rail */
.vsteps{
  display:flex;align-items:stretch;list-style:none;margin:38px 0 0;
  border-top:1px solid var(--rule);border-bottom:1px solid var(--rule-2);
}
.vsteps li{
  position:relative;display:flex;align-items:center;gap:11px;
  padding:14px 30px 14px 0;
  font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink-3);transition:color .4s var(--ease);
}
.vsteps li+li{padding-left:30px;border-left:1px solid var(--rule-2)}
.vsteps li i{font-style:normal;font-size:8.5px;letter-spacing:.1em;color:var(--ink-3);opacity:.62}
.vsteps li.done{color:var(--ink-2)}
.vsteps li.done i{color:var(--ok);opacity:1}
.vsteps li.on{color:var(--ink)}
.vsteps li.on i{color:var(--accent);opacity:1}
.vsteps li.on::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--accent)}
.vsteps .vs-note{margin-left:auto;border-left:0;padding-left:0;color:var(--ink-3)}
.vsteps .vs-note i{color:var(--gold);opacity:1}

.dl-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:56px;align-items:start;margin-top:44px}
.dl-grid.no-doc{grid-template-columns:1fr;justify-items:center;text-align:center}
.dl-grid.no-doc>*:first-child{display:none}
.dl-grid.no-doc .vk{justify-content:center}
.dl-grid.no-doc .vlede{margin-left:auto;margin-right:auto}
.nodata-act{margin-top:30px;display:flex;gap:12px;flex-wrap:wrap;justify-content:center}

/* document card */
.ticket{
  position:relative;background:var(--paper-2);color:var(--ink);
  border:1px solid var(--rule);overflow:hidden;
  box-shadow:0 34px 64px -50px var(--shadow);
}
.tk-head{
  padding:17px 26px;border-bottom:1px solid var(--rule-2);
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  font-family:var(--mono);font-size:8.5px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--ink-3);
}
.tk-head b{color:var(--ink-2);font-weight:600;letter-spacing:.12em}
.tk-body{padding:28px 26px 20px}
.tk-kicker{
  font-family:var(--mono);font-size:8.5px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--accent);
}
.tk-title{
  font-family:var(--serif);font-size:1.3rem;font-weight:700;line-height:1.55;
  margin:12px 0 22px;word-break:break-word;letter-spacing:-.01em;
}
.tk-rows{border-top:1px solid var(--rule-2)}
.tk-row{
  display:flex;align-items:baseline;justify-content:space-between;gap:16px;
  padding:11px 0;border-bottom:1px solid var(--rule-2);
  font-size:12.5px;
}
.tk-row span{
  font-family:var(--mono);font-size:8.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink-3);
}
.tk-row b{font-weight:600;text-align:right;color:var(--ink)}
.tk-tear{
  position:relative;height:24px;margin:0;
  background:
    radial-gradient(circle at 0 50%,transparent 9px,var(--paper-2) 9.5px) left/51% 100% no-repeat,
    radial-gradient(circle at 100% 50%,transparent 9px,var(--paper-2) 9.5px) right/51% 100% no-repeat;
}
.tk-tear::after{
  content:"";position:absolute;left:18px;right:18px;top:50%;border-top:1px dashed var(--rule);
}
.tk-foot{padding:6px 26px 20px;display:flex;align-items:flex-end;justify-content:space-between;gap:16px}
.tk-stamp{
  font-family:var(--mono);font-size:8px;letter-spacing:.16em;line-height:1.95;
  text-transform:uppercase;color:var(--ink-3);
}
.tk-stamp b{color:var(--ok);letter-spacing:.14em}
.ticket .seal{
  position:absolute;right:22px;bottom:14px;width:74px;height:74px;
  background:color-mix(in srgb,var(--paper-2) 74%,transparent);
  box-shadow:none;opacity:.9;
}
.ticket .seal .t b{font-size:16px}
.ticket .seal .t span{font-size:6px;letter-spacing:.2em}
.ticket-note{
  margin-top:16px;font-family:var(--mono);font-size:9px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink-3);text-align:center;
}

/* verify panel */
.vk{
  display:flex;align-items:center;gap:9px;margin-bottom:16px;
  font-family:var(--mono);font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:var(--accent);
}
.vk::before{content:"";width:20px;height:1px;background:currentColor;opacity:.6}
.verify .vlede{margin-top:14px;font-size:14px;line-height:1.95;color:var(--ink-3);max-width:30em}
.verify h1{
  font-family:var(--serif);font-size:clamp(1.8rem,3.2vw,2.4rem);font-weight:700;
  line-height:1.35;letter-spacing:-.02em;
}
.verify h1 em{font-style:normal;color:var(--accent)}

.vbox{
  margin-top:26px;border:1px solid var(--rule);padding:26px 28px 24px;
  background:color-mix(in srgb,var(--paper-3) 32%,transparent);
}
.vp-head{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding-bottom:18px;margin-bottom:22px;border-bottom:1px solid var(--rule-2);
  font-family:var(--mono);font-size:9px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--ink-3);
}
.vp-head b{color:var(--accent);font-weight:500;letter-spacing:.16em}
.vlabel{
  font-family:var(--mono);font-size:9px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--ink-3);margin-bottom:12px;display:flex;justify-content:space-between;gap:10px;
}
.vlabel i{font-style:normal;color:var(--accent)}
.cap-frame{display:flex;align-items:center;gap:16px;margin-bottom:22px}
canvas#captcha{
  border:1px solid var(--rule);background:var(--paper-3);
  cursor:pointer;transition:border-color .3s;
}
canvas#captcha:hover{border-color:var(--ink-3)}
.cap-refresh{
  font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-3);display:inline-flex;align-items:center;gap:7px;transition:color .3s;
}
.cap-refresh:hover{color:var(--accent)}
.cap-refresh svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:1.6}
.vinput{
  width:100%;background:transparent;border:0;border-bottom:1px solid var(--rule);
  padding:10px 0;font-family:var(--mono);font-size:20px;letter-spacing:.16em;color:var(--ink);
  outline:none;transition:border-color .3s;
}
.vinput::placeholder{font-size:13px;letter-spacing:.04em;color:var(--ink-3);font-family:var(--sans)}
.vinput:focus{border-bottom-color:var(--accent)}
.vbtn{
  width:100%;margin-top:24px;height:50px;background:var(--ink);color:var(--paper);
  font-size:13.5px;letter-spacing:.08em;font-weight:600;
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  transition:background-color .3s var(--ease),color .3s var(--ease),gap .3s var(--ease);
}
.vbtn:hover{background:var(--accent);color:#FCFAF3;gap:14px}
.vbtn[disabled]{opacity:.55;pointer-events:none}
.vbtn svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.8}
.vhint{
  margin-top:14px;font-family:var(--mono);font-size:9px;letter-spacing:.12em;
  color:var(--ink-3);text-align:center;text-transform:uppercase;
}
.verr{
  margin-top:12px;font-family:var(--mono);font-size:9.5px;letter-spacing:.06em;
  color:var(--accent);min-height:12px;line-height:1.7;
}
.vbox.shake{animation:shake .38s var(--ease)}
@keyframes shake{
  0%,100%{transform:translateX(0)}
  20%{transform:translateX(-6px)}40%{transform:translateX(5px)}
  60%{transform:translateX(-3px)}80%{transform:translateX(2px)}
}

.result{
  margin-top:22px;padding:22px 24px;
  border:1px solid color-mix(in srgb,var(--accent) 34%,var(--rule));
  background:color-mix(in srgb,var(--accent) 6%,transparent);
  animation:rise .5s var(--ease);
}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
.result-h{
  display:flex;align-items:center;gap:9px;font-family:var(--mono);font-size:9.5px;
  letter-spacing:.18em;text-transform:uppercase;color:var(--accent);margin-bottom:16px;
}
.result-h svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2}
.link-box{
  font-family:var(--mono);font-size:12.5px;line-height:1.9;word-break:break-all;
  color:var(--ink);background:var(--paper-2);
  border:1px dashed var(--rule);padding:14px 16px;
}
.copy-btn{
  margin-top:14px;width:100%;height:44px;border:1px solid var(--ink);
  color:var(--ink);font-size:12.5px;letter-spacing:.08em;
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  transition:background-color .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease);
}
.copy-btn:hover{background:var(--ink);color:var(--paper)}
.copy-btn svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.6}
.result-tip{margin-top:14px;font-size:11.5px;color:var(--ink-3);line-height:1.8}
.vhelp{
  margin-top:22px;padding-top:18px;border-top:1px solid var(--rule-2);
  font-size:12.5px;line-height:2;color:var(--ink-3);max-width:34em;
}

/* ==========================================================================
   school & book grids
   ========================================================================== */
.grid-cards{
  display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--rule-2);
  border:1px solid var(--rule-2);margin-top:44px;
}
.school{
  background:var(--paper);padding:26px 22px 22px;position:relative;width:100%;text-align:left;
  font:inherit;color:inherit;cursor:pointer;border:0;
  display:flex;flex-direction:column;align-items:flex-start;gap:16px;
  transition:background-color .4s var(--ease);
}
.school:hover{background:var(--paper-2)}
.school-logo{
  position:relative;width:58px;height:58px;display:grid;place-items:center;
  font-family:var(--serif);font-size:20px;color:var(--ink-2);
  transition:transform .45s var(--ease);
  overflow:hidden;
}
.school-logo i{
  font-style:normal;width:44px;height:44px;display:grid;place-items:center;
  border:1px solid var(--rule);color:var(--ink-2);background:var(--paper-2);
  transition:border-color .4s;
}
.school-logo.has-img i{display:none}
.school:hover .school-logo i{border-color:var(--accent);color:var(--accent)}
.school-logo img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:contain;
  opacity:.96;transition:opacity .45s var(--ease),transform .45s var(--ease);
}
.school:hover .school-logo img{opacity:1;transform:scale(1.05)}
.school-name{font-family:var(--serif);font-size:1.05rem;font-weight:700;line-height:1.5}
.school-sub{
  font-family:var(--mono);font-size:8.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-3);
}
.school-ar{
  position:absolute;right:18px;top:24px;font-size:13px;color:var(--accent);
  opacity:0;transform:translate(-4px,4px);transition:opacity .35s,transform .35s;
}
.school:hover .school-ar{opacity:1;transform:translate(0,0)}

/* books */
.book-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:38px 26px;margin-top:40px;
  align-items:start;
  transition:opacity .3s var(--ease);
}
.book-grid.busy{opacity:.3;pointer-events:none}
.book{
  display:flex;flex-direction:column;gap:14px;text-align:left;min-width:0;
  transition:transform .45s var(--ease);width:100%;font:inherit;color:inherit;
  cursor:pointer;border:0;background:none;padding:0;
}
.book:hover{transform:translateY(-5px)}
/* 封面框：图片以「正常文档流」参与布局（不再绝对定位 / 不再 height:0）。
   这样即使 aspect-ratio 不被支持，图片也能自己把盒子撑开——永远不会出现空框；
   同时浏览器能正确计算图片可见区域，lazy 判定不会再被零高度父级坑到。 */
.book-cover{
  position:relative;display:flex;align-items:center;justify-content:center;
  aspect-ratio:3/4;min-height:140px;
  padding:9% 14%;flex:none;
  background:var(--paper-3);
  overflow:hidden;
  border:1px solid var(--rule-2);
  transition:background-color .45s var(--ease),border-color .45s var(--ease);
}
.book-cover::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:2;
  background:linear-gradient(160deg,rgba(255,255,255,.16),transparent 46%);
  opacity:.7;
}
[data-theme="dark"] .book-cover::after{opacity:.35}
.book:hover .book-cover{background:color-mix(in srgb,var(--paper-3) 70%,var(--paper-2));border-color:var(--rule)}
/* 封面图：常规流内等比缩放，max-width/max-height 双约束保证不溢出 */
.book-cover img{
  position:relative;z-index:1;
  display:block;width:auto;height:auto;
  max-width:100%;max-height:100%;
  filter:drop-shadow(0 10px 14px rgba(21,20,15,.22));
  transition:transform .55s var(--ease),filter .55s var(--ease);
}
.book-ph{
  position:absolute;inset:0;display:grid;place-items:center;padding:22px;
  font-family:var(--serif);font-size:12px;line-height:1.8;color:var(--ink-3);
  text-align:center;z-index:0;overflow:hidden;
  transition:opacity .35s var(--ease);
}
/* 图片加载成功后隐藏占位文字；加载失败则移除图片、露出占位文字 */
.book-cover.has-img .book-ph{opacity:0}
.book-cover.img-fail img{display:none}
.book:hover .book-cover img{transform:translateY(-2px);filter:drop-shadow(0 16px 20px rgba(21,20,15,.3))}
.book-info{display:flex;flex-direction:column;flex:1;min-height:0}
.book-title{
  font-family:var(--serif);font-size:14px;font-weight:700;line-height:1.7;letter-spacing:.01em;
  min-height:3.4em;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.book-meta{
  font-size:11.5px;color:var(--ink-3);line-height:1.9;letter-spacing:.01em;
  display:flex;gap:8px;align-items:baseline;margin-top:1px;
}
.book-meta:first-of-type{margin-top:auto;padding-top:8px}
.book-meta em{
  font-style:normal;font-family:var(--mono);font-size:8px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-3);opacity:.72;flex-shrink:0;width:42px;
}
.book-meta span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.book-meta.isbn span{font-family:var(--mono);font-size:10.5px;letter-spacing:.04em;opacity:.85}

/* pager */
.pager{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:56px}
.pg{
  min-width:34px;height:34px;display:grid;place-items:center;padding:0 8px;
  font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:var(--ink-3);
  border:1px solid transparent;border-radius:2px;transition:all .3s;
}
.pg:hover:not([disabled]):not(.on){color:var(--ink);border-color:var(--rule)}
.pg.on{background:var(--ink);color:var(--paper)}
.pg[disabled]{opacity:.35;pointer-events:none}
.pg-sep{color:var(--ink-3);font-size:11px;opacity:.6}

/* modal */
.modal{
  position:fixed;inset:0;z-index:400;display:none;align-items:center;justify-content:center;
  padding:24px;background:rgba(12,11,8,.72);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
}
.modal.open{display:flex;animation:fade .3s var(--ease)}
@keyframes fade{from{opacity:0}to{opacity:1}}
.modal-box{
  position:relative;width:100%;max-width:440px;background:var(--paper-2);
  border:1px solid var(--rule);padding:36px 34px 30px;text-align:center;
  animation:pop .4s var(--ease);
}
@keyframes pop{from{opacity:0;transform:translateY(18px) scale(.99)}to{opacity:1;transform:none}}
.modal-x{
  position:absolute;right:14px;top:12px;width:30px;height:30px;display:grid;place-items:center;
  color:var(--ink-3);font-size:17px;line-height:1;transition:color .3s,transform .3s;
}
.modal-x:hover{color:var(--ink);transform:rotate(90deg)}
.modal-k{
  font-family:var(--mono);font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:var(--accent);
}
/* 品牌名保持 WeChat 原样大小写 */
.modal-k.wc{text-transform:none;letter-spacing:.18em}
.modal-h{
  margin-top:14px;font-family:var(--serif);font-size:1.45rem;font-weight:700;line-height:1.45;
}
.modal-h em{font-style:normal;color:var(--accent)}
.modal-p{margin-top:12px;font-size:13px;line-height:1.9;color:var(--ink-3)}
.qr-frame{
  width:190px;height:190px;margin:24px auto 0;padding:10px;background:#fff;
  border:1px solid var(--rule);
}
.qr-frame img{width:100%;height:100%;object-fit:contain}
.wx-id{
  display:inline-flex;align-items:center;gap:10px;margin-top:20px;padding:9px 16px;
  border:1px dashed var(--rule);font-family:var(--mono);font-size:13px;letter-spacing:.1em;
}
.wx-id span{font-size:9px;letter-spacing:.16em;text-transform:none;color:var(--ink-3)}
.modal-box .btn{width:100%;margin-top:20px}
.copy-tip{
  margin-top:12px;font-family:var(--mono);font-size:9px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ok);opacity:0;transition:opacity .3s;
}
.copy-tip.show{opacity:1}

/* ---------- toast（请求提示） ---------- */
.toast-host{
  position:fixed;left:50%;bottom:36px;transform:translateX(-50%);z-index:800;
  display:flex;flex-direction:column;gap:10px;align-items:center;
  width:calc(100% - 40px);max-width:430px;pointer-events:none;
}
.toast{
  pointer-events:auto;position:relative;width:100%;
  background:color-mix(in srgb,var(--paper-2) 94%,transparent);
  border:1px solid var(--rule);border-left:2px solid var(--accent);
  padding:14px 40px 15px 18px;
  box-shadow:0 26px 46px -32px var(--shadow);
  -webkit-backdrop-filter:saturate(1.2) blur(14px);
  backdrop-filter:saturate(1.2) blur(14px);
  opacity:0;transform:translateY(14px) scale(.985);
  transition:opacity .4s var(--ease),transform .4s var(--ease);
}
.toast.in{opacity:1;transform:none}
[data-theme="dark"] .toast{
  background:#22201A;border-color:#37322A;border-left-color:var(--accent);
  box-shadow:0 28px 48px -30px rgba(0,0,0,.9),0 1px 0 rgba(243,239,228,.05) inset;
}
[data-theme="dark"] .toast p{color:#DED8C7}
.toast .ts-k{
  display:flex;align-items:center;gap:7px;
  font-family:var(--mono);font-size:8.5px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--accent);
}
.toast .ts-k i{
  width:5px;height:5px;border-radius:50%;background:var(--accent);display:block;
  animation:toastDot 1.6s ease-in-out infinite;
}
.toast p{margin-top:7px;font-size:13.5px;line-height:1.75;color:var(--ink-2);letter-spacing:.01em}
.toast .ts-x{
  position:absolute;right:8px;top:9px;width:24px;height:24px;display:grid;place-items:center;
  color:var(--ink-3);font-size:12px;line-height:1;transition:color .3s;
}
.toast .ts-x:hover{color:var(--ink)}
@keyframes toastDot{0%,100%{opacity:.35;transform:scale(.75)}50%{opacity:1;transform:scale(1)}}
@media (max-width:640px){
  .toast-host{bottom:18px;width:calc(100% - 28px)}
  .toast{padding:13px 38px 14px 15px}
  .toast p{font-size:13px}
}
@media (prefers-reduced-motion:reduce){.toast{transition:opacity .2s linear}}

/* book detail modal */
.modal-book{max-width:840px;text-align:left;padding:34px 40px 28px;max-height:90vh;overflow:auto}
.mb-head{
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:0 26px 16px 0;border-bottom:1px solid var(--rule-2);
}
.mb-kicker{font-family:var(--mono);font-size:8.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent)}
.mb-no{font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;color:var(--ink-3)}
.mb-grid{display:grid;grid-template-columns:220px 1fr;gap:40px;align-items:stretch;margin-top:26px}
.mb-cover{
  aspect-ratio:3/4.1;min-height:180px;background:var(--paper-3);border:1px solid var(--rule-2);overflow:hidden;
  box-shadow:0 24px 44px -32px var(--shadow);
  display:grid;place-items:center;padding:14px;
}
.mb-cover img{width:100%;height:100%;object-fit:contain}
.mb-info{display:flex;flex-direction:column;min-height:100%}
.mb-title{font-family:var(--serif);font-size:1.5rem;font-weight:700;line-height:1.45;letter-spacing:-.01em}
.mb-rows{margin-top:22px;border-top:1px solid var(--rule-2)}
.mb-row{display:flex;gap:18px;padding:11px 0;font-size:13px;border-bottom:1px solid var(--rule-2);align-items:baseline}
.mb-row span{
  font-family:var(--mono);font-size:8.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink-3);width:74px;flex-shrink:0;
}
.mb-row b{font-weight:400;color:var(--ink-2);line-height:1.7}
.mb-note{
  margin-top:auto;padding:16px 0 0 13px;border-left:2px solid var(--rule);
  font-size:12.5px;line-height:1.95;color:var(--ink-3);
}
.mb-foot{display:flex;align-items:center;gap:18px;margin-top:26px;padding-top:22px;border-top:1px solid var(--rule-2)}
.mb-foot .btn{width:100%;margin:0;justify-content:center;padding:14px 28px}

/* page note strip */
.strip{
  margin-top:64px;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
  padding:22px 0;display:flex;align-items:center;gap:20px;justify-content:space-between;flex-wrap:wrap;
}
.strip p{font-size:13px;color:var(--ink-3)}
.strip a{
  font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--accent);display:inline-flex;align-items:center;gap:8px;
  transition:gap .3s;
}
.strip a:hover{gap:12px}
/* 微信号入口：保留 WeChat 的品牌大小写 */
.strip a.wx-link{text-transform:none;letter-spacing:.1em}

/* ---------- reveal ---------- */
.rv{opacity:0;transform:translateY(18px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.rv.in{opacity:1;transform:none}
.rv.d1{transition-delay:.08s}.rv.d2{transition-delay:.16s}.rv.d3{transition-delay:.24s}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}}

/* ---------- responsive ---------- */
@media (max-width:1080px){
  .hero-in{grid-template-columns:1fr;gap:56px}
  .dossier{margin:0 auto;max-width:340px}
  .cards{grid-template-columns:repeat(2,1fr)}
  .grid-cards{grid-template-columns:repeat(3,1fr)}
  .book-grid{grid-template-columns:repeat(3,1fr)}
  .foot-top{grid-template-columns:1fr;gap:36px}
  .dl-grid{grid-template-columns:1fr;gap:38px}
  .ticket{max-width:460px}
  .pro-band{grid-template-columns:1fr;gap:30px;padding:36px 34px}
}
@media (max-width:880px){
  .nav{display:none}
  .tb-cta{display:none}
  .menu-btn{display:grid}
  .wrap,.tb-in{padding:0 22px}
  .hero{padding-top:118px}
  .hero-stats{grid-template-columns:1fr 1fr;margin-top:64px}
  .hstat{border-left:0;border-top:1px solid var(--rule-2);padding:22px 0}
  .hstat:nth-child(-n+2){border-top:0}
  .hstat:nth-child(even){padding-left:20px;border-left:1px solid var(--rule-2)}
  .sec{padding-top:72px}
  .steps{grid-template-columns:1fr}
  .step{border-right:0;border-bottom:1px solid var(--rule-2);padding:24px 0!important}
  .step:last-child{border-bottom:0}
  .doc-grid{grid-template-columns:1fr}
  .doc-col{border-right:0;padding-right:0!important;padding-left:0!important;border-bottom:1px solid var(--rule-2);padding-bottom:24px}
  .doc-col:last-child{border-bottom:0}
  .subj-grid{grid-template-columns:repeat(2,1fr)}
  .grid-cards{grid-template-columns:repeat(2,1fr)}
  .book-grid{grid-template-columns:repeat(2,1fr);gap:30px 18px}
  .foot-cols{grid-template-columns:1fr 1fr}
  .entry{grid-template-columns:48px 1fr 24px;gap:16px}
  .entry-m{display:none}
  .page{padding-top:112px}
  .page-head .smeta{flex-direction:row;align-items:baseline;gap:10px}
  .page-head .smeta b{font-size:1rem}
  .vsteps{margin-top:30px}
  .vsteps li{padding:13px 18px 13px 0;letter-spacing:.12em}
  .vsteps li+li{padding-left:18px}
  .modal-box{padding:30px 22px 26px}
  .modal-book{max-width:600px;padding:30px 24px 24px}
  .mb-grid{grid-template-columns:160px 1fr;gap:26px}
  .mb-title{font-size:1.22rem}
}
@media (max-width:620px){
  .cards{grid-template-columns:1fr}
  .subj-grid{grid-template-columns:repeat(2,1fr)}
  .subj-card{min-height:150px;padding:20px 17px 16px}
  .grid-cards{grid-template-columns:1fr 1fr}
  .book-grid{grid-template-columns:1fr 1fr;gap:24px 16px}
  .hero h1{font-size:2.05rem}
  .hstat b{font-size:1.7rem}
  .sec-title{font-size:1.55rem}
  .doc-note{grid-template-columns:1fr;gap:18px}
  .mb-grid{grid-template-columns:1fr;gap:20px}
  .mb-cover{max-width:132px}
  .mb-foot{gap:14px}
  .mb-foot .btn{justify-content:center}
  .fb-field input{font-size:15.5px}
  .fb-btn{padding:0 16px;font-size:11.5px}
  .fb-hint button{font-size:9.5px}
  .findbar{padding:16px 18px 15px}
  .fb-field{gap:11px;padding:12px 0 10px}
  .fb-field input::placeholder{font-size:12.5px}
  .fb-kbd{display:none}
  .fb-btn{padding:0 14px;height:36px;gap:0}
  .fb-btn svg{display:none}
  .fb-hint{margin-top:11px;gap:7px}
  .pro-band{padding:30px 24px;gap:24px}
  .vsteps li{font-size:8.5px;letter-spacing:.08em;white-space:nowrap;padding:12px 12px 12px 0;gap:6px}
  .vsteps li+li{padding-left:12px}
  .vsteps li i{display:none}
  .vsteps .vs-note{display:none}
  .vsteps{margin-top:24px}
  .brand-txt i{display:none}
  .tk-body{padding:24px 22px 20px}
  .tk-head{padding:18px 22px}
  .tk-foot{padding:0 22px 20px}
  .verify .vbox,.vbox{padding:22px}
  .cap-frame{flex-direction:column;align-items:flex-start;gap:10px}
}