/* Desktop: the city is the canvas. Extras open from a small side rail. */
@media(min-width:601px) and (pointer:fine){
 .topbar{left:20px;top:20px;width:430px;max-width:calc(100vw - 120px);min-height:62px;border:1px solid #3853468c;box-shadow:0 3px 14px #29483b18;border-radius:14px;background:#fff9e8ed;background-image:none;padding:0;overflow:visible}
 .topbar .place{padding:11px 16px;gap:0}.topbar .place small{font-size:8px;letter-spacing:.6px}.topbar .place strong{font-size:23px;line-height:1.1}.topbar .place .pin,.topbar .chevron{display:none}
 .topbar .stats{gap:14px;padding:8px 15px;border-left:1px solid #38534624!important}.topbar .stats strong{font-size:25px;line-height:1.1}.topbar .stats small{font-size:8px;letter-spacing:.5px}.topbar .stat-divider{height:26px}.topbar #mode-button{min-width:51px}
 #mobile-menu-button{position:fixed;top:20px;right:20px;width:46px;height:46px;min-height:46px;margin:0;padding:0;background:#fff9e8ed;border:1px solid #38534680;border-radius:50%;box-shadow:0 3px 12px #29483b20;font-size:22px}
 #share-room{position:fixed;right:20px;top:78px;width:46px;height:46px;min-width:46px;padding:0;border:1px solid #9c738980;border-radius:50%;background:#f4dce7;box-shadow:0 3px 12px #29483b20;display:grid;place-content:center}
 #share-room>small{display:none}#share-room>span{font-size:25px}#share-room>b{position:absolute;bottom:-6px;right:-6px;padding:3px 5px;border-radius:10px;background:#385346;color:#fff9e8;font-size:9px}
 #game-shortcuts{position:fixed;left:auto;right:20px;top:calc(50% - 111px);width:46px;display:flex;flex-direction:column;gap:12px;padding:0;background:none;border:0;box-shadow:none;transform:none}
 #game-shortcuts button{width:46px;height:46px;min-height:46px;padding:0;border:1px solid #38534680!important;border-radius:50%;background:#fff9e8ed;box-shadow:0 3px 12px #29483b20}
 #game-shortcuts button>span,#game-shortcuts kbd{display:none}#game-shortcuts svg{width:20px;height:20px}
 #game-shortcuts button[aria-pressed=true]{background:#d3e6bb}
 #progress-strip{position:fixed;top:calc(50% + 63px);left:auto;right:20px;width:46px;display:flex;flex-direction:column;gap:12px}
 #progress-strip #mission-chip,#progress-strip #alert-chip{width:46px;height:46px;min-height:46px;padding:0;border:1px solid #38534680;border-radius:50%;box-shadow:0 3px 12px #29483b20;text-align:center}
 #progress-strip #mission-chip{background:#e5d9ed}#mission-chip::before{content:'☆';font-size:27px;line-height:1}#mission-chip>span,#progress-strip small,#progress-strip #passport-chip{display:none}
 #progress-strip #alert-chip[data-level='0']{display:none}#alert-chip::before{content:'!';display:block;font-size:21px;font-weight:900;line-height:1}#alert-chip>span{display:block;font-size:7px;line-height:1.4;letter-spacing:-1px}
 .mobile-map-open .minimap{left:auto;right:80px;top:100px;width:185px;padding:10px;border-radius:12px;border:1px solid #38534680;box-shadow:0 3px 14px #29483b20;background:#fff9e8ed;background-image:none}.minimap #map{height:135px}.minimap .map-caption{display:none}
 #action-dock{left:50%;right:auto;bottom:20px;transform:translateX(-50%);width:354px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:0;background:none;background-image:none;border:0;box-shadow:none;border-radius:0}
 #action-dock>button{height:60px;padding:24px 7px 10px;border:1px solid #38534680;border-radius:12px;box-shadow:0 3px 12px #29483b20;display:block;text-align:center;overflow:hidden}
 #action-dock strong{font-size:9px;line-height:1;letter-spacing:.2px}#action-dock small{display:none}#action-dock :is(#touch-roar,#touch-stomp)::after{display:none}
 #action-dock .action-shortcut{display:block;right:0;left:0;top:7px;margin:auto;background:none;border:0;box-shadow:none;font-size:8px;min-height:0;color:inherit;opacity:.65;line-height:1}
 #action-dock :is(.ultimate-track,.sprint-track){position:absolute;left:8px;right:8px;bottom:6px;width:auto;height:3px;margin:0;border:0;box-shadow:none}
 #action-dock :is(.ultimate-control[data-state=charging],.ultimate-control[data-state=cooldown],.sprint-control[data-state=cooldown]) small{display:block;position:absolute;bottom:10px;left:0;right:0;margin:0;font-size:7px;line-height:1}
 #action-dock :is(.ultimate-control[data-state=charging],.ultimate-control[data-state=cooldown],.sprint-control[data-state=cooldown]) strong{transform:translateY(-5px)}
 .desktop-movement{display:none}
 
 .toast{bottom:94px}
}
.profile-save-footer{position:sticky;bottom:-25px;padding:14px 0;background:var(--px-paper,#fff9e8);z-index:4}
.profile-save-footer .primary{margin:0;min-height:48px;width:100%}
.profile-rooms{margin:18px 0 6px;border-top:1px solid #38534635;padding-top:14px}
.profile-rooms>summary{cursor:pointer;font-size:12px;font-weight:700;min-height:30px}
#multiplayer[data-intent=profile] #lobby-identity{border:0;background:none;padding:0;margin:12px 0}
#multiplayer[data-intent=profile] #lobby-identity>summary{display:none}
#multiplayer[data-intent=profile] #lobby-identity>.profile-label{margin:16px 0 8px}
#room-rank[hidden]{display:none!important}
#room-rank{background:none;padding:0 0 0 12px;border:0;border-left:1px solid #38534625;min-width:56px;text-align:center;align-self:stretch}
#room-rank strong{white-space:nowrap;font-variant-numeric:tabular-nums;font-size:19px!important}
#room-rank:hover{color:#718957}
#room-ranks{width:min(440px,calc(100vw - 24px));padding:26px;max-height:calc(100dvh - 28px)}
#room-ranks h1{font-size:34px;margin:10px 0}#room-ranks p:not(.eyebrow){font-size:12px;line-height:1.5;color:#53695a}
#room-ranks ol{padding:0;list-style:none;display:grid;gap:7px;margin:20px 0}
#room-ranks li{display:grid;grid-template-columns:35px 1fr auto;gap:10px;align-items:center;padding:13px 10px;background:#edf0df;font-size:12px}
#room-ranks li[data-self=true]{background:#dceacb;border:1px solid #718957}#room-ranks li span{overflow-wrap:anywhere}#room-ranks li strong{font-variant-numeric:tabular-nums}#room-ranks .primary{min-height:44px}
@media(min-width:601px) and (pointer:fine){.topbar:has(#room-rank:not([hidden])){width:495px}}
@media(max-width:600px),(pointer:coarse){#room-rank{min-width:42px;padding-left:7px}#room-rank strong{font-size:15px!important}.topbar:has(#room-rank:not([hidden])) .stats{gap:6px;padding-left:6px;padding-right:6px}.topbar:has(#room-rank:not([hidden])) .stats strong{font-size:21px}.topbar:has(#room-rank:not([hidden])) .place{padding-left:6px;padding-right:4px}.topbar:has(#room-rank:not([hidden])) .place strong{font-size:17px}}
/* Inviting is a primary action: a labeled pill keeps it easy to discover. */
#share-room .invite-friends{display:none}
@media(min-width:601px) and (pointer:fine){
 #share-room{top:20px;right:82px;width:auto;min-width:156px;height:46px;display:flex;align-items:center;justify-content:center;gap:8px;padding:0 13px;border:1px solid #ae852f;border-radius:24px;background:#f5d279;color:#29483b;box-shadow:0 3px 14px #755d3328,inset 0 0 0 2px #fff2c34d}
 #share-room:hover{background:#ffe399;box-shadow:0 4px 16px #755d3340}#share-room>span{font-size:23px;line-height:1}#share-room>small{display:block;font:800 11px 'DM Sans',sans-serif;letter-spacing:0;margin:0;white-space:nowrap}#share-room .invite-friends{display:inline}
 #share-room>b{position:static;background:#fff8d799;color:#385346;font-size:10px;border-radius:10px;padding:4px 6px}
}
@media(min-width:601px) and (max-width:850px) and (pointer:fine){#share-room{top:94px;right:20px}}
/* Keep the smaller layout in the game's pixel-paper visual language. */
@media(min-width:601px) and (pointer:fine){
 .topbar,.mobile-map-open .minimap{border:2px solid var(--px-edge);border-radius:2px;box-shadow:3px 3px 0 var(--px-shadow);background-color:var(--px-paper);background-image:linear-gradient(90deg,#38534605 1px,transparent 1px),linear-gradient(#38534605 1px,transparent 1px);background-size:8px 8px}
 .topbar .stats{border-left:2px solid #38534636!important}.topbar .place small,.topbar .stats small{font-weight:800;letter-spacing:.5px}.topbar .stats strong{font-weight:900}
 #action-dock>button{border:2px solid var(--px-edge);border-radius:1px;box-shadow:2px 2px 0 var(--px-shadow)}#action-dock strong{font-family:var(--px-micro);font-size:9px;letter-spacing:0}
 #action-dock .action-shortcut{left:auto;right:5px;top:5px;padding:2px 3px;font:800 7px var(--px-micro);border:1px solid currentColor;opacity:.85}
 #action-dock>button:active{transform:translate(2px,2px);box-shadow:none}
 #share-room{border:2px solid #385346;border-radius:2px;background:#f8df9b;box-shadow:3px 3px 0 #385346}
 #share-room:hover{background:#ffe9ad;box-shadow:3px 3px 0 #385346}#share-room:active{transform:translate(2px,2px);box-shadow:1px 1px 0 #385346}
 #share-room>small{font:800 10px var(--px-micro)}#share-room>b{border:1px solid #8d813e;border-radius:1px;background:#fff6d1;font:800 9px var(--px-micro)}
}
/* Shared stepped circles on desktop and touch layouts. */
 :is(#mobile-menu-button,#game-shortcuts button,#progress-strip #mission-chip,#progress-strip #alert-chip){--hud-fill:var(--px-paper);--pixel-round:polygon(30% 0,70% 0,70% 7%,85% 7%,85% 15%,93% 15%,93% 30%,100% 30%,100% 70%,93% 70%,93% 85%,85% 85%,85% 93%,70% 93%,70% 100%,30% 100%,30% 93%,15% 93%,15% 85%,7% 85%,7% 70%,0 70%,0 30%,7% 30%,7% 15%,15% 15%,15% 7%,30% 7%);isolation:isolate;border:0!important;border-radius:0;box-shadow:none;background:var(--px-edge);clip-path:var(--pixel-round)}
 #game-shortcuts button,#progress-strip #mission-chip,#progress-strip #alert-chip{position:relative}
 :is(#mobile-menu-button,#game-shortcuts button,#progress-strip #mission-chip,#progress-strip #alert-chip)::after{content:'';position:absolute;inset:2px;z-index:-1;background:var(--hud-fill);clip-path:var(--pixel-round)}
 :is(#mobile-menu-button,#game-shortcuts button,#progress-strip #mission-chip,#progress-strip #alert-chip):hover{--hud-fill:#e7edd8;background:var(--px-edge)}
 :is(#mobile-menu-button,#game-shortcuts button,#progress-strip #mission-chip,#progress-strip #alert-chip):focus-visible{--hud-fill:#ffe2a0;outline:0;background:#a96b2b}
 #game-shortcuts button[aria-pressed=true]{--hud-fill:#d3e6bb;background:var(--px-edge)}#progress-strip #mission-chip{--hud-fill:#e5d9ed;background:var(--px-edge)}
 #progress-strip #alert-chip[data-level='1']{--hud-fill:#f9e6b5;background:var(--px-edge)}#progress-strip #alert-chip[data-level='2']{--hud-fill:#f4ce9d;background:var(--px-edge)}#progress-strip #alert-chip[data-level='3']{--hud-fill:#f2b7ac;background:var(--px-edge)}