/* 货片宝日间 / 夜间色板。React、登录页与管理后台共用。 */
:root {
  color-scheme: light;
  --ink: #171717;
  --ink-soft: #404040;
  --ink-mid: #262626;
  --paper: #f7f7f7;
  --panel: #ffffff;
  --surface-tint: #fafafa;
  --gray: #f1f1f1;
  --gray2: #e6e6e6;
  --gray3: #ebebeb;
  --line: #e5e5e5;
  --line-soft: #ededed;
  --line-strong: #d1d1d1;
  --muted: #6b6b6b;
  --faint: #929292;
  --brand: #171717;
  --brand-deep: #000000;
  --brand-soft: #eeeeee;
  --brand-rgb: 23, 23, 23;
  --on-brand: #ffffff;
  --on-brand-rgb: 255, 255, 255;
  --brand-grad: linear-gradient(var(--brand), var(--brand));
  --brand-grad-flow: linear-gradient(105deg, #171717, #424242, #171717);
  --brand-logo-filter: brightness(0);
  --ink-rgb: 23, 23, 23;
  --panel-rgb: 255, 255, 255;
  --paper-rgb: 247, 247, 247;
  --scrim-rgb: 0, 0, 0;
  --shadow-rgb: 0, 0, 0;
  --on-dark: #ffffff;
  --on-dark-rgb: 255, 255, 255;
  --media-bg: #000000;
  --media-bg-soft: #111111;
  --media-tint: #1c1c1c;
  --good-rgb: 35, 130, 90;
  --bad-rgb: 194, 61, 73;
  --warn-rgb: 153, 104, 25;
  --good: #23825a;
  --warn: #996819;
  --bad: #c23d49;
  --rose: var(--bad);
  --good-soft: rgba(var(--good-rgb), .1);
  --bad-scrim: rgba(72, 12, 18, .7);
  --blue: var(--brand);
  --rail: var(--panel);
  --rail-soft: var(--gray);
  --rail-line: var(--line-soft);
  --rail-muted: var(--muted);
  --shadow-sm: 0 1px 2px rgba(var(--shadow-rgb), .04), 0 8px 24px rgba(var(--shadow-rgb), .05);
  --shadow: 0 22px 64px rgba(var(--shadow-rgb), .12);
  --glass-fill: rgba(var(--panel-rgb), .82);
  --glass-fill-hover: rgba(var(--panel-rgb), .96);
  --glass-rim: rgba(var(--ink-rgb), .1);
  --glass-blur: blur(14px) saturate(100%);
  --glass-inset: inset 0 1px 0 rgba(var(--ink-rgb), .04);
  --glass-drop: 0 4px 18px rgba(var(--shadow-rgb), .08);
  --glass-tint: linear-gradient(180deg, rgba(var(--panel-rgb), .5), rgba(var(--panel-rgb), .1) 46%);
  --display: "Avenir Next", "SF Pro Display", "PingFang SC", "Microsoft YaHei", sans-serif;
  --sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", "PingFang SC", "Microsoft YaHei", "Segoe UI", sans-serif;
  --mono: ui-monospace, "SF Mono", Menlo, monospace;
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --ink: #f5f5f5;
  --ink-soft: #d4d4d4;
  --ink-mid: #e5e5e5;
  --paper: #0a0a0a;
  --panel: #171717;
  --surface-tint: #1c1c1c;
  --gray: #242424;
  --gray2: #333333;
  --gray3: #303030;
  --line: #363636;
  --line-soft: #2b2b2b;
  --line-strong: #515151;
  --muted: #aaaaaa;
  --faint: #8a8a8a;
  --brand: #f5f5f5;
  --brand-deep: #ffffff;
  --brand-soft: #292929;
  --brand-rgb: 245, 245, 245;
  --on-brand: #111111;
  --on-brand-rgb: 17, 17, 17;
  --brand-grad-flow: linear-gradient(105deg, #f5f5f5, #d4d4d4, #f5f5f5);
  --brand-logo-filter: brightness(0) invert(1);
  --ink-rgb: 245, 245, 245;
  --panel-rgb: 23, 23, 23;
  --paper-rgb: 10, 10, 10;
  --good-rgb: 115, 193, 148;
  --bad-rgb: 244, 139, 148;
  --warn-rgb: 218, 182, 117;
  --good: #73c194;
  --warn: #dab675;
  --bad: #f48b94;
  --shadow-sm: 0 1px 2px rgba(var(--shadow-rgb), .2), 0 8px 24px rgba(var(--shadow-rgb), .25);
  --shadow: 0 22px 64px rgba(var(--shadow-rgb), .5);
}
img[data-brand-mark] { filter: var(--brand-logo-filter); }
.theme-toggle {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  min-width: 32px; min-height: 32px; padding: 6px 10px;
  border: 1px solid var(--line); border-radius: 999px; background: var(--panel); color: var(--ink);
  font: 12px var(--sans); cursor: pointer; flex-shrink: 0;
}
.theme-toggle:hover { background: var(--gray); border-color: var(--line-strong); }
.theme-toggle:focus-visible { outline: 2px solid var(--brand); outline-offset: 3px; }
.theme-toggle svg { width: 16px; height: 16px; flex: none; }
.theme-toggle--compact { width: 32px; height: 32px; padding: 7px; }
.theme-toggle--compact span { display: none; }
.theme-toggle--rail { width: 64px; min-height: 44px; flex-direction: column; gap: 4px; border-color: transparent; border-radius: 10px; background: transparent; font-size: 10px; }
@media print { .theme-toggle { display: none; } }