/* Shared lobby presentation only. Gameplay stays in each game's existing modules. */
@font-face{font-family:Lobby Sans;src:url(fonts/bai-jamjuree-400-latin.woff2) format("woff2");font-weight:400;font-display:swap;unicode-range:U+0000-00FF,U+0100-024F,U+2000-206F}
@font-face{font-family:Lobby Sans;src:url(fonts/bai-jamjuree-400-thai.woff2) format("woff2");font-weight:400;font-display:swap;unicode-range:U+0E00-0E7F}
@font-face{font-family:Lobby Sans;src:url(fonts/bai-jamjuree-600-latin.woff2) format("woff2");font-weight:600 900;font-display:swap;unicode-range:U+0000-00FF,U+0100-024F,U+2000-206F}
@font-face{font-family:Lobby Sans;src:url(fonts/bai-jamjuree-600-thai.woff2) format("woff2");font-weight:600 900;font-display:swap;unicode-range:U+0E00-0E7F}
@font-face{font-family:Lobby Display;src:url(fonts/chonburi-400-latin.woff2) format("woff2");font-weight:400;font-display:swap;unicode-range:U+0000-00FF,U+0100-024F,U+2000-206F}
@font-face{font-family:Lobby Display;src:url(fonts/chonburi-400-thai.woff2) format("woff2");font-weight:400;font-display:swap;unicode-range:U+0E00-0E7F}
body.np-lobby{--np-ink:#fff3de;--np-muted:#c8c2b9;--np-gold:#f4ce87;--np-line:#f4dcaf24;--np-base:#171c25;--np-surface:#25303b;--np-accent:#485b70;margin:0!important;padding:0!important;background:var(--np-base)!important;background-image:none!important;color:var(--np-ink)!important;font-family:Lobby Sans,system-ui,sans-serif!important;min-height:100dvh;display:block!important;overflow-x:clip;color-scheme:dark}
.np-lobby *, .np-lobby *::before,.np-lobby *::after{box-sizing:border-box}
body.np-lobby::before,body.np-lobby::after,.np-lobby>.ambient,.np-lobby>.scanlines{display:none!important}
.np-lobby button,.np-lobby input,.np-lobby select,.np-lobby textarea{font-family:inherit!important}
.np-lobby a{text-decoration:none}
.np-lobby [hidden]{display:none!important}
body.np-lobby .np-lobby-main{width:100%!important;max-width:none!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;box-shadow:none!important;background:none!important;display:block!important;min-height:0!important}
.np-lobby .np-lobby-main::before,.np-lobby .np-lobby-main::after{display:none!important}
body.np-lobby .np-flow{width:100%!important;max-width:none!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;box-shadow:none!important;background:none!important;display:block!important}
.np-lobby .np-header{position:relative!important;inset:auto!important;z-index:20;width:100%!important;max-width:none!important;margin:0!important;padding:0!important;border:0!important;border-bottom:1px solid var(--np-line)!important;background:var(--np-base)!important;box-shadow:none!important}
.np-lobby .np-header::before,.np-lobby .np-header::after{display:none!important}
.np-lobby .np-header-inner,.np-lobby .np-header .club-header-inner{max-width:1440px!important;margin:auto!important;min-height:88px!important;padding:16px 36px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:24px!important;flex-wrap:nowrap!important}
.np-lobby .np-header .club-brand,.np-lobby .np-brand{display:flex!important;align-items:center;gap:12px;flex-shrink:0;color:var(--np-ink)}
.np-lobby .np-header .club-brand b,.np-lobby .np-brand b{font:400 23px/1.25 Lobby Display,serif!important;white-space:nowrap}
.np-lobby .np-header .club-brand small,.np-lobby .np-brand small{display:block;font:600 8px/1.5 Lobby Sans,sans-serif!important;letter-spacing:1.8px;color:var(--np-muted);margin-top:4px}
.np-lobby .np-brand-mark{width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--np-line);border-radius:12px;background:var(--np-surface);color:var(--np-gold);font:400 24px Lobby Display,serif}
.np-lobby .np-header .portal-menu-row{display:flex!important;align-items:center!important;flex-wrap:nowrap!important;gap:20px!important;min-width:0}
.np-lobby .np-header .portal-home-link{display:flex!important;align-items:center;gap:8px;flex-shrink:0;margin:0!important;padding:8px 12px!important;border:1px solid var(--np-line)!important;border-radius:12px!important;background:#ffffff05!important;color:var(--np-ink)!important;min-height:44px}
.np-lobby .np-header .portal-brand-tile{display:grid;place-items:center;width:25px;height:25px;border-radius:8px;background:var(--np-gold);color:var(--np-base);font-weight:700}
.np-lobby .np-header .portal-brand-copy b{display:block;font-size:13px}
.np-lobby .np-header .portal-brand-copy small{display:block;font-size:8px;color:var(--np-muted)}
.np-lobby .np-header nav{position:static!important;width:auto!important;max-width:none!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;box-shadow:none!important;background:none!important;display:flex!important;align-items:center!important;gap:5px!important;flex-wrap:nowrap!important;min-height:0!important;min-width:0}
.np-lobby .np-header nav::before,.np-lobby .np-header nav::after{display:none!important}
.np-lobby .np-header nav :is(.site-nav-links,.nav-menu,.menu-links){display:flex!important;flex-wrap:nowrap!important;align-items:center;gap:4px!important;padding:0!important;margin:0!important;border:0!important;box-shadow:none!important;background:none!important}
.np-lobby .np-header nav a{display:flex!important;align-items:center;justify-content:center;min-height:44px!important;padding:10px 12px!important;border:0!important;border-radius:9px!important;background:transparent!important;box-shadow:none!important;font:600 13px/1.3 Lobby Sans,sans-serif!important;letter-spacing:0!important;color:var(--np-muted)!important;white-space:nowrap;text-transform:none!important}
.np-lobby .np-header nav a:is(.active,[aria-current=page]){background:#f4ce8715!important;color:var(--np-gold)!important}
.np-lobby .np-header nav a:hover{background:#ffffff0c!important;color:var(--np-ink)!important}
.np-lobby .np-header .club-menu-toggle{display:none!important}
.np-lobby .np-menu-toggle{display:none;min-height:44px;padding:10px 13px;border:1px solid var(--np-line);border-radius:10px;background:var(--np-surface);color:var(--np-ink);font-size:13px;cursor:pointer}
.np-lobby .np-lobby-hero{isolation:isolate;position:relative;overflow:hidden;min-height:500px;display:flex;align-items:center;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;background:var(--np-base)}
.np-lobby .np-hero-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:70% 20%;z-index:-3}
.np-lobby .np-lobby-hero::before{content:"";position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,var(--np-base) 0%,color-mix(in srgb,var(--np-base) 91%,transparent) 24%,color-mix(in srgb,var(--np-base) 52%,transparent) 49%,transparent 76%),linear-gradient(0deg,var(--np-base),transparent 27%)}
.np-lobby .np-hero-inner{width:100%;max-width:1440px;margin:auto;padding:70px 60px 58px}
.np-lobby .np-hero-copy{width:55%;max-width:690px}
.np-lobby .np-eyebrow{display:flex;align-items:center;gap:12px;color:var(--np-gold);font:600 10px/1.6 Lobby Sans,sans-serif;letter-spacing:2.2px;margin:0 0 20px}
.np-lobby .np-eyebrow::before{content:"";width:23px;height:1px;background:var(--np-gold)}
.np-lobby .np-lobby-hero h1{margin:0 0 24px!important;font:400 clamp(36px,3.7vw,57px)/1.25 Lobby Display,Georgia,serif!important;letter-spacing:-1.4px!important;color:var(--np-ink)!important;text-shadow:0 3px 26px #0004}
.np-lobby .np-lobby-hero h1 em{color:var(--np-gold);font:inherit!important;font-style:normal!important}
.np-lobby .np-hero-desc{font:400 15px/1.85 Lobby Sans,sans-serif;color:#eee3d0;max-width:510px;margin:0 0 28px}
.np-lobby .np-hero-actions{display:flex;align-items:stretch;flex-wrap:wrap;gap:12px}
body.np-lobby .np-cta{display:inline-flex!important;align-items:center;justify-content:center;gap:20px;min-height:51px!important;padding:14px 22px!important;border:1px solid transparent!important;border-radius:10px!important;font:600 14px/1.5 Lobby Sans,sans-serif!important;text-transform:none!important;letter-spacing:0!important;text-decoration:none!important;cursor:pointer;transition:transform .18s,background .18s;box-shadow:0 6px 16px #0002!important;width:auto!important}
body.np-lobby .np-cta-primary{background:var(--np-gold)!important;color:#241d16!important}
body.np-lobby .np-cta-secondary{background:#1619206b!important;border-color:#e5d6bc5e!important;color:var(--np-ink)!important;backdrop-filter:blur(10px)}
.np-lobby .np-cta:hover{transform:translateY(-2px)}
.np-lobby :is(a,button,input,select,summary):focus-visible{outline:3px solid var(--np-gold)!important;outline-offset:4px}
.np-lobby .np-facts{display:flex;gap:16px;flex-wrap:wrap;padding:28px 0 0;margin:0;color:#dfd3bd;font:600 9px/1.7 Lobby Sans,sans-serif;letter-spacing:.6px}
.np-lobby .np-facts span+span{border-left:1px solid #f4dcaf4a;padding-left:16px}
.np-lobby .np-lobby-content{max-width:1320px;width:100%;padding:28px 36px 24px;margin:0 auto}
.np-lobby .np-section-intro{display:flex;align-items:end;justify-content:space-between;gap:24px;margin:0 0 24px}
.np-lobby .np-section-intro .np-eyebrow{margin-bottom:9px}
.np-lobby .np-section-intro h2{font:400 clamp(24px,2.2vw,32px)/1.5 Lobby Display,serif;margin:0;color:var(--np-ink);letter-spacing:-.7px}
.np-lobby .np-section-intro>p{color:var(--np-muted);font-size:13px;line-height:1.7;max-width:310px;margin:0}
body.np-lobby .np-lobby-grid{width:100%!important;max-width:none!important;display:grid!important;grid-template-columns:minmax(0,1.55fr) minmax(300px,1fr)!important;grid-template-areas:"tables entry"!important;gap:24px!important;margin:0!important;padding:0!important;align-items:start!important;background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;min-height:0!important}
body.np-lobby .np-lobby-grid.np-has-identity{grid-template-areas:"tables identity" "tables entry"!important}
body.np-lobby .np-lobby-grid.np-has-invite{grid-template-areas:"tables entry" "tables invite"!important}
.np-lobby .np-lobby-tables{grid-area:tables!important;min-height:310px}
.np-lobby .np-lobby-entry{grid-area:entry!important}
.np-lobby .np-lobby-identity{grid-area:identity!important}
.np-lobby .np-lobby-invite{grid-area:invite!important}
body.np-lobby .np-panel{position:relative;min-width:0;width:100%!important;margin:0!important;padding:28px!important;border:1px solid var(--np-line)!important;border-radius:18px!important;box-shadow:0 12px 35px #00000014!important;background:linear-gradient(145deg,#ffffff04,transparent 55%),var(--np-surface)!important;color:var(--np-ink)!important}
.np-lobby .np-panel::before,.np-lobby .np-panel::after{display:none!important}
.np-lobby .np-panel h2,.np-lobby .np-panel h3{color:var(--np-ink)!important;font-family:Lobby Display,serif!important;font-weight:400!important;letter-spacing:-.5px!important;line-height:1.5!important}
.np-lobby .np-panel h2{font-size:24px!important}
.np-lobby .np-panel h3{font-size:21px!important}
.np-lobby .np-panel p{color:var(--np-muted);line-height:1.8;font-size:13px}
.np-lobby .np-panel :is(.card-number,.panel-label,.club-kicker,.eyebrow){color:var(--np-gold)!important;font:600 10px/1.6 Lobby Sans,sans-serif!important;letter-spacing:1.7px!important}
.np-lobby .np-panel label{color:var(--np-ink)!important;font:600 12px/1.65 Lobby Sans,sans-serif!important;letter-spacing:0!important}
body.np-lobby .np-panel input:not([type=checkbox]):not([type=radio]),body.np-lobby .np-panel select{width:100%;min-width:0;max-width:100%;min-height:46px!important;padding:11px 13px!important;font-size:16px!important;line-height:1.5;color:var(--np-ink)!important;background:#0a101b52!important;border:1px solid #f4dcaf30!important;border-radius:9px!important;box-shadow:none!important}
.np-lobby .np-panel input::placeholder{color:#bab7b1!important;opacity:1}
.np-lobby .np-panel input[type=checkbox]{width:19px;height:19px;flex-shrink:0;accent-color:var(--np-gold)}
.np-lobby .np-panel select option{background:var(--np-base);color:var(--np-ink)}
body.np-lobby .np-panel button,body.np-lobby .np-panel .club-button{min-height:44px!important;border-radius:9px!important;font:600 12px/1.5 Lobby Sans,sans-serif!important;letter-spacing:0!important;box-shadow:none!important}
.np-lobby .np-panel button{color:var(--np-ink);background:var(--np-accent);border:1px solid var(--np-line);padding:10px 14px;cursor:pointer}
body.np-lobby .np-panel :is(.primary,.primary-button,.button:not(.secondary),button[type=submit],.start-primary,#createRoom,#createRoomButton,#create-room,#create-table,#createRoomBtn,#quick-play,#save-name,#soloPlay){background:var(--np-gold)!important;border-color:transparent!important;color:#241d16!important}
.np-lobby .np-panel button:disabled{opacity:.5;cursor:wait}
.np-lobby .np-panel :is(.room-list,.lobby-list,.table-list){display:grid!important;gap:10px;padding:0!important;list-style:none;margin:20px 0!important;max-height:none!important;overflow:visible!important}
.np-lobby .np-panel :is(.room-card,.room-row,.lobby-room,.lobby-table,.table-card){border:1px solid var(--np-line)!important;border-radius:12px!important;background:#ffffff04!important;padding:16px!important;box-shadow:none!important}
.np-lobby .np-panel :is(.empty,.empty-lobby,.empty-state,.lobby-empty){padding:40px 20px!important;text-align:center;background:#0a101b28!important;border:1px dashed #f4dcaf30!important;border-radius:12px!important;font:400 14px/1.8 Lobby Sans,sans-serif!important;color:var(--np-muted)!important}
.np-lobby .np-panel :is(output,[role=status],.status-line,.lobby-status){font:400 12px/1.7 Lobby Sans,sans-serif!important;letter-spacing:0!important;color:var(--np-muted)}
.np-lobby .np-panel .join-code,.np-lobby .np-panel .join-fields,.np-lobby .np-panel .join-code-row{min-width:0}
.np-lobby .np-panel form{min-width:0}
.np-lobby .np-panel :is(.field,.fields,.form-grid,.table-config-fields,.create-fields){min-width:0;gap:14px}
.np-lobby .np-panel :is(.surface,.arcade-panel){border-color:var(--np-line)!important;background:transparent!important;box-shadow:none!important}
.np-lobby .np-lobby-tables.lobby-left{padding:0!important;border:0!important;background:none!important;box-shadow:none!important}
.np-lobby .np-lobby-tables.lobby-left>.surface{background:var(--np-surface)!important;padding:26px;border-radius:18px!important}
.np-lobby .np-steps{margin:36px 0 0;padding:26px 0;display:grid;grid-template-columns:1fr 1fr 1fr;border-top:1px solid var(--np-line);border-bottom:1px solid var(--np-line)}
.np-lobby .np-steps article{display:flex;align-items:center;gap:16px;padding:0 26px;border-right:1px solid var(--np-line)}
.np-lobby .np-steps article:first-child{padding-left:0}
.np-lobby .np-steps article:last-child{border-right:0}
.np-lobby .np-steps b{color:var(--np-gold);font:400 25px Lobby Display,serif;opacity:.7}
.np-lobby .np-steps h3{font:600 14px/1.7 Lobby Sans,sans-serif;margin:0;color:var(--np-ink)}
.np-lobby .np-footer{display:flex;flex-wrap:wrap;gap:15px;justify-content:space-between;max-width:1320px;padding:24px 36px 35px;margin:0 auto;color:var(--np-muted);font-size:11px}
.np-lobby .np-footer a{color:var(--np-gold)}
.np-lobby .np-flow>.section-heading,.np-lobby[data-lobby-game=go] .screen-head,.np-lobby .np-lobby-content>.section-heading,.np-lobby .halma-section-heading,.np-lobby .halma-modes,.np-lobby .lobby-feature-row,.np-lobby .club-steps,.np-lobby .marquee{display:none!important}
.np-lobby .np-lobby-content .page-panel{padding:0!important;background:none!important;border:0!important;box-shadow:none!important}
.np-lobby .np-lobby-content>.club-footer,.np-lobby .np-lobby-content>footer{margin-top:28px;color:var(--np-muted)}
.np-lobby .np-language{border:1px solid var(--np-line);border-radius:9px;padding:10px;min-height:44px;min-width:44px;color:var(--np-ink);background:var(--np-surface);cursor:pointer}
.np-lobby[data-lobby-game=tank] .room-table-wrap{overflow:auto}
.np-lobby[data-lobby-game=tank] .room-table-head,.np-lobby[data-lobby-game=tank] .room-entry{min-width:570px}
.np-lobby[data-lobby-game=tank] .create-fields{display:grid;grid-template-columns:1fr 1fr;margin:22px 0}
.np-lobby[data-lobby-game=tank] .create-terminal summary{cursor:pointer;color:var(--np-gold);min-height:44px;display:flex;align-items:center;font-size:14px}
.np-lobby[data-lobby-game=tank] .directory-actions{display:flex;flex-wrap:wrap;gap:12px;padding-top:22px}
.np-lobby[data-lobby-game=setthi-siam] .hero-emblem{display:none}
.np-lobby[data-lobby-game=setthi-siam] .fields{display:grid;grid-template-columns:1fr}
.np-lobby[data-lobby-game=thaichess] .controls{margin:0 0 24px;padding:15px;border:1px solid var(--np-line);border-radius:12px;background:var(--np-surface)}
.np-lobby[data-lobby-game=thaichess] .game-tools{display:flex;flex-wrap:wrap;gap:10px}
.np-lobby[data-lobby-game=thaichess] .np-panel .table-config-fields{display:grid;grid-template-columns:1fr}
.np-lobby[data-lobby-game=ono] .club-nonplay-sound{position:relative!important;inset:auto!important;max-width:1320px;margin:10px auto!important;padding:0 36px;display:flex;justify-content:end}
.np-lobby[data-lobby-game=ludo] .np-lobby-grid{grid-template-columns:1fr 1fr!important}
.np-lobby[data-lobby-game=tarot] .np-panel>a{margin-top:16px}
.np-lobby[data-lobby-game=tarot] .np-reading-note{border-top:1px solid var(--np-line);margin-top:25px;padding-top:20px}
@media(min-width:1600px){.np-lobby .np-lobby-hero{min-height:580px}.np-lobby .np-hero-image{object-position:center 30%}}
@media(max-width:1190px){
 .np-lobby .np-header-inner,.np-lobby .np-header .club-header-inner{padding:14px 26px!important;gap:16px!important}
 .np-lobby .np-header .club-brand small{display:none}
 .np-lobby .np-header .portal-brand-copy small{display:none}
 .np-lobby .np-header .portal-menu-row{gap:12px!important}
 .np-lobby .np-header nav a{padding:9px!important;font-size:12px!important}
 .np-lobby .np-hero-inner{padding:58px 36px}
 .np-lobby .np-hero-copy{width:59%}
 .np-lobby .np-lobby-content{padding:25px 26px}
}
@media(max-width:1000px){
 .np-lobby .np-menu-toggle{display:block}
 .np-lobby .np-header nav{display:none!important;position:absolute!important;inset:100% 16px auto!important;width:auto!important;padding:12px!important;border:1px solid var(--np-line)!important;border-radius:12px!important;background:var(--np-base)!important;box-shadow:0 15px 35px #0006!important;flex-wrap:wrap!important;z-index:30}
 .np-lobby.np-menu-open .np-header nav{display:flex!important}
 .np-lobby:not([data-lobby-game=tarot]) .np-header .portal-home-link{display:none!important}
 .np-lobby .np-header .portal-menu-row{justify-content:flex-end!important}
 .np-lobby .np-header nav .np-nav-portal{flex:1 0 100%!important;justify-content:flex-start!important;color:var(--np-gold)!important;border-bottom:1px solid var(--np-line)!important;border-radius:0!important;margin-bottom:4px!important}
 .np-lobby .np-header nav :is(.site-nav-links,.nav-menu,.menu-links){flex-wrap:wrap!important;width:100%}
 .np-lobby .np-header nav a{flex:1;min-width:80px}
 .np-lobby .np-lobby-grid{gap:18px!important}
 .np-lobby .np-panel{padding:22px!important}
 .np-lobby .np-hero-copy{width:66%}
}
@media(max-width:760px){
 .np-lobby .np-header-inner,.np-lobby .np-header .club-header-inner{min-height:72px!important;padding:12px 18px!important;gap:10px!important}
 .np-lobby .np-header .club-brand b,.np-lobby .np-brand b{font-size:20px!important}
 .np-lobby .np-header :is(.club-mark,.club-brand-mark,.np-brand-mark){flex-shrink:0}
 .np-lobby .np-header :is(.club-mark,.club-brand-mark) img{max-width:44px!important;max-height:46px!important;width:auto!important;height:auto!important}
 .np-lobby .np-brand small{display:none}
 .np-lobby .np-header .portal-menu-row{gap:8px!important}
 .np-lobby .np-lobby-hero{min-height:600px;align-items:end}
 .np-lobby .np-hero-image{height:370px;object-position:65% top}
 .np-lobby .np-lobby-hero::before{background:linear-gradient(0deg,var(--np-base) 10%,color-mix(in srgb,var(--np-base) 95%,transparent) 43%,color-mix(in srgb,var(--np-base) 16%,transparent) 90%)}
 .np-lobby .np-hero-inner{padding:210px 24px 32px}
 .np-lobby .np-hero-copy{width:100%;max-width:600px}
 .np-lobby .np-eyebrow{font-size:9px;letter-spacing:1.8px;margin-bottom:14px}
 .np-lobby .np-lobby-hero h1{font-size:clamp(32px,7vw,43px)!important;margin-bottom:18px!important;letter-spacing:-1px!important}
 .np-lobby .np-hero-desc{font-size:14px;margin-bottom:22px}
 .np-lobby .np-hero-actions{gap:10px}
 .np-lobby .np-cta{flex:1;gap:10px!important;padding:13px 15px!important;font-size:13px!important}
 .np-lobby .np-facts{gap:12px;padding-top:22px;font-size:8px}
 .np-lobby .np-facts span+span{padding-left:12px}
 .np-lobby .np-lobby-content{padding:20px 18px}
 .np-lobby .np-section-intro{display:block;margin-bottom:20px}
 .np-lobby .np-section-intro>p{margin-top:10px;max-width:none}
 body.np-lobby .np-lobby-grid,body.np-lobby .np-lobby-grid.np-has-identity,body.np-lobby .np-lobby-grid.np-has-invite{grid-template-columns:minmax(0,1fr)!important;grid-template-areas:"entry" "tables"!important}
 body.np-lobby .np-lobby-grid.np-has-identity{grid-template-areas:"identity" "entry" "tables"!important}
 body.np-lobby .np-lobby-grid.np-has-invite{grid-template-areas:"entry" "invite" "tables"!important}
 .np-lobby .np-panel{padding:22px!important}
 .np-lobby .np-lobby-tables{min-height:200px}
 .np-lobby .np-steps{margin-top:26px;grid-template-columns:1fr;padding:10px 0}
 .np-lobby .np-steps article{padding:18px 0;border-right:0;border-bottom:1px solid var(--np-line)}
 .np-lobby .np-steps article:last-child{border-bottom:0}
 .np-lobby .np-steps b{font-size:21px}
 .np-lobby .np-footer{padding:14px 20px 28px}
 .np-lobby[data-lobby-game=ludo] .np-lobby-grid{grid-template-columns:1fr!important}
 .np-lobby .np-panel .join-code>div,.np-lobby .np-panel .join-fields{display:flex;min-width:0}
 .np-lobby .np-panel .join-code input{min-width:0}
}
@media(max-width:380px){
 .np-lobby[data-lobby-game=tarot] .np-brand b{font-size:14px!important}
 .np-lobby[data-lobby-game=tarot] .np-header .portal-menu-row{gap:6px!important}
 .np-lobby .np-header-inner,.np-lobby .np-header .club-header-inner{padding:10px 14px!important}
 .np-lobby .np-header .club-brand b,.np-lobby .np-brand b{font-size:17px!important}
 .np-lobby .np-hero-inner{padding:190px 20px 28px}
 .np-lobby .np-hero-actions{flex-direction:column}
 .np-lobby .np-lobby-content{padding:18px 14px}
 .np-lobby .np-panel{padding:18px!important}
 .np-lobby .np-facts{gap:8px}
 .np-lobby .np-facts span+span{padding-left:8px}
}
@media(prefers-reduced-motion:reduce){.np-lobby *{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* ── The parts that make the Slave lobby feel finished, and that every other
   game was missing: a table list that invites you when it is empty, a panel
   heading that says what the panel is and whether it is live, a caption on the
   hero art, and a lead into the three steps. Slave is the prototype; these are
   its blocks, named for the shared system so every game gets them the same. ── */

/* A panel says what it is before it says anything else. */
.np-lobby .np-panel-head{display:flex;align-items:start;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:0 0 18px}
.np-lobby .np-panel-head h2,.np-lobby .np-panel-head h3{margin:6px 0 0!important}
.np-lobby .np-panel-title{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-width:0}
.np-lobby .np-panel-head .np-eyebrow{margin:0}
.np-lobby .np-count{display:inline-grid;place-items:center;min-width:26px;height:23px;padding:0 8px;border:1px solid var(--np-line);border-radius:999px;background:#0a101b52;color:var(--np-gold);font:600 11px/1 Lobby Sans,sans-serif}
/* Whether the table directory is actually listening, which a lobby that polls
   has to say out loud — a stale list and a broken one look identical. */
.np-lobby .np-live{display:inline-flex;align-items:center;gap:8px;color:var(--np-muted);font:600 10px/1.6 Lobby Sans,sans-serif;letter-spacing:1.1px}
.np-lobby .np-live i{width:7px;height:7px;border-radius:50%;background:var(--np-muted);box-shadow:0 0 0 3px #ffffff0d}
.np-lobby .np-live[data-state=online] i{background:#57d38b;box-shadow:0 0 0 3px #57d38b26}
.np-lobby .np-live[data-state=offline] i{background:#e2725f;box-shadow:0 0 0 3px #e2725f26}
.np-lobby .np-panel-head .np-refresh{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:9px 14px;border:1px solid var(--np-line);border-radius:9px;background:#ffffff06;color:var(--np-ink);font:600 12px/1.4 Lobby Sans,sans-serif;cursor:pointer}
.np-lobby .np-panel-head .np-refresh:hover{background:#ffffff0f}

/* An empty table list is the most-seen state of every one of these lobbies and
   was the least designed: a dashed box saying nothing is open. It is the best
   chance the page has to ask for the first table of the night. */
/* The row rules each game already has for its table list are unpredictable — most lay a room out in columns — so this one states its own shape outright. */
.np-lobby .np-empty{display:grid!important;grid-template-columns:minmax(0,1fr)!important;justify-items:center!important;align-items:center!important;text-align:center!important;gap:6px!important;padding:38px 24px!important;border:1px solid var(--np-line)!important;border-radius:14px!important;background:radial-gradient(120% 90% at 50% 0,#ffffff07,transparent 70%),#0a101b30!important;box-shadow:none!important;list-style:none!important;width:100%}
.np-lobby .np-empty-art{display:flex!important;align-items:end;justify-content:center;gap:4px;margin:0 0 14px;padding:0;min-height:64px;width:auto}
.np-lobby .np-empty-art img,.np-lobby .np-empty-art span{width:64px;height:auto;filter:drop-shadow(0 10px 18px #00000047)}
.np-lobby .np-empty-art :nth-child(1){transform:rotate(-11deg) translateX(14px)}
.np-lobby .np-empty-art :nth-child(3){transform:rotate(11deg) translateX(-14px)}
.np-lobby .np-empty-art span{display:grid;place-items:center;width:auto;min-width:56px;height:64px;border:1px solid var(--np-line);border-radius:12px;background:var(--np-surface);color:var(--np-gold);font:400 30px/1 Lobby Display,serif}
.np-lobby .np-empty .np-eyebrow{justify-content:center;margin:0 0 4px}
.np-lobby .np-empty .np-eyebrow::before{display:none}
.np-lobby .np-empty h4{margin:0!important;grid-column:1;font:400 20px/1.5 Lobby Display,serif;color:var(--np-ink);letter-spacing:-.4px}
.np-lobby .np-empty p{margin:0!important;max-width:400px;color:var(--np-muted);font:400 13px/1.8 Lobby Sans,sans-serif}
.np-lobby .np-empty .np-empty-cta{margin-top:14px;width:auto!important;justify-self:center;display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:11px 18px;border:1px solid var(--np-gold);border-radius:9px;background:transparent;color:var(--np-gold);font:600 13px/1.4 Lobby Sans,sans-serif;cursor:pointer}
.np-lobby .np-empty .np-empty-cta:hover{background:#f4ce8714}

/* A closing line under the table browser, so the panel ends rather than stops. */
.np-lobby .np-panel-note{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin:20px 0 0;padding:16px 0 0;border-top:1px solid var(--np-line);color:var(--np-muted);font:400 12px/1.7 Lobby Sans,sans-serif}
.np-lobby .np-panel-note span{color:var(--np-gold);letter-spacing:3px}

/* The hero art earns a caption in the corner it is already occupying. */
/* The caption sits on whatever the artwork happens to put in that corner, which
   in several games is the brightest part of the picture — chips, coins, a lit
   crown. The shadow is what keeps it readable there. */
.np-lobby .np-hero-caption{position:absolute;right:60px;bottom:44px;text-align:right;color:#e9dcc6;z-index:1;pointer-events:none;text-shadow:0 1px 2px #000000b8,0 4px 18px #000000a8}
.np-lobby .np-hero-caption span{display:block;font:600 9px/1.6 Lobby Sans,sans-serif;letter-spacing:2.2px;opacity:.72}
.np-lobby .np-hero-caption b{display:block;margin-top:6px;font:600 11px/1.5 Lobby Sans,sans-serif;letter-spacing:2.6px;color:var(--np-gold)}
.np-lobby .np-hero-caption i{font-style:normal;opacity:.5;padding:0 4px}

/* The three steps get a lead, the way a section deserves a name. */
.np-lobby .np-steps.np-has-intro{grid-template-columns:minmax(250px,1.35fr) 1fr 1fr 1fr}
.np-lobby .np-steps-intro{display:flex;align-items:center;gap:14px}
.np-lobby .np-steps-intro>span{display:grid;place-items:center;width:42px;height:42px;flex-shrink:0;border:1px solid var(--np-line);border-radius:12px;background:var(--np-surface);color:var(--np-gold);font:400 22px/1 Lobby Display,serif}
.np-lobby .np-steps-intro .np-eyebrow{margin:0 0 6px;letter-spacing:1.5px;font-size:9px}
.np-lobby .np-steps-intro h3{font:400 17px/1.4 Lobby Display,serif!important;margin:0;color:var(--np-ink);text-wrap:balance}
.np-lobby .np-steps article p{margin:0;color:var(--np-ink);font:600 14px/1.6 Lobby Sans,sans-serif}
.np-lobby .np-steps article p small{display:block;margin-top:4px;color:var(--np-muted);font:400 12px/1.6 Lobby Sans,sans-serif}

/* The footer signs the page rather than trailing off. */
.np-lobby .np-footer{align-items:center}
.np-lobby .np-footer .np-footer-brand{display:inline-flex;align-items:center;gap:9px;color:var(--np-ink);font:600 11px/1.5 Lobby Sans,sans-serif;letter-spacing:2.4px}
.np-lobby .np-footer .np-footer-brand small{color:var(--np-muted);font:400 10px/1.5 Lobby Sans,sans-serif;letter-spacing:1.6px}

@media(max-width:1000px){
 .np-lobby .np-steps.np-has-intro{grid-template-columns:1fr 1fr}
 .np-lobby .np-steps-intro{grid-column:1/-1;padding-bottom:18px;border-bottom:1px solid var(--np-line)}
 .np-lobby .np-hero-caption{right:36px;bottom:32px}
}
@media(max-width:760px){
 .np-lobby .np-steps.np-has-intro{grid-template-columns:1fr}
 .np-lobby .np-steps-intro{border-right:0}
 .np-lobby .np-hero-caption{display:none}
 .np-lobby .np-empty{padding:30px 18px}
 .np-lobby .np-empty-art img,.np-lobby .np-empty-art span{width:52px}
}

/* Taking a seat: the mark that sits opposite a panel's heading, the "I already
   have a code" block folded into the same panel rather than left as a strip of
   furniture above the page, and the quiet way back to a game in progress.
   Slave keeps all three inside its seat panel; before this the games that had a
   room-code field left it floating between the lobby heading and the panels,
   which is the one thing that read as another page. */
.np-lobby .np-panel-mark{display:grid;place-items:center;width:38px;height:38px;flex-shrink:0;border:1px solid var(--np-line);border-radius:11px;background:#0a101b3d;color:var(--np-gold);font:400 19px/1 Lobby Display,serif}
.np-lobby .np-join-code{margin:22px 0 0;padding:20px 0 0;border-top:1px solid var(--np-line)}
.np-lobby .np-join-code .np-eyebrow{margin:0 0 12px}
.np-lobby .np-join-code label{display:block;margin:0 0 8px}
.np-lobby .np-join-row{display:flex;gap:10px;align-items:stretch;min-width:0}
body.np-lobby .np-join-row input{flex:1;min-width:0;text-transform:uppercase;letter-spacing:3px;font-weight:600}
body.np-lobby .np-join-row button{flex-shrink:0;padding:10px 18px!important}
.np-lobby .np-panel-note .np-back-link{min-height:auto!important;padding:0!important;border:0!important;background:none!important;color:var(--np-gold)!important;font:600 12px/1.7 Lobby Sans,sans-serif!important;cursor:pointer}
.np-lobby .np-panel-note .np-back-link:hover{text-decoration:underline}
@media(max-width:420px){.np-lobby .np-join-row{flex-wrap:wrap}body.np-lobby .np-join-row button{width:100%}}

/* Last word on hiding. `[hidden]` is declared near the top of this file, and
   every block added below it that states its own display — the empty-state
   invitation does, because each game styles its own table rows and one of them
   would otherwise win — is a later rule of equal weight, which means an element
   the page hid with the attribute would go on showing. Repeating the rule here
   keeps the attribute the last thing said about display, whatever is added
   above it next. */
.np-lobby [hidden]{display:none!important}