/* Approved Chrome layout and Titan accents. */

:root{--hero-ink:#38465b;--hero-muted:#65738a;--areas:"timer timer" "figure figure" "turnover turnover";--rows:auto minmax(0,1fr) auto;--columns:1fr 1fr}
body[data-mode][data-screen=game] .game-hero{display:flex;flex-direction:column;color:var(--hero-ink);isolation:isolate}
body[data-mode][data-screen=game] .hero-stage{display:grid;grid-template-areas:var(--areas);grid-template-rows:var(--rows);grid-template-columns:var(--columns);gap:8px 12px;flex:1 1 0;min-height:0;min-width:0;padding:8px 0 12px;align-items:center}
body[data-mode][data-screen=game] .hero-stage>.game-figure{grid-area:figure;position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:100%;min-width:0;min-height:0;margin:0;align-self:stretch;overflow:visible}
body[data-mode][data-screen=game] .hero-stage .game-mascot{width:auto;height:100%;max-height:360px;max-width:100%;aspect-ratio:1;min-height:0;object-fit:contain}
body[data-mode][data-screen=game] .hero-stage>.game-timer{grid-area:timer;display:grid;grid-template-columns:minmax(0,1fr) max-content minmax(0,1fr);width:100%;min-width:0;margin:0;letter-spacing:0;row-gap:3px;align-self:center}
body[data-mode][data-screen=game] .hero-timer-label{grid-column:1/-1;grid-row:1;font-size:12px;line-height:16px;font-weight:700;color:var(--hero-muted)}
body[data-mode][data-screen=game] .game-timer-value{grid-row:2;color:var(--hero-ink)!important;font-variant-numeric:tabular-nums;white-space:nowrap}
body[data-mode][data-screen=game] .game-timer>.primary-info{grid-row:2;color:var(--hero-muted);border-color:currentColor;font-size:12px}
body[data-mode][data-screen=game] .game-timer-caption{grid-row:3;font-size:10px;line-height:13px;color:var(--hero-muted);margin:0;letter-spacing:0}
body[data-mode][data-screen=game] .hero-stage>.game-turnover{grid-area:turnover;display:flex;flex-direction:column;align-items:center;justify-content:center;flex-wrap:nowrap;gap:3px;min-width:0;margin:0;line-height:1.25;align-self:center}
.hero-turnover-label{font-size:12px;font-weight:700;color:var(--hero-muted)}
body[data-mode][data-screen=game] .game-turnover>strong{font-size:18px;color:var(--hero-ink);white-space:nowrap;font-variant-numeric:tabular-nums}
body[data-mode][data-screen=game] .game-balance{flex:none;margin-top:10px}
body[data-mode][data-screen=game] .game-progress{flex:none;background:rgb(110 125 151 / 13%);height:8px;margin-top:12px}
body[data-round-mode=ludo][data-screen=game] .game-timer-value{color:#986140!important}
body[data-mode=mobile][data-screen=game] .hero-stage{gap:5px 8px;padding:3px 0 5px}
body[data-mode=mobile][data-screen=game] .hero-stage .game-mascot{max-height:220px}
body[data-mode=mobile][data-screen=game] .hero-timer-label,
body[data-mode=mobile][data-screen=game] .hero-turnover-label{font-size:10px;line-height:13px}
body[data-mode=mobile][data-screen=game] .game-turnover>strong{font-size:14px}
body[data-mode=mobile][data-screen=game] .game-balance{margin-top:6px}
body[data-mode=mobile][data-screen=game] .game-progress{margin-top:7px;height:6px}
@media(max-width:380px){body[data-mode][data-screen=game] .hero-stage .game-timer-value{font-size:24px}body[data-mode][data-screen=game] .hero-stage>.game-turnover>strong{font-size:13px}}
@media(max-height:690px){body[data-mode=mobile][data-screen=game] .hero-stage{gap:3px 6px;padding-block:0}body[data-mode=mobile][data-screen=game] .hero-stage .game-timer-value{font-size:24px;line-height:25px}body[data-mode=mobile][data-screen=game] .hero-stage>.game-timer,
body[data-mode=mobile][data-screen=game] .hero-stage>.game-turnover{padding-block:0}}
body[data-mode=mobile][data-screen=game] .game-main{background-image:var(--hero-background)}
body[data-mode][data-screen=game] .game-claim{background:#30A1F5;color:#fff;box-shadow:none}
body[data-mode][data-screen=game] .game-claim:hover:not(:disabled){background:#30A1F5;filter:brightness(.96)}
body[data-mode][data-screen=game] .game-claim:focus-visible{outline:2px solid #205e95;outline-offset:3px}
.mobile-player-header button.mobile-phase-links{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;flex:0 0 90px;min-height:40px;padding:5px 25px 5px 8px;border:0;border-radius:12px;background:rgb(255 255 255 / 62%);color:#3e6785;cursor:pointer;box-shadow:none;transition:background-color .15s,filter .15s}
.mobile-player-header button.mobile-phase-links:hover{filter:none;background:rgb(255 255 255 / 80%);box-shadow:none}
.mobile-player-header button.mobile-phase-links:active{filter:brightness(.94)}
.mobile-player-header button.mobile-phase-links:focus-visible{outline:2px solid #2374bd;outline-offset:3px}
.mobile-phase-links>*{pointer-events:none}
.mobile-phase-links .phase-season,
.mobile-phase-links .phase-round{display:flex;align-items:baseline;justify-content:center;gap:3px;white-space:nowrap;line-height:14px;font-size:10px;font-weight:700;color:#617d90}
.mobile-phase-links .phase-round{font-size:13px;line-height:16px;font-weight:800;color:#345c79}
.mobile-phase-links strong{font:inherit;font-variant-numeric:tabular-nums}
.mobile-phase-links .phase-chevron{position:absolute;right:11px;top:50%;width:8px;height:8px;border-right:2px solid #6e95b0;border-bottom:2px solid #6e95b0;transform:translateY(-65%) rotate(45deg);border-radius:1px}
.mobile-player-header .mobile-player-copy{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:0;padding-top:3px}
.mobile-player-header .mobile-player-name{font-size:13px;line-height:16px;margin:0;padding:0;color:#38465b}
.mobile-player-header .mobile-player-balance{min-height:16px;font-size:12px;line-height:16px;margin:0;padding:0;font-weight:600;color:#657c8e}
.mobile-player-header .mobile-player-balance small{font:inherit}
@media(max-width:360px){.mobile-player-header .mobile-player-name{font-size:12px}.mobile-player-header .mobile-player-balance{font-size:11px}}
#dialog [data-header-panel] .phase-current,
#dialog [data-header-panel] .phase-list li.is-current{background:var(--hero-background)}
#dialog [data-header-panel] .phase-current>small,
#dialog [data-header-panel] .phase-current p,
#dialog [data-header-panel] .phase-section-label,
#dialog [data-header-panel] .phase-copy small,
#dialog [data-header-panel] .is-current .phase-copy small,
#dialog [data-header-panel] .phase-amount,
#dialog [data-header-panel] .phase-note,
#dialog [data-header-panel] .phase-next-season,
#dialog [data-header-panel] .phase-next-season>small{color:#61778c}
#dialog [data-header-panel] .phase-number{background:#e8f0f6;color:#5481a3}
#dialog [data-header-panel] .is-current .phase-number{background:#e3eff9;color:#326a94}
#dialog [data-header-panel] .is-current .phase-amount{color:#326a94}
#dialog [data-header-panel] .is-future .phase-copy strong{color:#758595}
#dialog [data-header-panel] .phase-list li{background:#f3f6f8}
:root{--hero-background:linear-gradient(160deg,#dcefff 0%,#cce3f5 27%,#dbe5ed 48%,#f3f5f7 65%,#bdc7d1 84%,#dde3e9 100%)}
html body[data-mode=mobile][data-screen=game] .game-main{background-image:var(--hero-background);animation:none}
html body[data-mode][data-screen=game] .game-progress>span:after{display:none;animation:none}
body[data-mode][data-screen=game] .hero-stage>.game-timer,
body[data-mode][data-screen=game] .hero-stage>.game-turnover{position:relative;z-index:2}
body[data-mode][data-screen=game] .gram-stream:after{background:radial-gradient(ellipse,#95a9bd33,transparent 68%)}
body[data-mode][data-screen=game] .game-balance .game-earned{color:var(--accent-earned,#326a94)}
body[data-mode][data-screen=game] .game-balance .game-earned>span,
body[data-mode][data-screen=game] .game-balance .game-earned>strong{color:var(--accent-earned,#326a94);background:none;-webkit-text-fill-color:currentColor}
body[data-mode][data-screen=game] .game-balance .game-potential>span,
body[data-mode][data-screen=game] .game-balance .game-potential>strong{background-image:var(--accent-text);background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
body[data-mode][data-screen=game] .game-progress>span{background:var(--accent-bar)}
:root{--accent-earned:#52616d;--accent-text:linear-gradient(105deg,#68747d,#46515c);--accent-bar:linear-gradient(90deg,#98a7b1,#677886)}
body[data-mode=mobile][data-screen=game] .game-main{position:relative;isolation:isolate}
body[data-mode][data-screen=game] .game-hero>.hero-card-light,
body[data-mode][data-screen=game] .game-main>.hero-card-light{position:absolute!important;z-index:-1!important;inset:0;overflow:hidden;border-radius:inherit;opacity:1;pointer-events:none;mix-blend-mode:screen;--star-color:#fff;--sweep-height:35%;--sweep-blur:5px;--sweep-width:190%;--sweep-left:-45%;--sweep-angle:-20deg;--edge-opacity:1}
.hero-card-light .light-sweep{position:absolute;z-index:2;left:var(--sweep-left,-35%);top:-68%;width:var(--sweep-width,170%);height:var(--sweep-height,42%);border-radius:50%;background:linear-gradient(180deg,transparent 0%,rgba(255,255,255,.08) 21%,var(--star-color,#fff) 49%,rgba(255,255,255,.14) 68%,transparent 100%);filter:blur(var(--sweep-blur,10px));opacity:0;transform:rotate(var(--sweep-angle,-20deg));transform-origin:center;animation:hero-light-loop 5s linear infinite}
.hero-card-light .light-sweep:before{content:'';position:absolute;left:12%;right:12%;top:47%;height:2px;border-radius:50%;background:rgba(255,255,255,.82);box-shadow:0 0 13px 4px var(--star-color,#fff);opacity:var(--edge-opacity,.65)}
@keyframes hero-light-loop{0%,
81%{opacity:0;transform:rotate(var(--sweep-angle,-20deg)) translateY(0) scaleX(.88)}83.5%{opacity:.12}87%{opacity:.88}93.5%{opacity:.48;transform:rotate(var(--sweep-angle,-20deg)) translateY(470%) scaleX(1.04)}96%,
100%{opacity:0;transform:rotate(var(--sweep-angle,-20deg)) translateY(490%) scaleX(1.04)}}
@media(prefers-reduced-motion:reduce){.hero-card-light{display:none}.hero-card-light .light-sweep{animation:none}}
.app-header .avatar,
.mobile-player-avatar .avatar{position:relative;overflow:visible}
.avatar-glint{display:none;position:absolute;right:-6px;top:-6px;width:22px;height:22px;z-index:2;overflow:visible;pointer-events:none;color:#fff;filter:drop-shadow(0 0 2px #87a9c9) drop-shadow(0 0 5px #dcefff);opacity:0;transform-origin:center;animation:avatar-glint-loop 5s linear infinite}
body[data-screen=game] .avatar-glint{display:block}
.avatar-glint path{fill:currentColor}
@keyframes avatar-glint-loop{0%,
71%{opacity:0;transform:scale(.22) rotate(-12deg)}76%{opacity:1;transform:scale(1.14) rotate(3deg)}82%{opacity:.88;transform:scale(.96) rotate(0)}88%{opacity:0;transform:scale(.68) rotate(5deg)}100%{opacity:0}}
@media(prefers-reduced-motion:reduce){body[data-screen=game] .avatar-glint{display:none;animation:none}}