/* October game pass: calm surfaces, readable controls and a phone play view. */
.rr{--rr-bg:#0b1523;--rr-surface:#101e30;--rr-track:#1a2c43;--rr-line:#41536a;--rr-text:#f5f7fc;--rr-muted:#c1cdde;--rr-gold-ink:#e9cb88;--rr-blue-ink:#b3d2ff;box-shadow:0 18px 60px #07132226}
[data-theme=light] .rr{--rr-bg:#eef3fa;--rr-surface:#ffffff;--rr-track:#edf2f8;--rr-line:#bbc9db;--rr-text:#14243a;--rr-muted:#465971;--rr-gold-ink:#765419;--rr-blue-ink:#245baa;box-shadow:0 18px 50px #0b234018}
.rr:before{background:linear-gradient(90deg,#b9924e,#efd9a7 36%,#bacbdc 70%,#7f98b6)}
.rr .rr-stat{border:1px solid var(--rr-line);border-radius:12px;background:var(--rr-track);padding:10px}
.rr .rr-stat small{color:var(--rr-muted);font-size:12px;letter-spacing:0}
.rr .rr-stat b{color:var(--rr-text);font-size:22px;font-variant-numeric:tabular-nums}
.rr .rr-stat.mult b{color:var(--rr-gold-ink)}
.rr .rr-stat.lvl b{color:var(--rr-blue-ink)}
.rr .rr-stage{border:1px solid var(--rr-line);border-radius:16px;overflow:hidden}
.rr .rr-tier{color:#fff;background:#0b172ce8;border:1px solid #8897aa;font-size:13px;line-height:1.4;max-width:calc(100% - 24px)}
.rr .rr-rate{color:#fff;background:#0b172ceb;border:1px solid #8897aa}
.rr .rr-rate small{color:#e1e9f4}.rr .rr-rate b{color:#ffe4a6}
.rr .rr-mod{color:#fff;max-width:calc(100% - 130px);line-height:1.35;text-align:left}
.rr .rr-bubble{font-size:14px;line-height:1.45;background:var(--rr-track);border-color:var(--rr-line);color:var(--rr-text)}
.rr .rr-bubble.pop{animation:rrCrispPop .25s}
@keyframes rrCrispPop{from{transform:scale(.97)}to{transform:scale(1)}}
.rr .rr-overlay:not(.intro){background:var(--rr-surface);backdrop-filter:none}
.rr .rr-track{height:54px;border:2px solid var(--rr-line);border-radius:14px;background:var(--rr-track);box-shadow:inset 0 2px 7px #0001}
.rr .rr-zone{background:linear-gradient(90deg,#b48735,#f8dd99 50%,#b48735);border:1px solid #805a17;box-shadow:0 0 0 1px #ffffff66}
.rr .rr-zone:after{content:"";position:absolute;left:50%;top:6px;bottom:6px;border-left:2px solid #694508;transform:translateX(-1px)}
.rr .rr-marker{filter:drop-shadow(0 1px 2px #0004)}
.rr .rr-lock{width:100%;min-height:54px;display:flex;align-items:center;justify-content:center;gap:10px;border:1px solid #8b6625;border-radius:13px;background:linear-gradient(180deg,#f5dfaa,#d3af68);color:#192335;font:800 1.0625rem/1.3 var(--display);box-shadow:inset 0 -3px 0 #85612830;touch-action:manipulation;cursor:pointer}
.rr .rr-lock:active{transform:translateY(1px);box-shadow:none}.rr .rr-lock:disabled{opacity:.65;cursor:default}
.rr .rr-focus{min-height:44px;min-width:44px;border:1px solid var(--rr-line);border-radius:9px;background:var(--rr-track);color:var(--rr-text);font:600 13px/1.2 var(--body);padding:8px;cursor:pointer}
.rr .rr-right{gap:8px}.rr .rr-lives{gap:5px;margin:auto}
.rr .rr-hint{margin:8px 0 0;text-align:center;font-size:13px;line-height:1.4}
.rr .rr-fine{margin:8px 0 0;font-size:12px;line-height:1.45;color:var(--rr-muted)}
.rr .rr-hero{height:245px}.rr .rr-hero-shade{background:linear-gradient(90deg,#081427f5 0%,#081427c9 36%,#08142700 76%),linear-gradient(0deg,#08142780,transparent 45%)}
.rr .rr-hero-img{animation:none;transform:none;object-position:74% 30%}
.rr .rr-hero-copy{width:58%;left:20px;top:24px}.rr .rr-hero-title{font-size:52px!important;line-height:.96}
.rr .rr-hero-title span{color:#f1d49a;background:none;animation:none}
.rr .rr-hero-sub{color:#fff!important;font-size:14px!important;max-width:22ch!important}
.rr .rr-hero-bubble{right:14px;top:18px;font-size:12px;animation:none}
.rr .rr-play{min-height:56px;animation:none;width:calc(100% - 32px);justify-content:center;border-radius:14px;margin-top:18px}
.rr .rr-play-note{font-size:13px!important}
.rr .rr-how{grid-template-columns:1fr;gap:7px;padding:0 16px;margin-top:18px}
.rr .rr-how-i{display:grid;grid-template-columns:30px 1fr;gap:1px 10px;text-align:left;align-items:center;padding:9px 12px;border-color:var(--rr-line);background:var(--rr-track)}
.rr .rr-how-ic{grid-row:span 2;width:30px;height:30px;margin:0}.rr .rr-how-i b,.rr .rr-how-i small{grid-column:2}.rr .rr-how-i small{font-size:13px;line-height:1.4}
.rr .rr-ptitle{gap:12px;flex-wrap:wrap;margin-top:18px}.rr .rr-ptitle span{font-size:12px;color:var(--rr-blue-ink)}
.rr .rr-pstrip:focus-visible{outline:3px solid var(--rr-blue-ink);outline-offset:-3px}
.rr .rr-pstrip{scrollbar-width:thin;scrollbar-color:var(--rr-line) transparent;mask-image:none;-webkit-mask-image:none;scroll-padding-left:18px}
.rr .rr-topscore{margin:14px 16px 0;width:calc(100% - 32px);justify-content:center;border-radius:12px;border-color:var(--rr-line);color:var(--rr-blue-ink)}
.rr .rr-lb{background:var(--rr-track);border:1px solid var(--rr-line);border-radius:12px;padding:12px!important}
.rr .rr-lb li{grid-template-columns:26px minmax(0,1fr) auto;min-height:40px;gap:8px;font-size:14px}.rr .rr-lb li .name{min-width:0;overflow-wrap:anywhere}.rr .rr-lb li .s{color:var(--rr-text)}
.rr .rr-lead{background:var(--rr-track);border-color:var(--rr-line)}.rr .rr-lead p,.rr .rr-msg,.rr .rr-pb{color:var(--rr-muted)}
.rr .rr-big{color:var(--rr-gold-ink)}.rr .rr-rank{color:var(--rr-blue-ink)}
.rr .rr-chip{color:var(--rr-text);border-color:var(--rr-line)}.rr .rr-chip.on{color:var(--rr-blue-ink);border-color:var(--rr-blue-ink)}
.rr .rr-cb-row{grid-template-columns:1fr}.rr .rr-submit{flex-wrap:wrap}.rr .rr-submit input{flex:1 1 180px;min-height:46px}
.rr .rr-replay .rr-btn{min-height:54px;border-radius:12px}
.rr .rr-sbtn{white-space:normal;line-height:1.35}.rr .rr-btns{flex-wrap:wrap}
.rr .rr-lead button,.rr .rr-cb input{min-height:46px}
body.game-focus{overflow:hidden}
body.game-focus>.header,body.game-focus>.market-bar,body.game-focus>.footer,body.game-focus>.analytics-consent{visibility:hidden}
body.game-focus .game-section>.game-bar,body.game-focus .game-disclaimer,body.game-focus .game-afterword{visibility:hidden}
.rr[data-focus=true]{position:fixed;inset:0;z-index:1000;width:100%;max-width:none;height:100dvh;margin:0!important;border:0;border-radius:0;padding:max(10px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));overflow:auto;overscroll-behavior:contain}
.rr[data-focus=true] #rr-playfield{display:grid;grid-template-rows:auto auto minmax(130px,1fr) auto auto auto auto auto;height:100%;max-width:600px;margin:auto;gap:9px;min-height:525px}
.rr[data-focus=true] .rr-top{display:flex;align-items:center;gap:8px}.rr[data-focus=true] .rr-title{font-size:18px}.rr[data-focus=true] .rr-sub{display:none}
.rr[data-focus=true] .rr-right{flex:1;justify-content:flex-end}.rr[data-focus=true] .rr-lives{margin:auto}.rr[data-focus=true] .rr-life{width:19px;height:19px}
.rr[data-focus=true] .rr-pause{min-width:64px;padding:7px}.rr[data-focus=true] .rr-stats{margin:0;gap:7px}
.rr[data-focus=true] .rr-stat{padding:7px 8px}.rr[data-focus=true] .rr-stage{height:auto;min-height:130px;margin:0}
.rr[data-focus=true] .rr-host{margin:0;gap:9px;min-height:48px}.rr[data-focus=true] .rr-avatar{width:44px;height:44px;flex:none}.rr[data-focus=true] .rr-bubble{padding:8px 11px;min-height:44px}
.rr[data-focus=true] .rr-ladder{margin:5px 0 18px}.rr[data-focus=true] .rr-next{font-size:12px}
.rr[data-focus=true] .rr-track{margin:0;height:48px}.rr[data-focus=true] .rr-hint{display:none}.rr[data-focus=true] .rr-fine{margin:0;text-align:center;font-size:11px}
@media(max-width:600px){
 .rate-lock-page .game-section{padding:12px 12px 28px}.game-section .rr{padding:14px;border-radius:18px}
 .rr .rr-hero{height:225px}.rr .rr-hero-title{font-size:46px!important}.rr .rr-hero-copy{left:16px;top:22px}
 .rr .rr-right{gap:6px}.rr .rr-focus{font-size:12px}.rr .rr-lives{gap:4px}.rr .rr-life{width:20px;height:20px}
 .rr .rr-stat b{font-size:20px}.rr .rr-stage{height:225px}.rr .rr-overlay:not(.intro){padding:22px 14px}
 .rr .rr-hero-bubble{display:none}.rr .rr-hero-copy{width:60%}.rr .rr-pill{font-size:10px;letter-spacing:.02em;padding:5px 8px}
 .rr .rr-hero-sub{font-size:13px!important;line-height:1.5!important}.rr .rr-ptitle small{font-size:12px}
 .rr .rr-lead-top{display:grid;grid-template-columns:52px minmax(0,1fr);gap:12px}.rr .rr-lead-top img{width:52px;height:52px;margin:0}
 .rr .rr-lead h4{font-size:17px;line-height:1.35}.rr .rr-lead p{font-size:14px;line-height:1.6}
}
@media(max-width:370px){.rr[data-focus=true] .rr-title{font-size:16px}.rr[data-focus=true] .rr-top{flex-wrap:wrap}.rr[data-focus=true] .rr-right{width:100%}.rr .rr-mod{font-size:11px}}
@media(max-height:650px){.rr[data-focus=true] #rr-playfield{gap:6px}.rr[data-focus=true] .rr-stat b{font-size:18px}.rr[data-focus=true] .rr-host{min-height:40px}.rr[data-focus=true] .rr-avatar{width:38px;height:38px}.rr[data-focus=true] .rr-bubble{font-size:12px;min-height:38px}.rr[data-focus=true] .rr-lock{min-height:48px}}
/* Keep the timing controls visible when narrow phones use two rows of stats. */
@media(max-width:370px) and (max-height:650px){
 .rr[data-focus=true] #rr-playfield{gap:5px}
 .rr[data-focus=true] .rr-stat{display:flex;align-items:center;justify-content:space-between;gap:4px}
}
@media(prefers-reduced-motion:reduce){.rr .rr-pcard{animation:none;opacity:1}.rr button{transition:none}.rr .rr-pimg img{transition:none}}
@media(orientation:landscape) and (max-height:500px){
 .rr[data-focus=true] #rr-playfield{max-width:1000px;min-height:0;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);grid-template-rows:auto auto minmax(35px,1fr) auto auto auto auto;gap:6px 14px}
 .rr[data-focus=true] .rr-top{grid-column:1/-1;grid-row:1;flex-wrap:nowrap}.rr[data-focus=true] .rr-right{flex:none;width:auto}
 .rr[data-focus=true] .rr-stats{grid-column:1/-1;grid-row:2}.rr[data-focus=true] .rr-stat{padding:4px 10px;display:flex;align-items:center;justify-content:space-between;gap:6px}
 .rr[data-focus=true] .rr-stage{grid-column:1;grid-row:3/7;min-height:120px}.rr[data-focus=true] .rr-prop.photo img{object-position:50% 34%}
 .rr[data-focus=true] .rr-host{grid-column:2;grid-row:3}.rr[data-focus=true] .rr-ladder{grid-column:2;grid-row:4}
 .rr[data-focus=true] .rr-track{grid-column:2;grid-row:5;height:42px}.rr[data-focus=true] .rr-lock{grid-column:2;grid-row:6;min-height:44px}
 .rr[data-focus=true] .rr-fine{grid-column:1/-1;grid-row:7}.rr[data-focus=true] .rr-rate b{font-size:19px}
}