/* ==========================================================================
   天博赛场 · 共享站点样式 /assets/site.css
   极简文字建筑 + 竞技场夜间数据界面
   ========================================================================== */

/* ---------- 1. Reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body,h1,h2,h3,h4,h5,p,figure,blockquote,dl,dd,ol,ul{margin:0;padding:0}
ol,ul{list-style:none}
img,picture,svg,video{display:block;max-width:100%}
table{border-collapse:collapse;border-spacing:0;width:100%}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer}
a{color:inherit;text-decoration:none}
hr{border:0}
[hidden]{display:none !important}

/* ---------- 2. Tokens ---------- */
:root{
  --night:#0B1220;
  --steel:#101B2E;
  --slate:#16233A;
  --clay:#E4572E;
  --flame:#FF8A4C;
  --neon:#4CE0A5;
  --moss:#6F8F5F;
  --bone:#E9E4D8;
  --rock:#9AA7BD;
  --grid:#3E4C63;
  --line:rgba(62,76,99,.62);
  --line-soft:rgba(62,76,99,.38);
  --ink-deep:#150C07;
  --sans:'Inter','Source Han Sans SC','Noto Sans SC',system-ui,-apple-system,'PingFang SC','Hiragino Sans GB','Microsoft YaHei',sans-serif;
  --mono:'Saira Mono','Roboto Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,'Courier New',monospace;
  --fs-10:.625rem;
  --fs-12:.75rem;
  --fs-14:.875rem;
  --fs-16:1rem;
  --fs-20:1.25rem;
  --fs-28:1.75rem;
  --fs-40:2.5rem;
  --fs-64:4rem;
  --fs-88:5.5rem;
  --shell:1240px;
  --head-h:7.1rem;
  --radius:16px;
  --radius-sm:10px;
  --radius-lg:26px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --gutter:clamp(1rem,4vw,2rem);
}

/* ---------- 3. Base ---------- */
html{color-scheme:dark}
body{
  position:relative;
  min-height:100%;
  font-family:var(--sans);
  font-size:var(--fs-16);
  line-height:1.7;
  color:var(--bone);
  background:
    radial-gradient(1100px 560px at 88% -8%, rgba(228,87,46,.16), transparent 62%),
    radial-gradient(900px 520px at -12% 18%, rgba(76,224,165,.09), transparent 58%),
    linear-gradient(180deg,#0B1220 0%,#0B1220 58%,#091019 100%);
  background-color:var(--night);
  letter-spacing:.01em;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background-image:
    linear-gradient(rgba(62,76,99,.15) 1px,transparent 1px),
    linear-gradient(90deg,rgba(62,76,99,.15) 1px,transparent 1px);
  background-size:64px 64px;
  -webkit-mask-image:radial-gradient(120% 78% at 50% 0%,#000 18%,transparent 76%);
  mask-image:radial-gradient(120% 78% at 50% 0%,#000 18%,transparent 76%);
}
::selection{background:rgba(228,87,46,.4);color:#fff}
:focus-visible{outline:2px solid var(--neon);outline-offset:3px;border-radius:6px}
#main-content{display:block}
#main-content:focus{outline:none}
[id],[data-section]{scroll-margin-top:calc(var(--head-h) + 1rem)}

/* ---------- 4. Shell & sections ---------- */
.shell{width:min(100% - (var(--gutter) * 2), var(--shell));margin-inline:auto}
.section{padding:clamp(3rem,7vw,6rem) 0}
.section--tight{padding:clamp(2rem,4.5vw,3.25rem) 0}
.section--dense{padding:clamp(1.5rem,3vw,2.25rem) 0}
.section--panel{background:linear-gradient(180deg,rgba(16,27,46,.8),rgba(11,18,32,0))}
.section-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:1rem 2rem;margin-bottom:clamp(1.5rem,3vw,2.5rem)}
.section-title{font-size:clamp(1.65rem,3.4vw,2.5rem);font-weight:800;line-height:1.12;letter-spacing:-.02em}
.section-note{max-width:40ch;font-size:var(--fs-14);color:var(--rock)}
.divider{height:1px;margin:clamp(1.5rem,3vw,2.5rem) 0;background:linear-gradient(90deg,rgba(62,76,99,.9),rgba(62,76,99,0))}

/* ---------- 5. Type ---------- */
.eyebrow{display:inline-flex;align-items:center;gap:.55rem;font-family:var(--mono);font-size:var(--fs-12);font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--clay)}
.eyebrow::before{content:"";width:20px;height:2px;background:linear-gradient(90deg,var(--clay),var(--flame))}
.display{font-size:clamp(2.4rem,7vw,5.5rem);font-weight:900;line-height:1.02;letter-spacing:-.035em}
.h1{font-size:clamp(1.9rem,4.6vw,3.5rem);font-weight:800;line-height:1.08;letter-spacing:-.025em}
.h2{font-size:clamp(1.45rem,3vw,2.25rem);font-weight:800;line-height:1.15;letter-spacing:-.018em}
.h3{font-size:clamp(1.1rem,2vw,1.5rem);font-weight:700;line-height:1.25;letter-spacing:-.01em}
.tilt{display:inline-block;transform:skewX(-4deg)}
.lede{max-width:44ch;font-size:clamp(1.06rem,1.6vw,1.375rem);line-height:1.6;color:var(--bone)}
.prose{max-width:62ch;font-size:var(--fs-16);line-height:1.7;color:var(--rock)}
.prose--narrow{max-width:44ch}
.prose p+p{margin-top:1em}
.prose strong{color:var(--bone);font-weight:600}
.prose a{color:var(--neon);border-bottom:1px solid rgba(76,224,165,.45)}
.prose a:hover{color:var(--flame);border-color:rgba(255,138,76,.6)}
.num{font-family:var(--mono);font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.num--xl{font-size:1.4em;line-height:1}

/* ---------- 6. Buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.65rem 1.1rem;border:1px solid transparent;border-radius:999px;font-size:var(--fs-14);font-weight:700;line-height:1;text-align:center;cursor:pointer;transition:background-color .18s var(--ease),color .18s var(--ease),border-color .18s var(--ease),transform .18s var(--ease)}
.btn--primary{background:linear-gradient(120deg,var(--clay),var(--flame));color:var(--ink-deep);box-shadow:0 10px 26px rgba(228,87,46,.24)}
.btn--primary:hover{transform:translateY(-1px);background:linear-gradient(120deg,var(--flame),var(--clay))}
.btn--ghost{background:rgba(76,224,165,.1);border-color:rgba(76,224,165,.42);color:var(--neon)}
.btn--ghost:hover{background:rgba(76,224,165,.2);transform:translateY(-1px)}
.btn--line{border-color:rgba(62,76,99,.9);color:var(--bone)}
.btn--line:hover{border-color:var(--clay);color:var(--flame);transform:translateY(-1px)}
.btn-row{display:flex;flex-wrap:wrap;gap:.7rem;align-items:center}

/* ---------- 7. Skip link ---------- */
.skip-link{position:absolute;left:1rem;top:-4.5rem;z-index:200;padding:.65rem 1.1rem;border-radius:0 0 10px 10px;background:var(--neon);color:#062015;font-size:var(--fs-14);font-weight:800;letter-spacing:.02em}
.skip-link:focus{top:0}

/* ---------- 8. Header ---------- */
.site-head{
  position:sticky;
  top:0;
  z-index:60;
  background:linear-gradient(180deg,rgba(11,18,32,.97),rgba(11,18,32,.9));
  border-bottom:1px solid var(--line);
  -webkit-backdrop-filter:blur(14px);
  backdrop-filter:blur(14px);
  transition:box-shadow .2s var(--ease),background-color .2s var(--ease);
}
.site-head[data-stuck]{box-shadow:0 14px 36px rgba(4,8,16,.55);background:linear-gradient(180deg,rgba(11,18,32,.99),rgba(11,18,32,.95))}
.head-inner{
  width:min(100% - (var(--gutter) * 2), var(--shell));
  margin-inline:auto;
  display:grid;
  grid-template-columns:auto 1fr auto;
  grid-template-areas:
    "brand utility actions"
    "nav nav nav";
  align-items:center;
  gap:.55rem 1.4rem;
  padding:.6rem 0 .35rem;
}
.brand{grid-area:brand;min-width:0}
.brand-mark{display:inline-flex;align-items:center;gap:.7rem;min-width:0}
.brand-glyph{display:grid;place-items:center;flex:none;width:2.4rem;height:2.4rem;border-radius:8px;background:linear-gradient(140deg,var(--clay),var(--flame));color:var(--ink-deep);font-family:var(--mono);font-size:var(--fs-14);font-weight:800;transform:skewX(-6deg);box-shadow:0 8px 20px rgba(228,87,46,.26)}
.brand-text{display:flex;flex-direction:column;min-width:0}
.brand-name{font-size:var(--fs-20);font-weight:900;line-height:1.1;letter-spacing:-.02em;color:var(--bone)}
.brand-line{font-size:var(--fs-10);font-family:var(--mono);letter-spacing:.08em;color:var(--rock);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.brand-mark:hover .brand-name{color:var(--flame)}
.head-utility{grid-area:utility;display:flex;align-items:center;justify-content:flex-end;gap:1rem;min-width:0}
.head-note{display:flex;align-items:center;gap:.5rem;min-width:0;font-size:var(--fs-12);color:var(--rock);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.head-search{display:inline-flex;align-items:center;gap:.55rem;max-width:23rem;padding:.4rem .75rem;border:1px solid rgba(62,76,99,.85);border-radius:999px;font-size:var(--fs-12);color:var(--rock);transition:border-color .18s var(--ease),color .18s var(--ease)}
.head-search:hover{border-color:var(--clay);color:var(--bone)}
.head-search-glyph{color:var(--neon);font-size:var(--fs-14)}
.head-search-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.head-search-key{flex:none;padding-left:.55rem;border-left:1px solid rgba(62,76,99,.85);font-family:var(--mono);font-size:var(--fs-10);letter-spacing:.12em;color:var(--clay)}
.head-actions{grid-area:actions;display:flex;align-items:center;gap:.6rem;justify-self:end}
.head-cta{white-space:nowrap;padding:.55rem .95rem}
.pulse{flex:none;display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--neon);box-shadow:0 0 0 0 rgba(76,224,165,.55);animation:pulse 2s infinite}
@keyframes pulse{
  0%{box-shadow:0 0 0 0 rgba(76,224,165,.55)}
  70%{box-shadow:0 0 0 9px rgba(76,224,165,0)}
  100%{box-shadow:0 0 0 0 rgba(76,224,165,0)}
}
.nav-toggle{display:none;align-items:center;gap:.5rem;padding:.45rem .75rem;border:1px solid rgba(62,76,99,.9);border-radius:999px;font-family:var(--mono);font-size:var(--fs-12);letter-spacing:.1em;color:var(--bone)}
.nav-toggle:hover{border-color:var(--clay);color:var(--flame)}
.nav-toggle-mark{position:relative;display:inline-block;width:14px;height:10px}
.nav-toggle-mark span{position:absolute;left:0;width:100%;height:2px;background:currentColor;border-radius:2px;transition:transform .2s var(--ease),opacity .2s var(--ease)}
.nav-toggle-mark span:first-child{top:0}
.nav-toggle-mark span:last-child{bottom:0}
.nav-toggle[aria-expanded="true"] .nav-toggle-mark span:first-child{transform:translateY(4px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] .nav-toggle-mark span:last-child{transform:translateY(-4px) rotate(-45deg)}
.site-nav{grid-area:nav;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-top:.3rem;border-top:1px solid var(--line-soft)}
.nav-list{display:flex;align-items:center;gap:.15rem;overflow-x:auto;scrollbar-width:none}
.nav-list::-webkit-scrollbar{display:none}
.nav-item{flex:none}
.nav-link{position:relative;display:inline-flex;align-items:center;gap:.45rem;padding:.5rem .7rem;border-radius:8px;font-size:var(--fs-14);font-weight:600;color:var(--rock);white-space:nowrap;transition:color .18s var(--ease),background-color .18s var(--ease)}
.nav-link:hover{color:var(--bone);background:rgba(22,35,58,.9)}
.nav-idx{font-family:var(--mono);font-size:var(--fs-10);font-weight:700;letter-spacing:.06em;color:var(--grid);transition:color .18s var(--ease)}
.nav-link:hover .nav-idx{color:var(--rock)}
.nav-link[aria-current="page"]{color:var(--bone);background:rgba(22,35,58,.95)}
.nav-link[aria-current="page"] .nav-idx{color:var(--clay)}
.nav-link[aria-current="page"]::before{content:"";position:absolute;left:.12rem;top:50%;width:5px;height:5px;margin-top:-2.5px;border-radius:50%;background:var(--neon);box-shadow:0 0 9px rgba(76,224,165,.9)}
.nav-link[aria-current="page"]::after{content:"";position:absolute;left:.7rem;right:.7rem;bottom:.16rem;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--clay),var(--flame))}
.nav-meta{flex:none;display:flex;align-items:center;gap:.5rem;font-family:var(--mono);font-size:var(--fs-10);letter-spacing:.12em;color:var(--rock);white-space:nowrap}
.nav-meta-key{padding:.16rem .45rem;border-radius:4px;background:rgba(76,224,165,.14);color:var(--neon);letter-spacing:.14em}
.head-progress{position:absolute;left:0;right:0;bottom:-1px;height:2px;background:rgba(62,76,99,.45)}
.head-progress-fill{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--clay),var(--flame) 55%,var(--neon));transition:width .12s linear}

/* ---------- 9. Footer ---------- */
.site-foot{position:relative;overflow:hidden;margin-top:clamp(2rem,5vw,4rem);padding:clamp(2.75rem,6vw,4.5rem) 0 clamp(1.5rem,3vw,2.25rem);background:linear-gradient(180deg,#0F1A2C 0%,#0A101C 100%);border-top:1px solid var(--line)}
.site-foot::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--clay) 0 14%,var(--flame) 14% 20%,var(--neon) 20% 23%,rgba(62,76,99,.7) 23% 100%)}
.foot-watermark{position:absolute;right:-.5rem;bottom:-1.2rem;z-index:0;font-family:var(--mono);font-weight:800;font-size:clamp(2.75rem,12vw,9rem);line-height:1;letter-spacing:-.04em;color:rgba(233,228,216,.035);pointer-events:none;user-select:none;white-space:nowrap}
.foot-shell{position:relative;z-index:1;width:min(100% - (var(--gutter) * 2), var(--shell));margin-inline:auto}
.foot-grid{display:grid;grid-template-columns:1.5fr repeat(3,minmax(0,1fr));gap:clamp(1.5rem,3vw,2.5rem)}
.foot-brand{max-width:34ch}
.foot-mark{display:inline-block;font-size:clamp(1.5rem,3vw,2rem);font-weight:900;letter-spacing:-.03em;color:var(--bone);border-bottom:3px solid var(--clay);padding-bottom:.15rem}
.foot-mark:hover{color:var(--flame);border-color:var(--flame)}
.foot-brand-line{margin-top:.85rem;font-family:var(--mono);font-size:var(--fs-12);letter-spacing:.06em;color:var(--rock)}
.foot-brand-note{margin-top:.6rem;font-size:var(--fs-14);line-height:1.7;color:var(--rock)}
.foot-col-title{margin-bottom:.85rem;font-family:var(--mono);font-size:var(--fs-12);font-weight:700;letter-spacing:.16em;color:var(--clay)}
.foot-list{display:flex;flex-direction:column;gap:.45rem}
.foot-link{display:inline-block;font-size:var(--fs-14);color:var(--rock);transition:color .18s var(--ease),transform .18s var(--ease)}
.foot-link:hover{color:var(--bone);transform:translateX(2px)}
.foot-contact{margin-top:clamp(2rem,4vw,3rem);padding-top:clamp(1.25rem,3vw,1.75rem);border-top:1px solid var(--line-soft)}
.foot-contact-title{margin-bottom:1rem;font-family:var(--mono);font-size:var(--fs-12);font-weight:700;letter-spacing:.16em;color:var(--clay)}
.foot-contact-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1rem 1.5rem}
.foot-contact-item{display:block}
.foot-contact-key{display:block;font-family:var(--mono);font-size:var(--fs-10);letter-spacing:.16em;color:var(--rock)}
.foot-contact-val{display:block;margin-top:.25rem;font-size:var(--fs-14);font-weight:600;color:var(--bone);word-break:break-all}
.copy-btn{margin-top:.5rem;padding:.24rem .6rem;border:1px solid rgba(62,76,99,.9);border-radius:999px;font-family:var(--mono);font-size:var(--fs-10);letter-spacing:.1em;color:var(--rock);transition:border-color .18s var(--ease),color .18s var(--ease)}
.copy-btn:hover{border-color:var(--clay);color:var(--flame)}
.copy-feedback{display:inline-block;margin-left:.5rem;min-height:1em;font-family:var(--mono);font-size:var(--fs-10);letter-spacing:.08em;color:var(--neon)}
.foot-note{margin-top:1rem;font-size:var(--fs-12);color:var(--rock)}
.foot-meta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.6rem 1.5rem;margin-top:clamp(1.5rem,3vw,2.25rem);padding-top:1rem;border-top:1px solid var(--line-soft)}
.foot-filing{font-family:var(--mono);font-size:var(--fs-12);letter-spacing:.06em;color:var(--rock)}
.foot-copy{font-size:var(--fs-12);color:var(--rock)}

/* ---------- 10. Grid ---------- */
.grid{display:grid;gap:clamp(1rem,2vw,1.5rem)}
.grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.grid--stagger>*:nth-child(even){margin-top:clamp(1rem,3vw,2.5rem)}

/* ---------- 11. Cards & callouts ---------- */
.card{position:relative;padding:clamp(1.1rem,2vw,1.5rem);border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(160deg,rgba(22,35,58,.92),rgba(16,27,46,.82))}
.card--data{clip-path:polygon(0 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%);border-radius:var(--radius) 0 var(--radius) var(--radius)}
.card-head{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;margin-bottom:.85rem}
.card-body{font-size:var(--fs-14);color:var(--rock)}
.card-foot{margin-top:1rem;padding-top:.8rem;border-top:1px solid var(--line-soft);font-family:var(--mono);font-size:var(--fs-12);color:var(--rock)}
.callout{padding:1rem 1.15rem;border-left:3px solid var(--neon);border-radius:0 var(--radius-sm) var(--radius-sm) 0;background:rgba(22,35,58,.7);color:var(--bone);font-size:var(--fs-14)}
.callout--clay{border-left-color:var(--clay)}

/* ---------- 12. Data blocks ---------- */
.data-table{font-size:var(--fs-14)}
.data-table caption{text-align:left;font-family:var(--mono);font-size:var(--fs-12);letter-spacing:.12em;color:var(--rock);padding-bottom:.6rem}
.data-table th{padding:.6rem .75rem;border-bottom:1px solid var(--grid);font-family:var(--mono);font-size:var(--fs-12);font-weight:700;letter-spacing:.1em;text-align:left;color:var(--rock);white-space:nowrap}
.data-table td{padding:.7rem .75rem;border-bottom:1px solid var(--line-soft);color:var(--bone);vertical-align:middle}
.data-table tbody tr:hover{background:rgba(22,35,58,.75)}
.data-table--rank td:first-child{font-family:var(--mono);font-weight:800;color:var(--clay)}
.stat{display:flex;flex-direction:column;gap:.2rem}
.stat-value{font-family:var(--mono);font-weight:800;font-size:clamp(1.5rem,3vw,var(--fs-28));line-height:1;color:var(--bone)}
.stat-label{font-size:var(--fs-12);color:var(--rock)}
.stat-delta{font-family:var(--mono);font-size:var(--fs-12);font-weight:700}
.stat--up .stat-delta{color:var(--neon)}
.stat--down .stat-delta{color:var(--clay)}
.tag{display:inline-flex;align-items:center;gap:.35rem;padding:.24rem .6rem;border:1px solid rgba(111,143,95,.5);border-radius:999px;background:rgba(111,143,95,.22);font-size:var(--fs-12);font-weight:600;color:var(--bone)}
.tag--clay{border-color:rgba(228,87,46,.5);background:rgba(228,87,46,.18);color:var(--flame)}
.tag--neon{border-color:rgba(76,224,165,.45);background:rgba(76,224,165,.14);color:var(--neon)}
.tag-list{display:flex;flex-wrap:wrap;gap:.4rem}

/* ---------- 13. Panels / filters / toc ---------- */
.panel-group{display:block}
.panel{border:1px solid var(--line);border-radius:var(--radius-sm);background:rgba(22,35,58,.55)}
.panel+.panel{margin-top:.6rem}
.panel-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;width:100%;padding:.9rem 1.05rem;font-size:var(--fs-14);font-weight:600;color:var(--bone);text-align:left}
.panel-head::after{content:"+";flex:none;font-family:var(--mono);font-size:var(--fs-16);color:var(--clay)}
.panel[data-open] .panel-head::after{content:"–";color:var(--neon)}
.panel-body{display:none;padding:0 1.05rem 1rem;font-size:var(--fs-14);color:var(--rock)}
.panel[data-open] .panel-body{display:block}
.filter-bar{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;padding:.4rem 0}
.filter-btn{padding:.35rem .8rem;border:1px solid rgba(62,76,99,.85);border-radius:999px;font-family:var(--mono);font-size:var(--fs-12);letter-spacing:.06em;color:var(--rock);transition:background-color .18s var(--ease),color .18s var(--ease),border-color .18s var(--ease)}
.filter-btn:hover{border-color:var(--flame);color:var(--bone)}
.filter-btn[aria-pressed="true"]{background:var(--clay);border-color:var(--clay);color:var(--ink-deep)}
.filter-count{font-family:var(--mono);font-size:var(--fs-12);color:var(--neon)}
.toc{position:sticky;top:calc(var(--head-h) + 1rem)}
.toc-list{display:flex;flex-direction:column;gap:.1rem;padding-left:.9rem;border-left:1px solid var(--line)}
.toc-list a{display:block;padding:.3rem 0;font-family:var(--mono);font-size:var(--fs-12);letter-spacing:.04em;color:var(--rock)}
.toc-list a:hover{color:var(--bone)}
.toc-list a[aria-current="true"]{color:var(--neon)}
.toc-list a[aria-current="true"]::before{content:"▸ ";color:var(--clay)}

/* ---------- 14. Breadcrumb ---------- */
.breadcrumb{padding:.9rem 0;border-bottom:1px solid var(--line-soft)}
.crumb-list{display:flex;flex-wrap:wrap;align-items:center;gap:.55rem;font-family:var(--mono);font-size:var(--fs-12);letter-spacing:.04em;color:var(--rock)}
.crumb-list li+li::before{content:"/";margin-right:.55rem;color:var(--grid)}
.crumb-list a:hover{color:var(--bone)}
.crumb-current{color:var(--bone);font-weight:700}

/* ---------- 15. Media ---------- */
.media{margin:0}
.media-frame{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(150deg,var(--slate),var(--night))}
.media-frame img{width:100%;height:100%;object-fit:cover}
.media-frame::after{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(62,76,99,.35) 1px,transparent 1px),linear-gradient(90deg,rgba(62,76,99,.35) 1px,transparent 1px);background-size:36px 36px;opacity:.55}
.media--16x9 .media-frame{aspect-ratio:16/9}
.media--4x3 .media-frame{aspect-ratio:4/3}
.media--1x1 .media-frame{aspect-ratio:1/1}
.media--wide .media-frame{aspect-ratio:21/9}
.media--tilt .media-frame{clip-path:polygon(0 0,100% 5%,100% 100%,0 95%)}
.media-overlay{position:absolute;left:0;right:0;bottom:0;z-index:1;padding:1rem;background:linear-gradient(0deg,rgba(11,18,32,.94),rgba(11,18,32,0))}
.media-caption{margin-top:.6rem;font-size:var(--fs-12);color:var(--rock)}

/* ---------- 16. Slant edges ---------- */
.slant--top{clip-path:polygon(0 2.25rem,100% 0,100% 100%,0 100%)}
.slant--bottom{clip-path:polygon(0 0,100% 0,100% calc(100% - 2.25rem),0 100%)}

/* ---------- 17. Motion ---------- */
@keyframes revealIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@supports (animation-timeline: view()){
  @media (prefers-reduced-motion: no-preference){
    [data-reveal]{animation:revealIn 1ms linear both;animation-timeline:view();animation-range:entry 5% cover 28%}
  }
}

/* ---------- 18. Responsive ---------- */
@media (max-width:1180px){
  .head-note{display:none}
}
@media (max-width:1024px){
  .head-search{display:none}
  .grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid--stagger>*:nth-child(even){margin-top:1.25rem}
}
@media (max-width:900px){
  :root{--head-h:4.9rem}
  .grid--3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .foot-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .toc{position:static}
  .toc-list{flex-direction:row;flex-wrap:wrap;gap:.2rem .9rem;padding-left:0;padding-top:.5rem;border-left:0;border-top:1px solid var(--line)}
}
@media (max-width:860px){
  .head-inner{
    grid-template-columns:1fr auto;
    grid-template-areas:
      "brand actions"
      "nav nav";
    gap:.4rem 1rem;
    padding:.55rem 0 .3rem;
  }
  .head-utility{display:none}
  .nav-toggle{display:inline-flex}
  .site-nav{display:none;justify-content:flex-start;margin-top:.35rem;padding-top:.5rem;max-height:min(70vh,520px);overflow-y:auto}
  .site-nav[data-open]{display:block;animation:revealIn .2s var(--ease) both}
  .nav-list{flex-direction:column;align-items:stretch;gap:0;overflow:visible}
  .nav-link{width:100%;padding:.8rem .65rem;border-radius:8px;font-size:var(--fs-16)}
  .nav-link+.nav-link{margin-top:2px}
  .nav-link[aria-current="page"]::after{left:.65rem;right:auto;width:24px;bottom:.28rem}
  .nav-meta{margin-top:.7rem;padding-top:.7rem;border-top:1px solid var(--line-soft)}
  .head-search{display:none}
}
@media (max-width:640px){
  :root{
    --fs-40:2rem;
    --fs-64:2.75rem;
    --fs-88:3.25rem;
    --radius:14px;
  }
  .head-cta{display:none}
  .brand-line{display:none}
  .grid--2,.grid--3,.grid--4{grid-template-columns:minmax(0,1fr)}
  .grid--stagger>*:nth-child(even){margin-top:0}
  .foot-grid{grid-template-columns:minmax(0,1fr);gap:1.6rem}
  .foot-meta{flex-direction:column;align-items:flex-start}
  .data-table{font-size:var(--fs-12)}
  .data-table th,.data-table td{padding:.55rem .5rem}
  .slant--top{clip-path:polygon(0 1.25rem,100% 0,100% 100%,0 100%)}
  .slant--bottom{clip-path:polygon(0 0,100% 0,100% calc(100% - 1.25rem),0 100%)}
}

/* ---------- 19. Reduced motion ---------- */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
  .pulse{animation:none;box-shadow:0 0 0 3px rgba(76,224,165,.28)}
  [data-reveal]{animation:none !important;opacity:1 !important;transform:none !important}
}
@media (prefers-reduced-motion: no-preference){
  html{scroll-behavior:smooth}
}
