/* The home uses the same warm, raised surfaces as the game sheets. */
#lobby{--home-line:#c8d8bc;--home-edge:#a7bf96;--home-ink:#254f36;--home-radius:26px;display:flex;flex-direction:column;gap:26px;min-width:0}
#lobby>.lobby-hero,#lobby>.arcade-toolbar,#lobby>.tournament-entry,#lobby>.bot-hub,#lobby>.catalog-section,#lobby>.lobby-bottom{margin:0;min-width:0;border:1px solid var(--home-line);border-bottom:5px solid var(--home-edge);border-radius:var(--home-radius);background:linear-gradient(145deg,#fffef7,#edf4e7);box-shadow:inset 0 2px #fff,0 8px 0 #e2eadb,0 15px 28px #23472e08!important}
#lobby>.lobby-hero{display:grid!important;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);min-height:310px;overflow:hidden}
#lobby .hero-copy{padding:30px!important;align-content:center}
#lobby .hero-copy h1{font-size:clamp(30px,3.4vw,46px);line-height:1.35;letter-spacing:-1px;margin:14px 0;color:var(--home-ink)}
#lobby .hero-copy p{font-size:14px!important;line-height:1.9;max-width:540px;margin:0}
#lobby .hero-copy .primary-button{margin-top:20px;min-height:52px}
#lobby .hero-benefits{margin-top:20px;gap:14px;flex-wrap:wrap;font-size:11px}
#lobby .hero-table{min-height:310px;background:radial-gradient(circle at 50% 35%,#fcfff3,#dce9d0);border-inline-start:1px solid #c8d7bd;box-shadow:inset 0 -8px 20px #57733d0c!important}
#lobby .hero-star{display:none}
#lobby>.arcade-toolbar{padding:18px 22px;gap:18px}
#lobby .arcade-toolbar>button,#lobby .hero-copy .primary-button,#lobby .tournament-entry>.primary-button{border-bottom-width:5px;border-radius:15px;box-shadow:inset 0 1px #ffffff50,0 4px 7px #294b3010!important}
#lobby>.tournament-entry{display:grid;grid-template-columns:72px minmax(0,1fr) auto;gap:18px 24px;padding:28px;background:radial-gradient(ellipse at 0 0,#fff2c6,transparent 65%),linear-gradient(130deg,#fffdf2,#e9f2dd)}
#lobby .tournament-entry>.cup-emblem{grid-column:1;grid-row:1/3}
#lobby .tournament-entry>div:not(.cup-prizes){grid-column:2;min-width:0}
#lobby .tournament-entry h2,#lobby .bot-heading h2,#lobby .catalog-heading h2{color:var(--home-ink);font-size:24px;line-height:1.5;margin:0 0 5px;letter-spacing:-.3px}
#lobby .tournament-entry p,#lobby .bot-heading p{font-size:13px;line-height:1.8;color:#62785b}
#lobby .tournament-entry>.cup-prizes{grid-column:2;grid-row:2;width:100%;max-width:490px;margin:0;gap:10px}
#lobby .tournament-entry>.primary-button{grid-column:3;grid-row:1/3;margin:0;min-height:56px;padding:14px 24px}
#lobby .tournament-entry .cup-prize{padding:11px 12px;border-radius:14px}
#lobby .tournament-entry .cup-prize strong{font-size:21px}
#lobby>.bot-hub,#lobby>.catalog-section{padding:26px}
#lobby .bot-heading{margin-bottom:22px;gap:15px}
#lobby .bot-heading>svg{box-sizing:content-box;width:26px;height:26px;padding:12px;border:1px solid #c7d7b9;border-bottom:4px solid #adbf9c;border-radius:16px;background:linear-gradient(145deg,#fffef4,#e1eccf)}
#lobby .bot-game-tabs{gap:10px;margin-bottom:20px}
#lobby .bot-game-tabs button,#lobby .filter-bar button{min-height:45px;border:1px solid #c9d8be;border-bottom:4px solid #aebe9f;border-radius:13px;background:linear-gradient(150deg,#fffef8,#e9f1df);box-shadow:inset 0 1px #fff!important;color:#44633b}
#lobby .bot-game-tabs button[aria-pressed=true],#lobby .filter-bar .filter-active{border-color:#3d7049;border-bottom-color:#1e4830;background:linear-gradient(145deg,#4c8258,#2c5d3c);color:#fff;box-shadow:inset 0 1px #ffffff3d!important}
#lobby .bot-card{border-radius:18px;background:linear-gradient(145deg,#fffef8,#edf4e5);box-shadow:inset 0 1px #fff,0 4px 8px #30532b06!important}
#lobby .catalog-heading{gap:20px;align-items:center}
#lobby .game-search{min-height:48px;border:1px solid #c7d6bd;border-bottom:3px solid #b6c9a7;border-radius:14px;background:#fffef9}
#lobby .filter-bar{padding:20px 0;gap:9px;flex-wrap:wrap}
#lobby .filter-bar button{font-size:12px;padding:9px 13px}
#lobby .game-cards{gap:22px}
#lobby .game-card{border:1px solid #c8d7ba;border-bottom:5px solid #9fb68a;border-radius:21px;background:linear-gradient(150deg,#fffef8,#f0f5e8);box-shadow:inset 0 1px #fff,0 7px 13px #30532b0a!important;transition:transform .18s,box-shadow .18s}
#lobby .card-art{height:235px;background-color:#e7efdd;box-shadow:inset 0 -6px 14px #3a5a2510!important}
#lobby .card-body{padding:22px}
#lobby .card-title-row h3{font-size:21px}
#lobby .card-body p{font-size:13px;line-height:1.8;min-height:48px}
#lobby .card-play{padding:9px 13px;border:1px solid #c6d7b6;border-bottom:3px solid #a9bf97;border-radius:11px;background:linear-gradient(145deg,#fffef5,#dfeccd);font-size:13px}
#lobby>.lobby-bottom{padding:24px;gap:18px}
#lobby .lobby-bottom-icon{border:1px solid #c3d5b4;border-bottom:4px solid #a1bc8b;background:linear-gradient(145deg,#fafff1,#deebcf);border-radius:17px}
#lobby .lobby-bottom h3{font-size:18px;color:var(--home-ink)}
#lobby .lobby-bottom p{font-size:13px;line-height:1.9}
#lobby .lobby-bottom>span{display:none}
#lobby :is(button,a,input):focus-visible{outline:3px solid #bb953b;outline-offset:4px}
@media(hover:hover){#lobby .game-card:hover{transform:translateY(-3px);box-shadow:inset 0 1px #fff,0 10px 20px #30532b18!important}}
@media(max-width:1050px){#lobby .tournament-entry{grid-template-columns:62px minmax(0,1fr)}#lobby .tournament-entry>.primary-button{grid-column:1/-1;grid-row:3;width:100%}#lobby .tournament-entry>.cup-prizes{max-width:none}#lobby .game-cards{grid-template-columns:repeat(2,minmax(0,1fr))}#lobby .catalog-heading{flex-wrap:wrap}#lobby .game-search{width:100%}}
@media(max-width:600px){
 #lobby{gap:22px;--home-radius:22px}
 #lobby>.lobby-hero{grid-template-columns:minmax(0,1fr);min-height:0}
 #lobby .hero-copy{padding:22px 20px!important;gap:0}
 #lobby .hero-copy h1{font-size:27px!important;line-height:1.3!important;margin:12px 0}
 #lobby .hero-copy h1 span{font-size:24px}
 #lobby .hero-copy p{max-width:none;font-size:12px!important;line-height:1.8}
 #lobby .hero-copy .eyebrow{font-size:10px}
 #lobby .hero-copy .primary-button{width:100%;justify-content:center}
 #lobby .hero-table{display:grid!important;place-items:center;height:220px!important;min-height:220px!important;border-inline-start:0;border-top:1px solid #c8d7bd}
 #lobby .hero-arena-art{display:block;width:100%!important;height:220px!important;max-width:360px!important;object-fit:contain}
 #lobby .hero-benefits{gap:10px;font-size:10px}
 #lobby>.arcade-toolbar{padding:16px;gap:12px}
 #lobby>.tournament-entry{grid-template-columns:54px minmax(0,1fr);padding:20px 16px;gap:17px 14px}
 #lobby .tournament-entry>.cup-emblem{grid-row:1;width:54px;height:58px}
 #lobby .tournament-entry h2,#lobby .bot-heading h2,#lobby .catalog-heading h2{font-size:20px;line-height:1.5}
 #lobby .tournament-entry p,#lobby .bot-heading p{font-size:12px}
 #lobby .tournament-entry>.cup-prizes{grid-column:1/-1;gap:8px}
 #lobby .tournament-entry .cup-prize{padding:10px 7px;gap:0 5px}
 #lobby .tournament-entry .cup-prize>b{width:21px;height:21px;font-size:10px}
 #lobby .tournament-entry .cup-prize strong{font-size:19px}
 #lobby .tournament-entry .cup-prize small{font-size:9px}
 #lobby .tournament-entry>.primary-button{min-height:54px;font-size:15px}
 #lobby>.bot-hub,#lobby>.catalog-section{padding:20px 16px}
 #lobby .bot-heading{gap:12px;align-items:start}
 #lobby .bot-heading>svg{padding:10px;width:22px;height:22px;border-radius:13px}
 #lobby .bot-game-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 #lobby .bot-game-tabs button{font-size:12px;padding:10px 8px;min-width:0;min-height:46px;justify-content:flex-start}
 #lobby .bot-cards{gap:12px}
 #lobby .bot-card{padding:13px 11px}
 #lobby .filter-bar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible;gap:8px}
 #lobby .filter-bar button{font-size:11px;padding:9px 7px;white-space:normal}
 #lobby .game-cards{grid-template-columns:minmax(0,1fr);gap:18px}
 #lobby .card-art{height:220px}
 #lobby .card-body{padding:19px}
 #lobby .card-body p{min-height:0;font-size:13px;margin:10px 0 16px}
 #lobby .card-bottom{font-size:11px;gap:8px}
 #lobby .card-play{min-height:44px;font-size:13px;padding:9px 12px}
 #lobby>.lobby-bottom{padding:20px 16px;align-items:start}
 #lobby .lobby-bottom h3{font-size:16px}
 #lobby .lobby-bottom p{font-size:12px}
}
/* Daylight navigation keeps the same raised buttons as the home cards. */
@media(max-width:900px){
 html body #mobile-navigation{background:linear-gradient(155deg,#fffef7,#edf4e6);border:1px solid #c9d9bd;border-top:2px solid #b1c59e;border-bottom:0;border-radius:22px 22px 0 0;box-shadow:inset 0 1px #fff,0 -8px 22px #254a3010!important;bottom:0;padding:10px 10px max(10px,env(safe-area-inset-bottom));gap:7px;overflow:visible}
 html body #mobile-navigation>button{border:1px solid #c9d8bc;border-bottom:4px solid #a8bf94;border-radius:14px;background:linear-gradient(150deg,#fffef8,#e6efda);color:#42633b;box-shadow:inset 0 1px #fff!important;min-height:57px;min-width:0;padding:8px 3px;gap:5px;font-size:10px;transition:background .15s,transform .15s}
 html body #mobile-navigation>button svg{width:23px;height:23px}
 html body #mobile-navigation>button.mobile-active{background:linear-gradient(145deg,#4c8258,#2c5d3c);border-color:#3d7049;border-bottom-color:#1e4830;color:#fff;box-shadow:inset 0 1px #ffffff40,0 3px 8px #23472e10!important}
 html body #mobile-navigation>button:disabled{opacity:.5}
 html body #mobile-navigation>button:active:enabled{transform:translateY(2px)}
 html body #mobile-navigation>button:focus-visible{outline:3px solid #bb953b;outline-offset:2px}
}
body:not(.in-room) #seo-information{border:1px solid #c8d8bc;border-bottom:5px solid #a7bf96;border-radius:24px;background:linear-gradient(145deg,#fffef7,#edf4e7);box-shadow:inset 0 2px #fff,0 8px 0 #e2eadb!important}
#account-logout{border:1px solid #a33834!important;border-bottom:4px solid #7c2828!important;background:linear-gradient(145deg,#d96a5a,#b83f3a)!important;color:#fff;border-radius:14px;box-shadow:inset 0 1px #ffffff45!important;transition:transform .15s,filter .15s}
#account-logout:hover:enabled{filter:brightness(1.05)}
#account-logout:active:enabled{transform:translateY(2px)}
#account-logout:focus-visible{outline:3px solid #bb953b;outline-offset:3px}
@media(prefers-reduced-motion:reduce){#lobby .game-card,#mobile-navigation>button{transition:none}}
.game-audio-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.game-audio-toggle{display:inline-flex!important;align-items:center;justify-content:center;gap:8px;min-height:48px;min-width:0;border-radius:14px;font-size:12px}
.game-audio-toggle svg{width:20px;height:20px;flex-shrink:0}
.game-audio-toggle[aria-pressed=true]{background:linear-gradient(145deg,#e8f2d9,#d8e7c5)!important;border-color:#8eaf74!important;border-bottom-color:#709353!important;color:#2f5738}
.invitation-card>.game-audio-toggle,.searching-card>.game-audio-toggle{width:100%;margin-top:14px}
.sticker-picker{--sticker-row:80px;--sticker-gap:10px;gap:var(--sticker-gap);padding:4px;grid-auto-rows:var(--sticker-row);height:calc(3 * var(--sticker-row) + 2 * var(--sticker-gap) + 8px);overflow-y:auto;overflow-x:hidden;overscroll-behavior-x:contain;overscroll-behavior-y:auto;scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:#a0b98b #eff4e7;align-content:start}
.sticker-choice{padding:3px!important;border-radius:17px;overflow:visible;min-height:0!important;height:100%;width:100%;aspect-ratio:auto}
.sticker-choice img{border-radius:14px;object-fit:contain}
.sticker-choice[aria-pressed=true]{outline:3px solid #568242;outline-offset:1px}
@media(max-width:600px){.sticker-picker{--sticker-row:88px;--sticker-gap:12px;grid-template-columns:repeat(3,minmax(0,1fr))}.game-audio-controls{gap:9px}.game-audio-toggle{font-size:11px}}

/* Bring every game's artwork closer while keeping the card labels above it. */
#lobby .card-art>.mini-grid,#lobby .card-art>.mini-tic{scale:1.16}
#lobby .card-art>img:is(.parchisi-mini-art,.monopoly-mini-art){position:absolute;inset:0;width:100%;height:100%;max-width:none;padding:0;object-fit:contain;box-sizing:border-box;scale:1.1}
#lobby .card-art>.card-index{z-index:2}
@media(max-width:600px){
 #lobby .card-art>.mini-grid,#lobby .card-art>.mini-tic{scale:1.12}
 #lobby .card-art>img:is(.parchisi-mini-art,.monopoly-mini-art){scale:1.12}
}

/* Challenge posters: oversized rivals, a sculpted clash badge and arena spotlights. */
#lobby .card-art{isolation:isolate;background:radial-gradient(ellipse at 22% 28%,#fff6c9 0,transparent 48%),radial-gradient(ellipse at 88% 80%,#a0c790 0,transparent 58%),linear-gradient(145deg,#e7efdb,#c1d3ac)!important}
#lobby .card-art::before{content:'';position:absolute;inset:-35%;z-index:-1;background:conic-gradient(from 15deg,transparent 0 13%,#fff9df99 15% 17%,transparent 19% 52%,#fff7c266 54% 56%,transparent 58%);rotate:-12deg;pointer-events:none}
#lobby .card-art::after{content:'';position:absolute;left:8%;right:8%;bottom:8px;height:30px;border-radius:50%;background:radial-gradient(ellipse,#234a3566,transparent 70%);z-index:0;pointer-events:none}
#lobby .card-art>.mini-grid,#lobby .card-art>.mini-tic{scale:1.12;transform:perspective(650px) rotateX(28deg) rotateZ(-12deg) translateY(-6px)!important;opacity:.78;filter:saturate(1.2);transition:transform .22s}
#lobby .card-art>img:is(.parchisi-mini-art,.monopoly-mini-art){scale:1.2;transform:perspective(650px) rotateX(12deg) rotateZ(-7deg) translateY(-14px);filter:drop-shadow(0 10px 7px #284b3433);opacity:.9}
#lobby .card-art>.card-badge,#lobby .card-art>.card-index{z-index:4}
.card-challenge{position:absolute;inset:52px 10px 5px;display:flex;align-items:flex-end;justify-content:center;gap:0;pointer-events:none;direction:ltr;z-index:2}
.art-rival{display:grid;place-items:center;width:39%;max-width:132px;height:140px;filter:drop-shadow(0 9px 3px #173b3040);transform-origin:50% 90%;transition:transform .22s}
.art-rival-left{transform:rotate(-13deg) translateX(10px)}.art-rival-right{transform:rotate(13deg) translateX(-10px)}
.art-rival>img{width:100%;height:100%;object-fit:contain}
.art-ivory{filter:grayscale(.8) sepia(.2) brightness(1.35) contrast(.85)}
.art-clash{display:grid;place-items:center;flex:0 0 44px;width:44px;height:48px;align-self:center;margin:24px -9px 0;z-index:3;border:2px solid #fff3c3;border-bottom:6px solid #a37d37;border-radius:16px;background:linear-gradient(135deg,#fff2b8,#dcba64);color:#4e5a34;rotate:-7deg;box-shadow:inset 0 2px #fff8,0 5px 10px #294f3422!important}
.art-clash svg{width:27px;height:27px;stroke-width:2.3}
.art-disc{position:relative;display:grid;place-items:center;width:100px;height:89px;max-width:100%;border:4px solid #a9c294;border-bottom:13px solid #173e2c;border-radius:50%;background:radial-gradient(ellipse at 32% 20%,#80a36b,#39684a 55%,#1d4932);box-shadow:inset 0 0 0 5px #fff2,inset 0 5px #b8cf9e!important}
.art-disc::after{content:'';position:absolute;inset:11px;border:2px solid #ffffff35;border-radius:50%}.art-disc svg{width:45px;height:45px;color:#f9e8a7;stroke-width:2}
.art-disc-ivory{background:radial-gradient(ellipse at 30% 20%,#fffdf1,#eee1ad 65%,#c2a66a);border-color:#fff4ce;border-bottom-color:#ac9157}
.art-disc-ivory svg{color:#526c40}
.reversi .art-disc{transform:rotateY(-22deg) rotateX(12deg)}.reversi .art-disc-ivory{transform:rotateY(28deg) rotateX(-16deg);border-bottom-color:#315b3d}
.art-tic-piece{width:114px;height:114px;stroke-width:4;color:#285f40;filter:drop-shadow(0 6px 0 #153e2b)}.art-tic-gold{color:#fff0b8;filter:drop-shadow(0 6px 0 #b29350)}
.art-property{display:grid;place-items:center;width:104px;height:105px;border:3px solid #b8cfa3;border-bottom:11px solid #234e34;border-radius:23px;background:linear-gradient(135deg,#88ad6b,#3e7550);box-shadow:inset 0 3px #d6e6b8!important;color:#fff4c7}.art-property svg{width:77px;height:77px;stroke-width:1.8}
.art-fortune{position:relative;width:115px;height:120px;display:block}.art-fortune img{position:absolute;width:79px;height:88px;object-fit:contain;bottom:0;left:0;filter:drop-shadow(0 5px 0 #9b7937)}.art-fortune img:nth-child(2){left:30px;bottom:15px;rotate:14deg}.art-fortune img:nth-child(3){left:12px;bottom:40px;rotate:-12deg}
@media(hover:hover){#lobby .game-card:hover .art-rival-left{transform:rotate(-8deg) translate(11px,-7px) scale(1.06)}#lobby .game-card:hover .art-rival-right{transform:rotate(8deg) translate(-11px,-7px) scale(1.06)}}
@media(max-width:600px){.card-challenge{inset:47px 10px 4px}.art-rival{height:130px;max-width:125px}.art-clash{flex-basis:40px;width:40px;height:44px}.art-clash svg{width:25px;height:25px}}
@media(prefers-reduced-motion:reduce){.art-rival{transition:none}}

#lobby .card-art>.game-challenge-art{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:contain;scale:1}

.sticker-selection-name{margin:10px 0 15px;text-align:center;color:#356145;font-size:13px;font-weight:600;min-height:22px}