.theme-selector{display:flex;align-items:center;flex:none;gap:2px;padding:3px;border:1px solid #a43c2b;border-radius:5px;background:#201013;min-height:43px}
.theme-option{position:relative;display:grid;place-items:center;width:34px;height:35px;flex:none;padding:0;border:1px solid transparent;border-radius:3px;background:transparent;color:#f8e4d8;cursor:pointer}
.theme-option img{display:block;width:19px;height:19px;filter:invert(1);opacity:.65}
.theme-option[aria-pressed="true"]{background:#713025;border-color:#be5941}
.theme-option[aria-pressed="true"] img{opacity:1}
.theme-option[aria-disabled="true"]{cursor:default}
.theme-option:focus-visible{outline:2px solid #ffb08c;outline-offset:2px}
.theme-tooltip{position:absolute;top:calc(100% + 9px);left:50%;transform:translateX(-50%);z-index:20;padding:4px 8px;border:1px solid #a43c2b;border-radius:4px;background:#201013;color:#fff;font:600 12px/1.4 Inter,Arial,sans-serif;white-space:nowrap;visibility:hidden;pointer-events:none}
.theme-option:hover .theme-tooltip,.theme-option:focus-visible .theme-tooltip{visibility:visible}
@media(max-width:700px){.nav-tools{flex-wrap:wrap;max-width:100%}.theme-selector{min-height:36px;padding:2px}.theme-option{width:30px;height:30px}.theme-option img{width:17px;height:17px}}

html[data-theme="light"]{--red:#1589df;--muted:#deeff7}
html[data-theme="light"] body{background:#103c58;color:#fff}
html[data-theme="light"] header{background:#103c58}
html[data-theme="light"] body>nav{background:linear-gradient(180deg,#075184ed,#126599aa);color:#fff}
html[data-theme="light"] body>nav:before{background:linear-gradient(90deg,#06456cbb,#157bc655 42%,#06456c99),url('/assets/volcano-light.png') center top/auto 440px no-repeat}
html[data-theme="light"] body>nav:after{background:linear-gradient(180deg,#126599aa,#1479b333 45%,transparent)}
html[data-theme="light"] .brand img{filter:brightness(0) saturate(100%) invert(55%) sepia(94%) saturate(1900%) hue-rotate(168deg) brightness(108%)}
html[data-theme="light"] .hero-scene:after{background:linear-gradient(90deg,#062d50cf,transparent 43%),linear-gradient(0deg,#103c58,transparent 20%)}
html[data-theme="light"] .hero h1{color:#fff;text-shadow:0 2px 16px #062b46}
html[data-theme="light"] .hero h1 span{color:#55c6ff;text-shadow:0 2px 10px #07374f}
html[data-theme="light"] .hero p{color:#fff;text-shadow:0 1px 6px #062b46}
html[data-theme="light"] :is(.eyebrow,.tag,.address,.ase-mode,.mods-server,.stat-unconfigured){color:#7dd8ff;text-shadow:none}
html[data-theme="light"] :is(.navlinks a,.navlinks #next-wipe,.navlinks #event-button):is(:hover,:focus-visible){color:#9de6ff}
html[data-theme="light"] :is(.button.primary,.discord){background:#087dcc;border-color:#38b9ff;color:#fff}
html[data-theme="light"] :is(.language-control,.theme-selector,.theme-tooltip){background:#103f61;border-color:#479bce;color:#fff}
html[data-theme="light"] .language-control svg{color:#86d9ff}
html[data-theme="light"] .language-control option{background:#103f61;color:#fff}
html[data-theme="light"] .theme-option[aria-pressed="true"]{background:#1176b5;border-color:#7edbff}
html[data-theme="light"] :is(.theme-option,.stats-toggle):focus-visible{outline-color:#9de6ff}
html[data-theme="light"] :is(.filter,.server-actions button,.server-actions .server-vote){background:#103f61;color:#fff;border-color:#4289b1;box-shadow:none}
html[data-theme="light"] :is(.filter[aria-pressed="true"],.filter[aria-selected="true"],.rules-tab[aria-selected="true"]){background:#087dcc;border-color:#70ceff;color:#fff;box-shadow:0 5px 18px #007dcc33}
html[data-theme="light"] :is(.filter,.server-actions button,.server-actions .server-vote):hover{border-color:#8cddff;color:#fff}
html[data-theme="light"] :is(#ase,#asa,#nitrado) .card{background:linear-gradient(180deg,#123752 0%,#062039 28%,#04192c 75%,#103956 100%);border-color:#289cdd}
html[data-theme="light"] :is(#ase,#asa,#nitrado) .ase-name{color:#fff;background:none;-webkit-text-fill-color:#fff;filter:none;text-shadow:0 2px 6px #052b40}
html[data-theme="light"] :is(#ase,#asa,#nitrado) :is(.ase-mode,.ase-ip){color:#79d6ff;text-shadow:0 1px 3px #07334c}
html[data-theme="light"] :is(.ase-cluster,.status,.status b){color:#fff}
html[data-theme="light"] .ase-cluster:not(:empty):before,html[data-theme="light"] .ase-cluster:not(:empty):after{color:#66cdff}
html[data-theme="light"] :is(.setting-metric,.setting-metric:nth-child(3n+2),.setting-metric:nth-child(3n),.player-stat-card,.player-stats-panel,.settings-panel,.notice,.empty){background:#103d58;border-color:#4191b4;box-shadow:none;color:#fff}
html[data-theme="light"] .setting-metric:before{background:linear-gradient(90deg,#30b4ff,#9ae6ff88,transparent)}
html[data-theme="light"] :is(.setting-metric dt,.player-stat-card h3){color:#9ee1ff}
html[data-theme="light"] :is(.setting-metric dd,.stat-value,.populated-settings h3){color:#fff;text-shadow:none}
html[data-theme="light"] .player-stat-card .stat-icon{background:#125b89;border-color:#4fbded;color:#fff;box-shadow:none}
html[data-theme="light"] li::marker{color:#64ceff}
html[data-theme="light"] .common-rules{border-color:#4d9bb4}
html[data-theme="light"] :is(#mods-drawer,#wipe-dialog,#server-guide-dialog,#event-dialog){background:#103d58;color:#fff;border-color:#50b3e7;box-shadow:0 20px 70px #042c46aa}
html[data-theme="light"] :is(.mods-close,.wipe-close,.event-back){color:#fff;border-color:#61bde6;background:#164c69}
html[data-theme="light"] :is(.wipe-countdown,.event-clock,.event-card){background:#104b6b;border-color:#45b5ef;box-shadow:none;color:#fff}
html[data-theme="light"] .wipe-countdown>div{background:#103d58;border-color:#429bc2;box-shadow:none}
html[data-theme="light"] :is(.wipe-countdown strong,.event-countdown strong,#wipe-ended,#event-ended,.event-card small){color:#75d6ff;text-shadow:none}
html[data-theme="light"] :is(.wipe-countdown span,.wipe-date,.event-deadline,.event-countdown span){color:#fff}
html[data-theme="light"] .community-stats{background:#103f61ed;border-color:#51b8e166;box-shadow:0 12px 35px #00314c44}
html[data-theme="light"] :is(.stats-game,.player-history){background:#103d58;border-color:#61b7dc55;box-shadow:none}
html[data-theme="light"] .stats-metric{background:#0c344d;border-color:#5dadd244}
html[data-theme="light"] :is(.stats-toggle,.stats-metric strong,.stats-game h3,.history-heading h3,.stats-bar-label b){color:#fff}
html[data-theme="light"] :is(.stats-toggle strong,.stats-toggle:after,.stats-metric svg,.stats-game-top .stats-mark){color:#73d8ff}
html[data-theme="light"] .stats-toggle:after{color:#73d8ff}
html[data-theme="light"] :is(.stats-toggle small,.stats-welcome,.stats-metric span,.stats-chart-heading,.stats-bar-label,.stats-empty,.stats-game-foot,.stats-note,.history-heading span,.history-state,.history-source,.history-empty){color:#d5eefb}
html[data-theme="light"] :is(.stats-modes span,.stats-game-top .stats-mark){background:#157ab344;border-color:#68c6ee66;color:#a8e7ff}
html[data-theme="light"] .stats-bar{background:linear-gradient(90deg,#178ddc,#72dcff);box-shadow:none}
html[data-theme="light"] .history-line{stroke:#63d4ff}
html[data-theme="light"] .history-point{fill:#b0edff}
html[data-theme="light"] .history-plot path[fill]{fill:#49caff}
html[data-theme="light"] .history-grid{stroke:#9bd9f133}
html[data-theme="light"] .history-axis{fill:#c2e6f7}
body>footer{position:relative;z-index:1;background:#090b09;color:#fff}
body>footer a{color:#fff}
body>footer a:hover{text-decoration:underline;text-underline-offset:3px}
body>footer a:focus-visible{outline:2px solid currentColor;outline-offset:4px}
html[data-theme="light"] footer{color:#fff}
@media(max-width:700px){html[data-theme="light"] .hero{background:#103c58}}

html[data-nav-backdrop="forest"] body>nav{background:#090c0b99}
html[data-nav-backdrop="forest"] body>nav:before{
  background:linear-gradient(90deg,#050807b3,#05080794,#050807b3),url('/assets/jungle-background.jpg') center center/cover no-repeat;
}
html[data-nav-backdrop="forest"] body>nav:after{
  background:linear-gradient(180deg,#090c0bb3,#090c0b40 45%,transparent);
}

/* Share banner dimensions across categories, including cluster-map cards. */
#nitrado .card.has-cluster-map{height:112px;min-height:112px}
#nitrado .ase-heading{display:contents}
@media(min-width:1051px){
  #nitrado .has-cluster-map .ase-heading{
    grid-column:1;grid-row:1 / 4;align-self:center;
    display:flex;flex-direction:column;gap:2px;
  }
}
#nitrado .has-cluster-map .ase-map-label,
#nitrado .has-cluster-map .ase-ip{margin:0}
@media(min-width:701px) and (max-width:1050px){
  #nitrado .card.has-cluster-map{height:135px;min-height:135px}
}
@media(max-width:700px){
  #nitrado .card.has-cluster-map{height:106px;min-height:106px}
}
@media(max-width:440px){
  #nitrado .card.has-cluster-map{height:135px;min-height:135px}
}
@media(max-width:1050px){
  #nitrado .has-cluster-map .ase-copy{row-gap:1px}
  #nitrado .has-cluster-map .ase-name{font-size:20px}
  #nitrado .has-cluster-map .ase-mode{font-size:17px}
  #nitrado .has-cluster-map .ase-cluster{font-size:13px;margin:0}
  #nitrado .has-cluster-map .ase-map-label{font-size:13px;line-height:1;margin:0}
  #nitrado .has-cluster-map .ase-ip{font-size:18px;line-height:1;margin:0}
}

/* Keep the full artwork visible and fill the desktop hero edge to edge. */
.hero-art{max-height:max(120px,calc(100svh - var(--nav-height)));object-fit:contain;object-position:center top}
@media(min-width:701px){
  .hero-scene{height:max(120px,calc(100svh - var(--nav-height)))}
  .hero-art{height:100%;width:100%;max-height:100%;object-fit:cover;object-position:60% center}
  .hero-scene:after{background:linear-gradient(90deg,#050405bd,transparent 40%)}
  html[data-theme="light"] .hero-scene{background:#103c58}
  html[data-theme="light"] .hero-scene:after{background:linear-gradient(90deg,#062d50cf,transparent 43%)}
}
@media(min-width:701px) and (max-height:700px){
  .hero{padding:18px 20px;width:min(320px,34vw)}
  .hero h1{font-size:48px;margin:16px 0}
  .hero p{font-size:14px;line-height:1.45}
  .hero .eyebrow{font-size:11px;letter-spacing:0}
  .hero .actions{margin-top:18px;gap:8px}
  .hero .button{font-size:11px;padding:9px 12px}
}
