/* ============================================
   reference.css — Reference 参考资料
   ============================================ */

.reference{
  position:relative;padding:120px 6% 100px;z-index:1;
  background:linear-gradient(180deg,var(--ivory) 0%,var(--ivory-light) 100%);
}
.reference-inner{max-width:1000px;margin:0 auto}

.reference-block{margin-top:60px;text-align:left}
.reference-block-label{
  font-family:'Cinzel',serif;font-size:11px;letter-spacing:0.5em;color:var(--gold);
  text-transform:uppercase;margin-bottom:16px;padding-bottom:8px;
  border-bottom:1px solid var(--gold-light);
  display:flex;align-items:center;gap:12px;
}
.reference-block-label::before{content:'';width:24px;height:1px;background:var(--gold)}

.reference-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:20px 40px}
.reference-item{
  padding:20px;background:rgba(255,255,255,0.4);border-left:2px solid var(--gold-light);
  transition:all 0.3s;
}
.reference-item:hover{border-left-color:var(--gold-bright);background:rgba(255,255,255,0.6);transform:translateX(4px)}
.reference-item-title{
  font-family:'Noto Serif SC',serif;font-size:15px;font-weight:600;color:var(--ink);
  margin:0 0 4px;line-height:1.5;
}
.reference-item-title em{color:var(--gold-deep);font-style:italic}
.reference-item-meta{
  font-family:'Cormorant Garamond',serif;font-size:13px;color:var(--gold-deep);
  letter-spacing:0.1em;font-style:italic;margin:0 0 8px;line-height:1.5;
}
.reference-item a{
  font-family:'Cinzel',serif;font-size:11px;letter-spacing:0.2em;color:var(--gold);
  text-decoration:underline;text-underline-offset:3px;
}
.reference-item a:hover{color:var(--gold-deep)}

.reference-note{
  margin-top:50px;padding:24px;background:rgba(255,255,255,0.3);border:1px dashed var(--gold-light);
  font-family:'Noto Serif SC',serif;font-size:13px;line-height:1.8;color:var(--ink);opacity:0.75;
  text-align:center;letter-spacing:0.05em;
}
.reference-note a{color:var(--gold);text-decoration:underline}

@media(max-width:900px){
  .reference-list{grid-template-columns:1fr;gap:16px}
}

/* ========== 显眼声明卡（公版 / 概念插画 / 来源）========== */
.reference-callout{
  padding:28px 36px;
  background:linear-gradient(135deg,rgba(244,236,216,0.65),rgba(232,220,192,0.4));
  border:1.5px solid var(--gold);
  border-left:4px solid var(--gold-deep);
  position:relative;
}
.reference-callout::before{
  content:'';position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,var(--gold-deep),var(--gold-light),var(--gold-deep));
}
.reference-callout-title{
  font-family:'Cinzel',serif;font-size:13px;font-weight:600;
  letter-spacing:0.35em;color:var(--gold-deep);
  text-align:center;margin:0 0 14px;text-transform:uppercase;
}
.reference-callout-body{
  font-family:'Noto Serif SC',serif;font-size:14px;line-height:1.85;
  color:var(--ink);margin:0 0 10px;letter-spacing:0.04em;
}
.reference-callout-body a{color:var(--gold-deep);text-decoration:underline;text-underline-offset:3px}
.reference-callout-body a:hover{color:var(--ink)}
@media (max-width:760px){
  .reference-callout{padding:20px 18px}
  .reference-callout-body{font-size:13px;line-height:1.7}
}

/* v7.1.10 暗色：reference 全段文字 → 月白，对比度 WCAG AA */
:root[data-theme="dark"] .reference {
  background: linear-gradient(180deg, #0F1B2A 0%, #1A2840 100%);
}
:root[data-theme="dark"] .reference-block-label {
  color: var(--text-light);
  border-bottom-color: var(--gold);
}
:root[data-theme="dark"] .reference-block-label::before { background: var(--text-light); }

:root[data-theme="dark"] .reference-item {
  background: rgba(20, 35, 55, 0.7);
  border-left-color: var(--gold);
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.3);
}
:root[data-theme="dark"] .reference-item:hover {
  background: rgba(30, 50, 75, 0.85);
  border-left-color: var(--text-light);
}
:root[data-theme="dark"] .reference-item-title { color: var(--text-light); }
:root[data-theme="dark"] .reference-item-title em { color: var(--text-light); font-style: italic; }
:root[data-theme="dark"] .reference-item-meta { color: var(--text-light); opacity: 0.85; }
:root[data-theme="dark"] .reference-item a { color: var(--text-light); }
:root[data-theme="dark"] .reference-item a:hover { color: #FFFFFF; }

:root[data-theme="dark"] .reference-note {
  background: rgba(20, 35, 55, 0.7);
  border-color: var(--gold);
  color: var(--text-light);
  opacity: 1;
}
:root[data-theme="dark"] .reference-note a { color: var(--text-light); }

/* 显眼声明卡：暗色下用月白文字 + 暗月蓝半透明背景 */
:root[data-theme="dark"] .reference-callout {
  background: linear-gradient(135deg, rgba(20, 35, 55, 0.92), rgba(15, 27, 42, 0.88));
  border-color: var(--gold);
  border-left-color: var(--text-light);
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.4);
}
:root[data-theme="dark"] .reference-callout::before {
  background: linear-gradient(90deg, var(--text-light), var(--gold), var(--text-light));
}
:root[data-theme="dark"] .reference-callout-title { color: var(--text-light); }
:root[data-theme="dark"] .reference-callout-body { color: var(--text-light); }
:root[data-theme="dark"] .reference-callout-body a { color: var(--text-light); text-decoration: underline; }
:root[data-theme="dark"] .reference-callout-body a:hover { color: #FFFFFF; }
:root[data-theme="dark"] .reference-callout-body em { color: var(--text-light); }
:root[data-theme="dark"] .reference-callout-body u { color: var(--text-light); }
:root[data-theme="dark"] .reference-callout-body strong { color: #FFFFFF; }

/* ============================================
   v7.1.16: reference 内联 style 抽出 → class
   ============================================ */

/* L1190: reference-callout 上间距 */
.reference-callout--top{margin-top:32px}

/* L1197: reference-block 大间距 */
.reference-block--spaced{margin-top:48px}

/* L1289: reference-block 中间距 */
.reference-block--medium{margin-top:36px}

/* L1351: reference-item-meta 注释行 */
.reference-item-meta--caption{margin-top:10px;color:var(--ink-soft);font-style:italic;font-size:11px}

/* L1355: reference-note 顶部分隔线 */
.reference-note--divider{border-top:1px dashed rgba(184,134,11,0.4);padding-top:18px}

/* L1356: 鎏金强调文字 */
.text--gold{color:var(--gold);letter-spacing:0.05em}

/* L1017: 鎏金高光符号(在 diaochan 段的金色 ❦) */
.text--gold-bright{color:#FFD700}

/* L1193: em 金色斜体 */
.em--gold-italic{color:var(--gold-deep);font-style:italic}
