/* Scoped catalogue layout only. Header, wallet, profiles and chat controls use production CSS. */
.is-testslots{--sl-surface:#fff;--sl-soft:#f6f5f2;--sl-border:#e9e7e2;--sl-shadow:0 5px 16px #3d2a1310,0 1px 2px #3d2a1308;--sl-raised:0 14px 30px #3d2a1312,0 2px 5px #3d2a1308;overflow-x:clip}
[data-theme=dark] .is-testslots{--sl-surface:#202329;--sl-soft:#272a31;--sl-border:#33373f;--sl-shadow:0 5px 16px #0002,0 1px 2px #0003;--sl-raised:0 14px 30px #0003,0 2px 5px #0002}
.is-testslots [hidden]{display:none!important}
.is-testslots .layout>.sidebar,.is-testslots .layout>.main-column,.is-testslots .layout>.mode-sidebar,.is-testslots .layout>.mode-content{display:none!important}
.is-testslots .layout.layout--slots{display:grid;align-items:start}
.is-testslots .layout.layout--slots>.slots-page{grid-column:1;grid-row:1;min-width:0;padding:0;background:transparent;border:0;box-shadow:none}
.slots-page[hidden]{display:none}
.is-testslots .slots-page h1[id],.is-testslots .slots-page h2[id]{scroll-margin-top:110px}
.is-testslots .lobby3-page .slots-catalogue.card{background:transparent!important}
.is-testslots .l3-slot-art{background-size:cover;background-repeat:no-repeat}
.is-testslots .l3-slot-backdrop{display:none}
.is-testslots .l3-provider-all{font-size:12px;line-height:1.3;overflow-wrap:anywhere;padding:8px}
.is-testslots .l3-chat-rail{min-width:0}
@media(min-width:1500px){
 .is-testslots .layout.layout--slots>.l3-chat-rail{grid-column:2;grid-row:1;align-self:stretch;position:relative}
 .is-testslots .l3-chat-rail>.ruvi-chat{position:sticky;top:24px;bottom:auto;width:100%;height:calc(100dvh - 48px);max-height:980px;min-height:0;align-self:start}
 .is-testslots .layout.layout--slots.chat-collapsed{grid-template-columns:minmax(0,1fr) 64px}
}
@media(max-width:1499px){.is-testslots .l3-chat-rail{display:contents}}
.is-testslots .layout.layout--slots>.site-footer{grid-column:1;grid-row:2;min-width:0;max-width:100%}

/* Inherit the production viewport scale, matching the native header. */
@media(min-width:47.5625em) and (hover:hover) and (pointer:fine){
 .is-testslots .layout.layout--slots{width:100%;max-width:1700px;box-sizing:border-box;padding:0 24px;gap:20px;margin:20px auto 0;grid-template-columns:minmax(0,1fr)}
 .is-testslots .lobby3-page .l3-title{font-size:38px;letter-spacing:-1px;margin:0 0 4px}
 .is-testslots .lobby3-page .l3-subtitle{font-size:13px;margin-bottom:12px}
 .is-testslots .lobby3-page .l3-games{gap:10px}
 .is-testslots .lobby3-page .l3-game{aspect-ratio:1.64;border-radius:13px}
 .is-testslots .lobby3-page .l3-game h2{font-size:25px;margin:16px 14px 5px;letter-spacing:-.6px}
 .is-testslots .lobby3-page .l3-game p{font-size:12px;margin:0 14px}
 .is-testslots .lobby3-page .l3-game-arrow{width:40px;height:40px;font-size:27px;left:14px;bottom:14px}
 .is-testslots .lobby3-page .l3-coming{left:14px;bottom:14px;font-size:11px;padding:9px 12px}
 .is-testslots .lobby3-page .slots-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
 .is-testslots .lobby3-page .l3-toolbar{margin-top:10px;border-radius:14px;padding:6px;gap:8px}
 .is-testslots .lobby3-page .l3-category{font-size:12px;padding:0 9px;gap:5px}
 .is-testslots .lobby3-page .l3-categories{flex-basis:auto}
 .is-testslots .lobby3-page .l3-toolbar .slots-search{width:180px;font-size:12px}
 .is-testslots .lobby3-page .l3-provider-toggle{width:140px;font-size:12px}
 .is-testslots .lobby3-page .slots-heading{min-height:40px;margin-bottom:10px;padding-bottom:8px}
 .is-testslots .lobby3-page .slots-heading h2{font-size:22px}
}
/* em breakpoints are intentionally stable: ui-scale.js rewrites px media. */
@media(min-width:80em) and (hover:hover) and (pointer:fine){
 .is-testslots .layout.layout--slots{width:83%}
}
@media(min-width:47.5625em) and (max-width:68.75em) and (hover:hover) and (pointer:fine){
 .is-testslots .lobby3-page .slots-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
}
@media(max-width:93.6875em) and (hover:hover) and (pointer:fine){
 .is-testslots .l3-chat-rail{display:contents}
}
/* The global scaler rewrites legacy px media. Restore the native drawer at the
   actual viewport breakpoint so a visible sticky rail cannot become a grid row. */
@media(min-width:47.5625em) and (max-width:93.6875em) and (hover:hover) and (pointer:fine){
 .is-testslots:not(.native-slot-open) .layout.layout--slots>.l3-chat-rail>.ruvi-chat{position:fixed;z-index:40;right:16px;top:96px;bottom:18px;width:min(360px,calc(100vw - 32px));height:auto;max-height:none;min-height:0;grid-column:auto;grid-row:auto;align-self:auto;border:1px solid #eee6dd;box-shadow:0 18px 70px #30200b20;opacity:0;visibility:hidden;transform:translateX(16px);transition:transform .2s,opacity .2s}
 .is-testslots:not(.native-slot-open) .layout.layout--slots>.l3-chat-rail>.ruvi-chat.is-open{opacity:1;visibility:visible;transform:none}
 .is-testslots:not(.native-slot-open)>.chat-launcher:not([hidden]){display:flex}
 .is-testslots:not(.native-slot-open)>.chat-backdrop:not([hidden]){display:block;position:fixed;inset:0;z-index:39;pointer-events:none}
}
@media(min-width:47.5625em) and (max-width:93.6875em) and (hover:hover) and (pointer:fine) and (prefers-reduced-motion:reduce){
 .is-testslots:not(.native-slot-open) .layout.layout--slots>.l3-chat-rail>.ruvi-chat{transition:none}
}
@media(min-width:93.75em) and (hover:hover) and (pointer:fine){
 .is-testslots .layout.layout--slots{grid-template-columns:minmax(0,1fr) 310px}
 .is-testslots .layout.layout--slots.chat-collapsed{grid-template-columns:minmax(0,1fr) 64px}
 .is-testslots .layout.layout--slots>.l3-chat-rail{display:block;grid-column:2;grid-row:1;align-self:stretch;position:relative}
 .is-testslots .layout.layout--slots>.l3-chat-rail>.ruvi-chat{width:310px}
 /* The lobby starts below the native header (max 80px), canvas gap 20px and
    keeps 24px below the composer. The player owns its separate frame height. */
 .is-testslots:not(.native-slot-open) .layout.layout--slots>.l3-chat-rail>.ruvi-chat{height:calc(100dvh - 124px)}
 .is-testslots .layout.layout--slots.chat-collapsed>.l3-chat-rail>.ruvi-chat{width:64px}
}
/* The lobby chat belongs to the first games row in document flow. It must
   scroll out with that row, never stick to or follow the viewport. */
@media(min-width:93.75em){
 .is-testslots:not(.native-slot-open) .layout.layout--slots>.l3-chat-rail>.ruvi-chat{--chat-inline:1;position:relative;left:auto;right:auto;top:auto;bottom:auto;margin-top:var(--native-chat-offset,0px);width:var(--native-chat-width,310px);height:var(--native-chat-height,calc(100dvh - 124px));max-height:none;min-height:0}
 .is-testslots .layout.layout--slots>.site-footer{grid-column:1}
}
