/* Goudkoorts, completed. The gold background's tokens, header, cards, buttons, safehouse boxes and
   phone keypad live in heistle-lab.css and the safe has its own gold door; this file carries the
   same black gold and brass into every remaining screen (dialog cards, statistics, rewards and
   notices, leaderboards, the phone menu and player profiles), so nothing of the classic green
   theme is left. Green, red and amber feedback keep their meaning. */

/* ---- page, scrollbars and header ---- */
body[data-background="gold"]{background:radial-gradient(130% 95% at 50% 38%, transparent 52%, rgba(0,0,0,.55) 100%),
  radial-gradient(1200px 560px at 50% -220px, rgba(246,183,60,.09), transparent 62%), linear-gradient(180deg,#1a140a,var(--bg0) 58%)}
body[data-background="gold"] ::-webkit-scrollbar-thumb{background:#3f3119}
body[data-background="gold"] :is(.panel-scroll-body,#mPlayer .player-dialog-body){scrollbar-color:#7a6230 #1a1409}
body[data-background="gold"] .brand .sub{color:#c9b47f}

/* ---- the legendary loot banner on black gold ---- */
body[data-background="gold"] .loot-banner.is-special{
  background:radial-gradient(circle at 10% 45%, rgba(246,183,60,.2), transparent 27%), linear-gradient(112deg, rgba(150,108,28,.32), rgba(40,31,15,.96) 39%, rgba(24,19,9,.94))}

/* ---- the safe's digit windows in warm black glass ---- */
body[data-background="gold"] .console .slot{background:linear-gradient(180deg,#070503,#0f0b05 65%,#0a0703)}

/* ---- dialog cards: brass boxes like the safehouse; special states keep their own colours ---- */
body[data-background="gold"] :where(.stash-item,.sell-row,.inv-slot,.lb-row,.lb-page,.wb-lock,.tool-card,.tool-chip,.loot-sum .ls-box,.lvl-card,.loot-card,.hstep){
  background:linear-gradient(180deg,#30261a,#1f180d)}
body[data-background="gold"] .fab{background:linear-gradient(180deg,#3a2e17,#211a0c)}
body[data-background="gold"] .res-code .dchip{background:linear-gradient(180deg,#0f0b05,#1a1409)}
body[data-background="gold"] .inv-slot .sconf{background:rgba(18,13,5,.92)}
body[data-background="gold"] .btn-google{box-shadow:0 4px 0 #100c05, 0 7px 14px rgba(0,0,0,.4)}
body[data-background="gold"] .btn-google:active{box-shadow:0 1px 0 #100c05}
body[data-background="gold"] .lab-debrief-digits .absent{color:#c2b28a}
body[data-background="gold"] .lab-coach-step i:not(.done){background:#3d3018}

/* ---- leaderboards: the podium's own metals on a black-gold base; links light up in gold ---- */
body[data-background="gold"] .lb-row.lb-podium{
  background:linear-gradient(110deg,rgba(var(--podium-rgb),.13),rgba(var(--podium-rgb),.025) 62%) padding-box,
    linear-gradient(#1e170b,#1e170b) padding-box,
    linear-gradient(115deg,var(--podium-edge),var(--podium-dark) 38%,var(--podium-dark) 66%,var(--podium-edge)) border-box}
body[data-background="gold"] .lb-profile-link:not(.lb-podium){--podium-rgb:240,185,73}
@media(hover:hover) and (pointer:fine){
  body[data-background="gold"] .lb-profile-link:not(.lb-podium):not(.me):hover{border-color:#b18a3e}
}

/* ---- notices and rewards: brass plates instead of olive ---- */
body[data-background="gold"] .toast-card{
  background:radial-gradient(ellipse at 0 0, rgba(var(--notice-rgb),.09), transparent 70%), linear-gradient(120deg,#2c2312,#181208 85%)}
body[data-background="gold"] .toast-card:is(:not([data-tone]),[data-tone="info"]){border-color:#7d6431}
body[data-background="gold"] .toast-card[data-tone="achievement"]{
  background:radial-gradient(ellipse at 0 0, #b8862e38, transparent 75%), linear-gradient(120deg,#3a2d15,#1e170b 85%)}
body[data-background="gold"] .toast-has-value .toast-message{color:#d6c697}
body[data-background="gold"] .toast-close{color:#cdb98a}
body[data-background="gold"] .ach-new{
  background:radial-gradient(ellipse at 0 50%, #d6aa4a24, transparent 66%), linear-gradient(115deg,#3a2e17,#231b0d 68%,#1c160a)}
body[data-background="gold"] :is(.reward-emblem,.reward-summary .reward-level-badge){background:radial-gradient(circle at 45% 30%, #8a6a2c55, #130e06 72%)}
body[data-background="gold"] .reward-summary{border-color:#7d6431; background:linear-gradient(115deg,#352a16,#1f180c 70%)}
body[data-background="gold"] .reward-medal{border-color:#8b6d3466; background:rgba(18,13,5,.6)}
body[data-background="gold"] .reward-medal[tabindex]:is(:hover,:focus){background:#2c2312}
body[data-background="gold"] .reward-tip,body[data-background="gold"] .reward-tip::after{border-color:#7d6431; background:#120e06}

/* ---- the phone menu ---- */
@media(max-width:600px){
  body[data-background="gold"] .mobile-nav-toggle{border-color:#9a7a3a; background:linear-gradient(155deg,#4a3a1c,#21190b 65%)}
  body[data-background="gold"] .mobile-nav-toggle[aria-expanded="true"]{background:var(--well)}
  body[data-background="gold"] .header-menu{border-color:#7d6431;
    background:radial-gradient(ellipse at 15% 0%, #c9993f26, transparent 58%), linear-gradient(150deg,#2e2413,#160f07 65%)}
  body[data-background="gold"] .mobile-nav-grip{background:#d2c29b57}
  body[data-background="gold"] .mobile-nav-close{border-color:#c9a55a2e; background:#0f0b0559}
  body[data-background="gold"] .mobile-nav-close:active{background:#5a462455}
  body[data-background="gold"] .header-menu .icon-btn:where(:not(.active)){border-color:#b8954a2e; background:linear-gradient(145deg,#4a3b1d57,#2a200e75)}
  body[data-background="gold"] .header-menu .mobile-nav-icon{color:#e0cb95}
  body[data-background="gold"] .header-menu #btnLoot{border-color:#c9a55a80; background:linear-gradient(120deg,#8a6a2a40,#4a3a1a33)}
  body[data-background="gold"] .header-menu #btnLoot .mobile-nav-icon{border-color:#c9a55a66; background:linear-gradient(140deg,#b996422b,#5a462021); color:var(--amber2)}
  body[data-background="gold"] .header-menu #btnAccount{background:#140f0766}
  body[data-background="gold"] .header-menu #btnAccount .mobile-nav-icon{background:#3a2d16}
  body[data-background="gold"] .mobile-nav-summary :is(.streak-chip,#lvlChip){background:#120d0566}
  body[data-background="gold"] .header-menu .mobile-nav-switch{border-color:#b8a47755; background:#120d05}
  body[data-background="gold"] #soundToggle[aria-pressed="true"] .mobile-nav-switch,body[data-background="gold"] #musicToggle[aria-pressed="true"] .mobile-nav-switch{background:#276144; border-color:#448562}
}

/* ---- the player profile: brass panels on black gold ---- */
body[data-background="gold"] #mPlayer .profile-identity{border-color:#8a6d2c;
  background:radial-gradient(ellipse at 5% 0%, #efbe381c, transparent 75%), linear-gradient(120deg,#3a2e17,#1f180b)}
body[data-background="gold"] #mPlayer .profile-summary{background:#171108}
body[data-background="gold"] #mPlayer .profile-summary>div+div{border-left-color:#5947217a}
body[data-background="gold"] #mPlayer .profile-panel{background:linear-gradient(145deg,#30261a,#1c150b)}
body[data-background="gold"] #mPlayer .profile-cabinet{border-color:#7d6431; background:radial-gradient(ellipse at 50% 35%, #bd902118, transparent 70%), linear-gradient(155deg,#352a15,#1d160a)}
body[data-background="gold"] #mPlayer :is(.profile-trophy p,.profile-medal p,.profile-medal-progress>span){color:#d0c095}
body[data-background="gold"] #mPlayer .profile-trophy-arrow{background:#1a1309cc}
body[data-background="gold"] #mPlayer .profile-trophy-thumbnails{scrollbar-color:#7a6230 #1a1409}
body[data-background="gold"] #mPlayer .profile-trophy-thumbnails button{border-color:#5f4b24; background:#140f07}
body[data-background="gold"] #mPlayer .profile-trophy-thumbnails button[aria-pressed="true"]{border-color:#d0a449; background:#8e73202b}
body[data-background="gold"] #mPlayer .profile-medal{background:linear-gradient(150deg,#ac8d2526,#211a0d)}
body[data-background="gold"] #mPlayer .profile-medal-progress>div{background:#0c0904}
body[data-background="gold"] #mPlayer .profile-medal.is-locked{border-color:#4a3b1d; background:#171108}
body[data-background="gold"] #mPlayer .profile-medal.is-locked :is(h3,p,.profile-medal-state){color:#9c8c66}
@media(max-width:700px){body[data-background="gold"] #mPlayer .profile-summary .profile-wallet{border-bottom-color:#5947217a}}

/* ---- the coin button beside the dial: press it and gold coins tumble out of its slot (ThemeToys) ---- */
body[data-background="gold"] .console .coin-toy{display:flex; position:absolute; top:0; bottom:0; right:0; width:calc(50% - 66px); flex-direction:column; align-items:center;
  justify-content:center; gap:9px; pointer-events:none}
body[data-background="gold"] .console .coin-button{position:relative; width:48px; height:48px; padding:0; border:0; border-radius:50%; cursor:pointer; pointer-events:auto;
  touch-action:manipulation; -webkit-tap-highlight-color:transparent; -webkit-touch-callout:none; -webkit-user-select:none; user-select:none;
  background:radial-gradient(circle at 50% 45%,#2c2006,#120c02 72%);
  box-shadow:0 0 0 3px #c3942e, 0 0 0 4px #6b4e12, 0 0 0 5px rgba(255,236,170,.25), 0 4px 8px rgba(0,0,0,.6), inset 0 3px 5px rgba(0,0,0,.85)}
body[data-background="gold"] .console .coin-button:focus-visible{outline:2px solid rgba(255,222,140,.75); outline-offset:6px}
body[data-background="gold"] .console .coin-cap{position:absolute; inset:5px; border-radius:50%; overflow:hidden; display:grid; place-items:center; transform:translateY(-3px);
  background:radial-gradient(circle at 38% 30%,#fff6cf 0 7%,#ffd970 24%,#e0a93a 58%,#9a6814 100%);
  box-shadow:0 3px 0 #7a5210, 0 6px 6px rgba(0,0,0,.5), inset 0 0 0 2px rgba(255,236,170,.5), inset 0 0 0 5px rgba(150,100,20,.28);
  transition:transform .07s ease-out, box-shadow .07s ease-out}
body[data-background="gold"] .console .coin-cap svg{width:24px; height:24px; filter:drop-shadow(0 1px 0 rgba(255,240,190,.35))}
body[data-background="gold"] .console .coin-cap::after{content:''; position:absolute; inset:-20%; transform:translateX(-120%);
  background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,.75) 50%,transparent 60%); animation:coinGlint 6s ease-in-out 1.5s infinite}
@keyframes coinGlint{0%,78%{transform:translateX(-120%)}92%,100%{transform:translateX(120%)}}
body[data-background="gold"] .console .coin-button:hover .coin-cap{box-shadow:0 3px 0 #7a5210, 0 6px 6px rgba(0,0,0,.5), 0 0 12px rgba(255,214,110,.55),
  inset 0 0 0 2px rgba(255,236,170,.5), inset 0 0 0 5px rgba(150,100,20,.28)}
body[data-background="gold"] .console .coin-button.pressed .coin-cap{transform:translateY(0); transition-duration:.04s;
  box-shadow:0 0 0 #7a5210, 0 1px 2px rgba(0,0,0,.5), inset 0 0 0 2px rgba(255,236,170,.4), inset 0 0 0 5px rgba(150,100,20,.3)}
body[data-background="gold"] .console .coin-slot{width:32px; height:8px; border-radius:5px; background:#060402;
  box-shadow:0 0 0 2px #a57a22, 0 0 0 3px #5a420f, 0 1px 3px 3px rgba(0,0,0,.35), inset 0 2px 3px #000}
body[data-background="gold"].lab-background-still .console .coin-cap::after{animation:none}
@media (prefers-reduced-motion:reduce){body[data-background="gold"] .console .coin-cap::after{animation:none}}
