.homeRanking{margin-top:16px;background:linear-gradient(145deg,#142737,#0b1725);border:1px solid #304958;border-radius:17px;padding:17px;overflow:hidden;color:#e6f1fa}.rankingHead small{font-size:8px;color:#a9cd90;letter-spacing:2px}.rankingHead h3{font-size:18px;margin:7px 0 14px;letter-spacing:-.5px}.rankingPeriods{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-bottom:12px}.rankingPeriods button{min-height:34px;padding:7px 5px;border:1px solid #2d475a;background:#122737;border-radius:8px;font:10px system-ui;color:#9fb6c9;cursor:pointer}.rankingPeriods button[aria-pressed=true]{background:#b8ff7619;border-color:#9ed96b66;color:#c6ff99}.homeRankRow{display:flex;align-items:center;gap:10px;padding:10px 3px;border-top:1px solid #28404f;min-width:0}.rankNumber{font:700 12px monospace;color:#6e8aa1;width:22px;flex-shrink:0}.rankWho{min-width:0;flex:1}.rankWho strong{font-size:12px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rankWho small{display:block;color:#7894ab;font:9px monospace;margin-top:4px}.rankScore{font-size:13px;color:#b9d7ed;font-variant-numeric:tabular-nums}.rankChampion{background:linear-gradient(90deg,#f7d47713,transparent);border-top-color:#d3ae5144;border-radius:9px;padding:12px 7px}.rankChampion .rankNumber,.rankChampion .rankScore{color:#f2d38c}.rankingNote{font-size:9px!important;color:#7894ab!important;margin:12px 0 0;line-height:1.5}.rankingEmpty{text-align:center;padding:18px 5px}.rankingEmpty span{display:block;font-size:30px;color:#b8ff76;margin-bottom:10px}.rankingEmpty strong{font-size:13px}.rankingEmpty p,.rankingLoading{font-size:11px;color:#8faabe;line-height:1.6}.homeSideTabs{display:none}
.homeAnnouncement{margin:0 0 18px}.homeAnnouncement[hidden]{display:none!important}.noticeCard{position:relative;display:flex;align-items:start;gap:13px;padding:18px!important;border-radius:16px!important;background:radial-gradient(ellipse at top left,#40734d24,transparent 65%),linear-gradient(130deg,#142c33,#0c1b2b)!important;border:1px solid #68895888!important;border-left:3px solid #b7f47c!important;box-shadow:0 10px 35px #0005!important;color:#ecf6fc;overflow:hidden;pointer-events:auto}.noticeIcon{display:grid;place-items:center;flex-shrink:0;width:40px;height:40px;border-radius:12px;border:1px solid #a5e17644;background:#a5e17613;color:#c5fb94;font-size:26px}.noticeContent{min-width:0;flex:1;padding-right:19px}.noticeMeta{display:flex;align-items:center;gap:9px;margin-bottom:7px;flex-wrap:wrap}.noticeTag{font-size:8px;font-weight:800;letter-spacing:1.5px;background:#b8fa7d;color:#17301c;padding:4px 6px;border-radius:4px}.noticeMeta small{color:#79999f;font:8px system-ui;letter-spacing:1px}.noticeTitle{display:block!important;font-size:16px!important;line-height:1.3;color:#e5f4dc!important;letter-spacing:-.2px}.noticeText{margin:7px 0 0!important;color:#b6cbd7!important;font:12px/1.6 system-ui!important;white-space:pre-wrap;overflow-wrap:anywhere;max-height:130px;overflow:auto}.noticeClose{position:absolute;top:10px;right:10px;width:30px;height:30px;padding:0!important;display:grid;place-items:center;border:1px solid #45606a!important;border-radius:8px!important;background:#102631!important;color:#9cb8c5!important;font:22px Arial!important;float:none!important;cursor:pointer}
#serverNotices{width:min(470px,88vw);top:115px}#serverNotices .noticeCard{margin:0}.homeAnnouncement .noticeCard{align-items:center}.homeAnnouncement .noticeText{max-height:60px}.homeAnnouncement .noticeMeta{margin-bottom:5px}
@media(orientation:landscape){body.mobile-ui .homeSideTabs{display:flex;gap:6px;margin-bottom:9px;position:sticky;top:0;background:#0d1e2c;z-index:1;padding:2px;border-radius:11px}body.mobile-ui .homeSideTabs button{flex:1;min-height:35px;border:0;border-radius:9px;background:transparent;color:#87a2b6;font-size:11px}body.mobile-ui .homeSideTabs button[aria-pressed=true]{background:#244332;color:#c5ff97}body.mobile-ui .rooms-column[data-home-side=rooms] #homeRanking{display:none}body.mobile-ui .rooms-column[data-home-side=ranking] .room-panel{display:none}body.mobile-ui .homeRanking{margin:0;padding:12px;border-radius:13px}body.mobile-ui .homeRanking h3{font-size:16px;margin:5px 0 10px}body.mobile-ui .rankingPeriods button{min-height:32px;font-size:9px}body.mobile-ui .homeRankRow{padding:9px 2px;gap:7px}body.mobile-ui .rankWho strong{font-size:11px}body.mobile-ui .rankScore{font-size:11px}body.mobile-ui .room-panel{min-height:0!important}body.mobile-ui .lobby-shell:has(#homeAnnouncement:not([hidden])){grid-template-rows:48px 60px minmax(0,1fr) 48px}body.mobile-ui .homeAnnouncement{grid-area:2/1/3/3;margin:0;min-width:0}body.mobile-ui .lobby-shell:has(#homeAnnouncement:not([hidden])) .lobby-grid{grid-row:3}body.mobile-ui .lobby-shell:has(#homeAnnouncement:not([hidden])) #mobileLobbyTools{grid-row:4}body.mobile-ui .compactNotice{height:60px;padding:8px 12px!important;gap:9px;border-radius:12px!important}body.mobile-ui .compactNotice .noticeIcon{width:31px;height:31px;border-radius:9px;font-size:20px}body.mobile-ui .compactNotice .noticeMeta{margin-bottom:3px;gap:7px}body.mobile-ui .compactNotice .noticeTag{font-size:7px;padding:2px 4px}body.mobile-ui .compactNotice .noticeTitle{font-size:12px!important;display:inline!important;margin-right:8px}body.mobile-ui .compactNotice .noticeText{display:inline;font-size:10px!important;line-height:1.4!important;max-height:26px}body.mobile-ui .compactNotice .noticeContent{max-height:45px;overflow:auto;padding-right:25px}body.mobile-ui .compactNotice .noticeMeta small{font-size:7px}body.mobile-ui .compactNotice .noticeClose{top:14px;right:8px;width:28px;height:28px}
body.mobile-ui.game-active #serverNotices{left:50%;transform:translateX(-50%);top:64px!important;width:min(400px,56vw)!important;z-index:65}body.mobile-ui #serverNotices .noticeCard{padding:12px!important;gap:9px}body.mobile-ui #serverNotices .noticeIcon{width:30px;height:30px;font-size:20px;border-radius:9px}body.mobile-ui #serverNotices .noticeTitle{font-size:13px!important}body.mobile-ui #serverNotices .noticeText{font-size:11px!important;max-height:65px;line-height:1.5!important}body.mobile-ui #serverNotices .noticeMeta small{font-size:7px}body.mobile-ui #serverNotices .noticeMeta{margin-bottom:5px}body.mobile-ui #serverNotices .noticeClose{width:27px;height:27px;top:8px;right:8px}}
@media(max-width:700px){body:not(.mobile-ui) .homeRanking{padding:13px}body.mobile-ui #serverNotices .noticeIcon{display:none}}
@media(orientation:landscape){body.mobile-ui .rooms-column[data-home-side=ranking]{overflow:hidden;display:flex;flex-direction:column}body.mobile-ui .homeSideTabs{flex-shrink:0}body.mobile-ui .rooms-column[data-home-side=ranking] .homeRanking{display:flex;flex-direction:column;flex:1;min-height:0;padding:10px}body.mobile-ui .homeRanking .rankingHead{display:none}body.mobile-ui .rankingPeriods{grid-template-columns:repeat(4,minmax(0,1fr));gap:3px;margin-bottom:6px;flex-shrink:0}body.mobile-ui .rankingPeriods button{font-size:0;min-height:30px;padding:4px 1px}body.mobile-ui .rankingPeriods button:after{font:9px system-ui;content:'Gün'}body.mobile-ui .rankingPeriods button[data-period=weekly]:after{content:'Hafta'}body.mobile-ui .rankingPeriods button[data-period=monthly]:after{content:'Ay'}body.mobile-ui .rankingPeriods button[data-period=all]:after{content:'Tümü'}body.mobile-ui .homeRankRows{overflow:auto;flex:1;min-height:0}body.mobile-ui .rankingNote{display:none}body.mobile-ui .lobby-shell:has(#homeAnnouncement:not([hidden])){grid-template-rows:48px 52px minmax(0,1fr) 48px}body.mobile-ui .compactNotice{height:52px}body.mobile-ui .compactNotice .noticeClose{top:11px}body.mobile-ui .compactNotice .noticeContent{max-height:37px}}
.lobby-side:first-child .homeRanking{margin-top:0}.rankingPeriods button:focus-visible,.homeSideTabs button:focus-visible,.noticeClose:focus-visible{outline:2px solid #bbff83;outline-offset:2px}
#lobby .player-card,#lobby .room-panel,#lobby .homeRanking,#lobby .noticeCard{box-sizing:border-box!important}#lobby .player-card,#lobby .lobby-side{min-width:0}#lobby input,#lobby select{box-sizing:border-box!important;max-width:100%}#lobby .noticeCard *{box-sizing:border-box}
