/* 亮色模式（白金）：只在「被工作台框起来」时生效，而且是工作台自己切到亮色时。
 *
 * 直接打开 /style-library/ 的访客看不到这套覆盖 —— 那时 html 上没有 data-z-theme，
 * 页面就是原版黑金。iframe 里的判断与加属性都在 z-theme.js。
 *
 * 配色思路：页面正文换成米白纸面 + 深金，影片画面（.screen / 推荐片黑框）
 * 和幕布上方那两处仍然留在夜里 —— 金箔字与金箔字标是抠在深色上的，
 * 底色一变就读不出来，所以 .house / .feature 里把那套黑金变量原地再声明一遍。
 */

html[data-z-theme="light"] {
  color-scheme: light;

  --paper: #f4ecdd;
  --paper-2: #fffdf7;
  --ink: #241b10;
  --soft: #5c4d3b;
  --dim: #8a7a63;
  --gold: #8a6526;
  --gold-hi: #6b4a12;
  --gold-lo: #b8914a;
  --line: rgba(138, 101, 38, 0.32);

  --black: var(--paper);
  --stage: var(--paper);
  --plate: #faf3e6;
  --plate2: #fffdf7;

  background: var(--paper);
}

html[data-z-theme="light"] body {
  background: var(--paper);
  color: var(--ink);
}

html[data-z-theme="light"] body::after { opacity: 0.045; }   /* 噪点：纸面上少一点 */

/* ---- 留在夜里的两块：幕布（英雄区）与推荐片 ---- */

html[data-z-theme="light"] .house {
  --stage: #0d0a08;
  --ink: #f3ead8;
  --soft: #b9a98c;
  --dim: #7a6d5a;
  --gold: #d4b064;
  --gold-hi: #f6e0a0;
  --gold-lo: #7d5f28;
  --line: rgba(212, 176, 100, 0.26);
  --plate: #120e0b;
  --plate2: #19130e;
  background:
    radial-gradient(900px 520px at 50% 34%, rgba(212, 176, 100, 0.16), transparent 70%),
    var(--stage);
  color: var(--ink);
}

html[data-z-theme="light"] .feature {
  --stage: #0d0a08;
  --ink: #f3ead8;
  --soft: #b9a98c;
  --dim: #7a6d5a;
  --gold: #d4b064;
  --gold-hi: #f6e0a0;
  --gold-lo: #7d5f28;
  --line: rgba(212, 176, 100, 0.26);
  background:
    radial-gradient(1000px 520px at 50% 58%, rgba(212, 176, 100, 0.14), transparent 70%),
    linear-gradient(180deg, var(--stage), var(--black));
  color: var(--ink);
}

/* ---- 分类 tab 条：米白玻璃 + 金线 ---- */

html[data-z-theme="light"] .tabs {
  background: linear-gradient(180deg, rgba(244, 236, 221, 0.97), rgba(244, 236, 221, 0.9));
}

html[data-z-theme="light"] .tabs button { color: var(--gold); }
html[data-z-theme="light"] .tabs button small { color: var(--dim); }
html[data-z-theme="light"] .tabs button:hover { background: rgba(138, 101, 38, 0.08); }
html[data-z-theme="light"] .tabs button.on small { color: #4a3714; }

/* ---- 幕后那一大片：黑绒换成纸面的一点暖调 ---- */

html[data-z-theme="light"] main {
  background: radial-gradient(1200px 700px at 50% 0, rgba(110, 15, 20, 0.05), transparent 70%);
}

/* ---- 卡片：纸面 + 金边 + 轻投影；屏幕里的影片仍是黑的 ---- */

html[data-z-theme="light"] .nominee {
  border-color: rgba(138, 101, 38, 0.45);
  box-shadow: 0 22px 44px -26px rgba(60, 40, 10, 0.45);
}

html[data-z-theme="light"] .nominee::before { border-color: rgba(138, 101, 38, 0.22); }

html[data-z-theme="light"] .nominee:hover {
  box-shadow: 0 0 0 1px var(--gold), 0 26px 60px -26px rgba(120, 85, 20, 0.4);
}

html[data-z-theme="light"] .line,
html[data-z-theme="light"] .more-grid span { color: #3a2d1e; }

/* 分类大标题本来是金箔描字：米白底上读不出来，换成实心深金 */
html[data-z-theme="light"] .cat-head h2 {
  background: none;
  color: var(--gold-hi);
  -webkit-text-fill-color: var(--gold-hi);
  filter: none;
}

/* ---- 金箔/金线上的字（--black 已经变成纸色，得单独给深字） ---- */

/* 卡片底下那颗金箔按钮（STYLE.md）：原文用 var(--black) 当字色，
   亮色下 --black 是纸色，会把字吃掉。.watch 是旁边的文字链接，不算。 */
html[data-z-theme="light"] .nominee .links a:not(.watch),
html[data-z-theme="light"] .nominee .links a[href^="styles/"] { color: #241b10; }
html[data-z-theme="light"] .repo { background: rgba(255, 253, 247, 0.8); }
html[data-z-theme="light"] .repo:hover,
html[data-z-theme="light"] .repo:focus-visible { background: var(--gold); color: #fff8ea; }
html[data-z-theme="light"] .repo .stars { border-left-color: var(--line); }

html[data-z-theme="light"] .more-grid a:hover,
html[data-z-theme="light"] .more-grid a:focus-visible {
  box-shadow: 0 18px 40px -24px rgba(120, 85, 20, 0.35);
}

/* ---- 滚动条 / 选区：纸面轨道 + 金滑块（z-scrollbar.css 写死了深色） ---- */

html[data-z-theme="light"] ::-webkit-scrollbar-track { background: #e9dfcd; }
html[data-z-theme="light"] ::-webkit-scrollbar-thumb {
  border-color: #e9dfcd;
  background: linear-gradient(180deg, #c9a35c 0%, #a47b32 55%, #8a6526 100%);
}
html[data-z-theme="light"] ::-webkit-scrollbar-corner { background: #e9dfcd; }

@supports (-moz-appearance: none) {
  html[data-z-theme="light"] { scrollbar-color: #a47b32 #e9dfcd; }
}

html[data-z-theme="light"] ::selection {
  color: #241b10;
  background: rgba(138, 101, 38, 0.22);
}

/* ---- 风格详情页（STYLE.md）：同一套纸面 ---- */

html[data-z-theme="light"] a { color: var(--gold); }

html[data-z-theme="light"] pre {
  background: var(--paper-2);
  border-color: rgba(138, 101, 38, 0.35);
  color: var(--ink);
}

html[data-z-theme="light"] .style-use {
  background: var(--paper-2);
  border-color: rgba(138, 101, 38, 0.35);
}

html[data-z-theme="light"] .style-use-example { color: #4a3c2b; }
html[data-z-theme="light"] .style-use-example span { color: var(--dim); }

html[data-z-theme="light"] .style-use-btns button { color: #241b10; }

html[data-z-theme="light"] .style-use-btns button.ghost {
  background: transparent;
  color: var(--gold);
  border-color: rgba(138, 101, 38, 0.35);
}

html[data-z-theme="light"] small { color: var(--dim); }