/* =========================================================
   大江赛场 · 共享站点包 /assets/site.css
   轨道记分牌外壳 + 展览画册式内容基础组件
   ========================================================= */

/* ---------- 1. RESET ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth}
body,h1,h2,h3,h4,h5,h6,p,figure,blockquote,dl,dd,ul,ol,fieldset{margin:0;padding:0}
ul,ol{list-style:none}
img,svg,video{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0}
table{border-collapse:collapse;width:100%}
main{display:block}
[id]{scroll-margin-top:calc(var(--dk-topbar-h) + 16px)}

/* ---------- 2. TOKENS ---------- */
:root{
  --dk-snow:#DCEFEF;
  --dk-teal:#2F6F6C;
  --dk-ink:#0E2F2E;
  --dk-sand:#E7C9A9;
  --dk-sand-deep:#9A6642;
  --dk-orange:#FF5A1F;
  --dk-lime:#B6FF3B;
  --dk-paper:#F7F5EF;
  --dk-char:#171A1A;
  --dk-slate:#5D6B6A;

  --dk-rail-w:248px;
  --dk-topbar-h:64px;

  --dk-shadow:6px 6px 0 rgba(14,47,46,.92);
  --dk-shadow-soft:6px 6px 0 rgba(14,47,46,.16);
  --dk-ease:180ms cubic-bezier(.2,.7,.3,1);

  --dk-font-display:"DIN Condensed","Barlow Condensed","Oswald","Noto Sans SC","Source Han Sans SC","Microsoft YaHei",sans-serif;
  --dk-font-body:"Noto Sans SC","Source Han Sans SC","Microsoft YaHei","PingFang SC","Hiragino Sans GB",sans-serif;
  --dk-font-mono:"IBM Plex Mono","JetBrains Mono",SFMono-Regular,Consolas,"Courier New",monospace;
}

/* ---------- 3. BASE / 中文排版 ---------- */
body{
  margin:0;
  min-height:100vh;
  padding-left:var(--dk-rail-w);
  padding-top:var(--dk-topbar-h);
  background:var(--dk-paper);
  color:var(--dk-ink);
  font-family:var(--dk-font-body);
  font-size:17px;
  line-height:1.75;
  letter-spacing:.01em;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
h1,h2,h3,h4,h5,h6{
  font-family:var(--dk-font-display);
  font-weight:700;
  line-height:1.12;
  letter-spacing:-.005em;
  text-wrap:balance;
}
h1{font-size:clamp(38px,6vw,72px)}
h2{font-size:clamp(28px,4vw,48px)}
h3{font-size:clamp(20px,2.4vw,28px)}
h4{font-size:clamp(17px,1.8vw,20px)}
strong,b{font-weight:700}
small{font-size:12px}
.dk-prose p,.dk-prose li{max-width:46em}
.dk-prose p+p{margin-top:.9em}

/* ---------- 4. 焦点 ---------- */
:where(a,button,input,summary,[tabindex]):focus-visible{
  outline:3px solid var(--dk-lime);
  outline-offset:1px;
  box-shadow:0 0 0 4px var(--dk-ink);
}
.dk-skip:focus{
  outline:3px solid var(--dk-ink);
  outline-offset:2px;
  box-shadow:none;
}

/* ---------- 5. 通用工具 ---------- */
.dk-sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);
  white-space:nowrap;border:0;
}
.dk-mono{
  font-family:var(--dk-font-mono);
  font-size:12px;letter-spacing:.1em;color:var(--dk-slate);
}
.dk-container{
  width:100%;max-width:1240px;margin-inline:auto;
  padding-inline:clamp(18px,3.2vw,44px);
}
.dk-rule{
  height:2px;border:0;background:var(--dk-ink);
  margin-block:clamp(20px,3vw,36px);
}

/* ---------- 6. 跳转链接 ---------- */
.dk-skip{
  position:fixed;top:10px;left:10px;z-index:300;
  display:inline-flex;align-items:center;
  padding:10px 18px;
  font-family:var(--dk-font-mono);font-size:12px;letter-spacing:.12em;
  background:var(--dk-lime);color:var(--dk-ink);
  border:2px solid var(--dk-ink);
  box-shadow:4px 4px 0 var(--dk-ink);
  transform:translateY(-240%);
  transition:transform var(--dk-ease);
}
.dk-skip:focus{transform:translateY(0)}

/* ---------- 7. HEADER 外壳 ---------- */
.dk-header{position:static}

/* 顶部状态条 */
.dk-topbar{
  position:fixed;top:0;left:var(--dk-rail-w);right:0;
  height:var(--dk-topbar-h);
  z-index:100;
  display:flex;align-items:center;gap:clamp(10px,1.4vw,18px);
  padding-inline:clamp(14px,2.4vw,32px);
  background:var(--dk-paper);
  border-bottom:2px solid var(--dk-ink);
}
.dk-progress{
  position:absolute;left:0;bottom:-2px;height:3px;width:0;
  background:var(--dk-orange);
  z-index:3;pointer-events:none;
}
.dk-topbar__brand{
  display:none;align-items:center;gap:8px;
  font-family:var(--dk-font-display);
  font-size:20px;font-weight:700;letter-spacing:.06em;
  color:var(--dk-ink);
}
.dk-topbar__brandmark{
  display:grid;place-items:center;
  width:28px;height:28px;
  background:var(--dk-lime);color:var(--dk-ink);
  border:2px solid var(--dk-ink);
  font-family:var(--dk-font-mono);
  font-size:11px;font-weight:700;letter-spacing:.04em;
}

/* 检索 */
.dk-search{
  position:relative;
  flex:1 1 auto;min-width:0;max-width:420px;
}
.dk-search__input{
  width:100%;height:38px;
  padding:0 12px 0 34px;
  font-family:var(--dk-font-mono);
  font-size:12px;letter-spacing:.04em;
  color:var(--dk-ink);
  background:var(--dk-snow);
  border:2px solid var(--dk-ink);
  border-radius:0;
  box-shadow:3px 3px 0 rgba(14,47,46,.18);
  appearance:none;
  transition:background var(--dk-ease),box-shadow var(--dk-ease),border-color var(--dk-ease);
}
.dk-search__input::placeholder{color:var(--dk-slate);opacity:1}
.dk-search__input:hover{background:#eaf5f5}
.dk-search::before{
  content:"";position:absolute;left:12px;top:50%;
  width:9px;height:9px;margin-top:-7px;
  border:2px solid var(--dk-teal);border-radius:50%;
  pointer-events:none;z-index:2;
}
.dk-search::after{
  content:"";position:absolute;left:21px;top:50%;margin-top:2px;
  width:6px;height:2px;background:var(--dk-teal);
  transform:rotate(45deg);
  pointer-events:none;z-index:2;
}
.dk-search__panel{
  position:absolute;left:0;right:0;top:calc(100% + 8px);
  z-index:130;
  padding:10px;
  background:var(--dk-paper);
  border:2px solid var(--dk-ink);
  box-shadow:var(--dk-shadow);
}
.dk-search__panel[hidden]{display:none}
.dk-search__hint{
  margin-bottom:8px;
  font-family:var(--dk-font-mono);
  font-size:10px;letter-spacing:.1em;line-height:1.5;
  color:var(--dk-slate);text-transform:uppercase;
}
.dk-search__list{display:grid;gap:2px}
.dk-search__item[hidden]{display:none}
.dk-search__item a{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:8px 10px;
  font-size:14px;font-weight:600;
  color:var(--dk-ink);
  border-left:3px solid transparent;
  transition:background var(--dk-ease),border-color var(--dk-ease),color var(--dk-ease);
}
.dk-search__item a:hover,.dk-search__item a:focus-visible{
  background:var(--dk-snow);
  border-left-color:var(--dk-orange);
  color:var(--dk-teal);
}
.dk-search__key{
  font-family:var(--dk-font-mono);
  font-size:11px;letter-spacing:.1em;color:var(--dk-slate);
}

/* 状态与行动 */
.dk-topbar__status{
  display:flex;align-items:center;gap:8px;
  margin-left:auto;
  font-family:var(--dk-font-mono);
  font-size:11px;letter-spacing:.08em;
  color:var(--dk-slate);white-space:nowrap;
}
.dk-topbar__status strong{
  color:var(--dk-ink);font-weight:700;letter-spacing:.06em;
}
.dk-cta{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:40px;padding:0 16px;
  background:var(--dk-orange);color:var(--dk-ink);
  font-family:var(--dk-font-body);font-size:14px;font-weight:700;letter-spacing:.04em;
  border:2px solid var(--dk-ink);
  box-shadow:4px 4px 0 var(--dk-ink);
  white-space:nowrap;
  transition:transform var(--dk-ease),box-shadow var(--dk-ease),background var(--dk-ease);
}
.dk-cta:hover{transform:translate(-1px,-1px);box-shadow:6px 6px 0 var(--dk-ink);background:#ff7440}
.dk-cta:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--dk-ink)}
.dk-cta--drawer{display:none}

/* 移动导航按钮 */
.dk-navtoggle{
  display:none;align-items:center;gap:8px;
  min-height:40px;padding:0 12px;
  background:var(--dk-ink);color:var(--dk-paper);
  border:2px solid var(--dk-ink);
  font-family:var(--dk-font-mono);
  font-size:11px;letter-spacing:.14em;
  cursor:pointer;
  transition:background var(--dk-ease),color var(--dk-ease);
}
.dk-navtoggle:hover{background:var(--dk-teal)}
.dk-navtoggle__bars{
  width:18px;height:12px;flex:0 0 auto;
  background:
    linear-gradient(var(--dk-lime),var(--dk-lime)) 0 0/100% 2px no-repeat,
    linear-gradient(var(--dk-lime),var(--dk-lime)) 0 5px/100% 2px no-repeat,
    linear-gradient(var(--dk-lime),var(--dk-lime)) 0 10px/100% 2px no-repeat;
  transition:background var(--dk-ease);
}
.dk-navtoggle__text{line-height:1}
.dk-header[data-open] .dk-navtoggle{background:var(--dk-orange);color:var(--dk-ink)}
.dk-header[data-open] .dk-navtoggle__bars{
  background:
    linear-gradient(var(--dk-ink),var(--dk-ink)) 0 5px/100% 2px no-repeat;
}

/* ---------- 8. 纵向记分牌轨道 ---------- */
.dk-nav{
  position:fixed;top:0;left:0;bottom:0;
  width:var(--dk-rail-w);
  z-index:110;
  display:flex;flex-direction:column;
  padding:22px 0 18px;
  overflow-y:auto;
  overscroll-behavior:contain;
  color:var(--dk-snow);
  background-color:var(--dk-ink);
  background-image:repeating-linear-gradient(180deg,rgba(220,239,239,.05) 0 1px,transparent 1px 10px);
  border-right:2px solid var(--dk-ink);
}
.dk-nav::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:110px;
  background:rgba(47,111,108,.55);
  clip-path:polygon(0 66%,16% 44%,30% 58%,46% 26%,62% 54%,76% 38%,100% 62%,100% 100%,0 100%);
  opacity:.55;pointer-events:none;z-index:0;
}
.dk-rail__head{position:relative;z-index:1;padding:0 18px 18px;border-bottom:1px solid rgba(220,239,239,.16)}
.dk-brand{display:flex;align-items:center;gap:12px}
.dk-brand__mark{
  display:grid;place-items:center;flex:0 0 auto;
  width:44px;height:44px;
  background:var(--dk-lime);color:var(--dk-ink);
  border:2px solid var(--dk-ink);
  box-shadow:3px 3px 0 rgba(255,90,31,.9);
  font-family:var(--dk-font-display);
  font-size:19px;font-weight:700;letter-spacing:.02em;
}
.dk-brand__text{display:block;min-width:0}
.dk-brand__cn{
  display:block;
  font-family:var(--dk-font-display);
  font-size:24px;line-height:1.05;font-weight:700;letter-spacing:.08em;
  color:var(--dk-paper);
}
.dk-brand__en{
  display:block;margin-top:3px;
  font-family:var(--dk-font-mono);
  font-size:9.5px;letter-spacing:.16em;
  color:var(--dk-lime);
}
.dk-rail__label{
  position:relative;z-index:1;
  padding:16px 18px 6px;
  font-family:var(--dk-font-mono);
  font-size:10px;letter-spacing:.2em;
  color:rgba(220,239,239,.55);
  text-transform:uppercase;
}
.dk-nav__list{position:relative;z-index:1;display:flex;flex-direction:column;padding:4px 0 10px}
.dk-nav__item{display:block}
.dk-nav__link{
  display:grid;grid-template-columns:30px 1fr 10px;align-items:center;gap:10px;
  padding:13px 16px 13px 18px;
  color:var(--dk-snow);
  border-left:4px solid transparent;
  transition:background var(--dk-ease),border-color var(--dk-ease),transform var(--dk-ease),color var(--dk-ease);
}
.dk-nav__num{
  font-family:var(--dk-font-mono);
  font-size:11px;letter-spacing:.1em;
  color:rgba(220,239,239,.5);
  transition:color var(--dk-ease);
}
.dk-nav__label{
  font-size:16px;font-weight:600;letter-spacing:.03em;line-height:1.3;
}
.dk-nav__dot{
  justify-self:end;
  width:8px;height:8px;border-radius:50%;
  background:rgba(220,239,239,.22);
  transition:background var(--dk-ease),box-shadow var(--dk-ease);
}
.dk-nav__link:hover{
  background:rgba(47,111,108,.6);
  border-left-color:var(--dk-orange);
  transform:translateX(2px);
}
.dk-nav__link:hover .dk-nav__num{color:var(--dk-sand)}
.dk-nav__link:hover .dk-nav__dot{background:var(--dk-orange)}
.dk-nav__link[aria-current="page"]{
  background:rgba(182,255,59,.12);
  border-left-color:var(--dk-lime);
  color:#fff;
}
.dk-nav__link[aria-current="page"] .dk-nav__num{color:var(--dk-orange)}
.dk-nav__link[aria-current="page"] .dk-nav__label::after{
  content:"当前";
  margin-left:10px;
  font-family:var(--dk-font-mono);
  font-size:10px;letter-spacing:.14em;
  color:var(--dk-lime);
  vertical-align:2px;
}
.dk-nav__link[aria-current="page"] .dk-nav__dot{
  background:var(--dk-lime);
  box-shadow:0 0 0 3px rgba(182,255,59,.22);
}
.dk-rail__foot{
  position:relative;z-index:1;
  margin-top:auto;
  display:flex;flex-direction:column;gap:8px;
  padding:16px 18px 4px;
  border-top:1px solid rgba(220,239,239,.16);
}
.dk-live{
  display:flex;align-items:center;gap:8px;
  font-family:var(--dk-font-mono);
  font-size:11px;letter-spacing:.12em;
  color:var(--dk-lime);text-transform:uppercase;
}
.dk-live__dot{
  flex:0 0 auto;
  width:8px;height:8px;border-radius:50%;
  background:var(--dk-lime);
  box-shadow:0 0 0 3px rgba(182,255,59,.2);
  animation:dk-pulse 2.6s ease-in-out infinite;
}
@keyframes dk-pulse{
  0%,100%{box-shadow:0 0 0 3px rgba(182,255,59,.22)}
  50%{box-shadow:0 0 0 7px rgba(182,255,59,0)}
}
.dk-rail__meta{
  font-family:var(--dk-font-mono);
  font-size:10.5px;letter-spacing:.08em;
  color:rgba(220,239,239,.6);line-height:1.6;
}

/* ---------- 9. FOOTER ---------- */
.dk-footer{
  position:relative;
  margin-top:clamp(48px,7vw,96px);
  background:var(--dk-ink);
  color:var(--dk-snow);
  border-top:6px solid var(--dk-lime);
}
.dk-footer__inner{
  max-width:1240px;margin-inline:auto;
  padding:clamp(30px,4vw,56px) clamp(18px,3.2vw,44px) 22px;
}
.dk-footer__grid{
  display:grid;
  grid-template-columns:1.5fr 1fr 1.3fr 1fr;
  gap:clamp(20px,3vw,40px);
}
.dk-footer__col{
  display:grid;gap:12px;align-content:start;
  padding-top:14px;
  border-top:2px solid rgba(220,239,239,.22);
}
.dk-footer__col--brand{gap:8px}
.dk-footer__brand{display:flex;align-items:center;gap:10px}
.dk-footer__mark{
  display:grid;place-items:center;
  width:38px;height:38px;
  background:var(--dk-lime);color:var(--dk-ink);
  border:2px solid var(--dk-paper);
  box-shadow:3px 3px 0 var(--dk-orange);
  font-family:var(--dk-font-display);
  font-size:16px;font-weight:700;letter-spacing:.02em;
}
.dk-footer__name{
  font-family:var(--dk-font-display);
  font-size:24px;font-weight:700;letter-spacing:.08em;
  color:var(--dk-paper);
}
.dk-footer__tagline{
  font-size:13.5px;line-height:1.7;color:rgba(220,239,239,.82);max-width:24em;
}
.dk-footer__meta{
  font-family:var(--dk-font-mono);
  font-size:11px;letter-spacing:.08em;line-height:1.7;
  color:rgba(220,239,239,.58);
}
.dk-footer__title{
  font-family:var(--dk-font-mono);
  font-size:11px;font-weight:600;letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--dk-lime);
}
.dk-footer__links{display:grid;gap:2px}
.dk-footer__link{
  display:inline-flex;align-items:baseline;gap:10px;
  padding:5px 0;
  font-size:14px;
  color:var(--dk-snow);
  border-bottom:2px solid transparent;
  transition:color var(--dk-ease),border-color var(--dk-ease),transform var(--dk-ease);
}
.dk-footer__link:hover{
  color:var(--dk-lime);
  border-bottom-color:var(--dk-orange);
  transform:translateX(2px);
}
.dk-footer__idx{
  font-family:var(--dk-font-mono);
  font-size:10px;letter-spacing:.12em;
  color:rgba(220,239,239,.5);
  min-width:2.4em;
}
.dk-footer__item{
  display:flex;align-items:baseline;gap:10px;
  padding:5px 0;font-size:14px;line-height:1.6;
}
.dk-footer__value{
  font-family:var(--dk-font-mono);
  font-size:12.5px;letter-spacing:.02em;
  color:var(--dk-snow);
  word-break:break-word;
}
.dk-footer__note{
  font-size:12px;line-height:1.7;
  color:rgba(220,239,239,.62);
  max-width:32em;
  border-left:3px solid var(--dk-teal);
  padding-left:10px;
}
.dk-footer__bottom{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:10px 26px;
  margin-top:clamp(24px,4vw,44px);
  padding-top:18px;
  border-top:2px solid rgba(220,239,239,.22);
}
.dk-footer__copy{
  font-family:var(--dk-font-mono);
  font-size:11px;letter-spacing:.12em;
  color:rgba(220,239,239,.8);
}

/* ---------- 10. 内容基础组件 ---------- */
.dk-section{
  padding-block:clamp(40px,6vw,88px);
  border-top:2px solid rgba(14,47,46,.14);
}
.dk-section--snow{background:var(--dk-snow);border-top-color:rgba(14,47,46,.18)}
.dk-section--sand{background:var(--dk-sand);border-top-color:rgba(154,102,66,.4)}
.dk-section--ink{background:var(--dk-ink);color:var(--dk-snow);border-top-color:rgba(220,239,239,.22)}
.dk-section--ink .dk-lede{color:rgba(220,239,239,.78)}
.dk-section--ink .dk-eyebrow{color:var(--dk-lime)}
.dk-section--ink .dk-title{color:var(--dk-paper)}
.dk-section__head{
  display:grid;gap:10px;
  max-width:66ch;
  margin-bottom:clamp(20px,3vw,36px);
}
.dk-eyebrow{
  display:flex;align-items:center;gap:10px;
  font-family:var(--dk-font-mono);
  font-size:12px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--dk-teal);
}
.dk-eyebrow::before{
  content:"";flex:0 0 auto;
  width:28px;height:2px;background:var(--dk-orange);
}
.dk-title{
  font-family:var(--dk-font-display);
  font-size:clamp(28px,4vw,48px);
  line-height:1.06;letter-spacing:-.01em;
  color:var(--dk-ink);
}
.dk-lede{
  font-size:17px;line-height:1.75;
  color:var(--dk-slate);
  max-width:44ch;
}
.dk-grid{
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:clamp(16px,2.2vw,28px);
}
.dk-col-4{grid-column:span 4}
.dk-col-5{grid-column:span 5}
.dk-col-6{grid-column:span 6}
.dk-col-7{grid-column:span 7}
.dk-col-8{grid-column:span 8}
.dk-col-12{grid-column:span 12}

.dk-panel{
  display:grid;gap:12px;align-content:start;
  padding:clamp(16px,2.4vw,26px);
  background:var(--dk-paper);
  border:2px solid var(--dk-ink);
  box-shadow:var(--dk-shadow-soft);
  transition:transform var(--dk-ease),box-shadow var(--dk-ease),border-color var(--dk-ease);
}
.dk-panel:hover{
  transform:translateY(-2px);
  border-color:var(--dk-orange);
  box-shadow:var(--dk-shadow);
}
.dk-panel--ink{
  background:var(--dk-ink);color:var(--dk-snow);
  box-shadow:6px 6px 0 var(--dk-teal);
}
.dk-panel--accent{
  border-color:var(--dk-orange);
  box-shadow:6px 6px 0 rgba(255,90,31,.32);
}
.dk-panel__head{
  display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  padding-bottom:10px;
  border-bottom:2px solid rgba(14,47,46,.16);
  font-family:var(--dk-font-mono);
  font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--dk-teal);
}
.dk-panel--ink .dk-panel__head{
  border-bottom-color:rgba(220,239,239,.24);
  color:var(--dk-lime);
}
.dk-stat{display:grid;gap:2px}
.dk-stat__num{
  font-family:var(--dk-font-display);
  font-size:clamp(38px,6vw,64px);
  line-height:.95;letter-spacing:-.02em;
  color:var(--dk-ink);
  font-variant-numeric:tabular-nums;
}
.dk-panel--ink .dk-stat__num{color:var(--dk-lime)}
.dk-stat__label{
  font-family:var(--dk-font-mono);
  font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--dk-slate);
}
.dk-panel--ink .dk-stat__label{color:rgba(220,239,239,.7)}

.dk-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:44px;padding:0 20px;
  background:var(--dk-ink);color:var(--dk-paper);
  border:2px solid var(--dk-ink);
  box-shadow:4px 4px 0 rgba(14,47,46,.26);
  font-size:15px;font-weight:700;letter-spacing:.04em;
  cursor:pointer;
  transition:transform var(--dk-ease),box-shadow var(--dk-ease),background var(--dk-ease),color var(--dk-ease);
}
.dk-btn:hover{transform:translate(-1px,-1px);box-shadow:6px 6px 0 rgba(14,47,46,.34)}
.dk-btn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 rgba(14,47,46,.34)}
.dk-btn--accent{background:var(--dk-orange);color:var(--dk-ink);box-shadow:4px 4px 0 var(--dk-ink)}
.dk-btn--ghost{background:transparent;color:var(--dk-ink);box-shadow:none}
.dk-btn--ghost:hover{background:var(--dk-snow);box-shadow:4px 4px 0 rgba(14,47,46,.2)}

.dk-tag{
  display:inline-flex;align-items:center;gap:6px;
  padding:3px 9px;
  font-family:var(--dk-font-mono);
  font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  background:var(--dk-snow);color:var(--dk-teal);
  border:2px solid var(--dk-teal);
}
.dk-tag--live{background:var(--dk-lime);color:var(--dk-ink);border-color:var(--dk-ink)}
.dk-tag--hot{background:var(--dk-orange);color:var(--dk-ink);border-color:var(--dk-ink)}

.dk-breadcrumb{
  display:flex;flex-wrap:wrap;align-items:center;
  padding-block:14px;
  font-family:var(--dk-font-mono);
  font-size:11.5px;letter-spacing:.08em;
  color:var(--dk-slate);
}
.dk-breadcrumb li{display:inline-flex;align-items:center}
.dk-breadcrumb li+li::before{
  content:"/";margin-inline:8px;color:var(--dk-sand-deep);
}
.dk-breadcrumb a{
  color:var(--dk-teal);
  border-bottom:1px solid rgba(47,111,108,.45);
  transition:color var(--dk-ease),border-color var(--dk-ease);
}
.dk-breadcrumb a:hover{color:var(--dk-orange);border-bottom-color:var(--dk-orange)}

/* 图片容器基础规则 */
.dk-media{
  position:relative;display:block;overflow:hidden;
  aspect-ratio:16/9;
  background:var(--dk-snow);
  border:2px solid var(--dk-ink);
  box-shadow:var(--dk-shadow);
  transition:box-shadow var(--dk-ease),transform var(--dk-ease);
}
.dk-media:hover{transform:translateY(-2px);box-shadow:8px 8px 0 rgba(14,47,46,.92)}
.dk-media img,.dk-media video{
  display:block;width:100%;height:100%;object-fit:cover;
}
.dk-media--wide{aspect-ratio:21/9}
.dk-media--tall{aspect-ratio:3/4}
.dk-media--square{aspect-ratio:1/1}
.dk-media--empty{
  background-image:repeating-linear-gradient(45deg,rgba(47,111,108,.16) 0 10px,transparent 10px 20px);
}
.dk-media__cap{
  position:absolute;left:0;right:0;bottom:0;
  padding:10px 12px;
  background:linear-gradient(180deg,rgba(23,26,26,0) 0%,rgba(23,26,26,.82) 100%);
  color:var(--dk-paper);
  font-family:var(--dk-font-mono);
  font-size:11px;letter-spacing:.08em;line-height:1.5;
}

/* 回到顶部（JS 注入） */
.dk-totop{
  position:fixed;right:16px;bottom:16px;z-index:120;
  display:inline-flex;align-items:center;gap:8px;
  min-height:44px;padding:0 14px;
  background:var(--dk-ink);color:var(--dk-paper);
  border:2px solid var(--dk-lime);
  box-shadow:4px 4px 0 rgba(14,47,46,.34);
  font-family:var(--dk-font-mono);
  font-size:11px;letter-spacing:.14em;
  cursor:pointer;
  opacity:0;visibility:hidden;transform:translateY(10px);
  transition:opacity var(--dk-ease),transform var(--dk-ease),visibility var(--dk-ease);
}
.dk-totop[data-visible]{opacity:1;visibility:visible;transform:none}

/* 显现动效协议 */
.dk-motion [data-reveal]{
  opacity:0;transform:translateY(14px);
  transition:opacity .5s var(--dk-ease),transform .5s var(--dk-ease);
}
.dk-motion [data-reveal][data-reveal-in]{opacity:1;transform:none}

/* ---------- 11. 响应式 ---------- */
@media (max-width:1180px){
  :root{--dk-rail-w:224px}
  .dk-topbar__status{display:none}
  .dk-search{max-width:none}
}

@media (max-width:900px){
  :root{--dk-rail-w:0px;--dk-topbar-h:104px}

  body{padding-left:0;padding-top:var(--dk-topbar-h)}

  .dk-topbar{
    left:0;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-rows:36px 44px;
    grid-template-areas:
      "brand toggle"
      "search search";
    gap:8px 12px;
    height:var(--dk-topbar-h);
    padding:8px 14px;
    align-content:center;
  }
  .dk-topbar__brand{grid-area:brand;display:inline-flex}
  .dk-navtoggle{grid-area:toggle;display:inline-flex;justify-self:end;min-height:36px}
  .dk-search{grid-area:search;max-width:none}
  .dk-search__input{height:44px}
  .dk-topbar__status{display:none}
  .dk-topbar > .dk-cta{display:none}

  /* 抽屉 */
  .dk-nav{
    top:var(--dk-topbar-h);
    width:min(86vw,330px);
    transform:translateX(-102%);
    transition:transform 220ms cubic-bezier(.2,.7,.3,1);
    border-right:2px solid var(--dk-lime);
    box-shadow:10px 0 0 rgba(14,47,46,.18);
    z-index:110;
  }
  .dk-header[data-open] .dk-nav{transform:translateX(0)}
  .dk-rail__head{display:none}
  .dk-rail__foot{padding-bottom:18px}
  .dk-cta--drawer{display:inline-flex;margin-top:12px;align-self:start}

  /* 遮罩 */
  .dk-header::after{
    content:"";position:fixed;left:0;right:0;bottom:0;top:var(--dk-topbar-h);
    background:rgba(14,47,46,.42);
    opacity:0;visibility:hidden;
    transition:opacity var(--dk-ease),visibility var(--dk-ease);
    z-index:95;
  }
  .dk-header[data-open]::after{opacity:1;visibility:visible}

  .dk-col-4,.dk-col-5,.dk-col-6,.dk-col-7,.dk-col-8{grid-column:span 12}
  .dk-footer__grid{grid-template-columns:1fr 1fr}
  .dk-footer__bottom{justify-content:flex-start}
  .dk-totop{right:12px;bottom:12px}
}

@media (max-width:620px){
  body{font-size:16px}
  .dk-footer__grid{grid-template-columns:1fr;gap:22px}
  .dk-search__panel{box-shadow:4px 4px 0 rgba(14,47,46,.9)}
  .dk-nav__link{padding-block:12px}
  .dk-media{box-shadow:4px 4px 0 rgba(14,47,46,.92)}
}

@media (max-width:380px){
  .dk-topbar__brand{font-size:17px}
  .dk-topbar__brandmark{width:24px;height:24px;font-size:10px}
}

/* ---------- 12. 动效降级 ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  .dk-motion [data-reveal]{opacity:1;transform:none;transition:none}
  .dk-nav__link:hover,.dk-footer__link:hover,.dk-panel:hover,.dk-media:hover,.dk-cta:hover,.dk-btn:hover{transform:none}
}