/* PotLuck additions on top of the shared CookingFoil stylesheet: the live room board. Same tokens, flat rows. */
/* Two tabs in the top bar: the room list and the guide. Without a script both views show. */
.tabs{display:flex;gap:4px;margin-right:12px;padding:4px;border:1px solid var(--line);border-radius:100px;background:var(--surface)}
.tabs a{display:inline-flex;align-items:center;min-height:32px;padding:0 16px;border-radius:100px;font-size:14px;font-weight:700;color:var(--secondary);text-decoration:none}
.tabs a:hover{color:var(--ink)}
.tabs a[aria-current="page"]{background:var(--ink);color:var(--ground)}
.tabs a:focus-visible{outline:3px solid var(--butter);outline-offset:2px}
.view[hidden]{display:none}
.tabs a,.chip,.wm{white-space:nowrap}
.home footer p{margin:0 auto}
.board{padding:72px 0 64px}
.board-head{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap;padding-bottom:36px;margin-bottom:28px;border-bottom:1px solid var(--line)}
.home .board .intro-desc{margin:20px 0 0}
.totals{display:flex;gap:28px;margin:0}
.totals div{display:grid;gap:2px}
.totals dt{font:600 11px/1.5 "JetBrains Mono",monospace;letter-spacing:.1em;color:var(--secondary)}
.totals dd{margin:0;font:800 44px/1 "Baloo 2",system-ui,sans-serif}
.home .board .section-note{margin-top:18px}
.section-note a{color:var(--ink);font-weight:600}
.games{margin:0}
.game{display:grid;grid-template-columns:200px 1fr;gap:20px;padding:22px 0;border-bottom:1px solid var(--line)}
.game:first-child{padding-top:0}.game:last-child{border:0;padding-bottom:0}
.game dt{font-size:15px;font-weight:700;padding-top:3px}
.game dt small{display:block;font:500 11px/1.8 "JetBrains Mono",monospace;color:var(--faint)}
.game dd{margin:0;display:grid;gap:14px}
.room{display:grid;gap:8px}
.room-line{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:13px}
.seats{display:flex;gap:5px}
.seats i{width:11px;height:11px;border-radius:50%;background:var(--line2)}.seats i.on{background:var(--butter)}
.room-size{font-weight:700}
.tag{font-size:11px;font-weight:700;border-radius:6px;padding:1px 7px;background:var(--sunk);color:var(--secondary)}
.tag.good{color:var(--good)}.tag.busy{color:var(--pending)}
.age{margin-left:auto;font-size:12px;color:var(--faint)}
.names{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none}
.names li{font-size:12px;font-weight:600;padding:2px 10px;border:1px solid var(--line);border-radius:100px;background:var(--surface)}
.board-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:18px}
.home .board .board-foot .section-note{margin:0}
.refresh[disabled] svg{animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.board-empty{padding:28px 0;border-block:1px solid var(--line);color:var(--secondary);margin:0}
@media (max-width:640px){.top .in{flex-wrap:wrap;row-gap:14px}.tabs{order:3;width:100%;margin:0}.tabs a{flex:1;justify-content:center}.board{padding:40px 0}.board-head{gap:20px;padding-bottom:24px}.game{grid-template-columns:1fr;gap:10px}.totals dd{font-size:36px}}