/* Friends' visual language, scoped to Game; its measured layout stays intact. */
html[data-look] body[data-mode][data-screen=game]{--dx-font:Nunito,Arial,sans-serif;--game-ink:#1e1e1e;--game-muted:#929292;--game-card:#f7f7f7;--game-line:#e7e7e7;--game-green:#51b13d;--look-ink:var(--game-ink);--look-muted:var(--game-muted);--look-pale:var(--game-card);--hero-ink:var(--game-ink);--hero-muted:var(--game-muted);--hero-background:linear-gradient(160deg,#dcefff 0%,#cce3f5 27%,#dbe5ed 48%,#f3f5f7 65%,#bdc7d1 84%,#dde3e9 100%);--accent-earned:var(--game-ink);--look-progress:#51b13d;--accent-bar:#51b13d;--feedback-latest:#dff3e4;background:#fff;color:var(--game-ink)}
html[data-look] body[data-mode][data-screen=game]>.app-header{background:#fff}
html[data-look] body[data-mode][data-screen=game] :is(.game-page,.game-main){background:#fff;box-shadow:none;border:0}
html[data-look] body[data-mode=mobile][data-screen=game] .game-main{background:var(--hero-background);border-radius:24px;border:0;box-shadow:none}
html[data-look] body[data-mode=mobile][data-screen=game] .game-main{border-radius:0 0 24px 24px}
html[data-look] body[data-mode=mobile][data-screen=game] .game-main::after{display:block}
html[data-look] body[data-mode][data-screen=game] :is(.game-latest,.game-investments){background:transparent;border:0;border-radius:24px;box-shadow:none}
html[data-look] body[data-mode][data-screen=game] .game-latest .section-title{font-size:18px;line-height:1.25;font-weight:800;letter-spacing:0;color:var(--game-ink)}
html[data-look] body[data-mode][data-screen=game] :is(.game-latest-hint,.game-last-player .muted,.game-timer-caption,.hero-timer-label,.hero-turnover-label){font-weight:600;color:var(--game-muted)}
html[data-look] body[data-mode][data-screen=game] .game-last-player>strong{color:var(--game-ink);font-weight:700}
html[data-look] body[data-mode][data-screen=game] .game-hero{--hero-ink:#1e1e1e;--hero-muted:#929292}
html[data-look] body[data-mode][data-screen=game] .game-timer-value{font-weight:600!important;letter-spacing:-.025em}
html[data-look] body[data-mode][data-screen=game] .game-timer>.primary-info{color:var(--game-muted)}
html[data-look] body[data-mode][data-screen=game] .game-balance :is(.game-earned,.game-potential)>strong{font-weight:600;background:none;color:var(--game-ink);-webkit-text-fill-color:currentColor}
html[data-look][data-gramlook] body[data-mode][data-screen=game] .game-balance :is(.game-earned,.game-potential)>span{background:none;color:var(--game-muted);-webkit-text-fill-color:currentColor;font-weight:600}
html[data-look][data-gramlook] body[data-mode][data-screen=game] .game-balance :is(.game-earned,.game-potential)>strong>small{background:none;color:var(--game-muted);-webkit-text-fill-color:currentColor;font-weight:600}
html[data-look] body[data-mode][data-screen=game] .game-progress{background:#e7e7e7;border-radius:999px}
html[data-look] body[data-mode][data-screen=game] .game-progress>span{background:var(--game-green);border-radius:inherit}
html[data-look] body[data-mode][data-screen=game] .game-claim,
html[data-look] body[data-mode][data-screen=game] .game-claim:hover:not(:disabled){background:linear-gradient(#000,#323232)!important;color:#fff!important;border-radius:12px!important;box-shadow:none;font-weight:700;letter-spacing:-.3px}
html[data-look] body[data-mode][data-screen=game] .game-claim:focus-visible{outline-color:#1aaeeb}
html[data-look] body[data-mode][data-screen=game] .game-summary{background:#fff;gap:8px}
html[data-look] body[data-mode][data-screen=game] .game-summary>div{background:#f6f6f6;border:0;border-radius:12px;box-shadow:none}
html[data-look] body[data-mode][data-screen=game] .game-summary dt{color:#999;font-weight:700}
html[data-look] body[data-mode][data-screen=game] .game-summary dd{color:var(--game-ink);-webkit-text-fill-color:currentColor;font-weight:700}
html[data-look] body[data-mode][data-screen=game] .game-summary>div[data-stat-change=referral-income] dd{color:var(--game-green)}
html[data-look] body[data-mode][data-screen=game] .game-summary .summary-unit{font-weight:600;color:var(--game-muted)}
html[data-look] body[data-mode][data-screen=game] .contribution-mode-bridge{gap:10px}
html[data-look] body[data-mode][data-screen=game] .mode-label{color:var(--game-muted)}
html[data-look] body[data-mode][data-screen=game] .mode-label strong{font-weight:700;letter-spacing:-.15px}
html[data-look] body[data-mode][data-screen=game] .mode-label small{color:var(--game-muted);font-weight:600}
html[data-look] body[data-mode][data-screen=game] .mode-bridge-switch::before{background:radial-gradient(circle,#bcbcbc 2px,transparent 2.5px) 0 0/12px 6px repeat-x}
html[data-look] body[data-mode][data-screen=game] .mode-bridge-switch>span{background:#1e1e1e;box-shadow:0 0 0 4px #fff}
html[data-look] body[data-mode][data-screen=game] .mode-bridge-switch:focus-visible{outline-color:#1aaeeb}
html[data-look] body[data-mode][data-screen=game] .game-investments .mvp-list-row{border-color:var(--game-line)}
html[data-look] body[data-mode][data-screen=game] .game-investments .mvp-list-main>strong{font-weight:700!important;color:var(--game-ink)}
html[data-look] body[data-mode][data-screen=game] .game-investments .mvp-list-main>small{font-weight:600!important;color:var(--game-muted)!important}
html[data-look] body[data-mode][data-screen=game] :is(.contribution-history,.inline-coefficient-note){background:transparent;color:var(--game-muted);font-weight:700}
/* Keep the fixed action and its full-width timer fill in their current places. */
html[data-look] body[data-mode][data-screen=game] .game-controls.controls-v5{background:#fff!important}
html[data-look] body[data-mode][data-screen=game] .controls-v5 .controls-v5-joint{background:linear-gradient(#000,#323232);border-radius:12px}
html[data-look] body[data-mode][data-screen=game] .controls-v5 :is(.game-deposit>strong,.controls-v5-auto>strong){font-weight:700!important;letter-spacing:-.4px}
html[data-look] body[data-mode][data-screen=game] .controls-v5 .game-award-side>strong{font-weight:600;letter-spacing:-.2px}
html[data-look] body[data-mode][data-screen=game] .controls-v5 .game-award-side{border-left-color:#ffffff26}
html[data-look] body[data-mode][data-screen=game] .coefficient-more{color:#ccc;font-weight:600}
/* The mobile header and game dialogs follow Friends' neutral controls. */
html[data-look] body[data-mode][data-screen=game] .mobile-player-header{background:transparent}
html[data-look] body[data-mode][data-screen=game] .mobile-player-header button.mobile-phase-links{background:#f6f6f6;border-radius:12px}
html[data-look] body[data-mode][data-screen=game] .mobile-phase-links :is(.phase-season,.phase-round){color:#929292;font-weight:700}
html[data-look] body[data-mode][data-screen=game] .mobile-phase-links .phase-round{color:#1e1e1e}
html[data-look] body[data-mode][data-screen=game] .phase-chevron{border-color:#929292}
html[data-look] body[data-mode][data-screen=game] :is(.mobile-player-name,.mobile-player-balance){color:#1e1e1e;font-weight:600}
html[data-look] body[data-mode][data-screen=game] #dialog{background:#fff;color:#1e1e1e;border:0;border-radius:24px;--hero-background:linear-gradient(#f7f7f7,#f7f7f7);--look-ink:#1e1e1e;--look-muted:#929292}
html[data-look] body[data-mode][data-screen=game] #dialog-title{font-weight:800;letter-spacing:-.4px}
html[data-look] body[data-mode][data-screen=game] #dialog :is(.mvp-metrics>div,.phase-current,.phase-list li,.phase-next-season,.contribution-mode-option){background:#f7f7f7;border-radius:12px}
html[data-look] body[data-mode][data-screen=game] #dialog :is(.button-primary,.game-mode-current){background:linear-gradient(#000,#323232);color:#fff;border-radius:12px;font-weight:700}
html[data-look] body[data-mode][data-screen=game] #dialog :is(.button-secondary,.dialog-close){background:#f0f0f2;color:#1e1e1e;border-radius:12px}
html[data-look] body[data-mode][data-screen=game] #dialog .controls-v5-auto-details p{color:#929292}
html[data-look] body[data-mode=mobile][data-screen=game] .game-latest{border-radius:20px}
html[data-look] body[data-mode=mobile][data-screen=game] .game-latest .section-title{font-size:14px}
@media(max-height:650px){
  html[data-look] body[data-mode=mobile][data-screen=game] .game-latest .section-title{font-size:12px}
}

/* Let Redo fill the available figure area without the old 180 px phone cap. */
html[data-look] body[data-mode=mobile][data-screen=game] .hero-stage .game-mascot{max-width:min(240px,100%);max-height:240px;scale:1}

html[data-look] body[data-mode=mobile][data-screen=game] .game-summary>div[data-stat-change=referral-income] dd{color:#1e1e1e;-webkit-text-fill-color:currentColor}

/* The whole referrals tile is a native link, including keyboard navigation. */
html[data-look] body[data-mode][data-screen=game] .game-summary>div[data-stat-change=referral-income]{position:relative;isolation:isolate;cursor:pointer}
html[data-look] body[data-mode][data-screen=game] .game-referrals-link{color:inherit;font:inherit;text-decoration:none}
html[data-look] body[data-mode][data-screen=game] .game-referrals-link::after{content:'';position:absolute;inset:0;z-index:1;border-radius:12px}
html[data-look] body[data-mode][data-screen=game] .game-referrals-link:focus-visible{outline:none}
html[data-look] body[data-mode][data-screen=game] .game-referrals-link:focus-visible::after{outline:2px solid #1aaeeb;outline-offset:3px}

/* Match the Friends footer button, including the white inset around it. */
html[data-look] body[data-mode][data-screen=game] .game-controls.controls-v5{
  padding:10px 16px 8px!important;background:#fff!important;
}
html[data-look] body[data-mode][data-screen=game] .controls-v5 .controls-v5-joint{
  background:linear-gradient(#000,#323232);border-radius:12px;overflow:hidden;
}
html[data-look] body[data-mode][data-screen=game] .controls-v5 :is(.game-deposit,.controls-v5-auto,.game-deposit:disabled,.game-deposit.is-cooling){
  background:transparent;color:#fff;opacity:1;filter:none;box-shadow:none;
}
html[data-look] body[data-mode=mobile][data-screen=game] .controls-v5 .controls-v5-joint{min-height:56px}
html[data-look] body[data-mode=mobile][data-screen=game] .controls-v5 :is(.game-deposit,.controls-v5-auto){height:56px;min-height:56px;padding:10px 12px}
html[data-look] body[data-mode=mobile][data-screen=game] .controls-v5 :is(.game-deposit>strong,.controls-v5-auto>strong){font-size:20px;line-height:24px}
html[data-look] body[data-mode=mobile][data-screen=game] .controls-v5 .game-deposit.is-cooling>strong{font-size:17px;color:#ccc}
html[data-look] body[data-mode=mobile][data-screen=game] .controls-v5 .game-award-side{margin-block:9px}

/* Tabular seconds and a figure-space below 10 keep the centered label still. */
html[data-look] body[data-mode][data-screen=game] .controls-v5-auto>[data-bind="auto-button-title"]{font-variant-numeric:tabular-nums;font-kerning:none;white-space:nowrap}

/* Open the corresponding operation history from the whole summary tile. */
html[data-look] body[data-mode][data-screen=game] .game-summary>div:is([data-stat-change=wagered],[data-stat-change=claimed]){position:relative;isolation:isolate;cursor:pointer}
html[data-look] body[data-mode][data-screen=game] .game-history-link{padding:0;border:0;background:none;color:inherit;font:inherit;text-align:inherit}
html[data-look] body[data-mode][data-screen=game] .game-history-link::after{content:'';position:absolute;inset:0;z-index:1;border-radius:12px}
html[data-look] body[data-mode][data-screen=game] .game-history-link:focus-visible{outline:none}
html[data-look] body[data-mode][data-screen=game] .game-history-link:focus-visible::after{outline:2px solid #1aaeeb;outline-offset:3px}
html[data-look] body[data-mode][data-screen=game] .game-investments{justify-content:flex-start;gap:12px}

html[data-look] body[data-mode][data-screen=game] .controls-v5 .controls-v5-auto>small{font-size:10px;line-height:13px;color:#dbe1e6;font-weight:600;white-space:nowrap;font-variant-numeric:tabular-nums}
html[data-look] body[data-mode=mobile][data-screen=game] .controls-v5 .controls-v5-auto{padding-block:5px;gap:1px}
html[data-look] body[data-mode=mobile][data-screen=game] .controls-v5 .controls-v5-auto>strong{font-size:17px;line-height:22px}

html[data-look] body[data-mode][data-screen=game] .controls-v5-auto>[data-auto-remaining-line][hidden]{display:none}

/* Offset only the label; keep the prize amount anchored. */
html[data-look][data-detail] body[data-mode][data-screen=game] .game-last-player .game-prize>small{color:var(--game-ink);-webkit-text-fill-color:currentColor;position:relative;left:3px}
