/* Personal site cosmetics. Existing solid panels keep the content readable. */
.site-theme-sample { --site-background-image: none; --site-background-size: cover; --site-background-repeat: no-repeat; }
body[data-site-background], .site-theme-sample {
  background-color: #0e131b;
  background-image: var(--site-background-image, none);
  background-size: var(--site-background-size, cover);
  background-position: center top;
  background-repeat: var(--site-background-repeat, no-repeat);
}
[data-site-background="background-midnight"] {
  --site-background-image: radial-gradient(ellipse at 80% 10%, #23446d 0%, transparent 55%), linear-gradient(150deg, #090f1e, #12253d 65%, #090e19);
}
[data-site-background="background-aurora"] {
  --site-background-image: radial-gradient(ellipse at 15% 0%, #235b51 0%, transparent 55%), radial-gradient(ellipse at 85% 30%, #452758 0%, transparent 60%), linear-gradient(130deg, #0b1c23, #101627);
}
[data-site-background="background-ember"] {
  --site-background-image: radial-gradient(ellipse at 90% 90%, #72321e 0%, transparent 60%), radial-gradient(ellipse at 5% 0%, #42202a 0%, transparent 50%), linear-gradient(140deg, #171216, #241a17);
}
[data-site-background="background-grid"] {
  --site-background-image: linear-gradient(#4b94b329 1px, transparent 1px), linear-gradient(90deg, #4b94b329 1px, #101c2b 1px);
  --site-background-size: 36px 36px; --site-background-repeat: repeat;
}
[data-site-background="background-sakura"] {
  --site-background-image: url("/assets/sakura-petals.svg"), linear-gradient(130deg, #281a2a, #39202e);
  --site-background-size: 320px 256px, cover; --site-background-repeat: repeat, no-repeat;
}
[data-site-background="background-carbon"] {
  --site-background-image: conic-gradient(#1c2228 25%, #14191f 0% 50%, #1c2228 0% 75%, #14191f 0%);
  --site-background-size: 14px 14px; --site-background-repeat: repeat;
}
[data-site-background="background-sunset"] {
  --site-background-image: repeating-linear-gradient(0deg, #130f242e 0 2px, transparent 2px 12px), radial-gradient(ellipse at 50% 0%, #643a30 0%, #4b284c 35%, #17182c 80%);
}
[data-site-background="background-ocean"] {
  --site-background-image: repeating-radial-gradient(ellipse at 100% 0%, transparent 0 44px, #458c9c26 45px 46px, transparent 47px 70px), linear-gradient(120deg, #0c1e2b, #153641);
}
[data-site-background="background-topography"] {
  --site-background-image: repeating-radial-gradient(ellipse at 0% 30%, transparent 0 22px, #aaa16e24 23px 24px, transparent 25px 42px), linear-gradient(150deg, #212720, #171d1c);
}
[data-site-background="background-starlight"] {
  --site-background-image: radial-gradient(circle at 20% 35%, #d0d6f4a6 0 1px, transparent 1.5px), radial-gradient(circle at 65% 80%, #9fafe178 0 1px, transparent 1.5px), linear-gradient(150deg, #10132a, #1c1c36);
  --site-background-size: 103px 137px, 173px 97px, cover; --site-background-repeat: repeat, repeat, no-repeat;
}

/* Accent overrides target navigation and controls, not wins, losses or P1/P2. */
body { --site-accent: var(--cyan); }
.site-tabs button[aria-selected="true"], #tournamentTab[aria-selected="true"], #shopTab[aria-selected="true"],
.shop-category-tabs button[aria-pressed="true"] { color: var(--site-accent); border-bottom-color: var(--site-accent); }
.kicker, #shopView .section-label { color: var(--site-accent); }
.account-menu { border-top-color: var(--site-accent); }
button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible, a:focus-visible { outline-color: var(--site-accent); }
.chat-form button, .style-form > button, .password-form > button { background: var(--site-accent); color: #101518; }
.shop-card.equipped { border-color: var(--site-accent); }
.shop-card > button:not(:disabled):hover, .loadout-slot > button:not(:disabled):hover { border-color: var(--site-accent); color: var(--site-accent); }
.shop-category-tabs { display: flex; flex-wrap: wrap; }
.shop-category-tabs button { flex: 1 0 auto; padding-inline: 12px; }
.shop-ownership-filter { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 16px; }
.shop-ownership-filter label { font-size: 12px; color: var(--muted); }
.shop-ownership-filter select { padding: 7px 28px 7px 10px; max-width: 100%; }
.shop-ownership-filter span { margin-left: auto; font-size: 12px; color: var(--muted); }
.shop-grid.empty { display: block; padding: 32px 20px; background: var(--panel); color: var(--muted); font-size: 14px; }
.site-theme-sample { width: 100%; height: 100%; min-height: 112px; padding: 14px; border: 1px solid #ffffff12; display: flex; flex-direction: column; gap: 12px; justify-content: center; }
.site-theme-sample-heading { align-self: flex-start; color: var(--site-accent); font: 600 13px 'Barlow Condensed', sans-serif; letter-spacing: .08em; border-bottom: 2px solid var(--site-accent); padding-bottom: 4px; }
.site-theme-sample-panels { display: flex; gap: 8px; }
.site-theme-sample-panels i { flex: 1; height: 25px; background: #141c25ed; border: 1px solid #ffffff24; }
.site-theme-sample-panels i:first-child { border-top: 2px solid var(--site-accent); }
.shop-card.site-cosmetic .shop-card-visual { padding: 0; }
/* Shared header stays on the page background on every tab. */
body[data-site-tab="casino"] .masthead { background: transparent; }
body[data-site-tab="stats"] .kicker, body[data-site-tab="dailies"] .kicker { display: block; }
.masthead .kicker { text-transform: none; }
#casinoTab[aria-selected="true"] { background: transparent; color: var(--site-accent); border-bottom-color: var(--site-accent); }

/* Announcements remain in document flow without covering the page texture. */
#siteAnnouncement { background: transparent; border: 0; box-shadow: none; padding-block: 14px; align-items: baseline; }
#siteAnnouncement strong, #siteAnnouncement p {
  -webkit-text-stroke: 2px #080a0e;
  paint-order: stroke fill;
  text-shadow: 0 2px 3px #000c;
}
#siteAnnouncement strong { color: var(--site-accent); }
#siteAnnouncement p { color: #f2f0ea; font-size: 15px; line-height: 1.6; overflow-wrap: anywhere; min-width: 0; }

/* Equipped accents reach the whole interface, keeping outcome tokens intact. */
body[data-site-accent] {
  --panel: color-mix(in srgb, #181e22 90%, var(--site-accent));
  --line: color-mix(in srgb, #343c40 65%, var(--site-accent));
}
body[data-site-accent] :is(.masthead h1, .shop-hero h2, .stats-heading h2, .slots-heading h2, .hr-heading h2, .lb-heading h2, .mine-stage h2, .account strong, .shop-balance-panel strong) { color: var(--site-accent); }
body[data-site-accent] :is(.stream-heading, .site-chat-heading) { border-bottom-color: var(--site-accent); }
body[data-site-accent] :is(.join-panel, .ledger, .recent-outcomes-section, .leaderboard-section, .daily-board, .stats-chart-panel, .hr-machine) { border-top-color: var(--site-accent); }
body[data-site-accent] .slots-machine:not(.has-win) { border-top-color: var(--site-accent); }
body[data-site-accent] .hr-machine { background: var(--panel); }
body[data-site-accent] :is(.stats-line, .stats-crosshair) { stroke: var(--site-accent); }
body[data-site-accent] :is(.stats-area, .stats-marker) { fill: var(--site-accent); }
body[data-site-accent] :is(.daily-switch, .stats-switch, .stats-period, .casino-machines) button[aria-pressed="true"] { color: var(--site-accent); border-color: var(--site-accent); }
body[data-site-accent] :is(.daily-primary, .slots-spin, .hr-spin, .mine-retry, #statsSignIn, #statsRetry, .lb-categories button[aria-pressed="true"]) { color: #101518; background: var(--site-accent); border-color: var(--site-accent); }
body[data-site-accent] .hr-spin { box-shadow: inset 0 -4px 0 color-mix(in srgb, var(--site-accent) 65%, #101518); }
body[data-site-accent] .shop-card > button:not(:disabled) { color: var(--site-accent); border-color: color-mix(in srgb, var(--site-accent) 60%, var(--line)); }
body[data-site-accent] :is(.daily-bottom a, .slots-machine-top button[aria-pressed="true"], .hr-machine-top button[aria-pressed="true"], .lb-toolbar button[aria-pressed="true"]) { color: var(--site-accent); }
body[data-site-accent] .mine-button { background: var(--site-accent); color: #101518; border-color: color-mix(in srgb, var(--site-accent) 70%, white); box-shadow: 0 8px 0 color-mix(in srgb, var(--site-accent) 50%, #101518), 0 12px 24px #0005; }
body[data-site-accent] .mine-button:not(:disabled):active { box-shadow: 0 2px 0 color-mix(in srgb, var(--site-accent) 50%, #101518); }
body[data-site-accent] :is(.mine-machine, .mine-bar) { border-color: color-mix(in srgb, var(--site-accent) 60%, #101518); }
body[data-site-accent] .mine-segments .filled { background: var(--site-accent); box-shadow: 0 0 14px color-mix(in srgb, var(--site-accent) 35%, transparent); }
body[data-site-accent] .site-theme-sample { background-color: #0e131b; }
@media(max-width:700px) {
  .shop-category-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .shop-category-tabs button { font-size: 12px; padding-inline: 6px; }
  .shop-ownership-filter span { flex-basis: 100%; margin-left: 0; }
  #siteAnnouncement { flex-wrap: wrap; gap: 3px 10px; }
}

/* Local files override only the background; equipped themes and accents remain intact. */
body[data-local-background] {
  background-image: var(--local-background-image) !important;
  background-size: var(--local-background-size) !important;
  background-repeat: var(--local-background-repeat) !important;
  background-position: center center !important;
  background-attachment: fixed !important;
}
body[data-local-background] > .game-page-texture { opacity: 0 !important; }
body[data-local-background]::before, body[data-local-background]::after { display: none !important; }
body[data-local-background] #backgroundMotion { display: none; }
.local-background-settings { margin-block: 20px; padding-block: 16px; border-block: 1px solid var(--line); }
.local-background-settings label { display: block; margin-block: 12px 6px; }
.local-background-settings input, .local-background-settings select { max-width: 100%; }
.local-background-settings p { overflow-wrap: anywhere; }