.online-entry .online-hero{min-height:340px;margin-bottom:24px}.online-entry .online-hero h1{font-size:clamp(2.8rem,5vw,5rem)}.online-entry-panels{display:grid;grid-template-columns:1.15fr 1fr;gap:24px}.online-card{background:var(--panel);border:1px solid var(--line);border-radius:28px;padding:clamp(22px,3vw,36px)}.online-card h2{margin:0 0 20px;font-size:clamp(1.7rem,2.5vw,2.3rem)}.online-card form{display:grid;gap:20px}.online-card form>label{display:grid;gap:8px;font-weight:800}.online-card form input:not([type=radio]){width:100%;min-width:0}.online-card .muted{line-height:1.5}.visibility-options{margin:0;padding:0;border:0;display:grid;grid-template-columns:1fr 1fr;gap:12px}.visibility-options legend{font-weight:800;padding:0 0 10px}.visibility-options>label{display:flex;gap:10px;align-items:flex-start;padding:16px;border:2px solid var(--line);border-radius:18px;cursor:pointer;background:var(--soft)}.visibility-options>label.selected{border-color:var(--teal);box-shadow:inset 0 0 0 1px var(--teal)}.visibility-options input{flex:0 0 auto;margin:4px 0;accent-color:var(--teal)}.visibility-options small{display:block;font-size:.83rem;line-height:1.4;font-weight:500;margin-top:5px}.room-code-input{text-transform:uppercase;letter-spacing:.12em;font-weight:850}.browse-invite{display:flex;align-items:center;gap:18px;border-top:1px solid var(--line);margin-top:28px;padding-top:24px}.browse-invite h3,.browse-invite p{margin:0 0 10px}.room-browser h1{font-size:clamp(2rem,4vw,3.6rem);margin:0}.public-room-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;margin-top:28px}.public-room{border:1px solid var(--line);background:var(--soft);border-radius:22px;padding:20px}.public-room-heading{display:flex;gap:14px;align-items:center}.public-room-heading h2{font-size:1.2rem;margin:0 0 5px;overflow-wrap:anywhere}.public-room-heading p{font-size:.83rem;margin:0}.public-room-footer{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:22px;font-size:.9rem}.button-link{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 17px;border-radius:16px;text-decoration:none;font-weight:850}a.button-link.primary{color:var(--panel);background:var(--teal)}.room-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:10px;border-top:1px solid var(--line);padding:12px 0 18px}.room-toolbar>strong{margin-right:auto;font-size:.95rem}.room-toolbar small{font-size:.75rem;font-weight:600;margin-left:8px}.room-toolbar button,.room-toolbar .button-link{font-size:.82rem;min-height:38px;padding:7px 12px}.room-toolbar .confirm-action{display:inline-block}.in-match .room-toolbar{padding:4px 0 8px;border:0}.in-match .room-toolbar>strong{font-size:.8rem}.in-match .room-toolbar button,.in-match .room-toolbar .button-link{min-height:30px;padding:4px 10px;font-size:.72rem}.online-lobby .join-panel{overflow-wrap:anywhere}.online-lobby .join-panel .actions{justify-content:center}.online-lobby .join-code{font-size:clamp(1.3rem,2vw,2rem);letter-spacing:.12em}.online-lobby .join-panel .qr{width:min(100%,230px)}.room-connection-state{display:grid;place-items:center;min-height:50vh;text-align:center}.session-stats-empty{text-align:center}@media(min-width:950px){.online-lobby.in-lobby .lobby-layout{min-height:calc(100dvh - 210px)}}@media(max-width:800px){.online-entry-panels{grid-template-columns:1fr}.online-entry .online-hero{min-height:0}.online-entry .hero-art{display:none}.room-toolbar{justify-content:center;gap:8px}.room-toolbar>strong{width:100%;text-align:center;margin:0}.room-browser .section-heading{align-items:flex-start}.room-browser .section-heading>button{flex-shrink:0}}@media(max-width:440px){.online-card{border-radius:22px;padding:20px}.visibility-options{grid-template-columns:1fr}.browse-invite{align-items:flex-start}.browse-invite .dog-avatar{width:56px}}.visibility-options input[type=radio]{width:18px;height:18px;min-width:18px;padding:0;flex:0 0 18px}.visibility-options>label>span{min-width:0}@media(max-width:700px){.online-entry .app-header .main-nav,.online-lobby .app-header .main-nav{flex-wrap:wrap}.online-entry .app-header .main-nav button,.online-lobby .app-header .main-nav button{flex:1;min-width:0;padding:10px;font-size:.9rem;white-space:normal}}.online-entry.host-shell #content>.online-hero{min-height:370px}.online-entry-panels>.online-card{scroll-margin-top:20px}.online-entry .hero .button-link{min-height:48px;padding:13px 22px}@media(max-width:800px){.online-entry.host-shell #content>.online-hero{min-height:0;padding:28px}.online-entry .hero h1{font-size:clamp(2.5rem,9vw,3.4rem)}.online-entry .hero-copy>p:not(.eyebrow){line-height:1.5}.online-entry .hero-meta{margin-top:20px}}