/* ================================================================
   NOUS Review — ATTRIBUTION THEME  (NOUS_Review-attribution.css)
   ----------------------------------------------------------------
   FB03 · The Attribution Default After LLMs
   主题：透视档案 / 证据板 —— 冷灰蓝雾纸底、铅版印刷质感、
   虚线探针引线标注、终端日志条、案例档案卡（EXHIBIT 印章）。
   只做排版与配色覆写，不改动内容结构。
   依赖 NOUS_Review-shared.css / NOUS_Review-essay.css 先行加载。
   ================================================================ */

:root{
  --at-bg:#E8EDF0;          /* 冷灰蓝雾纸 */
  --at-panel:#F3F7F8;       /* 档案卡面板 */
  --at-slate:#3E5E70;       /* 钢青主色 */
  --at-deep:#2F4250;        /* 深板岩 */
  --at-line:#BFCBD3;        /* 冷灰线 */
  --at-stamp:#A8483A;       /* 档案印章砖红 */
  --at-mono:"Courier New",ui-monospace,SFMono-Regular,Menlo,monospace;
}

/* ---- 全局底色与基调 ---- */
body{ background:var(--at-bg); }
.es-band{ border-bottom-color:var(--at-slate); }
.es-band .tick{ color:var(--at-slate); }
.read-progress{ background:linear-gradient(90deg,var(--at-slate),#7FA3B5); }
.read-progress::after{ background:var(--at-slate); }
.rosette{ color:var(--at-slate); }

/* ---- chips → 冷色调 ---- */
.es-chip.track{ background:#D9E5EB; color:#2F4A58; }
.es-chip.issue{ background:#E3E9EC; color:#55606A; }
.es-chip.subject{ background:#DCE7E0; color:#3F5A4A; }
.es-crumbs .sep{ color:#9FB0BA; }

/* ---- 标题 / 署名 ---- */
.es-title{ color:#2C4656; max-width:640px; }
.es-byline{ border-top-color:var(--at-line); }
.byline-mono{ background:var(--at-deep); box-shadow:3px 3px 0 rgba(47,66,80,.16); }

/* ================================================================
   HERO 拼贴舞台 —— 右侧留白列：X光片 × 打开的黑箱 × 颅相版画 × 油画切片
   ================================================================ */
.es-hero{ padding-bottom:150px; }
.attr-stage{ position:absolute; inset:0; z-index:0; pointer-events:none; }
.attr-stage figure{ position:absolute; margin:0; }
.attr-stage img{ display:block; width:100%; height:auto; }

/* 手写标签（等宽小签） */
.st::after{
  content:attr(data-label);
  position:absolute; left:50%; bottom:-22px; transform:translateX(-50%) rotate(-1deg);
  font-family:var(--at-mono); font-size:9.5px; font-weight:700; letter-spacing:.08em;
  color:#F1F6F8; background:var(--at-deep);
  padding:3px 9px; white-space:nowrap; box-shadow:2px 3px 0 rgba(47,66,80,.18);
}

/* 虚线探针引线 */
.st::before{
  content:""; position:absolute; border-top:1.5px dashed #8CA2AF; opacity:.85;
}

.st-xray{
  top:20px; right:60px; width:130px;
  transform:rotate(4deg); mix-blend-mode:multiply; opacity:.95;
  z-index:1;
}
.st-xray::before{ left:-66px; top:62%; width:68px; transform:rotate(16deg); }
.st-xray::after{ top:34%; bottom:auto; left:-128px; transform:rotate(-2deg); }

.st-boombox{
  top:235px; right:-6px; width:280px; transform:rotate(-3deg);
  filter:drop-shadow(7px 11px 13px rgba(31,45,54,.30));
  z-index:3;
}
.st-boombox::before{ left:-92px; top:38%; width:94px; transform:rotate(-13deg); }
.st-boombox::after{ bottom:24px; left:auto; right:-16px; transform:rotate(-2deg); }

/* 大幅神经网络垫底：垫在标题一侧最后，低透明度若隐若现 */
.st-netwc{
  top:-50px; left:-100px; width:700px; transform:rotate(2deg);
  mix-blend-mode:multiply; opacity:.16; z-index:0;
  filter:saturate(.78) brightness(1.08);
}
/* 墨线神经网：右上第二层，薄纱质感 */
.st-netink{
  top:-16px; right:-44px; width:330px; transform:rotate(-4deg);
  mix-blend-mode:multiply; opacity:.28; z-index:0;
  filter:contrast(1.05);
}
.st-phren{
  top:262px; right:284px; width:228px; transform:rotate(-7deg);
  mix-blend-mode:multiply; opacity:.97; z-index:2;
}
.st-phren::before{ left:-34px; top:30%; width:36px; transform:rotate(-32deg); }
.st-phren::after{ top:-22px; bottom:auto; left:50%; transform:translateX(-50%) rotate(2deg); }

/* 打开怀表线稿：左下角 */
.st-watch{
  top:330px; left:26px; width:150px; transform:rotate(5deg);
  mix-blend-mode:multiply; opacity:.95; z-index:1;
}

@media(max-width:1120px){
  .st-xray{ width:104px; right:44px; top:16px; }
  .st-boombox{ width:238px; top:212px; }
  .st-netwc{ width:560px; left:-80px; top:-40px; }
  .st-netink{ width:270px; right:-40px; }
  .st-phren{ width:186px; right:230px; top:244px; }
  .st-watch{ width:122px; top:300px; left:16px; }
}
@media(max-width:880px){
  .hero-flex{ flex-direction:column; }
  .es-hero{ display:flex; flex-direction:column; padding-bottom:10px; }
  .hero-flex{ order:1; }
  .attr-stage{
    position:relative; inset:auto; order:2;
    display:flex; flex-wrap:wrap; gap:20px; align-items:flex-end;
    padding-top:30px;
  }
  .attr-stage figure{ position:static; }
  .st{ width:auto !important; }
  .st-netwc{ display:none; }
  .st-netink{ width:130px !important; opacity:.55; }
  .st-xray{ width:84px !important; }
  .st-boombox{ width:150px !important; }
  .st-watch{ width:96px !important; }
  .st-phren{ width:104px !important; }
  .st::before{ display:none; }
  .st::after{ display:none; }
}

/* ================================================================
   终端日志条
   ================================================================ */
.attr-log{ max-width:1060px; margin:6px auto 26px; padding:0 42px; }
.attr-log span{
  display:block;
  font-family:var(--at-mono); font-size:11px; letter-spacing:.05em; line-height:1.7;
  color:#C7DBD0; background:#24323C;
  border-left:3px solid var(--at-slate);
  padding:9px 15px;
  box-shadow:4px 5px 0 rgba(47,66,80,.10);
}
@media(max-width:880px){ .attr-log{ padding:0 24px; } }

/* ================================================================
   正文基调
   ================================================================ */
.es-body p{ color:#313D46; }
.es-body .dropcap::first-letter{ color:var(--at-slate); }

/* 章节号 → § 等宽代码块 */
.es-sec .medal{
  width:auto; min-width:46px; height:30px; padding:0 10px; border-radius:3px;
  background:var(--at-deep); color:#EAF2F5;
  font-family:var(--at-mono); font-size:13px; font-weight:700;
  transform:none; box-shadow:none; border:1px solid #22303A;
}
.es-sec .medal::before{ content:""; }
.es-sec:nth-of-type(even) .medal{ transform:none; }
.es-sec .sec-title{ border-bottom:1px dashed var(--at-line); }

/* 摘要卡 → 档案面板 */
.es-abstract{
  background:var(--at-panel);
  border:1px solid var(--at-line); border-top:3px solid var(--at-slate);
  box-shadow:6px 7px 0 rgba(47,66,80,.08);
}
.es-abstract .lbl{ color:var(--at-slate); font-family:var(--at-mono); letter-spacing:.22em; }
.es-abstract p{ color:#39464F; }
.es-abstract::before{ border-color:rgba(62,94,112,.28); }

/* ================================================================
   案例档案卡（answer-key 案 / parole 案）
   ================================================================ */
.attr-case{
  position:relative; background:var(--at-panel);
  border:1px solid var(--at-line);
  box-shadow:6px 7px 0 rgba(47,66,80,.08);
  padding:22px 26px 8px; margin:32px 0;
}
.attr-case::before{
  content:""; position:absolute; inset:6px;
  border:1px dashed rgba(62,94,112,.35); pointer-events:none;
}
.attr-case .case-tag{
  display:inline-block; position:relative; z-index:1;
  font-family:var(--at-mono); font-size:10.5px; font-weight:700;
  letter-spacing:.12em; text-transform:uppercase;
  color:#F3F7F8; background:var(--at-deep);
  padding:4px 11px; margin-bottom:13px;
  box-shadow:2px 3px 0 rgba(47,66,80,.18);
}
.attr-case::after{
  content:"EXHIBIT";
  position:absolute; top:13px; right:15px;
  font-family:var(--at-mono); font-size:10.5px; font-weight:700; letter-spacing:.28em;
  color:var(--at-stamp); border:2px solid var(--at-stamp); border-radius:2px;
  padding:3px 7px 3px 11px; transform:rotate(7deg); opacity:.6;
}
.attr-case p{ font-size:15.5px; line-height:1.9; }

/* ================================================================
   证据板照片（caseboard）
   ================================================================ */
.attr-board{
  position:relative; margin:40px auto 46px; max-width:540px;
  transform:rotate(-1.2deg);
}
.attr-board img{
  width:100%; display:block;
  border:7px solid #FBFDFC;
  box-shadow:9px 13px 24px rgba(31,45,54,.26);
}
.attr-board::before,.attr-board::after{
  content:""; position:absolute; width:96px; height:26px;
  background:rgba(210,222,226,.8); border:1px solid rgba(140,160,170,.45);
}
.attr-board::before{ top:-13px; left:26px; transform:rotate(-6deg); }
.attr-board::after{ bottom:-11px; right:26px; transform:rotate(5deg); }
.attr-board figcaption{
  font-family:var(--at-mono); font-size:10px; letter-spacing:.07em;
  text-transform:uppercase; color:#5B6B75; margin-top:12px; line-height:1.7;
}

/* ================================================================
   侧栏 / 脚注 / 书目 / 翻页 → 冷色统一
   ================================================================ */
.rail-card{ background:var(--at-panel); border-color:var(--at-line); box-shadow:4px 5px 0 rgba(47,66,80,.07); }
.rail-card .lbl{ color:var(--at-slate); font-family:var(--at-mono); }
.rail-row b{ color:#2C4656; }
.rail-row{ border-bottom-color:rgba(62,94,112,.18); }
.rail-toc li{ border-bottom-color:rgba(62,94,112,.18); }
.rail-toc .rn{ color:var(--at-slate); }

.es-notes li,.es-bib li{ color:#46525A; }
.es-bib li::before{ background:var(--at-slate); }
.es-bib li{ border-bottom-color:rgba(62,94,112,.16); }
.es-notes li:target{ background:#DCE9EF; box-shadow:0 0 0 6px #DCE9EF; }
.es-notes h3,.es-bib h3{ color:var(--at-slate); }
.es-notes h3::after,.es-bib h3::after{ background:var(--at-line); }

.footnav-card{ background:var(--at-panel); border-color:var(--at-line); box-shadow:5px 6px 0 rgba(47,66,80,.07); }
.footnav-card .t{ color:#2C4656; }
.es-end{ color:var(--at-slate); }
.es-end .el{ background:var(--at-line); }
