/* HORSE.BIZ — racing emerald, pearl ivory and champagne. Lightweight wallpapers served locally. */
:root {
  --bg:#f4f5ef; --surface:#fff; --surface-2:#f8faf6; --surface-3:#eef2e9;
  --line:#e2e8dc; --line-2:#ced8c8; --line-strong:#c7dcc9;
  --text:#14231c; --text-2:#3f5147; --muted:#68796d;
  --gold:#198754; --gold-deep:#126448; --gold-soft:#e7f2eb;
  --racing:#126448; --racing-bright:#20815d; --racing-soft:#e7f2eb;
  --gold-gradient:linear-gradient(180deg,#42a875,#126448);
  --success:#137c51;
}
html { background:#f5f5ef; }
body { position:relative; background:transparent; }
body::before { content:""; position:fixed; z-index:-1; inset:0; pointer-events:none; background:linear-gradient(180deg,rgba(251,252,246,.32),rgba(251,252,246,.08)), url('/assets/wallpapers/racetrack-mobile.webp') center bottom / cover no-repeat; }
.app-frame,.main-column,.auth-layout { background:transparent; }
.user-frame .rail { background:rgba(255,255,252,.97); border-right-color:var(--line); }
.user-frame .topbar { background:rgba(252,253,248,.93); border-bottom-color:var(--line); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); }
.user-frame .topbar-title h1,.hx-section-head h2,.page-intro h2 { color:#153c2c; }
.user-frame .bottom-nav { background:rgba(255,255,252,.97); border-top-color:var(--line); }
.user-frame .nav-link.is-active { color:var(--racing); background:var(--racing-soft); }
.user-frame .bottom-nav .nav-link.is-active .icon { color:var(--racing); background:var(--racing-soft); }
.hx-panel,.hx-stats,.hx-quick,.panel-soft { background:rgba(255,255,253,.96); border-color:var(--line); }
.hx-tile-icon { border-color:#d7e5d7; color:var(--racing); background:linear-gradient(160deg,#f6fbf2,#e3efdf); }
.hx-tile:hover .hx-tile-icon { box-shadow:0 8px 16px rgba(18,100,72,.12); }
.hx-balance { border-color:#d5dfc7; background:radial-gradient(110% 90% at 100% 0%,#f8f0d9,rgba(248,240,217,0) 58%),rgba(255,255,253,.98); }
.hx-balance .balance-number { color:#123e2a; }
.hx-balance .hx-label { color:#4f6958; }
.hx-balance-actions .button-gold { background:linear-gradient(160deg,#1c7855,#0e563c); border-color:#0f5c40; color:#fff; box-shadow:inset 0 1px 0 rgba(255,255,255,.15),0 8px 18px rgba(18,100,72,.16); }
.hx-balance-actions .button-soft { color:#126448; background:#eef4e7; border-color:#d3ddc7; }
.hx-balance::before { border-color:rgba(18,100,72,.12); box-shadow:0 0 0 34px rgba(18,100,72,.035); }
.hx-plan { border-color:#dce5d4; }
.hx-plan .hx-plan-price strong { color:#143e2a; }
.hx-plan-stats { background:#f5f8f0; border-color:#dfe6d8; }
.hx-hero .hx-hero-cta { background:#114e36; box-shadow:0 8px 18px rgba(17,78,54,.2); }
.hx-tag { color:#126448; background:rgba(255,255,250,.92); border-color:#c9dbc0; }
.text-link { color:#126448; }
.user-frame .tab.is-active { color:#12583f; background:#fff; }
.auth-panel { background:rgba(253,254,249,.97); }
.auth-heading h1 { color:#164c35; }
.auth-visual-top { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.auth-visual-top .logo { flex:0 1 auto; }
/* Compact PNG locale selector; keyboard accessible native buttons. */
.lang-switcher { position:relative; z-index:80; display:inline-flex; flex:0 0 auto; align-self:center; }
.lang-switcher [data-lang-toggle] { display:inline-flex; align-items:center; gap:6px; min-height:36px; min-width:52px; padding:5px 8px; border:1px solid #dbe4d4; border-radius:11px; color:#254d3b; background:rgba(255,255,253,.97); box-shadow:0 2px 6px rgba(19,50,31,.04); }
.lang-switcher img { flex:0 0 auto; width:23px; height:16px; object-fit:cover; border-radius:3px; box-shadow:0 0 0 1px rgba(0,0,0,.08); }
.lang-current { font-size:11px; line-height:1; font-weight:800; }
.lang-menu { position:absolute; top:calc(100% + 7px); right:0; min-width:195px; padding:5px; border:1px solid #d7e1d0; border-radius:14px; background:#fffefb; box-shadow:0 12px 30px rgba(17,49,28,.16); }
.lang-menu[hidden] { display:none!important; }
.lang-menu button { display:flex; align-items:center; gap:9px; width:100%; min-height:42px; padding:8px 10px; border:0; border-radius:9px; font-size:13px; font-weight:700; text-align:left; color:#233b2d; background:transparent; }
.lang-menu button[aria-checked=true],.lang-menu button:hover { background:#eaf3e6; color:#125b3e; }
.lang-switcher button:focus-visible { outline:2px solid #126448; outline-offset:2px; }
body > .lang-switcher { position:fixed; top:12px; right:12px; }
.admin-frame .lang-switcher [data-lang-toggle] { color:#172f23; }
@media(min-width:800px) { body::before { background-image:linear-gradient(180deg,rgba(251,252,246,.35),rgba(251,252,246,.1)),url('/assets/wallpapers/racetrack-desktop.webp'); } }
@media(max-width:500px) {
  .user-frame .topbar { padding-inline:14px; gap:8px; }
  .user-frame .topbar-title h1 { font-size:20px; }
  .user-frame .topbar-actions { gap:7px; }
  .user-frame .topbar-bell { display:none; }
  .user-frame .install-button { display:none; }
  .auth-visual-top .lang-switcher { margin-left:auto; }
  .lang-menu { min-width:185px; }
}
