.online-entry{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:26px 32px;margin:24px 0;border:1px solid #b49155;border-radius:18px;background:linear-gradient(120deg,#283c30,#17261f);box-shadow:inset 0 0 0 4px #0a17174d,0 12px 30px #0003}.online-entry h2{font-size:28px;margin:5px 0 8px}.online-entry p{margin:0;color:#b9c9b9}.online-entry-actions{display:flex;flex-direction:column;gap:10px;min-width:270px}.online-create-settings{display:grid;grid-template-columns:1fr 1fr;gap:18px}.join-divider{text-align:center;color:#a4b7a5;margin:25px 0 18px}.network-hud{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding:14px 20px;background:#23352c;border:1px solid #7f8055;border-radius:12px;margin:22px 0 12px}.network-hud>div{display:flex;gap:16px;align-items:center;flex-wrap:wrap}.network-hud b{font-size:19px;color:#f5d7a2}.network-hud span{font-size:15px}.network-dot{width:10px;height:10px;display:inline-block;border-radius:50%;background:#8ac9a9;box-shadow:0 0 9px #81c298}.network-dot.offline{background:#ec9b58}.online-lobby{max-width:1050px;margin:24px auto;padding:38px}.online-lobby h1{font-size:40px;margin:10px 0}.lobby-seats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:28px 0}.lobby-seat{display:flex;flex-direction:column;gap:12px;min-height:160px;padding:22px;border:1px dashed #596b58;border-radius:14px;background:#14271f}.lobby-seat.occupied{border-style:solid;background:linear-gradient(140deg,#314b38,#203327);border-color:#8e9b69}.lobby-seat-number{display:grid;place-items:center;width:35px;height:35px;border-radius:50%;background:#bd8a4140;color:#f3b675;font-weight:900}.lobby-seat strong{font-size:23px}.lobby-seat small{color:#b8cdbb}.lobby-settings,.lobby-actions{display:flex;gap:18px;align-items:center;flex-wrap:wrap;margin:24px 0}.lobby-settings label{display:flex;gap:12px;align-items:center}.lobby-settings select{padding:10px;background:#182a22;color:#f5efdc;border:1px solid #697b60;border-radius:8px;font:inherit}.online-connecting{margin:60px auto;padding:48px;max-width:1000px}.online-connecting h1{font-size:32px}.online-lobby .hint{line-height:1.8}.network-waiting{font-size:14px;color:#b9c9b9}#turnCountdown{color:#f4c083;font-variant-numeric:tabular-nums}#roomExpiry{color:#a0b19f}
@media(max-width:700px){.online-entry{flex-direction:column;align-items:stretch;padding:22px}.online-entry-actions{min-width:0}.online-entry h2{font-size:25px}.online-lobby{padding:22px}.online-lobby h1{font-size:32px}.lobby-seats{grid-template-columns:1fr 1fr;gap:10px}.lobby-seat{padding:14px;min-height:145px}.network-hud{padding:12px}.network-hud>div{gap:10px}.online-connecting{padding:24px}.online-connecting h1{overflow-wrap:anywhere}}

#roomCleanupNotice{position:fixed;left:50%;top:8px;transform:translateX(-50%);z-index:250;max-width:calc(100vw - 28px);width:max-content;padding:10px 16px;border:1px solid #e0b660;border-radius:10px;background:#273728;color:#ffe0a0;box-shadow:0 4px 16px #0007;font:700 15px/1.5 system-ui;pointer-events:none}
#homeLanding:has(.room-closed-note){position:relative}
.room-closed-note{position:absolute;top:12px;left:50%;transform:translateX(-50%);z-index:40;box-sizing:border-box;width:440px;max-width:calc(100% - 16px);margin:0;padding:16px 48px 16px 16px;display:flex;align-items:flex-start;gap:12px;border:1px solid #b3985980;border-radius:14px;background:linear-gradient(120deg,#2c4030,#192f23);color:#f5dba0;box-shadow:0 10px 30px #020d0880,inset 0 1px #ffe6a112;text-align:left;font-family:inherit}
.room-closed-note strong{display:block;font-size:16px;font-weight:800;line-height:1.5}
.room-closed-note p{margin:5px 0 0;color:#c0cfb8;font-size:13px;line-height:1.65}
.room-closed-icon{display:grid;place-items:center;flex:0 0 26px;height:26px;margin-top:1px;border:1px solid #b3985970;border-radius:50%;background:#e0bd5820;color:#f2d391;font:700 17px/1 Georgia,serif}
.room-closed-note .room-closed-dismiss{position:absolute;top:6px;right:6px;width:36px;height:36px;margin:0;padding:0;border:0;border-radius:8px;background:transparent;box-shadow:none;color:#c8d0bb;font:400 25px/1 system-ui;cursor:pointer}
.room-closed-note .room-closed-dismiss:hover{background:#f5dba012;color:#ffe2a2}
body:has(#overlay:not(.hidden)) .room-closed-note,body:has(#inPageCenter[open]) .room-closed-note{visibility:hidden}
@media(max-width:650px){.room-closed-note{top:6px;gap:10px;padding:13px 43px 13px 13px}.room-closed-note strong{font-size:15px}.room-closed-note p{font-size:12px}}