/* Canonical horizontal lobby card composition. Dynamic content comes from the table API. */
#tableBrowser{width:100%;max-width:none;min-width:0;height:auto;min-height:0;max-height:calc(100vh - 275px);padding:16px;background:rgba(3,18,16,.74);border:1px solid rgba(72,155,119,.72);border-radius:20px;overflow-y:auto}
#tableBrowser .lobby-reference-heading{display:flex;align-items:end;justify-content:space-between;gap:16px;margin:-2px 0 14px;padding:0 4px;color:#f8ead0}
#tableBrowser .lobby-reference-heading h2{margin:3px 0 0;color:#fff6e4;font-size:clamp(1.2rem,2vw,1.8rem)}
#tableBrowser .lobby-reference-heading small{max-width:380px;color:#bdd0c4;text-align:right}
#tableBrowser .lobby-reference-kicker{color:#e6be68;font-size:.68rem;font-weight:900;letter-spacing:.16em}
#tableBrowser .lobby-reference-section{margin-top:14px;padding:10px 12px 14px;border:1px solid rgba(71,167,128,.8);border-radius:18px;background:linear-gradient(145deg,rgba(7,61,48,.97),rgba(4,31,29,.96));box-shadow:0 14px 30px rgba(0,0,0,.22)}
#tableBrowser .lobby-reference-section-private{border-color:rgba(241,75,139,.9);background:linear-gradient(145deg,rgba(91,7,43,.94),rgba(42,5,27,.96))}
#tableBrowser .lobby-reference-section-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 2px 10px;color:#f7e9cb}
#tableBrowser .lobby-reference-section-heading h3{display:flex;align-items:center;gap:8px;margin:0;font-size:clamp(1rem,1.7vw,1.35rem)}
#tableBrowser .lobby-reference-section-heading h3 span{color:#f0c56d;font-size:1.35em}
#tableBrowser .lobby-reference-section-private .lobby-reference-section-heading h3 span{color:#ffe0a1}
#tableBrowser .lobby-reference-section-heading p{margin:3px 0 0;color:#c6d9ce;font-size:.78rem}
#tableBrowser .lobby-reference-section-heading>strong{color:#ffe2a4;font-size:.8rem;white-space:nowrap}
#tableBrowser .lobby-reference-table-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-items:start;width:100%;min-width:0}
#tableBrowser .lobby-reference-table-card{position:relative;display:grid;grid-template-rows:auto auto;gap:8px;align-self:start;box-sizing:border-box;width:100%;max-width:none;min-width:0;padding:8px;border:1px solid #2f9b78;border-radius:20px;background:rgba(2,14,14,.86);box-shadow:0 9px 22px rgba(0,0,0,.35)}
#tableBrowser .lobby-reference-table-card.table-item-private{border-color:#e7bb3e}
#tableBrowser .lobby-reference-table-header{display:grid;gap:4px;min-width:0;color:#fff9ed}
#tableBrowser .lobby-reference-table-header-top{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;min-width:0}
#tableBrowser .lobby-reference-table-title-block{display:grid;min-width:0;gap:1px}
#tableBrowser .lobby-reference-table-kind{color:#f0d37b;font-size:.62rem;font-weight:900;line-height:1.1;letter-spacing:.08em;white-space:nowrap}
#tableBrowser .lobby-reference-table-card.table-item-private .lobby-reference-table-kind{color:#ffb9bd}
#tableBrowser .lobby-reference-table-header .table-title{min-width:0;padding:0;color:#fff9ed;font-size:clamp(.92rem,1.45vw,1.2rem);font-weight:900;line-height:1.1;white-space:nowrap;overflow:visible;text-overflow:clip;text-shadow:0 1px 2px #000}
#tableBrowser .lobby-reference-table-ruleset{min-width:0;color:#c6d9ce;font-size:.62rem;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#tableBrowser .lobby-reference-table-header .table-meta-seats{padding:5px 9px;border-radius:11px;background:rgba(4,12,12,.88);color:#fff9ed;font-size:.78rem;font-weight:900;white-space:nowrap}
#tableBrowser .lobby-reference-table-art{position:relative;display:block;width:100%;height:auto;aspect-ratio:444/324;min-width:0;border:1px solid rgba(47,155,120,.9);border-radius:18px;background-color:#082c25;overflow:hidden;isolation:isolate}
#tableBrowser .lobby-reference-table-card.table-item-private .lobby-reference-table-art{aspect-ratio:444/344;border-color:#e7bb3e;background-color:#401015}
#tableBrowser .lobby-reference-table-image{position:absolute;inset:0;z-index:0;display:block;width:100%;height:100%;max-width:none;object-fit:fill}
#tableBrowser .lobby-reference-table-art>.table-players{position:absolute;inset:0;z-index:3;display:block;min-height:0;padding:0;background:transparent;pointer-events:none}
#tableBrowser .lobby-reference-table-art .lobby-table-seat{position:absolute;display:grid;place-items:center;width:clamp(46px,16.67%,74px);height:clamp(46px,16.67%,74px);padding:0;border:0;border-radius:50%;background:transparent;box-shadow:none;color:#fff5df;text-align:center}
#tableBrowser .lobby-reference-table-art .lobby-table-seat[data-seat-no="1"]{left:calc(217 / 444 * 100%);top:calc(74 / 324 * 100%);transform:translate(-50%,-50%)}
#tableBrowser .lobby-reference-table-art .lobby-table-seat[data-seat-no="2"]{left:calc(384 / 444 * 100%);top:calc(136 / 324 * 100%);transform:translate(-50%,-50%)}
#tableBrowser .lobby-reference-table-art .lobby-table-seat[data-seat-no="3"]{left:calc(217 / 444 * 100%);top:calc(199 / 324 * 100%);transform:translate(-50%,-50%)}
#tableBrowser .lobby-reference-table-art .lobby-table-seat[data-seat-no="4"]{left:calc(61 / 444 * 100%);top:calc(136 / 324 * 100%);transform:translate(-50%,-50%)}
#tableBrowser .lobby-reference-table-card.table-item-private .lobby-table-seat[data-seat-no="1"]{left:calc(217 / 444 * 100%);top:calc(63 / 344 * 100%)}
#tableBrowser .lobby-reference-table-card.table-item-private .lobby-table-seat[data-seat-no="2"]{left:calc(383 / 444 * 100%);top:calc(134 / 344 * 100%)}
#tableBrowser .lobby-reference-table-card.table-item-private .lobby-table-seat[data-seat-no="3"]{left:calc(217 / 444 * 100%);top:calc(215 / 344 * 100%)}
#tableBrowser .lobby-reference-table-card.table-item-private .lobby-table-seat[data-seat-no="4"]{left:calc(61 / 444 * 100%);top:calc(134 / 344 * 100%)}
#tableBrowser .lobby-reference-table-art .lobby-table-seat-profile{position:relative;display:grid;place-items:center;width:100%;height:100%;min-width:0;min-height:0;padding:2px;border-radius:50%;overflow:visible}
#tableBrowser .lobby-reference-table-art .lobby-table-seat.occupied .lobby-table-seat-profile{background:rgba(4,20,18,.18)}
#tableBrowser .lobby-reference-table-art .lobby-table-avatar-wrap{position:absolute;inset:0;z-index:1;display:grid;place-items:center;width:100%;height:100%;min-width:0;min-height:0;border-radius:50%;overflow:hidden;pointer-events:none}
#tableBrowser .lobby-reference-table-art .lobby-table-avatar{position:absolute;inset:0;display:grid;place-items:center;width:100%;height:100%;min-width:100%;min-height:100%;box-sizing:border-box;margin:0;padding:0;border:2px solid #e7c66f;border-radius:50%;overflow:hidden;background:linear-gradient(145deg,#285c58,#081f24);color:#fff5d6;font-size:.72rem;font-weight:900;object-fit:cover;object-position:center center}
#tableBrowser .lobby-reference-table-art .lobby-table-avatar--photo{display:block;box-sizing:border-box;width:100%;height:100%;min-width:100%;min-height:100%;border-radius:50%;overflow:hidden;object-fit:cover;object-position:center center}
#tableBrowser .lobby-reference-table-art .lobby-table-owner-mark{position:absolute;right:-1px;bottom:-1px;z-index:2;display:grid;place-items:center;width:17px;height:17px;border:1px solid #fff2b3;border-radius:50%;color:#5a3210;background:#f4ca5c;font-size:9px;font-weight:900;line-height:1}
#tableBrowser .lobby-reference-table-art .lobby-table-seat.occupied .lobby-table-seat-name{position:absolute;z-index:4;top:calc(100% + 4px);left:50%;display:block;max-width:min(132px,calc(100% + 46px));margin:0;padding:2px 5px;border:1px solid rgba(245,212,119,.82);border-radius:999px;background:rgba(14,25,24,.96);box-shadow:0 2px 5px rgba(0,0,0,.48);color:#fff6db;font-size:9px;font-weight:800;line-height:1;text-overflow:ellipsis;transform:translateX(-50%);white-space:nowrap;overflow:hidden}
#tableBrowser .lobby-reference-table-art .lobby-table-seat.empty .lobby-table-seat-profile{grid-template-rows:1fr auto;border:1px solid rgba(238,197,104,.9);background:rgba(4,20,18,.84)}
#tableBrowser .lobby-reference-table-art .lobby-table-seat.empty .lobby-table-seat-empty-icon{display:grid;place-items:center;width:38%;height:38%;border:1px solid rgba(238,197,104,.9);border-radius:50%;color:#e8bd66;background:rgba(4,20,18,.84);font-size:.9rem;line-height:1}
#tableBrowser .lobby-reference-table-art .lobby-table-seat.empty .lobby-table-seat-name{position:static;max-width:100%;padding:0 2px 2px;border:0;box-shadow:none;color:#ffe7a2;background:transparent;transform:none}
#tableBrowser .lobby-reference-hidden-badge{position:absolute;top:10px;left:13px;z-index:4;display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border:1px solid #efcf6b;border-radius:999px;color:#fff2c4;background:rgba(28,13,24,.94);box-shadow:0 2px 7px rgba(0,0,0,.42);font-size:9px;font-weight:900;letter-spacing:.07em;white-space:nowrap}
#tableBrowser .lobby-reference-hidden-eye{position:relative;display:inline-block;width:17px;height:12px;border:1px solid #ffd56b;border-radius:50% / 65%}
#tableBrowser .lobby-reference-hidden-eye::after{position:absolute;top:4px;left:-2px;width:19px;height:1px;background:#ffd56b;content:"";transform:rotate(-32deg)}
#tableBrowser .lobby-reference-table-art>.table-entry-actions{position:absolute;inset:0;z-index:5;display:block;width:100%;min-width:0;margin:0;padding:0;pointer-events:none}
#tableBrowser .lobby-reference-table-art>.table-entry-actions button{position:absolute;bottom:calc(11 / 324 * 100%);height:calc(60 / 324 * 100%);min-width:0;min-height:0;margin:0;padding:8px;border:1px solid #f3d276;border-radius:11px;pointer-events:auto;color:#fff9dc;box-shadow:inset 0 1px 0 rgba(255,255,255,.24),0 3px 8px rgba(0,0,0,.32);font-size:clamp(.68rem,1.1vw,.9rem);font-weight:900;line-height:1.1;text-shadow:0 1px 1px rgba(0,0,0,.52);white-space:nowrap}
#tableBrowser .lobby-reference-table-art>.table-entry-actions button:first-child{left:calc(13 / 444 * 100%);width:calc(217 / 444 * 100%);background:linear-gradient(180deg,#1fa65f,#087846)}
#tableBrowser .lobby-reference-table-art>.table-entry-actions .table-watch-button{left:calc(240 / 444 * 100%);width:calc(191 / 444 * 100%);border-color:#f2c65b;background:rgba(3,13,14,.94);color:#ffd96f}
#tableBrowser .lobby-reference-table-card.table-item-private .lobby-reference-table-art>.table-entry-actions button{bottom:calc(15 / 344 * 100%);height:calc(60 / 344 * 100%)}
#tableBrowser .lobby-reference-table-art>.table-entry-actions .vip-primary:first-child{border-color:#ffda72;background:linear-gradient(180deg,#e51c65,#a40743);color:#fff}
#tableBrowser .lobby-reference-empty{grid-column:1/-1;min-height:120px;border-color:rgba(234,196,103,.45);background:rgba(2,19,17,.55);color:#d5dfd4}
@media(max-width:700px){#tableBrowser{padding:10px;max-height:none}#tableBrowser .lobby-reference-heading,#tableBrowser .lobby-reference-section-heading{align-items:flex-start;flex-direction:column}#tableBrowser .lobby-reference-heading small{text-align:left}#tableBrowser .lobby-reference-table-list{grid-template-columns:1fr}#tableBrowser .lobby-reference-section-heading>strong{align-self:flex-end}}

#tableBrowser .lobby-reference-filters{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:0 0 10px}
#tableBrowser .lobby-reference-filter{min-width:0;min-height:32px;padding:7px 8px;border:1px solid rgba(231,184,92,.72);border-radius:9px;background:rgba(3,13,14,.92);color:#ffe7a2;font-size:clamp(.58rem,.82vw,.78rem);font-weight:900;letter-spacing:.02em;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#tableBrowser .lobby-reference-filter:hover,#tableBrowser .lobby-reference-filter:focus-visible{border-color:#ffe293;background:rgba(109,76,23,.75);color:#fff9dc}
#tableBrowser .lobby-reference-filter.is-active{border-color:#ffe293;background:linear-gradient(180deg,#d89b2e,#704511);box-shadow:0 0 0 1px rgba(255,226,147,.22),0 4px 12px rgba(0,0,0,.3);color:#181007}
@media(max-width:700px){#tableBrowser .lobby-reference-filters{grid-template-columns:repeat(2,minmax(0,1fr))}#tableBrowser .lobby-reference-filter{font-size:.68rem}}
