/* Roulette-local correction after shared viewport CSS. No shared header edits. */
body.pg-game-page.retro-theme[data-game=roulette] main>.pg-game-titlebar{display:grid;grid-template-columns:44px minmax(0,1fr) auto 48px;gap:6px;height:48px;min-height:48px;margin-bottom:4px;padding:0 6px;flex-wrap:nowrap}
body.pg-game-page.retro-theme[data-game=roulette] .pg-game-titlebar h1{position:static;transform:none;left:auto;top:auto;max-width:100%;width:auto;height:auto;font-size:clamp(12px,3.4vw,16px);letter-spacing:1px;grid-column:2;grid-row:1}
body.pg-game-page.retro-theme[data-game=roulette] .pg-game-titlebar #osCoins{position:static;inset:auto;grid-column:3;grid-row:1;font:700 12px/20px Arial,sans-serif;font-variant-numeric:tabular-nums;white-space:nowrap;max-width:104px;overflow:hidden;text-overflow:ellipsis;margin:0}
body.pg-game-page.retro-theme[data-game=roulette] .pg-game-titlebar a[href="#osRules"]{grid-column:4;grid-row:1;white-space:nowrap;word-break:keep-all;width:48px;min-width:48px;padding:0;font:600 12px/1 system-ui;height:44px;min-height:44px;border:0;border-radius:8px;background:#19382e}
body.pg-game-page.retro-theme[data-game=roulette] .roulette-stage{overflow:hidden;min-height:200px;padding:8px;gap:3px}
body.pg-game-page.retro-theme[data-game=roulette] #osBoard{max-height:360px;flex:1;min-height:0}
body.pg-game-page.retro-theme[data-game=roulette] .roulette-stage-label{flex:none;gap:10px;font-size:8px;letter-spacing:1px;white-space:nowrap}
body.pg-game-page.retro-theme[data-game=roulette] #osBoard svg{display:block;width:100%;height:100%;max-height:100%;margin:auto;aspect-ratio:1}
body.pg-game-page.retro-theme[data-game=roulette] .roulette-bet-dialog{padding:8px 12px 12px;scroll-padding-top:64px}
body.pg-game-page.retro-theme[data-game=roulette] .roulette-panel-tools{position:sticky;top:-8px;z-index:6;display:flex;align-items:center;gap:8px;min-height:56px;background:#112620;padding:6px 0;border-bottom:1px solid #c7b07844}
body.pg-game-page.retro-theme[data-game=roulette] .roulette-panel-coins{margin-right:auto;min-width:0;font:700 12px/20px Arial,sans-serif;color:#e7d4a4;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
body.pg-game-page.retro-theme[data-game=roulette] .roulette-panel-tools button{flex:none;min-height:44px;padding:0 10px;margin:0;font-size:12px;white-space:nowrap;border:1px solid #b7a16c77;border-radius:8px;background:#203a32;color:#f6ead1}
body.pg-game-page.retro-theme[data-game=roulette] .roulette-panel-tools .pg-overlay-close{background:#dec590;color:#211d14;min-width:56px;font-weight:800}
body.pg-game-page.retro-theme[data-game=roulette] .roulette-bet-dialog .os-betboard{padding:10px 8px;margin-top:8px}
body.pg-game-page.retro-theme[data-game=roulette] .roulette-bet-dialog #osDirectTargets{grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}
body.pg-game-page.retro-theme[data-game=roulette] .roulette-bet-dialog .os-target{padding:6px 4px;font-size:13px;gap:2px;white-space:nowrap;min-width:0}
body.pg-game-page.retro-theme[data-game=roulette] .roulette-bet-dialog .os-target small{font-size:10px}
body.pg-game-page.retro-theme[data-game=roulette] .roulette-bet-dialog #osSpatial{max-height:none;overflow:visible}
/* Finite rotation avoids endless high-speed aliasing; each sector keeps its fill. */
body.os-page[data-game=roulette] .roulette-cinematic .roulette-rotor,body.os-page[data-game=roulette] .roulette-cinematic .roulette-ball-orbit{transform-box:view-box;transform-origin:128px 128px}
body.os-page[data-game=roulette] .roulette-cinematic.is-spinning .roulette-rotor{animation:roulette-land var(--roulette-duration,4200ms) cubic-bezier(.25,.5,.55,1) both}
body.os-page[data-game=roulette] .roulette-cinematic.is-spinning .roulette-ball-orbit{animation:roulette-orbit-land 4200ms cubic-bezier(.2,.55,.4,1) both}
body.os-page[data-game=roulette] .roulette-cinematic.is-spinning .roulette-ball{animation:roulette-ball-drop 4200ms linear both}
body.os-page[data-game=roulette] .roulette-cinematic .roulette-pocket--red path{fill:#9a3040}
body.os-page[data-game=roulette] .roulette-cinematic .roulette-pocket--black path{fill:#141d20}
body.os-page[data-game=roulette] .roulette-cinematic .roulette-pocket--green path{fill:#21644c}
body.os-page[data-game=roulette] .roulette-cinematic .roulette-pocket.is-selected path{stroke:#fff1a6;stroke-width:2.4;fill-opacity:1}
@keyframes roulette-land{from{transform:rotate(0deg)}to{transform:rotate(var(--target-angle))}}
@keyframes roulette-orbit-land{from{transform:rotate(0deg)}to{transform:rotate(1440deg)}}
@keyframes roulette-ball-drop{0%,55%{transform:translateY(-13px)}78%{transform:translateY(-8px)}91%{transform:translateY(1px)}96%{transform:translateY(-1px)}100%{transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){body.os-page[data-game=roulette] .roulette-cinematic *{animation:none!important}}

/* Keep the live stake next to the balance/actions in the same sticky toolbar. */
body.pg-game-page.retro-theme[data-game=roulette] .roulette-panel-tools{flex-wrap:wrap;row-gap:4px}
body.pg-game-page.retro-theme[data-game=roulette] .roulette-panel-stake{flex:0 0 100%;min-width:0;margin:0;padding:2px 0 4px;font:600 12px/1.5 system-ui;color:#f2e6c9;font-variant-numeric:tabular-nums;overflow-wrap:anywhere;white-space:normal}
body.pg-game-page.retro-theme[data-game=roulette] .roulette-bet-dialog{scroll-padding-top:104px}
