:root {
  color-scheme: light;
  --theme-panel: #fff0d5;
  --theme-panel-raised: #f2e1c2;
  --theme-on-panel: #352218;
}
.theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 44px;
  padding: 8px 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  color: var(--ink);
  background: transparent;
  font-size: 13px;
  flex-shrink: 0;
}
.theme-toggle > span:first-child {
  font-size: 19px;
  line-height: 1;
}
.theme-toggle:hover {
  background: var(--cream);
  color: #352218;
}
.header .theme-toggle {
  margin: 0;
}
.header .header-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
  margin-left: auto;
}
.header-actions .nav-login {
  font-size: 13px;
  white-space: nowrap;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.header #navigation {
  margin-left: auto;
}
@media (max-width: 900px) {
  .header .header-actions {
    order: 2;
    margin-left: 0;
  }
  .header .menu-toggle {
    margin-left: auto;
  }
  .header #navigation {
    top: 100%;
    margin-left: 0;
  }
}
@media (max-width: 600px) {
  .header {
    height: auto;
    min-height: 75px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 44px;
    padding: 12px 16px;
    gap: 10px;
  }
  .header .brand {
    grid-column: 1;
    grid-row: 1;
    font-size: 22px;
  }
  .header .brand img {
    width: 32px;
    height: 32px;
  }
  .header .menu-toggle {
    grid-column: 2;
    grid-row: 1;
    margin: 0;
    width: 44px;
    height: 44px;
    padding: 12px;
    font-size: 0;
    border-radius: 12px;
  }
  .header .menu-toggle::before {
    content: "";
    display: block;
    width: 18px;
    height: 2px;
    margin: auto;
    background: currentColor;
    box-shadow: 0 -6px currentColor, 0 6px currentColor;
  }
  .header .header-actions {
    grid-column: 1 / -1;
    grid-row: 2;
    width: 100%;
    min-width: 0;
  }
  .header-actions .nav-login {
    flex: 1;
    min-width: 0;
    justify-content: center;
    padding: 10px 12px;
  }
}
html[data-theme="dark"] {
  --theme-panel: #2a201a;
  --theme-panel-raised: #35281f;
  --theme-on-panel: #f8e7cf;
  --ink: #f8e7cf;
  --butter: #1c1512;
  --line: #5b4635;
  --muted: #c2aa8e;
  --caramel: #e5ad71;
  --cocoa: #35241c;
  --dark-surface: #2a201a;
  --dark-raised: #35281f;
}
/* Warm brand surfaces need their own text and borders in both modes. */
html[data-theme="dark"]
  :is(.season-banner, .closing, .locked, dialog .command-ref) {
  background: var(--theme-panel-raised);
  color: var(--theme-on-panel);
  border-color: var(--line);
}
html[data-theme="dark"] .season-banner {
  box-shadow: 0 7px 0 #100c09;
}
html[data-theme="dark"]
  :is(.season-banner p, .closing p, .locked p, dialog .command-ref small) {
  color: var(--muted);
}
html[data-theme="dark"] .form-error {
  color: #ffc29e;
}
html[data-theme="dark"] .ranking-hall .rank-page-button:not(:disabled):hover {
  background: #493421;
  color: #ffe8c6;
}
html[data-theme="dark"] .ranking-hall .rank-personal:hover {
  background: #35281f;
}
html[data-theme="dark"] .inventory-hall .inv-card:hover {
  box-shadow: 0 8px 0 #100c09;
}
html[data-theme="dark"] .inventory-hall .inv-active {
  background: #36452c;
  color: #dcebc7;
}
html[data-theme="dark"] .inventory-hall .inv-equipped-filter input {
  accent-color: #f2b65f;
}
html[data-theme="dark"] .inventory-hall .inv-art {
  background: radial-gradient(circle, #fff4df, var(--wash));
}
html[data-theme="dark"] .ranking-hall .rank-empty .rank-overline {
  color: #eac58c;
}
html[data-theme="dark"] .ranking-hall .rank-empty-tip {
  color: #dac09b;
}
html[data-theme="dark"] .btn {
  color: #352218;
  border-color: #986837;
  box-shadow: 0 5px 0 #6c482b;
}
html[data-theme="dark"] .btn.secondary {
  color: var(--ink);
  border-color: var(--line);
  box-shadow: none;
}
html[data-theme="dark"] :is(input, select, textarea) {
  background: var(--dark-surface);
  color: var(--ink);
  border-color: var(--line);
}
html[data-theme="dark"]
  :is(
    .item-card,
    .settings-tabs button.active,
    .conversation,
    .command-card,
    .guild,
    .empty,
    .notice,
    .feature-card
  ) {
  background: var(--dark-surface);
  color: var(--ink);
}
html[data-theme="dark"] .command-tabs button.active {
  background: var(--dark-raised);
  color: var(--ink);
}
html[data-theme="dark"] .map {
  background: #34291d;
  border-color: #5b4635;
}
html[data-theme="dark"] .map:before {
  border-color: #51402c;
}
html[data-theme="dark"] .scene-disc {
  background: #654721;
}
html[data-theme="dark"] .guild-icon {
  background: #654721;
  color: #fff0d5;
}
html[data-theme="dark"] .tag {
  background: #493421;
  color: #f1c68b;
}
html[data-theme="dark"] :is(.skip, .theme-toggle:hover) {
  color: #352218;
}
html[data-theme="dark"] :is(a, button, input, select, summary):focus-visible {
  outline-color: #ffd28c;
}
html[data-theme="dark"] .inventory-hall {
  --inv-ink: #f8e7cf;
}
html[data-theme="dark"]
  .inventory-hall
  :is(.inv-toolbar input[type="search"], .inv-toolbar select) {
  background: #2a201a;
  color: #f8e7cf;
  border-color: #65503b;
  box-shadow: 0 3px 0 #493526;
}
html[data-theme="dark"] .inventory-hall .inv-card {
  background: linear-gradient(155deg, #35281f, #271d18);
  border-color: #5b4635;
  border-top-color: var(--rarity);
  box-shadow: 0 5px 0 #100c09;
}
html[data-theme="dark"] .inventory-hall .inv-rarity--comum {
  --rarity: #c3b9aa;
}
html[data-theme="dark"] .inventory-hall .inv-rarity--incomum {
  --rarity: #95c69a;
}
html[data-theme="dark"] .inventory-hall .inv-rarity--raro {
  --rarity: #91bde6;
}
html[data-theme="dark"] .inventory-hall .inv-rarity--epico {
  --rarity: #c5a2e2;
}
html[data-theme="dark"] .inventory-hall .inv-rarity--lendario {
  --rarity: #efc16c;
}
html[data-theme="dark"] .inventory-hall .inv-rarity--mitico {
  --rarity: #ef9abd;
}
html[data-theme="dark"]
  .inventory-hall
  :is(
    .inv-description,
    .inv-category,
    .inv-quantity,
    .inv-private-note,
    .inv-discord-hint,
    .inv-empty p,
    .inv-toolbar label > span,
    #inventory-count,
    .inv-reserved
  ) {
  color: #c9b297;
}
html[data-theme="dark"] .inventory-hall .inv-quantity {
  border-color: #5b4635;
}
html[data-theme="dark"] .inventory-hall .inv-quantity b {
  color: #ffe0af;
}
html[data-theme="dark"] .inventory-hall .inv-empty {
  background: #2a201a;
  border-color: #756044;
}
html[data-theme="dark"] .ranking-hall {
  color: #f8e7cf;
  --rank-gold: #efc16c;
  --rank-silver: #b7c8d4;
  --rank-bronze: #e6b18a;
}
html[data-theme="dark"] input::placeholder {
  color: #bba58c;
  opacity: 1;
}
html[data-theme="dark"]
  .ranking-hall
  :is(
    .rank-category-input,
    .rank-personal,
    .rank-standing,
    .rank-page-button,
    .rank-empty
  ) {
  background: #2a201a;
  color: #f8e7cf;
  border-color: #65503b;
  box-shadow: none;
}
html[data-theme="dark"] .ranking-hall .rank-category-input select {
  color: #f8e7cf;
}
html[data-theme="dark"]
  .ranking-hall
  :is(
    .rank-section-label,
    .rank-category > span:first-child,
    .rank-personal small,
    .rank-personal > span > span,
    .rank-standing-score small,
    .rank-data-note,
    .rank-page-label,
    .rank-empty p
  ) {
  color: #c9b297;
}
html[data-theme="dark"]
  .ranking-hall
  :is(
    .rank-personal b,
    .rank-standing-name,
    .rank-standing-score b,
    .rank-page-label b
  ) {
  color: #ffe8c6;
}
html[data-theme="dark"] .ranking-hall .rank-medalist {
  background: linear-gradient(150deg, #3d342c, #2c2722);
  color: #e3d3bf;
  border-color: #80766a;
  box-shadow: 0 6px 0 #12100e;
}
html[data-theme="dark"] .ranking-hall .rank-medalist--1 {
  background: radial-gradient(ellipse at top, #73521f, #392919);
  color: #ffe1a0;
  border-color: #b68a40;
  box-shadow:
    0 6px 0 #61451f,
    0 0 35px #bd863322;
}
html[data-theme="dark"] .ranking-hall .rank-medalist--3 {
  background: linear-gradient(150deg, #4b3224, #30231c);
  color: #f1c39d;
  border-color: #936f4e;
}
html[data-theme="dark"]
  .ranking-hall
  :is(
    .rank-medalist h3,
    .rank-score strong,
    .rank-medalist--1 .rank-score strong
  ) {
  color: #ffebce;
}
html[data-theme="dark"]
  .ranking-hall
  :is(.rank-score-unit, .rank-award-label, .rank-step) {
  color: inherit;
}
html[data-theme="dark"] .ranking-hall .rank-standing:hover {
  background: #3d2d22;
}
html[data-theme="dark"]
  .ranking-hall
  :is(.rank-skeleton-card, .rank-skeleton-rows > div) {
  background: #2a201a;
  border-color: #5b4635;
}
@media (max-width: 900px) {
  .header {
    gap: 10px;
  }
  .header .theme-toggle {
    order: 0;
    margin-left: 0;
    margin-right: 0;
  }
  .theme-label {
    display: none;
  }
  .theme-toggle {
    width: 44px;
    padding: 8px;
  }
  .header .menu-toggle {
    color: var(--ink);
  }
}
