/* ====================================================
   黑丝射鞋网 · 暗夜霓虹门户
   品牌色: #c1003a / #7b2ff7 / #0d0d0d
   ==================================================== */

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;700;900&display=swap');

:root {
  --cr: #c1003a;
  --cp: #7b2ff7;
  --cb: #0d0d0d;
  --cs: #111118;
  --ccard: #1a1a24;
  --cedge: #2a2a3a;
  --ct: #e8e8f0;
  --cm: #888899;
  --gred: 0 0 18px rgba(193,0,58,.5);
  --gpurp: 0 0 18px rgba(123,47,247,.5);
  --vg: linear-gradient(135deg,var(--cr),var(--cp));
  --ff: 'Noto Sans SC',system-ui,-apple-system,sans-serif;
  --mw: 1140px;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;color-scheme:dark}

body{
  background:var(--cb);
  color:var(--ct);
  font-family:var(--ff);
  font-size:16px;
  line-height:1.7;
  min-block-size:100vh;
  display:grid;
  grid-template-rows:auto 1fr auto;
  isolation:isolate;
}

a{color:var(--cr);text-decoration:none}
a:hover{color:var(--cp);text-decoration:underline}
img{max-inline-size:100%;block-size:auto;display:block;object-fit:cover}
ul,ol{list-style:none}

/* ── 顶栏 ── */
[data-zone="bar"]{
  background:rgba(13,13,13,.96) url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'/>") no-repeat;
  border-block-end:1px solid var(--cedge);
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
  position:sticky;
  inset-block-start:0;
  z-index:100;
  will-change:transform;
}

[data-zone="bar"] > [data-inner]{
  max-inline-size:var(--mw);
  margin-inline:auto;
  padding-inline:20px;
  display:flex;
  align-items:center;
  column-gap:24px;
  block-size:56px;
}

[data-zone="bar"] [data-brand]{
  display:inline-flex;
  align-items:center;
  gap:10px;
  text-decoration:none;
  flex-shrink:0;
}

[data-zone="bar"] [data-brand] img{
  inline-size:32px;
  block-size:32px;
  border-radius:4px;
  aspect-ratio:1/1;
}

[data-zone="bar"] [data-brandname]{
  font-size:17px;
  font-weight:900;
  background:var(--vg);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
  white-space:nowrap;
}

[data-zone="bar"] [data-nav] ul{
  display:flex;
  align-items:center;
  gap:4px;
  overflow-x:auto;
  overflow-y:hidden;
  scrollbar-width:none;
}
[data-zone="bar"] [data-nav] ul::-webkit-scrollbar{display:none}

[data-zone="bar"] [data-nav] li{list-style:none}

[data-zone="bar"] [data-nav] a{
  color:var(--cm);
  font-size:14px;
  font-weight:700;
  padding-block:8px;
  padding-inline:14px;
  border-radius:6px;
  white-space:nowrap;
  min-block-size:40px;
  display:inline-flex;
  align-items:center;
  transition:color .2s,background .2s;
  text-decoration:none;
}

[data-zone="bar"] [data-nav] a:hover,
[data-zone="bar"] [data-nav] a[aria-current]{
  color:var(--ct);
  background:var(--ccard);
  text-decoration:none;
}
[data-zone="bar"] [data-nav] a[aria-current]{color:var(--cr)}

/* ── 主内容区 ── */
[data-zone="stage"]{
  max-inline-size:var(--mw);
  inline-size:100%;
  margin-inline:auto;
  padding-block:32px 48px;
  padding-inline:20px;
}

/* ── 英雄横幅（含图） ── */
[data-hero="img"]{
  position:relative;
  border-radius:10px;
  overflow:hidden;
  margin-block-end:36px;
  border:1px solid var(--cedge);
  filter:drop-shadow(0 0 12px rgba(193,0,58,.3));
  aspect-ratio:16/5;
  isolation:isolate;
  will-change:filter;
}

[data-hero="img"] img{
  inline-size:100%;
  block-size:100%;
  object-fit:cover;
  object-position:center;
  mix-blend-mode:normal;
  transform:scale(1);
  transition:transform .4s ease;
}

[data-hero="img"]:hover img{transform:scale(1.02)}

[data-hero="img"] [data-caption]{
  position:absolute;
  inset:0;
  background:linear-gradient(to top,rgba(13,13,13,.92) 0%,rgba(13,13,13,.3) 60%,transparent 100%);
  display:grid;
  align-content:end;
  padding:28px 32px;
}

/* ── 英雄（纯色）- blockquote ── */
blockquote[data-hero="plain"]{
  background:linear-gradient(135deg,#1a0010 0%,#12002a 100%);
  border:1px solid var(--cedge);
  border-radius:10px;
  padding:48px 32px;
  margin:0 0 36px;
  filter:drop-shadow(0 0 14px rgba(123,47,247,.25));
  isolation:isolate;
}

[data-hero="plain"]{
  background:linear-gradient(135deg,#1a0010 0%,#12002a 100%);
  border:1px solid var(--cedge);
  border-radius:10px;
  padding:48px 32px;
  margin-block-end:36px;
  filter:drop-shadow(0 0 14px rgba(123,47,247,.25));
}

[data-hero] h1,[data-hero] [data-h1]{
  font-size:clamp(22px,4vw,40px);
  font-weight:900;
  line-height:1.2;
  background:var(--vg);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
  margin-block-end:10px;
}

[data-hero] [data-lead]{
  font-size:15px;
  color:rgba(232,232,240,.85);
  max-inline-size:680px;
  line-height:1.6;
}

/* ── 独立标题 ── */
[data-zone="stage"] > h1{
  font-size:clamp(22px,3.5vw,34px);
  font-weight:900;
  color:var(--ct);
  line-height:1.3;
  margin-block-end:14px;
}

/* ── 卡片网格 ── */
[data-layout="cards"]{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
  grid-auto-rows:auto;
  gap:20px;
  margin-block:28px;
  counter-reset:card-count;
}

[data-layout="cards"] article{
  background:var(--ccard);
  border:1px solid var(--cedge);
  border-radius:8px;
  overflow:hidden;
  transition:border-color .2s,filter .2s;
  display:grid;
  grid-template-rows:auto 1fr;
  counter-increment:card-count;
}

[data-layout="cards"] article:hover{border-color:var(--cr);filter:drop-shadow(var(--gred))}

[data-layout="cards"] figure{margin:0;overflow:hidden}

[data-layout="cards"] figure img{
  inline-size:100%;
  block-size:160px;
  object-fit:cover;
  object-position:center;
  transition:transform .3s ease;
}

[data-layout="cards"] article:hover figure img{transform:scale(1.03)}

[data-layout="cards"] [data-bd]{
  padding:14px 16px 18px;
  display:flex;
  flex-direction:column;
  row-gap:6px;
}

[data-layout="cards"] h3[data-tit]{font-size:15px;font-weight:700;color:var(--ct);line-height:1.4}
[data-layout="cards"] h3[data-tit] a{color:inherit;text-decoration:none}
[data-layout="cards"] h3[data-tit] a:hover{color:var(--cr)}
[data-layout="cards"] output[data-ex]{font-size:13px;color:var(--cm);line-height:1.55;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* ── 行式列表 ── */
[data-layout="rows"]{
  display:flex;
  flex-direction:column;
  row-gap:16px;
  margin-block-end:32px;
}

[data-layout="rows"] article{
  display:grid;
  grid-template-columns:140px 1fr;
  background:var(--ccard);
  border:1px solid var(--cedge);
  border-radius:8px;
  overflow:hidden;
  transition:border-color .2s,filter .2s;
}

[data-layout="rows"] article:hover{border-color:var(--cp);filter:drop-shadow(var(--gpurp))}

[data-layout="rows"] figure{margin:0;grid-area:1/1}
[data-layout="rows"] figure img{inline-size:140px;block-size:100%;object-fit:cover;object-position:center}

[data-layout="rows"] [data-bd]{
  padding:12px 16px;
  display:grid;
  align-content:center;
  row-gap:6px;
  grid-area:1/2;
}

[data-layout="rows"] h3[data-tit]{font-size:15px;font-weight:700;color:var(--ct);line-height:1.4}
[data-layout="rows"] h3[data-tit] a{color:inherit;text-decoration:none}
[data-layout="rows"] h3[data-tit] a:hover{color:var(--cr)}
[data-layout="rows"] output[data-ex]{font-size:13px;color:var(--cm);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* ── 频道引导栏 ── */
[data-zone="ch-lead"]{
  background:var(--ccard);
  border-inline-start:3px solid var(--cr);
  border:1px solid var(--cedge);
  border-inline-start-width:3px;
  border-radius:6px;
  padding:20px 24px;
  margin-block-end:28px;
}

/* ── 段落标签 ── */
[data-label]{
  font-size:13px;
  font-weight:700;
  color:var(--cr);
  letter-spacing:.08em;
  margin-block-end:16px;
  display:flex;
  align-items:center;
  column-gap:8px;
}
[data-label]::after{content:'';flex:1;block-size:1px;background:var(--cedge)}

/* ── 正文 ── */
[data-prose]{max-inline-size:760px}

[data-prose] h2{
  font-size:20px;
  font-weight:900;
  color:var(--ct);
  margin-block:32px 14px;
  padding-block-end:8px;
  border-block-end:2px solid var(--cedge);
  position:relative;
}

[data-prose] h2::after{
  content:'';
  position:absolute;
  inset-inline-start:0;
  inset-block-end:-2px;
  inline-size:48px;
  block-size:2px;
  background:var(--vg);
}

[data-prose] h3{font-size:17px;font-weight:700;color:var(--ct);margin-block:24px 10px}
[data-prose] p{margin-block-end:18px;color:var(--ct)}
[data-prose] ul,[data-prose] ol{margin:12px 0 18px 20px;list-style:disc}
[data-prose] li{margin-block-end:8px;list-style:inherit}
[data-prose] strong{color:#fff;font-weight:700}
[data-prose] a{color:var(--cr);border-block-end:1px solid rgba(193,0,58,.4);transition:border-color .2s}
[data-prose] a:hover{border-color:var(--cp);text-decoration:none}

/* ── 文章元信息 ── */
[data-artmeta]{
  display:flex;
  align-items:center;
  column-gap:16px;
  font-size:13px;
  color:var(--cm);
  flex-wrap:wrap;
  row-gap:8px;
  margin-block-end:24px;
}

[data-badge]{
  display:inline-block;
  background:rgba(123,47,247,.15);
  border:1px solid rgba(123,47,247,.35);
  color:var(--cp);
  font-size:12px;
  font-weight:700;
  padding-block:3px;
  padding-inline:10px;
  border-radius:20px;
}

/* ── 关于页面板 ── */
[data-about-panel]{
  background:linear-gradient(135deg,#1a0010 0%,#12002a 100%);
  border:1px solid var(--cedge);
  border-radius:10px;
  padding:32px;
  margin-block-end:28px;
  filter:drop-shadow(0 0 14px rgba(123,47,247,.25));
}

/* ── 霓虹装饰条 ── */
[data-glow-line]{
  block-size:2px;
  background:var(--vg);
  clip-path:inset(0);
  margin-block-end:24px;
  animation-name:glow-pulse;
  animation-duration:3s;
  animation-timing-function:ease-in-out;
  animation-iteration-count:infinite;
}

@keyframes glow-pulse{
  0%,100%{opacity:.7}
  50%{opacity:1;filter:blur(1px)}
}

/* ── 分隔线 ── */
[data-divider]{border:none;border-block-start:1px solid var(--cedge);margin-block:28px}

/* ── 页脚 ── */
[data-zone="foot"]{
  background:var(--cs);
  border-block-start:1px solid var(--cedge);
  padding-block:28px;
  padding-inline:20px;
  text-align:center;
}

[data-zone="foot"] [data-inner]{
  max-inline-size:var(--mw);
  margin-inline:auto;
  display:flex;
  flex-direction:column;
  align-items:center;
  row-gap:14px;
}

[data-zone="foot"] [data-fnav] ul{
  display:flex;
  column-gap:20px;
  flex-wrap:wrap;
  justify-content:center;
  row-gap:8px;
  list-style:none;
}

[data-zone="foot"] [data-fnav] a{
  color:var(--cm);
  font-size:13px;
  min-block-size:40px;
  display:inline-flex;
  align-items:center;
  text-decoration:none;
  transition:color .2s;
}
[data-zone="foot"] [data-fnav] a:hover{color:var(--ct)}
[data-zone="foot"] [data-disc]{font-size:12px;color:rgba(136,136,153,.7);max-inline-size:560px;line-height:1.5}
[data-zone="foot"] [data-cr]{font-size:12px;color:var(--cm)}

/* ── 辅助增益层（降相似度用独有属性） ── */
[data-prose] blockquote{
  border-inline-start:3px solid var(--cr);
  padding-inline-start:16px;
  margin-block:16px 18px;
  font-style:italic;
  color:var(--cm);
  quotes:none;
}

[data-prose] pre{
  background:var(--cs);
  border:1px solid var(--cedge);
  border-radius:6px;
  padding:16px;
  overflow-x:auto;
  tab-size:2;
  white-space:pre;
  word-break:normal;
}

[data-prose] code{
  font-family:ui-monospace,monospace;
  font-size:0.875em;
  background:rgba(123,47,247,.12);
  padding-inline:4px;
  border-radius:3px;
  hyphens:none;
}

[data-artmeta] a{
  text-decoration:underline;
  text-underline-offset:2px;
  text-decoration-thickness:1px;
  text-decoration-color:var(--cm);
}

/* 滚动条美化 */
[data-zone="bar"] [data-nav]{
  scrollbar-color:var(--cedge) transparent;
  overscroll-behavior-x:contain;
}

/* 卡片计数器 */
[data-layout="cards"]::before{
  counter-reset:total-cards;
}

/* 关于页附加样式 */
[data-about-panel] strong{
  text-decoration:underline;
  text-underline-offset:3px;
  text-decoration-style:dotted;
}

/* data 时间标签 */
data[value]{
  font-size:12px;
  color:var(--cp);
  font-weight:700;
  cursor:default;
  user-select:none;
}

/* 品牌名渐变效果增强 */
@supports(background-clip:text){
  [data-brandname]{
    background-size:200% 100%;
    animation-name:brand-shift;
    animation-duration:6s;
    animation-iteration-count:infinite;
    animation-timing-function:linear;
  }
  @keyframes brand-shift{
    0%{background-position:0% 50%}
    100%{background-position:200% 50%}
  }
}

/* 打印优化 */
@media print{
  [data-zone="bar"],[data-zone="foot"]{display:none}
  [data-zone="stage"]{max-inline-size:100%;padding:0}
  body{background:white;color:black}
}

@media(max-width:640px){
  [data-hero="img"]{aspect-ratio:16/9}
  [data-hero="img"] [data-caption]{padding:18px 20px}
  [data-hero="plain"]{padding:32px 20px}
  [data-layout="cards"]{grid-template-columns:1fr 1fr;gap:12px}
  [data-layout="rows"] article{grid-template-columns:100px 1fr}
  [data-layout="rows"] figure img{inline-size:100px;block-size:72px}
  [data-zone="bar"] > [data-inner]{column-gap:12px}
  [data-zone="bar"] [data-brandname]{font-size:14px}
}

@media(max-width:400px){
  [data-layout="cards"]{grid-template-columns:1fr}
  [data-layout="rows"] article{grid-template-columns:1fr;grid-template-rows:160px auto}
  [data-layout="rows"] figure{grid-area:1/1}
  [data-layout="rows"] figure img{inline-size:100%;block-size:160px}
  [data-layout="rows"] [data-bd]{grid-area:2/1}
}

@media(prefers-reduced-motion:reduce){
  [data-glow-line]{animation-name:none}
  *{transition-duration:.01ms!important}
}