:root {
  --bg: #f4f0ea;
  --bg-strong: #e9e2d8;
  --bg-deep: #e9e2d8;
  --surface: #fffdfa;
  --surface-strong: #fffdfa;
  --surface-soft: #f8f3ec;
  --surface-muted: #eee5da;
  --text: #25201c;
  --muted: #70675f;
  --line: rgba(74, 61, 50, 0.14);
  --line-strong: rgba(74, 61, 50, 0.24);
  --accent: #a84f32;
  --accent-deep: #7d3827;
  --accent-strong: #7d3827;
  --accent-soft: #f6e4dc;
  --accent-soft-strong: rgba(168, 79, 50, 0.2);
  --danger: #a63c3c;
  --success: #3c765b;
  --shadow: 0 16px 38px rgba(39, 29, 22, 0.1);
  --shadow-soft: 0 7px 18px rgba(39, 29, 22, 0.06);
  --radius-panel: 16px;
  --radius-control: 10px;
}

body[data-theme="dark"] {
  --bg: #1c1916;
  --bg-strong: #15120f;
  --bg-deep: #15120f;
  --surface: #29241f;
  --surface-strong: #29241f;
  --surface-soft: #332c26;
  --surface-muted: #403831;
  --text: #f3ede7;
  --muted: #beb3a7;
  --line: rgba(255, 255, 255, 0.11);
  --line-strong: rgba(255, 255, 255, 0.18);
  --accent: #efa073;
  --accent-deep: #ffd0b1;
  --accent-strong: #ffd0b1;
  --accent-soft: #4c3429;
  --accent-soft-strong: rgba(239, 160, 115, 0.22);
  --danger: #ffaaa2;
  --success: #9bd0b5;
  --shadow: 0 18px 42px rgba(0, 0, 0, 0.32);
  --shadow-soft: 0 7px 18px rgba(0, 0, 0, 0.22);
}

body {
  font-family: "IBM Plex Sans", "Segoe UI", system-ui, sans-serif;
  background: var(--bg);
}

h1, h2, h3, .panel-title, .card h3 {
  font-family: "Iowan Old Style", "Palatino Linotype", Georgia, serif;
  letter-spacing: 0;
}

.panel, .hero-shell, .topbar, .shell, .modal, .mobile-week-card, .help-card, .detail-card, .event-card {
  border-radius: var(--radius-panel);
}

input, select, textarea, .btn, button, .filter-btn, .tab-link, .ghost-link, .logout-btn, .page-link, .nav a, .nav strong {
  border-radius: var(--radius-control);
}

input, select, textarea {
  background: var(--surface-soft);
  border-color: var(--line);
}

input:focus, select:focus, textarea:focus {
  border-color: color-mix(in srgb, var(--accent) 55%, transparent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 14%, transparent);
}

.btn-primary, .primary, .add, .quick-nav a.primary {
  background: var(--accent-deep);
}

body[data-theme="dark"] .btn-primary,
body[data-theme="dark"] .primary,
body[data-theme="dark"] .add,
body[data-theme="dark"] .quick-nav a.primary {
  color: #2d1b14;
}

.btn-secondary, .soft, .ghost-link, .tab-link, .logout-btn, .filter-btn, .page-link {
  background: var(--surface-soft);
  border-color: var(--line);
  color: var(--text);
}

.card, .dashboard-card, .hero-card, .stat-card, .theme-option, .candidate-card {
  border-color: var(--line);
  box-shadow: var(--shadow-soft);
}

body[data-theme="dark"] .tag.wishlist,
body[data-theme="dark"] .pill.wishlist,
body[data-theme="dark"] .icon-btn.active {
  background: #52343a;
}

@media (max-width: 640px) {
  .page { padding-left: 0.85rem; padding-right: 0.85rem; }
  .panel, .hero-shell, .topbar, .shell { border-radius: 14px; }
}

/* The shared theme wins over legacy per-page palettes. */
html body:not([data-theme="dark"]) {
  --bg: #f6f1ea !important;
  --bg-strong: #eee5da !important;
  --bg-deep: #eee5da !important;
  --surface: #ffffff !important;
  --surface-strong: #fffdfa !important;
  --surface-soft: #faf6f0 !important;
  --surface-muted: #efe6da !important;
  --text: #1f1a17 !important;
  --muted: #756a61 !important;
  --line: rgba(109, 92, 75, 0.14) !important;
  --line-strong: rgba(109, 92, 75, 0.24) !important;
  --accent: #7b4aa3 !important;
  --accent-deep: #64357f !important;
  --accent-strong: #64357f !important;
  --accent-soft: #f3eaf7 !important;
  --accent-soft-strong: rgba(123, 74, 163, 0.2) !important;
  --danger: #ba2d2d !important;
  --success: #2f7d4b !important;
}

html body[data-theme="dark"] {
  --bg: #211d1a !important;
  --bg-strong: #191512 !important;
  --bg-deep: #191512 !important;
  --surface: #2b2622 !important;
  --surface-strong: #2b2622 !important;
  --surface-soft: #342e29 !important;
  --surface-muted: #453d36 !important;
  --text: #f4eee8 !important;
  --muted: #c5b7aa !important;
  --line: rgba(255, 255, 255, 0.08) !important;
  --line-strong: rgba(255, 255, 255, 0.16) !important;
  --accent: #c89be0 !important;
  --accent-deep: #9b70b9 !important;
  --accent-strong: #9b70b9 !important;
  --accent-soft: #4c3857 !important;
  --accent-soft-strong: rgba(200, 155, 224, 0.22) !important;
  --danger: #ff8f8f !important;
  --success: #8cd6a9 !important;
}

html body {
  background: var(--bg) !important;
  background-image: none !important;
  color: var(--text);
}

.rating-picker { display:flex; align-items:center; gap:.75rem; margin-top:.4rem; }
.rating-buttons { display:flex; gap:.18rem; }
.rating-button { appearance:none !important; width:34px; height:34px; min-width:0; padding:0 !important; border:0 !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important; color:#9b9184; font-size:1.55rem; line-height:1; cursor:pointer; }
.rating-button:hover, .rating-button.active { color:#d99719; background:transparent !important; }
.rating-inline { display:flex; gap:.14rem; align-items:center; margin:.15rem 0 .35rem; }
.rating-inline .rating-button { width:31px; height:31px; color:#9b9184; }
.rating-inline .rating-button.active, .rating-inline .rating-button:hover { color:#d99719; text-shadow:0 1px 4px rgba(217,151,25,.2); }
.rating-amazon { gap:.28rem; margin:.12rem 0 .12rem; }
.rating-score { color:#d99719; font-weight:800; font-size:.9rem; font-variant-numeric:tabular-nums; }
.rating-star-group { display:inline-flex; align-items:center; gap:0; }
.rating-amazon .rating-star { width:18px; height:24px; font-size:1.12rem; }
.rating-amazon .rating-star:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.rating-caption { color:var(--muted); font-size:.82rem; }
.rating-stars { --rating:0; display:inline-block; background:linear-gradient(90deg, #e4a12b calc(var(--rating) * 20%), var(--surface-muted) calc(var(--rating) * 20%)); -webkit-background-clip:text; background-clip:text; color:transparent; font-family:Arial,sans-serif; font-size:1rem; letter-spacing:0; white-space:nowrap; }
.rating-picker strong { color:var(--text); font-size:.86rem; }
.reading-panel { display:grid; gap:.75rem; margin:1.15rem 0; padding:1rem 1.1rem; border:1px solid var(--line); border-radius:var(--radius-panel); background:var(--surface-soft); }
.reading-panel-head { display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.reading-panel-head > div { display:grid; gap:.1rem; }
.reading-panel .eyebrow { color:var(--muted); font-size:.72rem; font-weight:800; text-transform:uppercase; }
.reading-panel-head strong { color:var(--text); font-size:1rem; }
.reading-progress-value { color:var(--accent); font-size:1.75rem; font-weight:900; line-height:1; font-variant-numeric:tabular-nums; }
.reading-progress-value small { font-size:.85rem; }
.reading-progress-form { display:grid; grid-template-columns:minmax(120px, .8fr) minmax(140px, .9fr) auto; gap:.65rem; align-items:end; }
.reading-progress-form label { display:grid; gap:.3rem; color:var(--muted); font-size:.76rem; font-weight:800; }
.reading-progress-form input { width:100%; min-height:40px; padding:.5rem .6rem; border:1px solid var(--line); border-radius:10px; background:var(--surface); color:var(--text); font:inherit; color-scheme:light; }
.reading-progress-form input:focus { outline:2px solid var(--accent); outline-offset:2px; border-color:var(--accent); }
body[data-theme="dark"] .reading-progress-form input { background:var(--surface-muted); color:var(--text); color-scheme:dark; }
.reading-progress-form .btn { min-height:40px; padding:.5rem .75rem; white-space:nowrap; }
.reading-meter { overflow:hidden; height:8px; border-radius:999px; background:var(--surface-muted); }
.reading-meter span { display:block; height:100%; border-radius:inherit; background:var(--accent); transition:width .2s ease; }
.reading-summary { margin:0; color:var(--muted); font-size:.9rem; }
.reading-summary strong { color:var(--text); }
.reading-caption { color:var(--muted); font-size:.8rem; }
.reading-finish { appearance:none; justify-self:start; padding:0; border:0; background:transparent; color:var(--accent); font:inherit; font-size:.82rem; font-weight:800; cursor:pointer; }
.reading-finish:hover { text-decoration:underline; }
@media (max-width: 640px) { .reading-panel { padding:.9rem; gap:.65rem; } .reading-progress-form { grid-template-columns:1fr; gap:.55rem; } .reading-progress-form .btn { width:100%; } }
.reference-price-card { display:grid; gap:.45rem; }
.reference-price-form { display:grid; grid-template-columns:minmax(0, 1fr) auto auto; gap:.45rem; align-items:center; }
.reference-price-form input { min-width:0; min-height:38px; padding:.45rem .55rem; }
.reference-price-form span { color:var(--muted); font-size:.82rem; font-weight:800; }
.reference-price-form .btn { min-height:38px; padding:.45rem .65rem; font-size:.8rem; }
@media (max-width: 420px) { .reference-price-form { grid-template-columns:minmax(0, 1fr) auto; } .reference-price-form .btn { grid-column:1 / -1; width:100%; } }

html,
html:has(body[data-theme="dark"]) {
  background: #211d1a;
}

html:has(body:not([data-theme="dark"])) {
  background: #f6f1ea;
}

.check-row { display:flex; align-items:flex-start; gap:.55rem; color:var(--muted); font-size:.86rem; line-height:1.35; cursor:pointer; }
.check-row input { width:18px; height:18px; margin:.05rem 0 0; accent-color:var(--accent); flex:0 0 auto; }
.upload-inline .check-row { flex-basis:100%; }