:root{--bg:#05080d;--panel:#10151e;--line:#2a3340;--muted:#7f8998;--gold:#f0b53c;--blue:#3a95ff;--red:#ff5148}
*{box-sizing:border-box}.mf-app{position:fixed;inset:0;background:#05080d;color:#fff;overflow:hidden;font-family:system-ui,-apple-system,Segoe UI,sans-serif}.mf-map{position:absolute;inset:0;z-index:1;background:#070b10}.leaflet-container{background:#070b10!important}.leaflet-control-attribution{display:block!important;background:#05080dcc!important;color:#cbd4dd!important;font-size:9px!important}.leaflet-control-attribution a{color:#fff!important}.leaflet-tile{filter:brightness(.56) contrast(1.08) saturate(.58)}
.mf-hud{position:absolute;top:0;left:0;right:0;z-index:20;min-height:78px;padding:9px 9px 13px 54px;background:linear-gradient(#05080df5,#05080db8 76%,transparent);display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px;pointer-events:none;align-items:start}.mf-menu{position:absolute;left:10px;top:14px;width:36px;height:36px;border:1px solid #39424e;border-radius:10px;background:#10151dcc;color:#fff;font-size:19px;pointer-events:auto}.mf-stat{text-align:center;min-width:0;padding-top:1px}.mf-stat small{display:block;font-size:9px;line-height:12px;letter-spacing:1.25px;color:#aeb7c3;font-weight:900;white-space:nowrap}.mf-stat b{display:block;font-size:21px;line-height:25px;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mf-stat em{display:block;font-style:normal;font-size:7px;line-height:9px;color:#707b8a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mf-stat.money b{color:#f0c34c}.mf-stat.material b{color:#4fe0b1}.mf-stat.drugs b{color:#d86cff}.mf-stat.hitmen b{color:#dce5f2}.mf-stat.level b{color:#ff8a35}
.mf-event{position:absolute;top:78px;left:50%;transform:translateX(-50%);z-index:15;border:1px solid var(--gold);box-shadow:0 0 18px #f0b53c33;background:#17140ddd;color:var(--gold);border-radius:28px;padding:7px 16px;font-weight:900;font-size:11px;letter-spacing:.7px;white-space:nowrap}.mf-legend{position:absolute;left:10px;top:128px;z-index:15;background:#0c1119e6;border:1px solid #293341;border-radius:11px;padding:8px 10px;font-size:9px;color:#b6bec9}.mf-legend div{margin:3px 0}.sw{display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:5px}.sw.blue{background:#2e90ff}.sw.red{background:#ff4d43}.sw.gray{border:1px solid #7b8592}
.mf-bottom{position:absolute;left:8px;right:8px;bottom:max(8px,env(safe-area-inset-bottom));z-index:40;height:70px;border-radius:25px;background:#10141df2;border:1px solid #252d39;box-shadow:0 15px 45px #000b;display:grid;grid-template-columns:repeat(5,1fr);align-items:center;padding:6px}.bottom-btn{border:0;background:none;color:#7f8998;height:58px;border-radius:18px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}.bottom-btn span{font-size:20px;line-height:22px}.bottom-btn small{font-size:7px;font-weight:900;letter-spacing:1px}.bottom-btn.active{color:#fff;background:#1a202a}
.mf-drawer{position:absolute;left:8px;right:8px;bottom:86px;z-index:35;max-height:76vh;overflow:auto;background:#10151ef7;border:1px solid #303946;border-radius:22px;padding:16px;box-shadow:0 25px 70px #000d;backdrop-filter:blur(18px)}.mf-drawer.hidden{display:none}.drawer-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.drawer-head small{color:#6e7887;font-size:8px;letter-spacing:2px}.drawer-head h2{margin:2px 0 0;font-size:22px}.close-btn{width:40px;height:40px;border:1px solid #343d49;border-radius:50%;background:#1a2029;color:#fff;font-size:25px}.hero{display:flex;gap:12px;align-items:center;padding:13px;background:#171d27;border:1px solid #2b3542;border-radius:17px}.hero-icon{font-size:28px}.hero b{font-size:17px}.hero p{margin:4px 0 0;color:#8f99a8;font-size:11px;line-height:1.4}.statgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:10px 0}.statgrid>div{background:#171d27;border:1px solid #293340;border-radius:13px;padding:10px 6px;text-align:center}.statgrid b{display:block;font-size:16px}.statgrid small{display:block;color:#7e8998;margin-top:3px;font-size:8px}.action{width:100%;border:1px solid #35404d;border-radius:13px;background:#1b222c;color:#fff;padding:12px 13px;margin:4px 0;text-align:left;font-weight:800}.action.primary{background:#2d73b9;border-color:#4997df}.action.danger{background:#4b201e;border-color:#8b3b35}.hint{padding:10px 11px;background:#111923;border:1px solid #293542;border-radius:11px;color:#aeb7c2;font-size:10px;margin:9px 0}.list{display:flex;flex-direction:column;gap:6px;margin-top:8px}.row,.rankrow,.build-option{display:flex;align-items:center;gap:9px;background:#171d27;border:1px solid #283340;border-radius:12px;padding:10px}.row{justify-content:space-between}.row small,.rankrow small,.build-option small{display:block;color:#7f8997;font-size:9px;margin-top:2px}.mini{border:1px solid #465261;background:#202833;color:#fff;border-radius:8px;padding:6px 8px;font-size:10px}.rankrow>b{width:22px;color:#aab3bf;text-align:center}.rankrow span{flex:1}.rankrow em{font-style:normal;color:#f0c34c;font-size:10px}.build-option{width:100%;text-align:left;color:#fff;cursor:pointer}.build-option>span{font-size:26px;width:36px;text-align:center}.build-option div{flex:1}.build-option b{font-size:13px}.territory-head{display:flex;justify-content:space-between;align-items:center}.territory-head h3{margin:0 0 4px;font-size:20px}.badge{display:inline-block;padding:4px 7px;border-radius:7px;font-size:7px;font-weight:900;letter-spacing:1px}.badge.own{background:#163a64;color:#5da9ff}.badge.enemy{background:#551f1e;color:#ff8179}.badge.free{background:#242b34;color:#9aa5b1}.building-card{display:flex;align-items:center;gap:9px;padding:11px;background:#171d27;border:1px solid #293340;border-radius:13px;margin:9px 0}.building-card>span{font-size:30px}.building-card div{flex:1}.building-card small{display:block;color:#7f8998;margin-top:3px}.production-card{margin:10px 0;padding:13px;background:#171d27;border:1px solid #303b48;border-radius:16px}.production-card h3{margin:0 0 8px;font-size:16px}.production-card #productionStatus{padding:9px 10px;background:#10161f;border-radius:10px;border:1px solid #293441}.production-card #productionStatus b{display:block;font-size:12px}.production-card #productionStatus small{display:block;color:#8995a4;margin-top:3px;font-size:9px}.production-row{display:grid;grid-template-columns:100px 1fr;gap:7px;margin-top:8px}.production-row input{width:100%;height:43px;border:1px solid #394653;border-radius:11px;background:#0b1016;color:#fff;padding:0 10px;font-size:16px}.production-card>.action{margin-top:7px}.production-card>small{display:block;color:#7f8997;font-size:9px;margin-top:7px}.social-block{margin-top:12px}.social-block h3{margin:0 0 5px;font-size:13px}.social-block h3 small{color:#7f8997;font-weight:400}.tabs{display:flex;gap:7px;margin-top:10px}.tabs>*{padding:8px 11px;border-radius:9px;background:#171d27;color:#fff;text-decoration:none;font-size:11px}.profile-card{text-align:center;padding:8px}.avatar{width:68px;height:68px;margin:auto;border-radius:50%;display:grid;place-items:center;background:#151c27;border:1px solid #394454;font-size:32px}.res-marker{background:transparent!important;border:0!important}.res-marker span{display:grid;place-items:center;width:22px;height:22px;border-radius:7px;background:#10151de8;border:1px solid #39424e;font-size:12px;font-weight:900;text-shadow:0 1px 3px #000}.res-marker .money{color:#f0c34c}.res-marker .material{color:#52dfb0}.res-marker .reputation{color:#e9b8ff}.building-marker{background:transparent!important;border:0!important;text-align:center}.building-marker span{display:block;font-size:27px;line-height:27px;filter:drop-shadow(0 2px 4px #000)}.building-marker b{display:block;background:#080d13e8;border:1px solid #36404b;border-radius:7px;padding:2px 5px;font-size:7px;white-space:nowrap}.player-marker{background:transparent!important;border:0!important}.player-marker::before{content:'';display:block;width:16px;height:16px;margin:4px;border-radius:50%;background:#5ab0ff;border:3px solid #fff;box-shadow:0 0 0 6px #3a95ff44,0 0 18px #3a95ff}.toast{position:absolute;left:50%;bottom:170px;transform:translate(-50%,20px);z-index:80;opacity:0;pointer-events:none;background:#151b24;border:1px solid #3b4654;border-radius:11px;padding:10px 14px;color:#fff;font-size:11px;font-weight:800;transition:.2s}.toast.show{opacity:1;transform:translate(-50%,0)}.toast.error{border-color:#8b3b35;color:#ff9a91}@media(max-width:430px){.mf-hud{padding-left:50px;padding-right:5px;gap:3px;min-height:74px}.mf-stat small{font-size:8px;letter-spacing:1px}.mf-stat b{font-size:18px;line-height:23px}.mf-stat em{font-size:6px}.mf-menu{left:8px;top:12px;width:34px;height:34px}}@media(min-width:700px){.mf-drawer{left:auto;width:460px;right:18px;bottom:100px;max-height:78vh}.mf-bottom{left:50%;right:auto;width:min(720px,calc(100% - 24px));transform:translateX(-50%)}.mf-legend{left:18px}.mf-hud{padding-left:62px;padding-right:22px}}
/* MAFIVERA V1 — fullscreen menu layer: map/HUD/nav stay unchanged */
.mf-drawer{position:absolute;inset:7px;left:7px;right:7px;top:7px;bottom:7px;width:auto;max-height:none;z-index:60;overflow:auto;padding:20px;background:#10151efc;border-radius:24px;box-shadow:0 25px 90px #000e;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.mf-drawer .drawer-head{position:sticky;top:-20px;z-index:5;padding:14px 0 16px;margin:-20px 0 16px;background:linear-gradient(#10151eff 72%,#10151ecc 88%,transparent);align-items:center}.mf-drawer .drawer-head h2{font-size:28px;line-height:1.15}.mf-drawer .drawer-head small{font-size:10px}.mf-drawer .close-btn{width:50px;height:50px;min-width:50px;font-size:31px;line-height:1;cursor:pointer}.mf-drawer .hero{padding:18px;gap:16px}.mf-drawer .hero-icon{font-size:38px}.mf-drawer .hero b{font-size:21px}.mf-drawer .hero p{font-size:14px}.mf-drawer .statgrid{gap:10px;margin:14px 0}.mf-drawer .statgrid>div{padding:15px 8px}.mf-drawer .statgrid b{font-size:21px}.mf-drawer .statgrid small{font-size:11px}.mf-drawer .action{padding:17px 18px;margin:6px 0;font-size:16px;border-radius:15px;min-height:54px}.mf-drawer .hint{padding:14px;font-size:13px;line-height:1.5}.mf-drawer .list{gap:9px}.mf-drawer .row,.mf-drawer .rankrow,.mf-drawer .build-option{padding:15px;font-size:15px;border-radius:14px}.mf-drawer .row small,.mf-drawer .rankrow small,.mf-drawer .build-option small{font-size:11px}.mf-drawer .mini{padding:10px 13px;font-size:13px}.mf-drawer .build-option>span{font-size:32px;width:44px}.mf-drawer .build-option b{font-size:16px}.mf-drawer .territory-head h3{font-size:26px}.mf-drawer .badge{font-size:9px;padding:6px 9px}.mf-drawer .building-card{padding:15px}.mf-drawer .building-card>span{font-size:36px}.mf-drawer .building-card small{font-size:11px}.mf-drawer .production-card{padding:17px;border-radius:17px}.mf-drawer .production-card h3{font-size:20px}.mf-drawer .production-card #productionStatus{padding:13px}.mf-drawer .production-card #productionStatus b{font-size:15px}.mf-drawer .production-card #productionStatus small,.mf-drawer .production-card>small{font-size:11px}.mf-drawer .production-row{grid-template-columns:minmax(110px,160px) 1fr;gap:9px}.mf-drawer .production-row input{height:50px;font-size:18px}.mf-drawer .social-block{margin-top:18px}.mf-drawer .social-block h3{font-size:17px}.mf-drawer .tabs>*{padding:12px 15px;font-size:14px}
@media(max-width:600px){.mf-drawer{inset:6px;padding:18px;border-radius:22px}.mf-drawer .drawer-head{top:-18px;padding:12px 0 14px;margin:-18px 0 14px}.mf-drawer .drawer-head h2{font-size:25px}.mf-drawer .close-btn{width:48px;height:48px;min-width:48px;font-size:30px}.mf-drawer .action{font-size:15px;padding:16px}.mf-drawer .statgrid{grid-template-columns:repeat(3,1fr)}.mf-drawer .statgrid b{font-size:18px}.mf-drawer .statgrid small{font-size:10px}.mf-drawer .row,.mf-drawer .rankrow,.mf-drawer .build-option{padding:14px}.mf-bottom{z-index:40}}
@media(min-width:700px){.mf-drawer{inset:18px}.mf-drawer .drawer-head h2{font-size:30px}.mf-drawer .action{font-size:17px}}
/* MAFIVERA V1.1 – mobile readability: clear, modern, not oversized */
@media(max-width:600px){
  .mf-app .mf-hud{min-height:82px!important;padding-top:9px!important;padding-bottom:14px!important}
  .mf-app .mf-stat small{font-size:10px!important;line-height:12px!important;letter-spacing:.7px!important}
  .mf-app .mf-stat b{font-size:22px!important;line-height:25px!important}
  .mf-app .mf-stat em{font-size:8px!important;line-height:10px!important;letter-spacing:.2px!important}
  .mf-app .mf-menu{width:38px!important;height:38px!important;font-size:20px!important}
  .mf-app .mf-event{font-size:13px!important;padding:8px 15px!important;letter-spacing:.4px!important}
  .mf-app .mf-legend{font-size:11px!important;line-height:1.35!important;padding:9px 11px!important}
  .mf-app .mf-legend div{margin:4px 0!important}
  .mf-app .mf-bottom{height:72px!important;padding:6px!important;border-radius:24px!important}
  .mf-app .bottom-btn{height:60px!important;gap:3px!important}
  .mf-app .bottom-btn span{font-size:21px!important;line-height:23px!important}
  .mf-app .bottom-btn small{font-size:10px!important;line-height:12px!important;letter-spacing:.35px!important}
  .mf-app .res-marker span{font-size:13px!important;width:24px!important;height:24px!important}
  .mf-app .building-marker b{font-size:9px!important;padding:3px 5px!important}
  .mf-app .toast{font-size:13px!important}
}
@media(max-width:380px){
  .mf-app .mf-stat small{font-size:9px!important}
  .mf-app .mf-stat b{font-size:20px!important}
  .mf-app .mf-stat em{font-size:7px!important}
  .mf-app .bottom-btn small{font-size:9px!important}
}

/* MAFIVERA V3 – standalone/PWA visual parity
   Keep the installed standalone game visually identical to the normal mobile browser view. */
@media (display-mode: standalone), (display-mode: fullscreen){
  .mf-app .mf-hud{
    min-height:58px!important;
    padding:6px 7px 9px 45px!important;
    gap:3px!important;
  }
  .mf-app .mf-menu{
    left:7px!important;
    top:9px!important;
    width:38px!important;
    height:38px!important;
    font-size:20px!important;
  }
  .mf-app .mf-stat small{font-size:8px!important;line-height:10px!important;letter-spacing:.8px!important}
  .mf-app .mf-stat b{font-size:17px!important;line-height:19px!important}
  .mf-app .mf-stat em{font-size:6px!important;line-height:8px!important}
  .mf-app .mf-event{
    top:57px!important;
    font-size:10px!important;
    padding:5px 11px!important;
    border-radius:20px!important;
  }
  .mf-app .mf-legend{
    left:8px!important;
    top:92px!important;
    padding:6px 8px!important;
    font-size:8px!important;
    line-height:1.25!important;
    border-radius:9px!important;
  }
  .mf-app .mf-legend div{margin:3px 0!important}
  .mf-app .mf-bottom{
    left:50%!important;
    right:auto!important;
    bottom:max(7px,env(safe-area-inset-bottom))!important;
    width:min(520px,calc(100% - 18px))!important;
    height:58px!important;
    transform:translateX(-50%)!important;
    border-radius:21px!important;
    padding:4px!important;
  }
  .mf-app .bottom-btn{
    height:48px!important;
    gap:1px!important;
    border-radius:15px!important;
  }
  .mf-app .bottom-btn span{font-size:17px!important;line-height:19px!important}
  .mf-app .bottom-btn small{font-size:7px!important;line-height:9px!important;letter-spacing:.3px!important}
  .mf-map .leaflet-marker-icon.res-marker{
    width:24px!important;height:24px!important;
  }
  .mf-map .leaflet-marker-icon.res-marker span{
    width:20px!important;height:20px!important;margin:2px!important;
    font-size:12px!important;line-height:20px!important;
  }
  .mf-map .leaflet-marker-icon.building-marker{
    width:70px!important;height:40px!important;
  }
  .mf-map .leaflet-marker-icon.building-marker span{font-size:22px!important;line-height:22px!important}
  .mf-map .leaflet-marker-icon.building-marker b{font-size:6px!important;line-height:8px!important;padding:1px 4px!important}
  .mf-map .leaflet-marker-icon.dealer-marker{
    width:70px!important;height:42px!important;
  }
  .mf-map .leaflet-marker-icon.dealer-marker span,
  .mf-map .leaflet-marker-icon.dealer-marker .dealer-pin{
    font-size:23px!important;line-height:23px!important;
  }
  .mf-map .leaflet-marker-icon.dealer-marker b,
  .mf-map .leaflet-marker-icon.dealer-marker .dealer-label{
    font-size:7px!important;line-height:9px!important;padding:2px 5px!important;
  }
  .mf-app .mtrw-map-tools{
    top:157px!important;
    right:7px!important;
  }
  .mf-app .mtrw-recenter{
    width:42px!important;height:42px!important;
    border-radius:13px!important;font-size:25px!important;
  }
}
