/* ODA 110 / Visual system 2.0
   A single high-contrast palette across the league, profiles, casino, forum and shop.
   Loaded AFTER the legacy inline CSS to keep specialized components in control. */
:root{
  color-scheme:dark;
  --bg:#071522;
  --surface:#102638;
  --surface-2:#173346;
  --surface-3:#1d3c50;
  --line:#35576a;
  --line-soft:#264459;
  --gold:#ffd777;
  --gold-2:#f3c561;
  --teal:#6fe0d0;
  --text:#f4f8fc;
  --muted:#c3d5e2;
  --shadow:0 16px 35px rgba(0,8,18,.28);
}
html{scroll-behavior:smooth}
body{
  color:var(--text);
  background:
    radial-gradient(ellipse 650px 540px at 15% 0%,rgba(29,83,109,.34),transparent 75%),
    radial-gradient(ellipse 500px 430px at 92% 34%,rgba(21,73,76,.2),transparent 72%),
    #071522;
  font-family:system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  line-height:1.45;
  -webkit-font-smoothing:antialiased;
}
.site-top,main{max-width:980px}
.site-top{
  background:#0a1e31;
  border-inline:1px solid #27465c;
  overflow:visible;
  box-shadow:0 5px 28px rgba(0,0,0,.22)
}
.pixel-landscape{border-bottom:1px solid #416579}
.simple-brand{text-shadow:0 3px 16px rgba(2,12,26,.94),0 1px 3px #061322}
.account-button{
  color:#fff8e5;
  background:rgba(11,32,50,.91);
  border:1px solid rgba(255,224,155,.6);
  border-radius:12px;
  padding:10px 11px;
  box-shadow:0 6px 18px rgba(0,0,0,.22)
}
.account-button:hover{background:#21495d}
.nav-tabs{
  display:flex!important;
  grid-template-columns:none!important;
  gap:7px!important;
  overflow-x:auto;
  overflow-y:hidden;
  padding:11px 12px 13px!important;
  background:linear-gradient(180deg,#0a1d30,#0d2438);
  scrollbar-width:thin;
  scrollbar-color:#426b7b transparent;
  -webkit-overflow-scrolling:touch;
  scroll-snap-type:x proximity;
  border-bottom:1px solid #335369;
}
.nav-tabs button{
  flex:1 0 auto;
  scroll-snap-align:start;
  height:42px;
  min-width:79px;
  white-space:nowrap;
  padding:0 13px;
  background:#172e44;
  color:#e7f2fa;
  border:1px solid #355771;
  border-radius:11px;
  font-weight:850;
  font-size:12px;
  letter-spacing:.05px;
  box-shadow:inset 0 1px rgba(255,255,255,.03);
  transition:background .15s,border-color .15s,transform .15s;
}
.nav-tabs button:hover{background:#24475c;border-color:#6c9bb1}
.nav-tabs button.active{
  color:#162b3a;
  -webkit-text-fill-color:#162b3a;
  background:linear-gradient(135deg,#ffe397,#f4c669);
  border-color:#ffeaaa;
  box-shadow:0 3px 12px rgba(253,197,79,.16);
  font-weight:950;
}
.nav-tabs button:focus-visible{outline:3px solid #81e6da;outline-offset:2px}
main{
  background:linear-gradient(180deg,#0a1c2b,#091a2b);
  border-inline:1px solid #27465c;
  padding:16px 16px 36px;
  min-height:68vh
}
.pixel-panel,
.tab-panel:not(:where(#standingsTab)) section:not(.oda-paper){
  border:1px solid #35586b;
  border-radius:16px;
  box-shadow:var(--shadow);
}
.panel-heading{
  padding:14px 17px;
  background:linear-gradient(120deg,#19374d,#153146);
  border-bottom:1px solid #355367;
  color:#f5f9fd;
  font-size:14px;
  font-weight:900;
  letter-spacing:.25px;
}
.panel-heading .heading-link{color:#ffdb8f}
h1,h2,h3,h4{overflow-wrap:anywhere}
.tab-panel:not(:where(#standingsTab)) h2{font-size:clamp(19px,3.5vw,25px)}
.tab-panel p,.pixel-panel p{line-height:1.55}
.small,.forum-meta,.ranking-caption,.meta-label{color:var(--muted)}
.meta-label{letter-spacing:.5px}
.pixel-primary,
#standingsTab .pixel-primary,
.tab-panel .member-me-button,
#profilesTab .member-save,
#cupsTab .cup-create-entry{
  background:linear-gradient(135deg,#ffe197,#f6c968);
  color:#152c3a;
  -webkit-text-fill-color:#152c3a;
  border:1px solid #ffe9b0;
  border-radius:11px;
  box-shadow:0 3px 12px rgba(255,209,112,.12);
  font-weight:900;
}
.pixel-primary:hover,
#profilesTab .member-me-button:hover{filter:brightness(1.07)}
button:disabled{cursor:not-allowed;opacity:.58}
:where(button,input,textarea,select,summary):focus-visible{
  outline:3px solid #8fe9dd;
  outline-offset:3px;
}
input,select,textarea{
  color:#15283a;
  background:#edf5fb;
  border:1px solid #9cb7c8;
  border-radius:10px;
  min-height:44px;
  padding:11px 12px;
  accent-color:#2b8e91;
}
input::placeholder,textarea::placeholder{color:#586f83;opacity:1}
input:focus,textarea:focus,select:focus{border-color:#6fd5cb;box-shadow:0 0 0 2px rgba(111,224,208,.18)}
input[type=file]{min-height:auto}
input[type=checkbox],input[type=radio]{min-height:auto;width:auto}
.modal-body{
  background:#122a3d;
  border-color:#628197;
  border-radius:18px;
  box-shadow:0 18px 65px rgba(0,0,0,.48)
}
.forum-box,.result{
  background:linear-gradient(120deg,#142d43,#11283c);
  border-color:#375e78;
  border-radius:13px;
}
.social-preview-row{border-color:#32556b}
.social-preview-row strong{color:#ffda8d}
.league-table{font-variant-numeric:tabular-nums}
.league-table th{
  background:#1a374b;
  color:#d4e5ef;
  border-bottom:1px solid #506d7f;
}
.league-table td{border-color:#304f65;color:#e9f3f9}
.league-table tbody tr:nth-child(even){background:#142a3c}
.league-table tbody tr:first-child{
  background:linear-gradient(90deg,rgba(226,181,72,.16),rgba(226,181,72,.06));
}
.league-table td:last-child{color:#ffdf8c}
.standings-switch button{border-radius:10px;background:#1a3448;color:#e8f4fd}
.standings-switch button.rank-active{background:#f6ce73;color:#1a2b37}
.member-standings-link{color:#ffe09a}
.match-scene{background:linear-gradient(135deg,#102d45,#173c46)}
.match-center b{color:#ffe398;font-size:clamp(24px,4vw,32px)}
.bet-preview{background:linear-gradient(145deg,#102b3f,#133344)}
.markets-grid span{background:#14374b;border-color:#3d6278;color:#e8f3f9}
.home-gazette-body{border-top:1px solid #d8bd87}

/* Player profiles: dark panels, high-contrast subtitles, restrained gold selection. */
#profilesTab.tab-panel .members-shell{
  background:linear-gradient(158deg,#11293d,#0d2235 63%,#102f3c)!important;
  border-color:#45677d!important;
  color:#f4f9fd;
  padding:clamp(12px,2.5vw,22px)!important;
}
#profilesTab .members-head h2{color:#ffe199!important;font-size:clamp(22px,4vw,29px)!important}
#profilesTab .members-head p{color:#d0e1eb!important;font-size:13px}
#profilesTab .members-list{gap:12px;margin:16px 0 20px}
#profilesTab.tab-panel button.member-card{
  background:linear-gradient(150deg,#1b3e53 0%,#132e43 72%,#10273a 100%)!important;
  color:#f8fcff!important;
  -webkit-text-fill-color:#f8fcff!important;
  border:1px solid #4b7287!important;
  border-radius:15px!important;
  min-height:186px;
  padding:16px 10px!important;
  box-shadow:0 9px 23px rgba(0,11,25,.27)!important;
  transform:translateZ(0);
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
#profilesTab.tab-panel button.member-card:hover{
  transform:translateY(-3px);
  background:linear-gradient(145deg,#23516a,#173b52)!important;
  border-color:#7cccbf!important;
}
#profilesTab.tab-panel button.member-card.active{
  background:linear-gradient(145deg,#224b60,#193549)!important;
  border:2px solid #f9d27a!important;
  box-shadow:0 0 0 2px rgba(255,215,125,.1),0 13px 28px rgba(0,8,24,.38)!important;
}
#profilesTab button.member-card .member-card-name{
  color:#fff7e7!important;
  -webkit-text-fill-color:#fff7e7!important;
  font-size:15px!important;
  line-height:1.35;
}
#profilesTab button.member-card .member-card-sub{
  color:#cfe0ea!important;
  -webkit-text-fill-color:#cfe0ea!important;
  font-size:12px!important;
  font-weight:650;
}
#profilesTab button.member-card .member-card-rank{
  background:#0c2638!important;
  color:#ffe3a2!important;
  -webkit-text-fill-color:#ffe3a2!important;
  border:1px solid #746d50!important;
  border-radius:999px;
  padding:6px 10px;
  font-size:11px!important;
}
#profilesTab .member-card-avatar{
  background:#0b2539;
  box-shadow:0 5px 15px rgba(0,0,0,.42);
  border-width:3px;
  border-radius:18px;
}
#profilesTab .member-profile-hero{
  color:#f4f9fd;
  border-radius:17px;
  box-shadow:var(--shadow);
}
#profilesTab .member-profile-title h3{color:#fff4d3;font-size:clamp(22px,4vw,30px)}
#profilesTab .member-profile-title p,
#profilesTab .member-bio{color:#e0ebf3}
#profilesTab .member-profile-flair{background:#163c4b;color:#ffe1a4}
#profilesTab .member-stat{background:#142f43;border-color:#456577;border-radius:12px}
#profilesTab .member-stat b{color:#ffe09a}
#profilesTab .member-stat span{color:#d2e2eb;font-size:11px}
#profilesTab .member-badges{background:#112d3e;border-color:#35586d;border-radius:13px}
#profilesTab .member-editor{background:#122d41;border-color:#756d56;border-radius:16px}
#profilesTab .member-field{color:#dbe8f0}
#profilesTab .member-field input,#profilesTab .member-field select,#profilesTab .member-field textarea{
  background:#edf4f8!important;
  color:#152b3a!important;
  -webkit-text-fill-color:#152b3a!important;
  border:1px solid #92b6c7!important;
  min-height:43px;
}
#profilesTab .member-field input::placeholder{color:#63798b}
#profilesTab button.member-avatar-choice{
  background:#153548!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  border-color:#527184!important;
}
#profilesTab button.member-avatar-choice.selected{border-color:#ffe09e!important;background:#27536b!important}
#profilesTab .member-color-choice{box-shadow:0 0 0 1px #f7ecd3}
#profilesTab .member-color-choice.selected{box-shadow:0 0 0 3px #ffe0a0}
#profilesTab button.member-cancel{background:#203e50!important;color:#f3f7ff!important;border-color:#5a7d8c!important}
#profilesTab button.member-edit-button,#profilesTab button.member-save,#profilesTab button.member-me-button{
  background:linear-gradient(125deg,#ffe19b,#f4c869)!important;
  color:#1a2d3d!important;-webkit-text-fill-color:#1a2d3d!important;
  border-color:#ffe7b0!important;
}

/* Horse racing: NEVER inherit bright yellow default buttons with pale text. */
#casinoTab .horse-bets{gap:16px}
#casinoTab .horse-choices{gap:9px}
#casinoTab.tab-panel .horse-choice{
  background:linear-gradient(135deg,#204358,#173548)!important;
  border:1px solid #557888!important;
  border-radius:13px!important;
  color:#f8fcff!important;
  -webkit-text-fill-color:#f8fcff!important;
  min-height:84px;
  padding:12px 13px!important;
  box-shadow:0 5px 14px rgba(0,12,24,.23)!important;
  transition:background .16s,border-color .16s,transform .16s;
}
#casinoTab.tab-panel .horse-choice:hover{
  background:linear-gradient(125deg,#27526a,#1b4158)!important;
  border-color:#7cc8bf!important;
}
#casinoTab.tab-panel .horse-choice.active{
  background:linear-gradient(115deg,#195348,#1b4850)!important;
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
  border:2px solid #ffe19b!important;
  outline:none!important;
  box-shadow:inset 0 0 0 1px rgba(255,220,141,.2),0 0 0 3px rgba(253,217,138,.12)!important;
}
#casinoTab .horse-choice-info strong{
  color:#ffffff!important;-webkit-text-fill-color:#ffffff!important;
  font-size:14px!important;font-weight:900;
}
#casinoTab .horse-choice-info small{
  color:#d4e7f0!important;-webkit-text-fill-color:#d4e7f0!important;
  font-size:12px!important;font-weight:750;
}
#casinoTab .horse-rating{
  color:#ffe090!important;-webkit-text-fill-color:#ffe090!important;
  text-shadow:none!important;
  font-size:15px!important;
}
#casinoTab.tab-panel .horse-choice .horse-odds{
  color:#ffe39b!important;-webkit-text-fill-color:#ffe39b!important;
  font-size:clamp(16px,3vw,21px)!important;
  text-shadow:none!important;
}
#casinoTab .horse-choice .horse-n{
  color:#13283a!important;
  -webkit-text-fill-color:#13283a!important;
  font-size:15px;
  border:1px solid rgba(255,255,255,.6);
  min-width:34px;min-height:34px;
  display:inline-flex;align-items:center;justify-content:center
}
#casinoTab.tab-panel .horse-shell{
  border-color:#477966!important;
  background:linear-gradient(165deg,#123e3e,#102d3c 58%,#0c2337)!important;
}
#casinoTab .horse-top h2{color:#ffe3a2;font-size:clamp(20px,4vw,27px)}
#casinoTab .horse-top p,#casinoTab .horse-note{color:#d3e8e9}
#casinoTab .horse-stakes{
  background:#12383c!important;
  border:1px solid #426c71;
  border-radius:13px!important;
}
#casinoTab .horse-stakes label{color:#d3e7e9}
#casinoTab #horseStake{
  background:#e9f2f7!important;color:#14283a!important;
  -webkit-text-fill-color:#14283a!important;
  border-color:#9bbcc6;
  border-radius:10px;
}
#casinoTab .horse-return{background:#19433f;color:#ffe6aa;border-color:#4e8577;border-radius:11px}
#casinoTab .horse-course{border-color:#b7a376;border-radius:14px}
#casinoTab .horse-status{color:#e5f3e7}
#casinoTab .horse-history-row{background:#153b43;border-color:#43717a}
#casinoTab .horse-placings{border-radius:12px}
#casinoTab .horse-bets h3{color:#ffe09a}
#casinoTab.tab-panel .horse-chips button{
  background:#22516a!important;color:#effaff!important;
  -webkit-text-fill-color:#effaff!important;
  border:1px solid #678e9a!important;
  border-radius:9px!important;
}
#casinoTab.tab-panel button.horse-start{
  background:linear-gradient(120deg,#ffe39b,#f1c15c)!important;
  color:#142b3a!important;-webkit-text-fill-color:#142b3a!important;
  border-color:#fff0ba!important;
  border-radius:12px!important;
  min-height:51px;
}

/* Roulette and other games keep real game colors, but share consistent containers. */
#casinoTab .casino-game-switch button{border-radius:11px!important}
#casinoTab .casino-game-switch button.game-active{
  background:#f6d17b!important;color:#152c3a!important;
  -webkit-text-fill-color:#152c3a!important;
}
#casinoTab .casino-bet-controls{border-radius:13px;border-color:#4c706d}
#casinoTab .casino-ticket{border-radius:11px}
#casinoTab .casino-result{border-radius:12px}
#casinoTab #casinoNumbers button{border-radius:7px!important}
#casinoTab .casino-more-bets{border-radius:12px}
#casinoTab .casino-wallet{color:#ffe7aa}

/* Public social and shop surfaces. Preserve the paper's distinct ivory page. */
#forumTab .forum-box{background:linear-gradient(125deg,#16364c,#122d41);border-color:#436982}
#forumTab .forum-meta{color:#c8dbe5}
#forumTab .forum-author-date{color:#c1d5e1}
#forumTab .forum-author-link{color:#ffe09b!important}
#shopTab .shop-card{
  background:linear-gradient(145deg,#1a394a,#122c40);
  border-color:#4d7284;
  border-radius:14px;
  box-shadow:0 8px 19px rgba(0,13,22,.18)
}
#shopTab .shop-card h3{color:#ffe4a5}
#shopTab .shop-card p{color:#d4e3ed}
#shopTab .shop-card .shop-price{color:#ffe3a0}
#shopTab .shop-card button:not(.equipped){
  background:#ffd578;color:#152c3a;-webkit-text-fill-color:#152c3a;
}
#shopTab .shop-card button.equipped{background:#226c5b;color:#fff}
#cupsTab .cup-round,#cupsTab .cup-intro{border-radius:13px}
#cupsTab .cup-match{border-radius:11px}
#cupsTab .cup-create-entry{border-radius:12px!important}

/* The newspaper intentionally uses ink-on-paper, unlike the rest of the site. */
#gazetteTab.tab-panel section.oda-paper{
  background:#f7eedc!important;
  color:#211913!important;
  border-color:#c5ac80!important;
}
#gazetteTab .oda-paper :is(h2,h3,h4,.paper-byline,.paper-summary){text-shadow:none!important}

/* Wider clickable targets, minimal mobile scrolling, and responsive layouts. */
@media(max-width:650px){
  .nav-tabs{gap:6px!important;padding:9px 9px 11px!important}
  .nav-tabs button{flex:0 0 auto;min-width:88px;height:43px;font-size:12px!important;padding:0 11px!important}
  main{padding:10px 9px 24px}
  .panel-heading{padding:12px 13px}
  #profilesTab .members-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  #profilesTab.tab-panel button.member-card{min-height:180px;padding:13px 9px!important}
  #casinoTab .horse-choices{grid-template-columns:1fr}
  #casinoTab .horse-choice-info strong{font-size:15px!important}
  #casinoTab .horse-choice-info small{font-size:12px!important}
  #casinoTab .horse-bets{grid-template-columns:1fr}
  .shop-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:390px){
  .nav-tabs button{min-width:85px}
  #profilesTab.tab-panel button.member-card{padding:12px 7px!important;min-height:173px}
  #profilesTab .member-card-avatar{width:58px;height:58px}
  #profilesTab button.member-card .member-card-name{font-size:14px!important}
  #profilesTab button.member-card .member-card-sub{font-size:11px!important}
  #casinoTab.tab-panel .horse-choice{padding:10px!important}
  .match-contenders{gap:5px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}
}

/* Final mobile navigation affordance and colorful horse-number legibility. */
#casinoTab .horse-choice .horse-n{
  color:#07101c!important;
  -webkit-text-fill-color:#07101c!important;
  text-shadow:none!important;
}
.nav-scroll-hint{
  display:none;
  color:#a8c6d7;
  font-size:10px;
  text-align:center;
  letter-spacing:.45px;
  background:#0d2438;
  border-bottom:1px solid #29495c;
  padding:2px 6px 7px;
}
@media(max-width:650px){
  .nav-scroll-hint{display:block}
  .nav-tabs{border-bottom:0}
}


/* Searchable ODA 110 roster: legible contrast, touch-friendly clear action. */
#profilesTab .members-searchbar{
 display:grid;gap:6px;margin:14px 0 7px;
 background:linear-gradient(135deg,#19394e,#122d42);
 border:1px solid #52748a;
 border-radius:13px;padding:12px 13px;
}
#profilesTab .members-searchbar>label{
 color:#ffe19a;font-size:13px;font-weight:850
}
#profilesTab .members-search-controls{display:flex;gap:8px;align-items:center}
#profilesTab #memberSearch{
 flex:1;min-width:0;margin:0;
 background:#f2f8fc;color:#132b3a;-webkit-text-fill-color:#132b3a;
 border:1px solid #92bac8;border-radius:10px;
 font-size:15px;padding:12px
}
#profilesTab #memberSearchClear,
#profilesTab #memberRetry{
 background:#274d61!important;color:#f0faff!important;
 -webkit-text-fill-color:#f0faff!important;
 border:1px solid #6e9cad!important;
 border-radius:10px;padding:10px 13px!important;
 font-weight:800
}
#profilesTab #memberSearchClear{min-width:46px;min-height:46px}
#profilesTab .members-found{color:#c9dfeb;font-size:11px;font-weight:700}
#profilesTab .members-empty{
 grid-column:1/-1;padding:22px;
 border:1px dashed #7897a6;background:#173747;
 color:#eaf4f9;border-radius:12px;text-align:center;font-size:13px
}
#profilesTab .members-message{color:#f7dc99}
#cupsTab .cup-delete-action{
 background:#692f37!important;color:#fff5f3!important;
 -webkit-text-fill-color:#fff5f3!important;
 border:1px solid #d38b8b!important;border-radius:9px!important;
 font-weight:900;padding:11px 14px!important;
 margin:10px 0 0;min-height:43px;width:100%
}
#cupsTab .cup-delete-action:hover{background:#87404b!important}
#cupsTab .cup-delete-action:focus-visible{outline:3px solid #ffe1a4}


/* Instagram-like profile finder. No public grid before the visitor searches. */
#profilesTab .members-list{
 display:flex!important;flex-direction:column!important;
 grid-template-columns:none!important;gap:7px!important;
 margin:10px 0 20px!important;
}
#profilesTab .member-search-result{
 display:flex!important;flex-direction:row!important;align-items:center!important;
 width:100%!important;min-width:0!important;min-height:77px!important;
 padding:11px 12px!important;gap:12px!important;
 background:linear-gradient(120deg,#1a3c50,#132b40)!important;
 color:#f4f9fc!important;-webkit-text-fill-color:#f4f9fc!important;
 border:1px solid #496f83!important;border-radius:13px!important;
 box-shadow:0 3px 12px #020e1940!important;
 text-align:left!important;
}
#profilesTab .member-search-result:hover,
#profilesTab .member-search-result.active{
 background:#24516a!important;border-color:#eecb80!important;
}
#profilesTab .member-search-result .member-card-avatar{
 width:49px!important;height:49px!important;min-width:49px!important;
 font-size:26px!important;border-radius:50%!important;margin:0!important;
}
#profilesTab .member-search-info{
 display:flex;flex-direction:column;gap:3px;min-width:0;flex:1;
}
#profilesTab .member-search-name{
 color:#fff8eb!important;-webkit-text-fill-color:#fff8eb!important;
 font-size:15px!important;font-weight:900!important;
 white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
#profilesTab .member-search-handle{
 color:#c5dce9!important;-webkit-text-fill-color:#c5dce9!important;
 font-size:12px!important;font-weight:600!important;
 white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
#profilesTab .member-search-ranking{
 color:#ffe3a3!important;-webkit-text-fill-color:#ffe3a3!important;
 font-size:11px!important;font-weight:850;
 white-space:nowrap;
}
#profilesTab .member-search-chevron{font-size:26px;color:#8bc3c5;-webkit-text-fill-color:#8bc3c5}
#profilesTab .members-found{color:#a9cbdd;font-size:12px}
#profilesTab .members-empty{width:100%;margin:0}
#profilesTab #memberDetail.hidden{display:none!important}
#profilesTab .member-back-to-search{
 background:#244559!important;color:#f5f7fc!important;-webkit-text-fill-color:#f5f7fc!important;
 border:1px solid #6a8a9a!important;border-radius:9px!important;
 padding:10px 13px!important;font-size:12px!important;font-weight:850;
 margin:0 0 12px!important;
}
@media(max-width:450px){
 #profilesTab .member-search-result{padding:10px!important;gap:9px!important}
 #profilesTab .member-search-ranking{font-size:10px!important}
 #profilesTab .member-search-result .member-card-avatar{width:44px!important;height:44px!important;min-width:44px!important}
}