.online-panel{max-width:1050px;margin:auto;padding:24px;background:#15181de8;border:1px solid #ffffff38;border-radius:12px;max-height:89vh;overflow:auto}.online-panel h1{margin:0 0 8px;text-transform:uppercase}.online-panel p{color:#ced2d9}.online-columns{display:grid;grid-template-columns:1fr 1fr;gap:24px}.online-panel label{display:block;margin:12px 0}.online-panel input,.online-panel select{display:block;width:100%;padding:10px;background:#252b32;border:1px solid #647080;border-radius:5px;color:#fff;font:inherit}.online-panel button{padding:11px 16px;margin:5px;border:1px solid #ffffff55;border-radius:5px;background:#353e49;color:#fff;cursor:pointer;font:inherit}.online-panel button:disabled{opacity:.45;cursor:default}.online-panel .primary{background:#b3252c}.online-error{min-height:24px;color:#ffb1a8!important}.online-rooms{display:grid;gap:8px}.online-rooms button{text-align:left}.online-rooms small{display:block;color:#c4cbd4}.online-roster{padding-left:24px;line-height:2}.online-code{font:700 24px monospace;letter-spacing:2px}.online-status{position:fixed;bottom:12px;left:50%;transform:translateX(-50%);z-index:8;background:#111b;border-radius:5px;padding:6px 12px;font-size:12px;pointer-events:none}.online-panel .invite{overflow-wrap:anywhere;font-size:13px}.online-panel .notice{font-size:13px;color:#b9c3cd}@media(max-width:720px){.online-columns{grid-template-columns:1fr}.online-panel{padding:16px;max-height:90vh}.online-panel h1{font-size:24px}}

.online-panel-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px}.online-panel-heading h1{margin:0}.online-panel-heading button{flex-shrink:0;white-space:nowrap;margin:0}

/* Passive network status: separate from the game's existing HUD and inputs.
   Collapsed by default; detailed view never covers the room/race controls. */
.online-network-health{position:fixed;right:14px;bottom:54px;z-index:9;width:min(310px,calc(100vw - 28px));max-width:100%;color:#f5f7f9;font:12px/1.45 system-ui,-apple-system,sans-serif;filter:drop-shadow(0 5px 13px #0008)}
.online-network-health[hidden],.online-network-details[hidden]{display:none!important}
.online-network-toggle{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;min-height:36px;padding:8px 12px;background:#152028f5;color:inherit;border:1px solid #7c929e77;border-radius:8px;text-align:left;cursor:pointer;font:inherit}
.online-network-toggle:hover{background:#22313af5}
.online-network-toggle:focus-visible{outline:3px solid #e0b98b;outline-offset:3px}
.online-network-summary{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:650}
.online-network-dot{flex:none;width:8px;height:8px;border-radius:50%;background:#8bd8bd;box-shadow:0 0 0 2px #8bd8bd25}
.online-network-health[data-tone=warning] .online-network-dot{background:#ffbd81;box-shadow:0 0 0 2px #ffbd8126}
.online-network-health[data-tone=idle] .online-network-dot{background:#b8c0c9;box-shadow:0 0 0 2px #b8c0c924}
.online-network-details{margin-top:3px;padding:11px 13px;background:#111c24f5;border:1px solid #7c929e77;border-radius:8px}
.online-network-details p{margin:0 0 6px;color:#e1e9ef;overflow-wrap:anywhere}
.online-network-details p:last-child{margin-bottom:0}
.online-network-details .online-network-note{padding-top:8px;border-top:1px solid #ffffff24;color:#cbd9e4}
.online-network-health[data-tone=warning] .online-network-note{color:#ffcf9e}
.online-network-announcement{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.online-room-filters{display:grid;grid-template-columns:minmax(120px,1fr) minmax(110px,.8fr) auto;align-items:end;gap:9px;margin:10px 0 6px}
.online-panel .online-room-filters label{margin:0;font-size:12px;color:#d7e0e8}
.online-panel .online-room-filters input,.online-panel .online-room-filters select{margin-top:5px;padding:8px;font-size:13px}
.online-panel .online-room-filters .online-room-free{display:flex;align-items:center;gap:7px;white-space:nowrap;min-height:35px}
.online-panel .online-room-free input{width:16px;height:16px;flex:none;margin:0;accent-color:#cb353f}
.online-panel .online-filter-count{margin:5px 0 11px;font-size:12px;color:#aebdc8}
@media(max-width:720px){.online-network-health{right:9px;bottom:54px;width:min(260px,calc(100vw - 18px))}.online-network-details{max-height:42vh;overflow:auto}}
@media(max-width:540px){.online-room-filters{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.online-room-filters .online-room-free{grid-column:1/-1}}

.online-panel [data-kick-player]{padding:4px 9px;margin:3px 0 3px 8px;font-size:12px;border-color:#ff9b9280;color:#ffd8d3;background:#602b30}.online-panel #onlineManageRoster li{display:flex;justify-content:space-between;align-items:center;gap:12px}.online-panel #onlineManageRoster li span{overflow-wrap:anywhere}
.online-vote-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:24px 0}.online-vote-choices button{display:flex;flex-direction:column;gap:14px;padding:24px!important;min-height:150px}.online-vote-choices button[aria-pressed=true]{border:2px solid #ef4438!important;background:#64211f!important}.online-vote-choices span{font-size:13px;color:#d2d8df}#onlineVoteClock{color:#ffcc67}@media(max-width:700px){.online-vote-choices{grid-template-columns:1fr}}