/* Light palette. Layout and responsive rules live in style.css. */
:root {
  color-scheme: light;
  color: #293b50;
  background: #f0f5fa;
  --gold: #947020;
  --muted: #5c6e82;
  --line: #d1dce7;
  --panel: #ffffff;
  --surface: #f6f9fc;
}
body { background: linear-gradient(135deg, #eaf5ff 0%, #f5f8fc 45%, #f9f7f0 100%); }
button { color: #33465b; background: #f7faff; border-color: #c7d5e3; }
button:hover { background: #e7f0fa; border-color: #91acc5; }
button:disabled { opacity: .45; }
input, textarea, select { color: #293b50; background: #fff; border-color: #bfcede; }
input::placeholder, textarea::placeholder { color: #66788d; }
label { color: #43586c; }
.app-header { background: #ffffffee; border-color: #d5e0eb; }
.brand { color: #2c4660; }
.brand small, .local-badge { color: #5c7085; }
.brand-symbol { background: #fff8e5; border-color: #dac58e; }
i { background: #3e946d; }
.type-tabs { border-color: #c8d8e7; }
.type-tabs button { color: #5c7085; background: transparent; }
.type-tabs button:hover { background: #e7f1fb; }
.type-tabs button.active { color: #335e88; border-bottom-color: #5989b4; background: linear-gradient(0deg, #d9eafa, #edf5fc66); }
.type-tabs small { border-color: #b8cce0; background: #ffffff99; }
.panel { background: #ffffffeb; box-shadow: 0 3px 14px #49688407; }
.subtle { background: transparent; border-color: transparent; color: #5a6e83; }
.danger:hover { color: #ae3c42; background: #fff0f0; }
.presets button { color: #506a83; background: #f0f5fa; border-color: #d5e0eb; }
.presets button:hover { background: #dfedf9; }
.check input { accent-color: #4f7faa; }
.hint, .backup, .board-meta, .board-bottom, footer, .item-preview { color: #5d7085; }
.export-panel { border-color: #d8c797; background: #fffdf6; }
.primary { color: #453612; background: #f2d48c; border-color: #d7b665; }
.primary:hover { background: #f9dfa4; border-color: #c6a453; }
.search-box input { background: #fff; }
.search-box span { color: #627b93; }
.history-actions .reset { color: #5b6f83; }
.divider { color: #8ba0b4; }
.board { background: #fff; border-color: #c1cedb; box-shadow: 0 7px 26px #536c8510; }
.board-title { background: linear-gradient(110deg, #f0f7fd, #fffdf7); border-color: #cad9e7; }
.board-title h2 { color: #2d4358; }
.board-title p { color: #5d7387; }
.board-ornament { color: #b19958; }
.tier-row { background: #fff; border-color: #d9e3ed; }
.tier-row:nth-child(even) { background: #f4f8fc; }
.tier-label, .tier-label:hover { background: var(--tier-color); color: #243747; }
.tier-label.unrated { background: #dce5ee; }
.empty-row { color: #6b8095; }
.tile { background: #fff; border-color: #c4d3e1; box-shadow: 0 2px 4px #39536c07; }
.tile:hover { background: #f8fbff; border-color: #789dbd; }
.tile-main, .tile-main:hover { background: transparent; color: #2e4358; }
.emblem {
  background: linear-gradient(135deg, hsl(var(--hue) 52% 93%), hsl(var(--hue) 43% 85%));
  color: hsl(var(--hue) 37% 32%);
  border-color: hsl(var(--hue) 32% 70%);
  box-shadow: inset 0 0 0 4px #ffffff45;
}
.emblem img { background: #fff; }
.emblem.illustrated { width: calc(var(--card, 90px) - 12px); height: calc(var(--card, 90px) - 12px); border: 0; background: #fff; box-shadow: none; }
.emblem.illustrated img { border-radius: 4px; }
.grip { background: #e8f0f8f2; color: #536f8a; }
.grip:hover { background: #ccdfef; color: #284f73; }
.role-legend { color: #526a80; }
.role-legend small, .board-bottom>span:last-child { color: #667b8f; }
footer { border-color: #cedbe7; }
dialog { color: #293b50; background: #fff; border-color: #bacddd; box-shadow: 0 25px 80px #28445b38; }
dialog::backdrop { background: #3b536c55; }
.warning { color: #704a20; background: #fff2d9; border-color: #dcb575; }
#toast { color: #254e3e; background: #e0f3e9; border: 1px solid #a8ceba; box-shadow: 0 5px 25px #2d536c25; }
#toast.error { color: #863c36; background: #ffebe8; border-color: #e0ada7; }
.drag-ghost { box-shadow: 0 10px 35px #23446040; }
.drop-before:before, .drop-after:after { background: #367bbb; box-shadow: 0 0 8px #6cadd84d; }
.tier-row.drop-zone .tier-items { background: #e8f4ff; box-shadow: inset 0 0 0 2px #6195c0; }
.tier-row.drop-zone .empty-row { color: #35658e; }