/* Scoped to the catalogue: game mechanics and other pages keep their styles. */
.lobby-layout{--lobby-line:#80672f;--lobby-gold:#f2d47e;background:#080807}
.lobby-layout #header-container{max-width:1240px;margin:auto;grid-template-columns:auto auto 1fr auto;gap:16px;padding:8px 24px;min-height:64px}
.lobby-layout .site-brand{justify-self:start}
.lobby-header-nav{display:flex;gap:22px;align-items:center}
.lobby-header-nav a{font-size:14px;text-decoration:none;padding:8px 0}
.lobby-header-nav a[aria-current]{color:var(--lobby-gold);border-bottom:2px solid}
.lobby-layout #menu-button{padding:8px;border:0;background:none;box-shadow:none;min-width:32px}
.lobby-layout #menu-button>span:last-child{display:none}
.lobby-layout #menu-button .menu-button__icon{display:block}
.lobby-layout #buttons-container{gap:6px}
.lobby-layout .boton{border-radius:7px;text-transform:none}
.lobby-layout .site-footer-min{max-width:1240px;margin:auto;padding:20px 24px 70px;font-size:12px}
.lobby-layout .site-footer-min__brand{font-size:16px}
.lobby-layout .site-footer-min ul{padding:0;list-style:none}
.lobby-layout #soporte-instagram{width:42px;height:42px;min-width:42px;min-height:42px;right:12px;bottom:12px}
.lobby{max-width:1240px;margin:0 auto;border:1px solid var(--lobby-line);border-top:0;border-radius:0 0 12px 12px;overflow:hidden;color:#fff3d9}
.lobby h1,.lobby h2,.lobby p{margin:0}
.lobby a{text-decoration:none;color:inherit}
.lobby [hidden]{display:none!important}
.lobby-hero{height:140px;position:relative;display:flex;align-items:center;overflow:hidden;background:#160e08}
.lobby-hero>img{position:absolute;top:0;right:0;width:auto;height:180%;object-fit:contain}
.lobby-hero::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#08070588,transparent 70%)}
.lobby-hero>div{position:relative;z-index:1;padding:20px 30px}
.lobby-hero p{display:none}
.lobby-hero h1{font:italic 500 clamp(27px,3.5vw,44px)/1.1 Georgia,serif;text-shadow:0 2px 12px #000}
.lobby-content{padding:0 24px 16px}
.lobby-tools{padding:10px 0;border-bottom:1px solid var(--lobby-line);display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.lobby-search{display:flex;align-items:center;gap:6px;border:1px solid #a69b83;border-radius:8px;background:#111110;padding:0 8px;flex:0 1 220px;min-width:0}
.lobby-search>span:first-child{font-size:22px;color:var(--lobby-gold)}
.lobby-search input{background:none;border:0;outline:none;color:#fff8e8;width:100%;min-width:0;height:34px;font-size:16px}
.lobby-search input::placeholder{color:#d7d0c3}
.lobby-search:focus-within{outline:2px solid var(--lobby-gold);outline-offset:3px}
.lobby-search button{border:0;background:none;color:#ddd4c2;font-size:20px;width:28px;min-height:34px;cursor:pointer}
.lobby-filters{display:flex;gap:6px;flex:1;flex-wrap:wrap}
.lobby-filters button{min-height:32px;padding:5px 11px;border:1px solid #b79449;border-radius:30px;background:#0a0907;color:#f4ead6;font-size:11px;cursor:pointer;white-space:nowrap}
.lobby-filters button[aria-pressed=true]{background:linear-gradient(135deg,#ffe6a0,#d49c2e);color:#1a1205;border-color:#f1d37e}
.lobby-heading{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin:10px 0 8px}
.lobby h2{font:600 23px/1.2 Georgia,serif}
.lobby-count{color:#c8bfae;font-size:11px;white-space:nowrap}
.lobby-mixed{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:8px}
.lobby-card{position:relative;isolation:isolate;display:block;min-width:0;aspect-ratio:1;background:#17130d;border:1px solid #b08a3f;border-radius:7px;overflow:hidden;transition:border-color .18s,transform .18s}
.lobby-card__art{display:block;position:absolute;inset:0;overflow:hidden}
.lobby-card__background{width:100%;height:100%;object-fit:cover}
.lobby-card__cover{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:none}
.lobby-enhanced:not(.lobby-show-editions) .lobby-mixed .lobby-card__cover{display:block}
.lobby-card__caption{position:absolute;bottom:0;left:0;right:0;padding:24px 8px 7px;background:linear-gradient(transparent,#000b 50%,#000e);display:flex;flex-direction:column;gap:2px;pointer-events:none}
.lobby-card small{font:600 14px/1.15 Georgia,serif;color:#fff4d7;text-align:center}
.lobby-enhanced:not(.lobby-show-editions) .lobby-mixed .lobby-card strong{display:none}
.lobby-card strong{font:600 13px/1.2 Georgia,serif;color:#fff4d7;text-shadow:0 1px 3px #000;overflow-wrap:anywhere}
.lobby-card:hover{border-color:#ffe3a0;transform:translateY(-2px)}
.lobby :is(a,button,[tabindex]):focus-visible{outline:3px solid #f4d57b;outline-offset:3px}
.lobby-show-editions .lobby-mixed .lobby-card__cover{display:none}
.lobby-show-editions .lobby-mixed .lobby-card strong{display:block}
.lobby-show-editions .lobby-mixed .lobby-card small{font:10px/1.2 Arial,sans-serif;text-align:left;color:#e8cb83}
.lobby-card[data-game=dragonboxeo] .lobby-card__cover,.lobby-card[data-game=dragonmagico] .lobby-card__cover,.lobby-card[data-game=imperio] .lobby-card__cover{display:block}
.lobby-more{display:block;border:0;background:none;color:var(--lobby-gold);min-height:32px;margin:4px auto 0;padding:5px 14px;font-size:12px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.lobby-collection{border-top:1px solid var(--lobby-line);margin-top:10px}
.lobby-rail-wrap{position:relative;display:flex;gap:8px;align-items:center}
.lobby-rail{display:flex;gap:9px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:#8e7139 #14110c;padding:3px 2px 6px;flex:1;min-width:0}
.lobby-rail .lobby-card{flex:0 0 calc((100% - 27px)/3.5);aspect-ratio:2.8;scroll-snap-align:start}
.lobby-rail .lobby-card small{display:none}
.lobby-rail .lobby-card__caption{padding:18px 8px 5px}
.lobby-arrow{flex:0 0 30px;height:30px;border:1px solid #d1ac55;border-radius:50%;color:#f3d788;background:#0a0907;font-size:24px;line-height:1;cursor:pointer}
.lobby-arrow:disabled{opacity:.3;cursor:default}
/* Edition art combines the real theme with recognizable game pieces. */
.lobby-symbols{position:absolute;inset:6% 10% 18%;display:flex;justify-content:center;align-items:center;gap:3%;filter:drop-shadow(0 5px 5px #000)}
.lobby-symbols img{width:30%;height:100%;object-fit:contain}
.lobby-symbols--tragamonedas{background:linear-gradient(90deg,#1b0e05c9,#5d380d99,#1b0e05c9);border:2px solid var(--edition-accent);border-radius:8px;padding:3px}
.lobby-balls{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:0;filter:drop-shadow(0 5px 4px #000)}
.lobby-balls i{display:grid;place-items:center;width:58px;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 36% 27%,#fff 0 8%,#e8e8df 10% 36%,var(--edition-accent) 39% 52%,#13171c 95%);color:#111;font:bold 22px Arial,sans-serif;box-shadow:inset -5px -6px 8px #0009}
.lobby-balls i:nth-child(2){width:76px;z-index:1;margin:0 -5px;font-size:27px}
.lobby-wheel{position:absolute;left:25%;top:3%;width:50%;aspect-ratio:1;border-radius:50%;border:6px ridge #d49a38;background:repeating-conic-gradient(#981c16 0deg 10deg,#111 10deg 20deg);transform:rotateX(28deg);box-shadow:0 5px 10px #000}
.lobby-wheel::before{content:'';position:absolute;inset:23%;border:3px solid #d6ae58;border-radius:50%;background:radial-gradient(#fff1a6,#98621d 35%,#321909 70%)}
.lobby-wheel i{position:absolute;inset:43%;background:#ffe49b;border-radius:50%;box-shadow:0 0 12px #ffd17b}
.lobby-fan{position:absolute;inset:3% 20% 15%;display:flex;justify-content:center}
.lobby-fan img{position:absolute;height:100%;width:48%;object-fit:cover;border:1px solid #dbbd79;border-radius:5px;box-shadow:0 3px 6px #000;transform-origin:50% 100%}
.lobby-fan img:first-child{transform:rotate(-22deg)}
.lobby-fan img:last-child{transform:rotate(22deg)}
.lobby-single{border:0;margin-top:12px}
.lobby-single-link{height:84px;aspect-ratio:auto;display:flex;align-items:center;justify-content:space-between;padding:12px 22px;gap:10px}
.lobby-single-link>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 40%;z-index:-2}
.lobby-single-link::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#050504eb,transparent 65%,#05050499);z-index:-1}
.lobby-single-link h2{font-size:26px;font-style:italic}
.lobby-enter{border:1px solid #f1cd70;border-radius:7px;background:#090705ba;padding:8px 20px;font:16px Georgia,serif;white-space:nowrap}
.lobby-live{position:relative;overflow:hidden;border:1px solid var(--lobby-line);border-radius:7px;margin-top:12px;display:flex;align-items:center;justify-content:space-between;padding:12px 20px;gap:12px;background:#21170d}
.lobby-live>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.35}
.lobby-live>div,.lobby-live>a{position:relative}
.lobby-live p{font-size:11px;color:#e2d5bd;margin-top:3px}
.lobby-live>a{border:1px solid #d2b873;border-radius:6px;padding:8px 12px;font-size:12px;background:#090705b8}
.lobby-reading{display:flex;gap:20px;flex-wrap:wrap;justify-content:center;font-size:12px;margin-top:16px}
.lobby-reading a{text-decoration:underline;text-underline-offset:4px}
.lobby-empty{padding:20px 0;color:#d5c9b5}
.lobby-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
@media(min-width:761px){.lobby-layout .site-brand__mark{width:32px;height:32px;color:transparent;transform:none;text-shadow:none;background:url('../images/seo_v23/dragon-48.png') center/contain no-repeat}}
@media(min-width:761px) and (max-width:1050px){.lobby-header-nav{gap:12px}.lobby-mixed{grid-template-columns:repeat(4,minmax(0,1fr))}.lobby-card{aspect-ratio:1.8}.lobby-layout #header-container{gap:10px;padding:8px 16px}}
@media(max-width:760px){
 .lobby-layout #header-container{grid-template-columns:30px minmax(60px,1fr) auto;gap:5px;padding:6px 10px;min-height:62px}
 .lobby-header-nav{display:none}.lobby-layout .site-brand{gap:0}.lobby-layout .site-brand__mark{display:none}
 .lobby-layout .site-brand__copy strong{font-size:13px;letter-spacing:0}.lobby-layout .site-brand__copy small{font-size:7px;letter-spacing:.15em}
 .lobby-layout #buttons-container{max-width:210px;gap:3px}.lobby-layout .boton{font-size:11px;padding:5px 7px;min-height:30px}
 .lobby-layout #buttons-container .language-switch{font-size:10px;gap:3px}.lobby-layout .language-switch a{padding:2px 4px}
 .lobby{border-left:0;border-right:0}.lobby-hero{height:86px}.lobby-hero>div{padding:12px 14px}.lobby-hero h1{font-size:23px;max-width:65%}
 .lobby-hero>img{height:150%}.lobby-content{padding:0 12px 14px}.lobby-tools{gap:7px;padding:8px 0}
 .lobby-search{flex-basis:100%}.lobby-search input{height:32px}.lobby-search button{min-height:32px}
 .lobby-filters{gap:5px}.lobby-filters button{font-size:10px;padding:4px 8px;min-height:29px}
 .lobby h2{font-size:19px}.lobby-heading{margin:10px 0 7px}.lobby-count{font-size:10px}
 .lobby-mixed{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.lobby-card{aspect-ratio:1.85}
 .lobby-card small{font-size:14px}.lobby-card strong{font-size:12px}.lobby-card__caption{padding:20px 7px 5px}
 .lobby-rail-wrap{gap:4px}.lobby-arrow{flex-basis:22px;height:28px;font-size:21px}.lobby-rail{gap:7px;padding-bottom:5px}
 .lobby-rail .lobby-card{flex-basis:46%;aspect-ratio:2.1}.lobby-rail .lobby-card strong{font-size:11px}.lobby-rail .lobby-card__caption{padding:14px 5px 4px}
 .lobby-collection{margin-top:8px}.lobby-balls i{width:36px;font-size:15px}.lobby-balls i:nth-child(2){width:48px;font-size:20px}
 .lobby-single{margin-top:10px}.lobby-single-link{height:65px;padding:8px 12px}.lobby-single-link h2{font-size:20px}.lobby-enter{padding:6px 10px;font-size:12px}
 .lobby-live{padding:10px;gap:8px}.lobby-live h2{font-size:17px}.lobby-live>a{font-size:10px;padding:7px}.lobby-live p{font-size:9px}
 .lobby-reading{gap:12px;font-size:11px}
}
@media(max-width:360px){.lobby-layout #header-container{padding-inline:6px;gap:3px}.lobby-layout .site-brand__copy strong{font-size:11px}.lobby-layout .boton{font-size:10px;padding-inline:5px}.lobby-filters button{padding-inline:6px}.lobby-hero h1{font-size:21px}.lobby-single-link h2{font-size:18px}}
@media(prefers-reduced-motion:reduce){.lobby *,.lobby *::before,.lobby *::after{scroll-behavior:auto!important;transition:none!important}}

.lobby:not(.lobby-enhanced) .lobby-mixed .lobby-card small{font:10px Arial,sans-serif;text-align:left}
.lobby-layout #soporte-instagram{padding:8px;box-sizing:border-box}
.lobby-layout #soporte-instagram .instagram-label{display:none}
.lobby-layout #soporte-instagram svg{width:24px;height:24px;flex-basis:24px}
.lobby-layout .mi-saldo{margin:5px auto;padding:5px 12px;gap:12px}
@media(max-width:760px){.lobby-layout .mi-saldo{gap:8px;padding:4px 8px}.lobby-layout .mi-saldo__item{gap:4px}.lobby-layout .mi-saldo__item small{font-size:8px}.lobby-layout .mi-saldo__item strong{font-size:11px}}
/* V3: square edition cards and readable single-game cards. */
.lobby-rail .lobby-card{aspect-ratio:1 / 1;flex-basis:calc((100% - 36px)/4.5)}
.lobby-rail .lobby-card__art{bottom:48px}
.lobby-rail .lobby-card__caption{height:48px;box-sizing:border-box;padding:7px 9px;background:#100e0a;justify-content:center;border-top:1px solid #80672f}
.lobby-rail .lobby-card strong{font-size:14px;line-height:1.2}
.lobby-rail .lobby-symbols{inset:12% 5%;gap:2%}
.lobby-rail .lobby-wheel{top:5%;left:17%;width:66%}
.lobby-rail .lobby-fan{inset:10% 18%}
.lobby-rail .lobby-balls i{width:26%;font-size:20px}
.lobby-rail .lobby-balls i:nth-child(2){width:36%;font-size:27px}
.lobby .lobby-single-link{width:100%;max-width:none;aspect-ratio:auto;box-sizing:border-box}
@media(max-width:760px){
 .lobby-rail .lobby-card{flex-basis:calc((100% - 7px)/2);aspect-ratio:1 / 1}
 .lobby-rail .lobby-card__art{bottom:44px}
 .lobby-rail .lobby-card__caption{height:44px;padding:5px 6px}
 .lobby-rail .lobby-card strong{font-size:12px;line-height:1.2}
 .lobby-rail .lobby-balls i{font-size:15px}
 .lobby-rail .lobby-balls i:nth-child(2){font-size:20px}
 .lobby .lobby-single-link{height:auto;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;padding:0 12px 12px;background:#100e0a;align-items:center}
 .lobby-single-link>img{position:relative;inset:auto;grid-column:1 / -1;width:calc(100% + 24px);max-width:none;height:auto;aspect-ratio:3 / 2;object-fit:contain;object-position:center;margin:0 -12px;z-index:0}
 .lobby-single-link::after{display:none}
 .lobby .lobby-single-link h2{font-size:20px;line-height:1.2;font-style:normal;overflow-wrap:normal}
 .lobby .lobby-single-link .lobby-enter{padding:8px 12px;font-size:13px;justify-self:end}
}

@media(min-width:761px){
 .lobby .lobby-single-link{height:220px;padding:24px 28px;background:#100e0a}
 .lobby-single-link>img{inset:0 0 0 auto;width:auto;max-width:65%;height:100%;object-fit:contain;object-position:right center}
 .lobby-single-link::after{background:linear-gradient(90deg,#100e0a 0%,#100e0aee 25%,transparent 65%)}
 .lobby-single-link h2{max-width:40%;font-size:30px}
 .lobby-single-link .lobby-enter{align-self:flex-end;background:#080705ed}
}
/* Only the hero background changes; its title and dimensions stay fixed. */
.lobby-hero>.lobby-hero-slide{opacity:0;transition:opacity 1.2s ease-in-out;pointer-events:none}
.lobby-hero>.lobby-hero-slide.is-active{opacity:1}
.lobby-hero>.lobby-hero-controls{position:absolute;right:8px;bottom:4px;z-index:3;display:flex;align-items:center;gap:4px;padding:0;border-radius:18px;background:#080705c9;color:#ffe5a0;font:11px Arial,sans-serif}
.lobby-hero-controls button{display:grid;place-items:center;width:30px;height:30px;padding:0;border:1px solid #c5a255;border-radius:50%;background:#100e0ac9;color:#ffe5a0;font-size:21px;cursor:pointer}
.lobby-hero-controls [data-hero-pause]{font-size:13px}
.lobby-hero-controls [data-hero-count]{min-width:28px;text-align:center}
@media(prefers-reduced-motion:reduce){.lobby-hero>.lobby-hero-slide{transition:none}}