@import url('./team-tokens.css');

.site-preferences { display: flex; align-items: center; flex-wrap: wrap; gap: .6rem; }
.team-picker { display: flex; align-items: center; gap: .45rem; color: var(--ink); font: 600 .72rem/1.2 var(--sans); }
.team-picker > span { white-space: nowrap; }
.team-picker select { max-width: 16rem; min-height: 44px; padding: .55rem .7rem; border: 1px solid var(--rule); border-radius: .65rem; background: var(--surface); color: var(--ink); font: inherit; cursor: pointer; }
.team-picker-swatches { display: flex; gap: 3px; }
.team-picker-swatches i { display: block; width: .7rem; height: 1.6rem; border-radius: .2rem; border: 1px solid var(--hair); background: var(--team-primary); }
.team-picker-swatches i + i { background: var(--team-secondary); }
.site-preferences .theme-toggle,
.site-preferences .manager-account-button { min-height: 44px; border: 1px solid var(--rule); border-radius: .65rem; padding: .55rem .8rem; background: var(--surface); color: var(--ink); font: 700 .76rem/1.2 var(--sans); text-transform: uppercase; letter-spacing: .06em; box-shadow: none; }
.site-preferences .theme-toggle:hover,
.site-preferences .manager-account-button:hover { background: var(--surface-2); }
.team-picker select:disabled { cursor: wait; }
.site-preferences .theme-toggle { position: static; }
.masthead .masthead-inner { padding-top: 4rem; }
.lodge-header > div, .guide-header { display: flex; align-items: center; flex-wrap: wrap; gap: .75rem; }
.wire-icon.trade { color: var(--team-on-accent); }
:root[data-team] .section-head h2,
:root[data-team] .mh-word,
:root[data-team] .lodge-brand,
:root[data-team] .brand-section h2 { color: var(--series-1); }
:root[data-team] .btn,
:root[data-team] .chip[aria-pressed="true"] { background: var(--team-accent); color: var(--team-on-accent); border-color: var(--ink); }
:root[data-team] .btn:hover { background: var(--team-action-hover); filter: none; }
:root[data-team] .trophy-reactions button[aria-pressed="true"] { background: var(--team-accent); color: var(--team-on-accent); border-color: var(--ink); box-shadow: none; }
:root[data-team] .trophy-reactions button[aria-pressed="true"]::before { content: '\2713'; margin-right: .35em; }
:root[data-team] .trophy-reactions button { box-shadow: none; }
:root[data-team] .trophy-canvas:focus-visible { outline: 2px solid var(--ink); outline-offset: -4px; }
:root[data-team] .kicker { border-top: 4px solid var(--team-accent); }

@media (max-width: 960px), (max-width: 1100px) and (max-height: 600px) {
  #mobile-preferences-slot .site-preferences { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; width: 100%; }
  #mobile-preferences-slot .team-picker { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-column: 1 / -1; gap: .45rem; }
  #mobile-preferences-slot .team-picker > span:first-child { grid-column: 1 / -1; }
  #mobile-preferences-slot .team-picker select { width: 100%; max-width: none; font-size: .76rem; }
  #mobile-preferences-slot .theme-toggle,
  #mobile-preferences-slot .manager-account-button { width: 100%; justify-content: center; }
  #mobile-preferences-slot .team-picker-swatches { gap: 4px; }
  #mobile-preferences-slot .team-picker-swatches i { width: 1rem; height: 2.4rem; }
}
@media print { .site-preferences { display: none; } }