/* V4 map: graphite, lime route markers and a gold final gate. */
html[dir=ltr] .map-heading,html[dir=ltr] .hub-rail,html[dir=ltr] .map-node,html[dir=ltr] .map-legend{direction:ltr}
.world-board .world-tabs{position:absolute;z-index:4;left:5%;right:51%;top:112px;display:flex;gap:6px;overflow-x:auto;scrollbar-width:thin;padding-bottom:6px;direction:ltr}
.world-board .world-tabs button{flex:0 0 auto;display:grid;gap:3px;min-width:90px;min-height:47px;padding:6px 10px;font-size:12px;background:#15212def;border:1px solid #4d6170;border-radius:7px;color:#c8d3dd;white-space:nowrap}
.world-tabs button[aria-pressed=true]{border-color:var(--lime);color:var(--lime);background:#253129}
.world-tabs small{font-size:10px;letter-spacing:.06em;color:#a7b5c2}
.map-node:nth-child(12n){border-radius:18px 18px 7px 7px;border-color:#ae9662;color:#ffe2a0}
@media(max-width:800px){.world-board .world-tabs{top:108px;left:5%;right:5%;inset-inline-start:5%}.world-board .world-tabs button{min-width:96px}.world-board .map-legend{top:auto;bottom:8px}}
.hub-nav{display:flex;align-items:center;gap:22px}.hub-nav button,.hub-text-button{border:0;background:transparent;font-size:14px;padding:12px 4px;color:var(--muted)}.hub-nav button[aria-pressed=true]{color:var(--lime);box-shadow:0 3px var(--lime)}.hub-nav button:hover,.hub-text-button:hover{color:var(--white);background:transparent}.hub-nav button{white-space:nowrap}.hub-open .app{width:100%;max-width:1800px;padding:0 0 16px}.hub-open .app>.header{min-height:72px;margin:0;padding:12px 26px;border-bottom:1px solid #334350;background:#0e171fe8;gap:24px}.hub-open .brand h1{font-size:32px;margin:0;letter-spacing:-.6px}.hub-open .brand-door{width:23px;height:30px}.hub-open .brand p{display:none}.hub-open .header-actions>.icon-button{display:none}#back-to-game{display:none}.hub-open #back-to-game{display:inline-flex;min-height:40px;font-size:13px}.hub-open .app>:not(.header):not(.hub):not(.sr-only){display:none!important}.hub-open .header-actions{padding:0}.hub-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;min-height:900px;direction:rtl}.world-board{position:relative;isolation:isolate;overflow:hidden;min-width:0;height:100%;min-height:880px;direction:ltr;background:#0e1720 url('./assets/world-map.png') center center/100% 100% no-repeat}.map-heading{position:absolute;left:5%;top:4%;z-index:2;text-align:left;direction:rtl;max-width:50%;text-shadow:0 2px 18px #091018}.map-heading h2{font-size:clamp(30px,3.3vw,54px);line-height:1.2;margin:0 0 7px;font-weight:700;letter-spacing:-1px}.map-heading p{font-size:17px;color:#aebbc8;margin:0}.map-node{position:absolute;transform:translate(-50%,-50%);z-index:2;width:65px;height:65px;display:grid;place-items:center;border-radius:50%;background:#111b26e8;border:3px solid #536371;box-shadow:0 0 0 5px #64788b14,0 7px 20px #0009;color:#bec9d1;transition:box-shadow .18s,border-color .18s;direction:rtl}.map-node:hover{background:#22313d;border-color:#c1cfda}.map-node:active{transform:translate(-50%,-50%)}.map-node>span{font-size:25px;font-family:var(--font);line-height:1;font-weight:600}.map-node small{position:absolute;top:calc(100% + 9px);left:50%;transform:translateX(-50%);font-size:12px;font-weight:500;white-space:nowrap;text-shadow:0 1px 5px #000,0 1px 10px #000;background:#101820b8;padding:1px 6px;border-radius:3px}.map-node.unlocked{border-color:#91b453;color:#e1f6b7}.map-node.done{border-color:var(--lime);box-shadow:0 0 0 5px #d7fb7510,0 0 30px #b9ee574d;background:#26361bed;color:var(--lime)}.map-node[aria-pressed=true]{border-color:#ffe0a0;background:#3a311ced;color:#fff2cf;box-shadow:0 0 0 6px #ffe09b22,0 0 35px #ffca6163}.map-node[aria-pressed=true] small{color:#ffe0a0}.map-node[data-level="11"]{border-radius:18px 18px 7px 7px;border-color:#ae9662;color:#ffe2a0}.map-path{position:absolute;inset:0;width:100%;height:100%;z-index:1;overflow:visible;pointer-events:none}.map-path path{fill:none;stroke:#7e8e9e;stroke-width:2.5;stroke-dasharray:5 8;stroke-linecap:round;opacity:.8}.map-path #trail-done{stroke:#d7fb75;opacity:1}.map-legend{position:absolute;bottom:20px;left:25px;display:flex;direction:rtl;align-items:center;gap:8px;color:#bdc7cf;font-size:11px;padding:6px 10px;background:#0c141ce0;border-radius:5px}.map-legend i{width:6px;height:6px;display:inline-block;background:#62707d;border-radius:50%;margin-right:6px}.map-legend i:first-child{background:var(--lime)}.map-legend i:nth-child(2){background:#edcb86}.hub-rail{padding:16px;display:flex;flex-direction:column;gap:16px;direction:rtl;border-left:1px solid #2a3b47;background:#0c141c;min-width:0}.hub-rail h3{font-size:20px;margin:0 0 6px;line-height:1.4}.hub-rail h3>span{color:#ffd57e;float:left}.stage-preview,.friends-panel,.rank-panel{padding:18px 16px;border:1px solid #304450;border-radius:10px;background:#121d25;min-width:0}.stage-preview{display:grid;grid-template-columns:minmax(0,1fr) 84px;column-gap:10px}.stage-image{grid-column:2;grid-row:1/4;background:#16212a url('./assets/chamber.png') center/cover;border:1px solid #42565f;border-radius:6px;min-height:90px}.stage-preview #selected-number{color:#aebcca;font-size:12px}.stage-preview h3{font-size:23px;margin:7px 0}.stage-preview p{font-size:12px;line-height:1.8;color:#bcc7cf;margin:0 0 10px}.stage-preview button{grid-column:1/-1;width:100%;margin-top:10px}.stage-preview .hub-text-button{margin:2px 0 -8px;padding:8px 0;font-size:12px}.hub-muted{font-size:13px;color:#a9b9c7;margin:4px 0 18px}.player-count{display:flex;margin-bottom:14px;border:1px solid #415562;border-radius:6px;overflow:hidden}.player-count button,.rank-source button{flex:1;border:0;background:transparent;color:#bcc8d1;font-size:14px;min-height:44px;padding:8px 12px}.player-count button[aria-pressed=true]{color:var(--lime);box-shadow:inset 0 0 0 1px var(--lime);border-radius:5px;background:#d7fb7507}.hub label{display:block;color:#c6d3dd;font-size:12px;margin:10px 0}.hub input,.hub select{width:100%;font:14px var(--font);color:var(--white);background:#15222d;border:1px solid #415764;border-radius:6px;min-height:44px;padding:8px 11px;margin-top:5px;outline-color:var(--lime)}.hub input::placeholder{color:#8f9da9}.hub select{font-size:12px}.friends-panel .primary{width:100%;margin-top:7px}.join-room{display:flex;gap:8px;margin-top:15px}.join-room input{min-width:0;margin:0;text-align:center;letter-spacing:2px;font-size:14px}.join-room .secondary{font-size:13px;min-width:65px;padding:7px 10px}.friends-panel .hub-text-button{font-size:12px;width:100%;padding:12px 0 0;color:#cad6bf}.network-message{font-size:12px;line-height:1.7;color:#ffd89d;margin:8px 0 0}.network-message:empty{display:none}.rank-panel{padding-bottom:12px}.rank-source{display:flex;gap:4px;margin:9px 0;border-bottom:1px solid #344753}.rank-source button{font-size:12px;min-height:34px;padding:5px}.rank-source button[aria-pressed=true]{color:var(--lime);box-shadow:0 2px var(--lime)}.rank-panel table{width:100%;border-collapse:collapse;font-size:12px;text-align:right;table-layout:fixed}.rank-panel th{color:#aab9c5;font-weight:500;padding:8px 4px;border-bottom:1px solid #364752}.rank-panel td{padding:10px 4px;border-bottom:1px solid #263944;overflow-wrap:anywhere}.rank-panel th:first-child{width:44%}.rank-panel td:nth-child(2){direction:ltr;text-align:right;font-variant-numeric:tabular-nums}.rank-panel th:last-child,.rank-panel td:last-child{text-align:center}.ranking-empty{color:#a6b5c2;text-align:center;font-size:14px;padding:15px 0;margin:0;line-height:1.8}.ranking-empty:empty{display:none}.ranking-note{font-size:10px;color:#95a5b2;margin:12px 0 0}.room-code-line{display:flex;align-items:center;justify-content:space-between;margin:10px 0}.room-code-line>span{font-size:12px;color:#afc0cd}.room-code-line button{font:600 23px monospace;color:var(--lime);background:#09151b;border:1px dashed #6c8959;padding:8px 12px;border-radius:5px;letter-spacing:3px}.friends-panel ol{list-style:none;padding:0;margin:15px 0}.friends-panel li{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #2a3e49;padding:10px 0;gap:8px;font-size:14px}.friends-panel li small{color:#bcc6ce;font-size:11px}.friends-panel li.empty-seat{color:#7f94a3}.friends-panel #ready-player{width:100%}.race-strip{display:flex;align-items:center;gap:15px;border:1px solid #435961;border-radius:7px;padding:8px 12px;margin-bottom:10px;font-size:12px;background:#111f25}.race-strip>b{color:var(--lime);white-space:nowrap}.race-strip>div{display:flex;flex-wrap:wrap;gap:8px 18px;flex:1}.race-strip button{font-size:11px;min-height:30px;padding:4px 10px}.race-strip>span{font-variant-numeric:tabular-nums}.race-countdown{position:absolute;inset:0;z-index:8;background:#0b1420cc;display:grid;place-items:center;font-size:52px;font-weight:700;direction:rtl;color:var(--lime)}#race-connection{position:absolute;top:4px;left:50%;transform:translateX(-50%);z-index:9;background:#482a20f2;border:1px solid #cfa674;color:#ffe5b6;font-size:12px;direction:rtl;padding:7px 12px;max-width:90%;width:max-content;text-align:center}.online-playing #pause{display:none!important}.online-playing .victory #play-again,.online-playing .victory #share{display:none}.online-playing .app{width:min(1400px,calc(100% - 40px))}.online-playing .arena{max-height:60vh}
@media(min-width:1600px){.hub-layout{grid-template-columns:minmax(0,1fr) 370px}.world-board{min-height:1040px}.hub-rail{padding:20px}.stage-preview,.friends-panel,.rank-panel{padding:20px}.map-node{width:74px;height:74px}}
@media(max-width:1100px){.hub-layout{grid-template-columns:minmax(0,1fr) 295px}.hub-open .app>.header{padding:12px 18px;gap:14px}.hub-nav{gap:16px}.hub-nav button{font-size:13px}.map-heading h2{font-size:36px}.map-heading p{font-size:13px}.map-node{width:52px;height:52px}.map-node>span{font-size:21px}.hub-rail{padding:12px;gap:12px}.hub .stage-preview,.hub .friends-panel,.hub .rank-panel{padding:16px 12px}.stage-preview{grid-template-columns:minmax(0,1fr) 65px}.stage-preview h3{font-size:19px}.stage-image{min-height:70px}}
@media(max-width:800px){.hub-layout{display:flex;flex-direction:column;min-height:0}.world-board{height:620px;min-height:620px;background-size:cover;background-position:center}.hub-rail{display:grid;grid-template-columns:1fr 1fr;border:0;padding:16px;gap:16px}.stage-preview{grid-column:1/-1;grid-template-columns:minmax(0,1fr) 120px}.stage-preview .primary{grid-column:1;max-width:280px}.stage-preview .hub-text-button{grid-column:1;max-width:280px}.stage-image{grid-row:1/6}.hub-open .brand h1{font-size:26px}.hub-open .app>.header{flex-wrap:wrap;gap:10px;padding:12px 16px}.hub-nav{order:3;width:100%;justify-content:center;gap:32px}.hub-open .header-actions{margin-inline-start:auto}.map-heading{max-width:80%;top:6%;left:6%}.map-heading h2{font-size:37px}.map-heading p{font-size:15px}.map-node{width:54px;height:54px}.map-node small{font-size:11px}.hub-nav button{padding:9px 2px}.race-strip{flex-wrap:wrap;gap:7px}.race-strip>div{flex-basis:100%;order:3}.race-strip>span{margin-inline-start:auto}body:not(.hub-open) .hub-nav{gap:17px;order:3;width:100%}body:not(.hub-open) .header{flex-wrap:wrap}body:not(.hub-open) .hub-nav button{font-size:12px;padding:6px 0}}
@media(max-width:520px){.hub-rail{display:flex;padding:12px;gap:12px}.world-board{height:580px;min-height:580px}.hub-open .brand h1{font-size:25px}.hub-open #back-to-game{font-size:11px;min-height:36px;padding:6px 10px}.hub-open .header .brand-door{height:25px;width:20px}.hub-nav{gap:26px}.hub-nav button{font-size:12px}.stage-preview{grid-template-columns:minmax(0,1fr) 95px}.stage-preview h3{font-size:22px}.stage-preview p{font-size:13px}.hub .stage-preview,.hub .friends-panel,.hub .rank-panel{padding:18px}.hub input,.hub select{font-size:16px}.map-heading h2{font-size:35px}.map-heading p{font-size:14px}.map-node small{max-width:95px;white-space:normal;width:max-content;line-height:1.5}.map-legend{left:12px;bottom:14px;font-size:10px}.map-node{width:48px;height:48px}.map-node>span{font-size:20px}.race-countdown{font-size:32px}.hub .primary,.hub .secondary{min-height:44px}.race-strip{font-size:11px}.race-strip>div{font-size:10px}.online-playing .app{width:calc(100% - 24px)}}
.android-game .hub-open{height:auto;overflow:auto}.android-game .hub-open .app{height:auto;display:block;overflow:visible;width:100%;padding:0}.android-game .hub-open .header{min-height:60px}.android-game .hub-open .hub-layout{min-height:0}.android-game .hub-open .world-board{min-height:650px}.android-game .hub-open .hub-nav{display:flex}.android-game body:not(.hub-open) .hub-nav{gap:10px;width:auto;order:initial}.android-game body:not(.hub-open) .hub-nav button{font-size:11px;padding:5px 0}.android-game .online-playing .app{display:flex;flex-direction:column}.android-game .online-playing .game-shell{flex:1;min-height:0}.android-game .online-playing .arena{max-height:none}.android-game .online-playing .race-strip{margin:0;padding:5px 8px;flex-wrap:nowrap}.android-game .online-playing .race-strip>b{display:none}.android-game .online-playing .race-strip>div{order:0;flex-basis:auto}.android-game .online-playing .race-strip #race-time{margin:0}.android-game .hub-open .touch-controls{display:none!important}
@media(max-height:520px) and (orientation:landscape){body:not(.hub-open) .header{flex-wrap:nowrap}body:not(.hub-open) .hub-nav{order:initial;width:auto}.hub-nav button{font-size:11px;padding:4px}.hub-nav{gap:14px}.online-playing .arena{max-height:calc(100svh - 235px)}.online-playing .race-strip{padding:4px 8px;margin-bottom:5px}.online-playing .race-strip>div{order:0;flex-basis:auto}.online-playing .race-strip>b{display:none}.online-playing .race-strip>span{margin:0}.online-playing .race-strip button{min-height:26px}}
@media(min-width:801px){.hub-layout{align-items:start}.world-board{position:sticky;top:0;height:calc(100svh - 72px);min-height:610px;max-height:1050px}.hub-rail{min-height:100%}}

@media(max-width:800px){.map-legend{top:21%;bottom:auto;left:6%}}

.map-node .node-players{position:absolute;bottom:3px;left:50%;transform:translateX(-50%);display:flex;gap:3px;align-items:center;justify-content:center;pointer-events:none}.node-players i{width:9px;height:9px;border:1px solid #0b161c;border-radius:50%;box-shadow:0 0 5px #0008}

.hub-rail h3>span>svg{width:22px;height:22px;display:block}.friends-panel h3>span{color:var(--white)}
@media(min-width:1400px){.hub-layout{grid-template-columns:minmax(0,1fr) 400px}.hub-rail{padding:16px}.hub-rail h3{font-size:22px}.hub-nav button{font-size:16px}.stage-image{min-height:90px}}
