@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Oswald:wght@500;600;700&display=swap');
:root{color-scheme:dark;--bg:#10120f;--panel:#191c17;--muted:#92978a;--text:#f0f0e6;--gold:#d8dba9;--accent:#d1df81;--red:#e36f5f;--line:#ffffff12;--safe:env(safe-area-inset-bottom,0px)}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);font-family:Manrope,Arial,sans-serif;color:var(--text);font-size:13px}
button,input,select{font:inherit}
button{cursor:pointer;color:inherit;border:0}
button:disabled{opacity:.45;cursor:wait}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
button{touch-action:manipulation}
button:active{transform:scale(.97)}
[hidden]{display:none!important}
main{height:100dvh;min-height:540px;position:relative;overflow:hidden;max-width:780px;margin:auto}
#map,#map3d,#map-fallback,.map-shade{position:absolute;inset:0}
#map{z-index:1;background:transparent;pointer-events:none}
#map3d{z-index:2;pointer-events:auto;background:#12131a;touch-action:none}
#map-fallback{z-index:3;pointer-events:none}
.map-shade{z-index:4;pointer-events:none;background:linear-gradient(180deg,#101518ed 0%,#10151855 23%,transparent 40%,transparent 65%,#101518d9 90%)}
.maplibregl-ctrl-top-right,.leaflet-control-container,.maplibregl-ctrl-group,.leaflet-container,.leaflet-tile-pane,.leaflet-control-attribution{display:none!important}
.property-marker{display:none}
.card{border:1px solid #9aa58a55;background:#20282d;border-radius:8px;padding:12px;margin:8px 0}
.card h3{margin:0 0 8px;font-size:15px;color:var(--accent)}
.property-address{font-size:16px;font-weight:700;color:#e3fff7;margin-bottom:8px}
.wallet .income-rate{display:inline-flex;align-items:center;gap:5px;align-self:flex-start;width:auto!important;height:auto!important;min-width:0;padding:3px 0!important;margin-top:3px;background:transparent!important;color:#d5dfb8!important;font-size:11px!important;font-weight:700;line-height:1.3;border:0;border-radius:0;white-space:nowrap;box-shadow:none}
.income-rate span{font-size:10px;opacity:.6}
.income-rate:hover{color:#f1f5e7!important}
.wallet>div{min-width:0}
.wallet strong{overflow-wrap:anywhere}
.actor-direction{display:block;width:100%;height:100%;transform-origin:50% 50%}
.facing-left .actor-direction{transform:scaleX(-1)}
.vehicle-sprite{display:block;position:relative;width:88px;height:68px}
.vehicle-sprite svg{display:block;overflow:visible}
.vehicle-body{transform-origin:44px 55px}
.motion-streaks{position:absolute;left:0;top:39px;width:17px;height:2px;background:#d5e9bb;box-shadow:-5px 7px 0 #d5e9bb88;opacity:0;pointer-events:none}
.is-moving .motion-streaks{animation:vehicle-streak .45s linear infinite}
.is-moving .vehicle-wheel{animation:vehicle-wheel-spin .5s linear infinite}
.is-moving .vehicle-sportcar .vehicle-wheel{animation-duration:.22s}
.is-moving .vehicle-body{animation:vehicle-ride .35s ease-in-out infinite alternate}
.is-moving .vehicle-scooter .vehicle-body{animation-duration:.55s}
.helicopter-rotor{transform-origin:45px 23px}
.is-moving .helicopter-rotor{animation:rotor-spin .12s linear infinite}
@keyframes vehicle-wheel-spin{to{transform:rotate(360deg)}}
@keyframes vehicle-ride{from{transform:translateY(0)}to{transform:translateY(-1.5px)}}
@keyframes vehicle-streak{0%{opacity:0;transform:translateX(0)}35%{opacity:.7}100%{opacity:0;transform:translateX(-12px)}}
@keyframes rotor-spin{50%{transform:scaleX(.12)}100%{transform:scaleX(1)}}
@media(prefers-reduced-motion:reduce){.vehicle-sprite *{animation:none!important}.motion-streaks{display:none}}
#map .leaflet-interactive{cursor:pointer}
#map-fallback{pointer-events:none}
.player-marker{background:none;border:0;border-radius:0;box-shadow:none;filter:drop-shadow(0 3px 3px #000b)}
.walker{position:relative;display:block;width:34px;height:50px;transform-origin:50% 90%;filter:drop-shadow(0 0 7px #36f6e0)}
.walker i{position:absolute;display:block;border-radius:7px;background:#42f4df;box-shadow:0 0 7px #42f4df}
.walker-head{width:12px;height:12px;left:11px;top:2px;border:2px solid #c7fff8}
.walker-body{width:15px;height:20px;left:10px;top:15px;background:#2ad8c9;border:2px solid #b8fff5;border-radius:8px 8px 5px 5px}
.walker-arm{width:5px;height:18px;top:16px;transform-origin:50% 3px;background:#55f7e5}
.walker-arm.left{left:5px;transform:rotate(17deg)}
.walker-arm.right{right:5px;transform:rotate(-17deg)}
.walker-leg{width:6px;height:17px;top:33px;transform-origin:50% 2px;background:#1bb5b0;border:1px solid #a4fff4}
.walker-leg.left{left:10px}
.walker-leg.right{right:10px}
.is-moving .walker{animation:walker-bob .36s ease-in-out infinite alternate}
.is-moving .walker-leg.left,.is-moving .walker-arm.right{animation:walker-step .55s ease-in-out infinite alternate}
.is-moving .walker-leg.right,.is-moving .walker-arm.left{animation:walker-step .55s ease-in-out infinite alternate-reverse}
.facing-left .walker-head{border-left-width:4px}
.destination-marker{background:none;border:0;color:#eff7b8;font-size:31px;text-align:center;text-shadow:0 2px 5px #000}
.destination-marker:after{content:'';position:absolute;left:7px;bottom:0;width:18px;height:8px;border:2px solid #e3ed9e;border-radius:50%;background:#d1df8133}
.start-banner{position:absolute;z-index:452;top:245px;left:22px;right:85px;border-radius:12px;padding:14px;text-align:left;display:grid;gap:6px;color:var(--accent)}
.start-banner small{color:var(--text);font-size:10px}
.start-cities{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:12px 0}
.map-controls{display:none!important}
.map-source{position:absolute;z-index:449;left:22px;right:85px;bottom:calc(223px + var(--safe));font-size:9px;line-height:1.5;color:#d3dcbd;background:#111a;pointer-events:none;border-radius:7px;padding:5px 8px}
@keyframes walker-step{from{transform:rotate(-24deg)}to{transform:rotate(24deg)}}
@keyframes walker-bob{from{translate:0 0}to{translate:0 -2px}}
@media(prefers-reduced-motion:reduce){.walker,.walker i{animation:none!important}}
.right-rail{position:absolute;right:12px;top:50%;transform:translateY(-50%);z-index:460;display:flex;flex-direction:column;gap:10px}
.round-action{width:46px;height:46px;border-radius:50%;background:linear-gradient(145deg,#101f29ed,#21112fe8);border:1px solid #45f2e5aa;color:#86fff2;font-size:21px;box-shadow:0 0 12px #24d9d955,0 8px 24px #0008}
.round-action:nth-child(2n){border-color:#c178ffaa;color:#e1b5ff;box-shadow:0 0 12px #a64cff55,0 8px 24px #0008}
.round-action:hover{transform:translateX(-3px);background:#18333b}
.bottom-nav{position:absolute;left:12px;right:12px;bottom:calc(10px + var(--safe));z-index:460;height:68px;padding:8px 16px;display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:8px;background:#07131ae8;border:1px solid #53e9dd66;border-radius:22px;box-shadow:0 -4px 30px #061117cc,0 0 18px #20d9d933}
.bottom-nav button{display:grid;grid-template-columns:auto 1fr;grid-template-rows:1fr 1fr;column-gap:8px;align-items:center;text-align:left;background:transparent;color:#a8b7ba;border-radius:13px;padding:3px 8px}
.bottom-nav button.active,.bottom-nav button:hover{background:#1b3340;color:#dffffb}
.bottom-nav span{grid-row:1/3;font-size:23px;color:#59eee3}
.bottom-nav small{font-size:11px;font-weight:800;letter-spacing:.08em}
.bottom-nav b{font-size:10px;font-weight:700;color:#b9f8a1;white-space:nowrap}
.object-dock{position:absolute;z-index:455;left:16px;right:78px;bottom:calc(92px + var(--safe));padding:14px 16px;display:grid;gap:4px;border:1px solid #7aebdd99;border-radius:18px;background:linear-gradient(135deg,#071820f2,#161128ef);box-shadow:0 0 22px #3deadd33,0 14px 30px #0009}
.object-dock-kicker{font-size:9px;letter-spacing:.18em;color:#70fff1}
.object-dock strong{font-size:16px}
.object-dock span:not(.object-dock-kicker){color:#bac8c9;font-size:11px}
.object-dock .primary{margin-top:7px}
.property-address{font-size:18px;font-weight:800;color:#e3fff7}
.property-status{color:#9deee0}
.loading-percent{display:block;margin:10px 0;font-size:20px}
