@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{--bg:#0a1018;--panel:#101923;--panel-2:#16222d;--text:#f3f7f2;--sub:#9aadb6;--muted:#71838e;--line:rgba(217,246,227,.11);--accent:#b9f36e;--accent-2:#5cd9ae;--shadow:0 24px 70px #05090e8c;--radius:22px;--top:72px;--nav:76px}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;width:100%;height:100%;background:var(--bg);color:var(--text);font-family:'DM Sans',system-ui,-apple-system,sans-serif;overscroll-behavior:none}button,input,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.5;cursor:not-allowed}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:3px}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-thumb{background:#40505c;border-radius:4px}.hidden{display:none!important}
.app-shell{height:100vh;height:100dvh;display:flex;flex-direction:column;overflow:hidden;position:relative}.topbar{height:var(--top);flex-shrink:0;background:rgba(10,16,24,.97);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 27px;z-index:25}.brand{display:flex;align-items:center;gap:12px;background:none;border:0;color:inherit;text-align:left;padding:0}.brand-icon{width:39px;height:39px;background:linear-gradient(135deg,#d1fa91,#6ddaa8);color:#101c19;display:grid;place-items:center;border-radius:13px;box-shadow:0 8px 22px #b9f36e22}.brand-icon svg{width:24px;height:24px}.brand-words{display:flex;flex-direction:column;gap:1px}.brand-words strong{font:700 24px/1 'Space Grotesk',sans-serif;letter-spacing:-1px}.brand-words strong span{color:var(--accent)}.brand-words small{font-size:9px;font-weight:800;letter-spacing:2.4px;color:#748c95}.brand-words b{color:var(--accent)}.topbar-actions{display:flex;align-items:center;gap:16px}.demo-label{font-size:10px;letter-spacing:1.7px;font-weight:800;color:#9cbaac;display:flex;align-items:center;gap:9px}.online-dot{display:inline-block;width:7px;height:7px;background:var(--accent);border-radius:50%;box-shadow:0 0 0 5px #b9f36e14,0 0 14px #b9f36e99}.language-button{min-width:50px;height:37px;background:var(--panel-2);border:1px solid var(--line);border-radius:11px;color:#edf9ed;font-size:12px;font-weight:800;letter-spacing:1.5px}.language-button:hover{border-color:var(--accent)}
.main-layout{display:grid;grid-template-columns:minmax(0,1fr) 415px;flex:1;min-height:0;overflow:hidden}.map-stage{position:relative;overflow:hidden;background:radial-gradient(circle at 45% 50%,#294752,#172a37 60%,#111f2b);isolation:isolate}.map-stage #map{position:absolute;inset:0;z-index:1}.map-vignette{position:absolute;inset:0;pointer-events:none;z-index:2;background:linear-gradient(180deg,rgba(9,18,25,.37),transparent 30%,transparent 65%,rgba(8,17,23,.35));}.map-top-left{position:absolute;left:38px;top:35px;z-index:3;pointer-events:none;text-shadow:0 2px 24px #0008}.chip{display:inline-flex;align-items:center;gap:9px;background:rgba(12,24,32,.88);border:1px solid rgba(229,255,229,.11);border-radius:20px;padding:10px 12px;letter-spacing:2px;font-size:9px;font-weight:800;color:#d6f0d5;backdrop-filter:blur(12px)}.live-pulse{display:block;width:7px;height:7px;background:#b8ed68;border-radius:50%;box-shadow:0 0 10px #b8ed68}.map-title{font:700 clamp(34px,4vw,62px)/1.06 'Space Grotesk',sans-serif;letter-spacing:-2.5px;margin-top:17px;color:#fff}.map-title em{font-style:normal;color:var(--accent)}.map-subtitle{color:#f6fdfa;font-size:14px;font-weight:600;letter-spacing:.1px;opacity:.94;margin-top:13px}.map-top-right{position:absolute;right:24px;top:27px;z-index:4;display:flex;align-items:center;gap:8px}.country-group{padding:4px;background:rgba(13,23,30,.92);border:1px solid rgba(229,255,229,.14);border-radius:13px;backdrop-filter:blur(18px);display:flex;gap:3px;box-shadow:0 10px 25px #0004}.city-button{display:flex;align-items:center;gap:6px;color:#c8d4d7;border:0;background:transparent;padding:9px 11px;border-radius:9px;font-weight:800;letter-spacing:1px;font-size:11px}.city-button.active{background:var(--accent);color:#10251f}.flag{font-size:16px}.map-round,.map-control{height:43px;width:43px;display:grid;place-items:center;color:#eaf7e9;border:1px solid rgba(229,255,229,.13);border-radius:13px;background:rgba(13,23,30,.93);backdrop-filter:blur(16px);box-shadow:0 10px 24px #0005}.map-round svg{width:19px;height:19px}.map-round:hover,.map-control:hover{color:var(--accent);border-color:var(--accent)}.map-bottom-left{position:absolute;bottom:25px;left:28px;z-index:4;background:rgba(12,25,32,.91);padding:12px 17px;border-radius:14px;border:1px solid rgba(229,255,229,.14);display:flex;align-items:center;gap:10px;backdrop-filter:blur(16px)}.map-point{width:10px;height:10px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 5px #b9f36e22}.map-bottom-left strong{display:block;font-size:13px}.map-bottom-left small{display:block;color:#9eada9;font-size:10px;margin-top:3px}.map-right-controls{position:absolute;right:22px;bottom:27px;z-index:4;display:flex;flex-direction:column;gap:7px}.map-control{font-size:24px;font-weight:400;width:42px;height:42px}.map-attribution-extra{position:absolute;bottom:6px;left:29px;color:#eef5e8;font-size:9px;text-shadow:0 1px 4px #000;font-weight:700;z-index:3;opacity:.7}.draw-hint{position:absolute;left:50%;top:46%;transform:translateX(-50%);z-index:8;background:#0e1b25f5;padding:13px 17px;border:1px solid #d2ffa84f;box-shadow:0 12px 45px #0007;border-radius:15px;display:flex;gap:10px;align-items:center;min-width:max-content;font-size:12px;font-weight:700}.draw-hint span:first-child{color:var(--accent);font-size:21px}.map-fallback{position:absolute;inset:0;z-index:6;background:linear-gradient(135deg,#132b39,#06121d);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;padding:30px;text-align:center}.map-fallback>span{color:var(--accent);font-size:65px}.map-fallback small{color:var(--sub)}.small-primary{background:var(--accent);border:0;border-radius:10px;color:#14221e;padding:10px 18px;font-weight:800}.player-marker{width:41px;height:41px;display:grid;place-items:center;background:#101d27;border-radius:50%;border:3px solid var(--accent);box-shadow:0 0 0 6px #b9f36e3d,0 9px 26px #091018b5;color:#edf8e9;font-weight:800;font-size:11px}.player-marker.enemy{border-color:#fd886e;box-shadow:0 0 0 6px #fd886e42,0 9px 26px #091018b5}.player-marker.ping{border-color:#ffb96d;box-shadow:0 0 0 9px #ffb96d32;animation:pingGlow 1s infinite alternate}.player-marker.user{background:#6bdfbe;color:#102319;border-color:#fff}.maplibregl-popup-content{background:#121d27!important;border-radius:14px!important;color:#eef8ef!important;padding:10px 14px!important;box-shadow:0 12px 30px #07121b99!important;font-family:'DM Sans',sans-serif!important;font-size:12px}.maplibregl-popup-tip{border-top-color:#121d27!important}.maplibregl-ctrl-attrib{background:#ffffffd9!important;font-size:8px!important}.maplibregl-ctrl-bottom-right{bottom:2px!important}.maplibregl-ctrl-bottom-left{bottom:3px!important}
.dashboard{background:#0e1620;border-left:1px solid var(--line);height:100%;display:flex;flex-direction:column;min-height:0;position:relative;z-index:5}.dashboard-scroll{height:auto;flex:1 1 0%;min-height:0;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;touch-action:pan-y;overscroll-behavior-y:contain;padding:34px 30px 38px;scrollbar-width:thin;scrollbar-color:#32414d transparent}.panel-head{margin-bottom:27px}.panel-kicker{display:flex;align-items:center;gap:9px;color:var(--accent);letter-spacing:2.1px;font-size:10px;font-weight:800;margin-bottom:15px}.tiny-line{display:inline-block;width:21px;height:2px;background:var(--accent)}.panel-head h1{font:700 32px/1.12 'Space Grotesk',sans-serif;letter-spacing:-1.3px;margin:0 0 11px;max-width:350px}.panel-head p{color:#95a6ad;font-size:13px;line-height:1.65;margin:0;max-width:350px}.panel-bottom-note{display:flex;gap:10px;margin-top:32px;padding-top:21px;border-top:1px solid var(--line);font-size:11px;color:#72858e;line-height:1.7}.note-icon{font-size:15px;color:#9ab9ad}
.hero-card{border:1px solid #b9f36e2e;background:radial-gradient(circle at 80% 10%,#2f4a39 0%,transparent 43%),linear-gradient(135deg,#1e332e,#162430 70%);border-radius:21px;padding:24px 22px 23px;position:relative;overflow:hidden;margin-bottom:22px}.hero-card:before{content:'◉';position:absolute;right:-10px;bottom:-55px;font-size:205px;color:#b9f36e0e;font-family:sans-serif;pointer-events:none}.eyebrow{font-size:10px;font-weight:800;color:var(--accent);letter-spacing:2.3px;display:block;margin-bottom:15px}.hero-card h2{font:700 27px/1.09 'Space Grotesk',sans-serif;letter-spacing:-1px;max-width:280px;margin:0 0 12px}.hero-card p{color:#b0c9be;line-height:1.6;font-size:12px;margin:0 0 23px;max-width:250px}.btn{border:0;display:flex;align-items:center;justify-content:center;gap:9px;border-radius:12px;padding:14px 16px;font-size:13px;line-height:1.25;font-weight:800;transition:transform .15s,background .15s}.btn:hover{transform:translateY(-1px)}.btn svg{width:17px;height:17px;flex-shrink:0}.btn-primary{background:var(--accent);color:#112016;box-shadow:0 8px 24px #aef05c20}.btn-primary:hover{background:#ceff96}.btn-outline{background:var(--panel-2);border:1px solid #a2baae30;color:#e5f4e9}.btn-outline:hover{border-color:var(--accent)}.btn-warning{background:#362321;color:#ffb8a5}.btn-full{width:100%}.btn-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.section-kicker{font-weight:800;color:#879ca5;font-size:10px;letter-spacing:1.75px;margin:25px 0 13px}.feature-grid{display:grid;grid-template-columns:1fr;gap:10px}.feature-row{display:flex;align-items:center;gap:13px;background:#151f2a;border:1px solid var(--line);border-radius:14px;padding:14px}.feature-ico{width:41px;height:41px;flex-shrink:0;display:grid;place-items:center;background:#b9f36e13;color:var(--accent);border-radius:13px}.feature-ico svg{width:21px;height:21px}.feature-row strong{font-size:12px;display:block}.feature-row small{font-size:11px;color:#8fa2ab;display:block;line-height:1.6;margin-top:3px}.status-strip{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}.micro-pill{display:flex;gap:6px;align-items:center;border:1px solid #b9f36e2e;border-radius:9px;background:#b9f36e0a;color:#b4d1bd;font-size:10px;font-weight:700;padding:9px 10px}.micro-pill svg{width:13px;height:13px;color:var(--accent)}
.field{display:flex;flex-direction:column;gap:9px;margin-bottom:17px}.field label{font-size:10px;color:#99acb4;font-weight:800;letter-spacing:1.3px;text-transform:uppercase}.field input,.field select{width:100%;border:1px solid #2c3a42;background:#17242e;border-radius:12px;color:#ecf7ed;padding:14px;font-size:13px;outline:none;appearance:none}.field input:focus,.field select:focus{border-color:var(--accent)}.field input::placeholder{color:#536974}.field select{background-image:url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%23a8bec0" stroke-width="2"%3E%3Cpath d="m6 9 6 6 6-6"/%3E%3C/svg%3E');background-size:18px;background-repeat:no-repeat;background-position:right 13px center}.toggle-pair{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:21px}.toggle-choice,.seg-choice{padding:14px 12px;text-align:center;border:1px solid #293940;color:#9cb0b5;background:#16222c;border-radius:12px;font-size:12px;font-weight:800}.toggle-choice.active,.seg-choice.active{background:#b9f36e13;color:var(--accent);border-color:#b9f36e8a}.control-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.control-grid>div{min-width:0}.stats-card{border-radius:16px;padding:18px;border:1px solid #b9f36e33;background:linear-gradient(140deg,#20362c,#14252d);margin-bottom:15px}.stats-card .stat-label{letter-spacing:1.7px;font-size:10px;font-weight:800;color:#a4c7b3}.stats-card .stat-value{font:700 31px 'Space Grotesk',sans-serif;color:var(--accent);letter-spacing:-1px;margin-top:6px}.stats-card p{font-size:12px;color:#9bb8b5}.code-card{display:flex;align-items:center;justify-content:space-between;gap:8px;background:#1b2932;border:1px dashed #b9f36e66;border-radius:14px;padding:13px 15px;margin:12px 0 16px}.code-card strong{font:700 26px 'Space Grotesk',sans-serif;letter-spacing:4px;color:#e7ffc8}.code-card span{font-size:9px;color:#92a7ac;letter-spacing:1.5px}.tiny-btn{background:#b9f36e16;color:#b9f36e;border:1px solid #b9f36e35;border-radius:9px;padding:10px;font-size:11px;font-weight:800}.notice{font-size:11px;line-height:1.7;color:#99adb5;background:#192630;border:1px solid #2a3c45;border-radius:12px;padding:13px;margin:16px 0}.notice strong{color:var(--accent)}.row-between{display:flex;justify-content:space-between;align-items:center;gap:10px}.player-list{display:flex;flex-direction:column;gap:9px}.player-list-row{display:flex;align-items:center;gap:11px;border:1px solid var(--line);border-radius:13px;padding:11px;background:#15212b}.avatar{width:35px;height:35px;border-radius:12px;display:grid;place-items:center;background:#e7a17928;color:#ffb38a;font-size:12px;font-weight:800}.player-list-row strong{font-size:12px}.player-list-row small{display:block;color:#8098a1;font-size:10px;margin-top:3px}.active-label{color:var(--accent);background:#b9f36e1a;border-radius:6px;padding:5px 7px;font-size:9px;font-weight:800}
.step-box{background:#15232b;border:1px solid var(--line);border-radius:15px;padding:15px;margin:14px 0}.step-box p{color:#95a8af;font-size:11px;line-height:1.7;margin:0}.step-box strong{color:#e0f6da}.slider-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:17px 0 8px}.slider-row strong{font:700 25px 'Space Grotesk',sans-serif;color:var(--accent)}input[type='range']{accent-color:var(--accent);width:100%;margin-bottom:20px}.point-counter{font-size:11px;color:#aabdb5;margin-top:5px}.coin-card{padding:18px 19px;border-radius:18px;background:radial-gradient(circle at 90% 15%,#47633255,transparent 40%),linear-gradient(130deg,#263d32,#162931);border:1px solid #a7da743b;margin-bottom:19px}.coin-total{display:flex;gap:12px;align-items:center;margin:6px 0 17px}.coin-symbol{background:#baf272;color:#1d301e;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:26px;box-shadow:0 0 0 4px #b9f36e17}.coin-total strong{font:700 33px 'Space Grotesk',sans-serif;letter-spacing:-1px}.coin-total small{font-size:12px;color:#b1c9b7}.item-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.item-card{border:1px solid var(--line);border-radius:16px;padding:15px;background:#16222c;min-height:193px;display:flex;flex-direction:column}.item-symbol{height:42px;width:42px;border-radius:13px;background:color-mix(in srgb,var(--item-color) 14%,transparent);color:var(--item-color);display:grid;place-items:center;margin-bottom:13px}.item-symbol svg{width:23px;height:23px}.item-card h3{font:700 13px 'Space Grotesk',sans-serif;margin:0 0 7px}.item-card p{font-size:10px;line-height:1.52;color:#90a5ad;margin:0 0 13px;flex:1}.item-card .btn{padding:10px 8px;font-size:11px}.item-quantity{font-size:10px;color:#a3c7a7;font-weight:700}.item-foot{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:8px}.price{color:#d7f2af;font-size:11px;font-weight:800}.mini-tag{font-size:10px;color:#a7c6ad;font-weight:700}.timer-strip{border:1px solid #b9f36e55;background:#b9f36e12;color:#c9fca1;border-radius:12px;padding:12px;display:flex;align-items:center;justify-content:space-between;font-size:11px;font-weight:800;margin-bottom:13px;gap:8px}.timer-strip strong{font:700 20px 'Space Grotesk',sans-serif}.language-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.language-option{display:flex;gap:9px;align-items:center;text-align:left;padding:12px;color:#ccd8d6;border:1px solid #2c3a42;background:#182530;border-radius:12px;font-size:12px;font-weight:800}.language-option.active{border-color:var(--accent);color:var(--accent);background:#b9f36e12}.language-option span{font-size:19px}.separator{height:1px;background:var(--line);margin:22px 0}.bottom-nav{height:var(--nav);flex-shrink:0;display:flex;background:#0e1720;border-top:1px solid #21303c;padding:7px max(12px, env(safe-area-inset-right)) calc(5px + env(safe-area-inset-bottom));z-index:30;box-shadow:0 -12px 35px #07101844;justify-content:space-evenly;gap:6px}.nav-link{min-width:0;flex:1;max-width:160px;background:none;border:0;color:#738b92;border-radius:12px;display:flex;justify-content:center;align-items:center;flex-direction:column;gap:4px;font-size:10px;font-weight:800}.nav-link.active{background:#b9f36e12;color:var(--accent)}.nav-icon{height:22px}.nav-icon svg{height:22px;width:22px}.toast{position:fixed;bottom:calc(var(--nav) + 17px);left:50%;transform:translate(-50%,15px);background:#b9f36e;color:#13231d;font-weight:800;font-size:12px;padding:12px 17px;border-radius:11px;box-shadow:0 12px 30px #0008;z-index:80;opacity:0;visibility:hidden;transition:.22s;max-width:min(460px,90vw);text-align:center;line-height:1.4}.toast.show{opacity:1;visibility:visible;transform:translate(-50%,0)}.dialog-backdrop{position:fixed;inset:0;z-index:90;background:#03090fd9;display:grid;place-items:center;padding:18px;backdrop-filter:blur(7px)}.dialog{position:relative;width:min(420px,95vw);max-height:calc(100dvh - 36px);overflow-y:auto;-webkit-overflow-scrolling:touch;touch-action:pan-y;background:#121e28;border:1px solid #385044;border-radius:22px;box-shadow:var(--shadow);padding:28px}.dialog-close{position:absolute;right:14px;top:9px;border:0;background:transparent;color:#9eb4b4;font-size:30px}.dialog h2{font:700 25px 'Space Grotesk',sans-serif;margin:0 25px 12px 0}.dialog p{color:#a9bcbc;font-size:13px;line-height:1.7}.dialog .field{margin-top:16px}.dialog .btn{margin-top:12px}.dialog strong{color:var(--accent)}@keyframes pingGlow{to{box-shadow:0 0 0 18px #ffb96d09}}
@media (min-width:1400px){.main-layout{grid-template-columns:minmax(0,1fr) 445px}.dashboard-scroll{padding:40px 36px}.feature-grid{grid-template-columns:1fr}.map-top-left{left:57px;top:51px}.map-bottom-left{left:46px}}
@media (max-width:880px){:root{--top:63px;--nav:72px}.topbar{padding:0 16px}.brand-icon{width:35px;height:35px;border-radius:11px}.brand-words strong{font-size:21px}.demo-label{font-size:9px}.main-layout{display:block;position:relative}.map-stage{position:absolute;inset:0}.dashboard{position:absolute;right:0;bottom:0;width:100%;height:56%;min-height:0;border:1px solid #31414a;border-bottom:0;border-radius:24px 24px 0 0;background:#101923f5;backdrop-filter:blur(21px);box-shadow:0 -10px 35px #0008;transition:height .22s}.dashboard::before{content:'';position:absolute;top:9px;left:50%;transform:translateX(-50%);width:40px;height:4px;background:#536572;border-radius:10px}.dashboard-scroll{padding:28px 20px 26px}.panel-head{margin-bottom:21px}.panel-head h1{font-size:26px}.panel-head p{font-size:12px}.map-top-left{left:17px;top:21px}.map-title{font-size:35px;letter-spacing:-1.5px;margin-top:12px}.map-subtitle{font-size:11px;margin-top:8px}.chip{padding:8px 10px;font-size:8px}.map-top-right{right:12px;top:14px;display:block}.country-group{gap:0;padding:3px}.city-button{padding:9px 8px;font-size:10px;gap:4px}.city-button .flag{font-size:13px}.map-round{margin-left:auto;margin-top:8px;height:40px;width:40px}.map-bottom-left{bottom:calc(56% + 9px);left:15px;padding:9px 12px;max-width:200px}.map-right-controls{bottom:calc(56% + 9px);right:13px}.map-attribution-extra{display:none}.feature-grid{grid-template-columns:1fr}.hero-card{padding:19px 18px}.hero-card h2{font-size:24px}.hero-card p{font-size:11px;margin-bottom:16px}.hero-card:before{font-size:150px;right:-3px;bottom:-32px}.panel-bottom-note{margin-top:20px}.maplibregl-ctrl-bottom-right{bottom:calc(56% + 0px)!important}.draw-hint{top:26%;max-width:90vw;min-width:0;font-size:11px;padding:10px}}
@media (max-width:420px){.demo-label{font-size:0;gap:0}.online-dot{width:8px;height:8px}.topbar-actions{gap:12px}.brand-words small{letter-spacing:1.7px}.map-title{font-size:31px}.map-top-right{top:17px}.city-button{padding:7px;font-size:9px}.city-button .flag{font-size:12px}.country-group{max-width:165px}.map-subtitle{max-width:225px}.dashboard{height:58%}.map-bottom-left,.map-right-controls{bottom:calc(58% + 8px)}.maplibregl-ctrl-bottom-right{bottom:calc(58% + 0px)!important}.dashboard-scroll{padding:27px 17px 26px}.item-card{min-height:205px}.panel-head h1{font-size:24px}}
@media (max-height:740px) and (max-width:880px){.dashboard{height:62%}.map-bottom-left,.map-right-controls{bottom:calc(62% + 8px)}.maplibregl-ctrl-bottom-right{bottom:62%!important}.map-title{font-size:27px}.map-subtitle{display:none}}

/* HUNTZONE 0.3 — interactive map sheet, shrinking zone, emoji/photo avatars */
.sheet-handle-row{display:none}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.shape-choice{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-bottom:13px}
.shape-choice .toggle-choice{border-radius:11px;padding:10px 5px;font-size:11px;min-width:0}
.check-row{display:flex;gap:10px;align-items:center;margin:18px 0 13px;font-size:12px;color:#d8e9e0;font-weight:700}
.check-row input{width:20px;height:20px;accent-color:var(--accent)}
.zone-live-card{display:flex;justify-content:space-between;flex-wrap:wrap;align-items:center;gap:9px;background:#24372c;border:1px solid #b9f36e55;border-radius:13px;padding:13px;margin:12px 0;color:#d5f6c4;font-size:12px;font-weight:700}
.zone-live-card strong{font:700 25px 'Space Grotesk',sans-serif;color:var(--accent)}
.zone-live-card small{width:100%;color:#bfd7c3}
.emoji-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;margin:10px 0 15px}
.emoji-choice{height:40px;display:grid;place-items:center;background:#1a2a31;border:1px solid #38504d;border-radius:10px;font-size:22px;padding:0}
.emoji-choice.active{border:2px solid var(--accent);background:#bbec7520}
.avatar-preview{display:flex;align-items:center;gap:12px;margin-top:14px;font-size:14px;font-weight:800}
.avatar-preview>.avatar-emoji,.avatar-preview>.avatar-photo{width:64px;height:64px;border-radius:50%;background:#273e38;display:grid;place-items:center;font-size:33px;object-fit:cover;border:2px solid #b9f36e}
.avatar-photo{width:100%;height:100%;object-fit:cover;display:block;border-radius:inherit}
.avatar-emoji{font-size:22px}
.player-list-row .avatar{overflow:hidden;font-size:22px;flex-shrink:0;border-radius:50%}
.player-list-row .avatar .avatar-emoji{font-size:22px}
.player-bubble{display:flex;align-items:center;flex-direction:column;gap:2px;filter:drop-shadow(0 2px 7px #0009);cursor:pointer}
.player-bubble-face{width:39px;height:39px;border-radius:50%;display:grid;place-items:center;font-size:22px;background:#18292d;border:3px solid #b8f56d;box-shadow:0 0 0 2px #0c1a19;overflow:hidden}
.player-bubble.user .player-bubble-face{border-color:#82c9ff}
.player-bubble-name{font-size:10px;font-weight:800;white-space:nowrap;background:#0d1d23f0;padding:3px 6px;border-radius:8px;border:1px solid #42584b;color:white;max-width:120px;overflow:hidden;text-overflow:ellipsis}
.player-bubble.ping .player-bubble-face{box-shadow:0 0 0 4px #ff944987,0 0 15px #ff944999}
@media(max-width:880px){
 .dashboard{height:var(--sheet-height,56%)!important;transition:height .23s ease;display:flex;flex-direction:column;padding-top:25px}
 .sheet-handle-row{position:absolute;z-index:20;top:0;left:0;right:0;height:29px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;touch-action:none}
 .sheet-handle{border:0;background:transparent;min-width:62px;height:29px;display:flex;align-items:center;justify-content:center;touch-action:none}
 .sheet-handle span{width:48px;height:5px;background:#8396a2;border-radius:4px}
 .map-peek{background:#b9f36e1c;border:1px solid #b9f36e44;color:var(--accent);font-size:11px;font-weight:800;border-radius:10px;padding:5px 9px}
 .map-bottom-left,.map-right-controls{bottom:calc(var(--sheet-height,56%) + 9px)!important;transition:bottom .23s ease}
 .maplibregl-ctrl-bottom-right{bottom:var(--sheet-height,56%)!important}
 .dashboard-scroll{padding-top:10px!important;overflow-y:auto!important;touch-action:pan-y}
 .dashboard[data-sheet='collapsed'] .panel-head{margin-bottom:6px}
 .dashboard[data-sheet='collapsed'] .panel-head p{display:none}
 .dashboard[data-sheet='collapsed'] .panel-head h1{font-size:18px}
 .map-top-left{max-width:55%}
 .map-title{font-size:clamp(23px,6vw,36px)}
}

@media(max-width:880px){.dashboard::before{display:none}}

/* HUNTZONE 0.4 — always-available safety rules and pre-game acknowledgment */
.safety-header{width:36px;height:37px;display:grid;place-items:center;background:#342823;border:1px solid #ab794e88;color:#ffd79b;font-size:17px;border-radius:10px;flex-shrink:0}
.safety-header:hover{background:#513429;border-color:#ffd79b}
.safety-strip{display:flex;align-items:center;gap:8px;background:#352c22;border:1px solid #f4b66c50;color:#f7d4aa;border-radius:12px;padding:12px 13px;margin:12px 0;font-size:11px;line-height:1.45;font-weight:700}
.safety-strip span{flex:1}.safety-strip button{font-size:19px;color:#ffe4b7;border:0;background:transparent;min-width:30px;height:32px}
.safety-link{margin:10px 0}
.safety-modal-head h2{margin:10px 18px 8px 0!important}.safety-modal-head p{margin:0 0 10px}
.safety-badge{display:inline-block;border:1px solid #f4b66c4d;background:#e3994217;color:#ffcf93;border-radius:999px;padding:7px 11px;font-size:10px;letter-spacing:1px;font-weight:800}
.safety-list{padding:0;margin:15px 0 15px 23px;color:#d9e7e3;font-size:12px;line-height:1.6}.safety-list li{padding-left:4px;margin:9px 0}.safety-list li::marker{color:#ffd08f;font-weight:800}
.dialog .safety-legal{font-size:11px;color:#d8dbd1;background:#21312c;border:1px solid #4b6351;border-radius:12px;padding:11px 12px;line-height:1.6}
.dialog .safety-review{font-size:10px;color:#94a8a4;line-height:1.5;margin-bottom:18px}
.safety-accept{display:flex;align-items:flex-start;gap:11px;background:#253a31;border:1px solid #6e9b63;border-radius:12px;padding:12px;margin:15px 0;color:#efffdf;font-weight:800;font-size:12px;line-height:1.55;cursor:pointer}
.safety-accept input{appearance:auto;flex-shrink:0;margin-top:2px;accent-color:#b9f36e;width:21px;height:21px}
.dialog #safety-proceed:disabled{opacity:.43}
@media(max-width:420px){.safety-header{width:32px;height:34px}.topbar-actions{gap:8px}}

/* v0.5: pre-game Yes/No rules gate and low-battery safety notice. */
.start-flow{text-align:center;padding-top:9px}.start-flow-icon{width:70px;height:70px;border-radius:21px;background:#314033;border:1px solid #93b56c66;display:grid;place-items:center;font-size:34px;margin:0 auto 17px}.start-flow-icon.battery{background:#203c31}
.start-flow h2{margin:14px 0 12px!important;font-size:clamp(22px,6vw,27px)!important;line-height:1.23}.start-flow>p{font-size:13px;line-height:1.65;margin:0 0 18px;color:#c4d1ca}
.start-choice-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0 14px}.start-choice-row .btn{min-height:51px;font-size:15px;margin-top:0}
.start-flow-note{font-size:11px;line-height:1.55;text-align:left;background:#233229;border:1px solid #52745960;border-radius:12px;color:#b8cdbb;padding:11px 13px;margin:16px 0 8px}
.quick-safety-list{list-style:none;padding:0;margin:13px 0;display:grid;gap:8px;text-align:left}.quick-safety-list li{border:1px solid #304a40;background:#182b28;display:flex;align-items:flex-start;gap:10px;padding:10px 11px;border-radius:12px;color:#e3f0e7;font-size:11.5px;line-height:1.45}.quick-safety-bullet{display:flex;width:20px;height:20px;border-radius:50%;background:#b9f36e24;color:#b9f36e;align-items:center;justify-content:center;flex:0 0 auto;font-weight:800}
.battery-help{background:#233b35;border:1px solid #668d5f80;border-radius:13px;padding:14px;font-size:12px;color:#e0f3de;line-height:1.6;text-align:left;margin:16px 0 17px}
@media(max-width:390px){.start-flow-icon{width:58px;height:58px;font-size:29px;margin-bottom:10px}.start-flow h2{font-size:22px!important}.quick-safety-list li{font-size:11px;padding:9px 10px}.start-choice-row .btn{padding:11px 8px}}
/* Compact safety overview on short phones; the modal also supports touch scrolling. */
@media(max-height:740px) and (max-width:460px){
 .dialog{padding:19px 18px}
 .start-flow{padding-top:0}
 .start-flow h2{font-size:21px!important;margin:9px 0 7px!important}
 .start-flow>p{margin:0 0 9px;font-size:11.5px;line-height:1.45}
 .quick-safety-list{gap:5px;margin:8px 0}
 .quick-safety-list li{font-size:10.3px;line-height:1.32;padding:7px 9px}
 .quick-safety-bullet{width:18px;height:18px}
 .start-flow-note{margin:8px 0 6px;padding:9px 10px;font-size:10.3px}
 .start-flow .btn{padding:12px 10px}
}


/* v0.7: zone phase banner / out of zone countdown / border reminder */
.zone-phase-status{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#1b342e;border:1px solid #47775e;color:#ddf9dd;border-radius:12px;padding:12px 13px;margin:10px 0;font-size:11px;line-height:1.4}
.zone-phase-status strong{font-size:12px}.zone-phase-status span{font-variant-numeric:tabular-nums;font-weight:800;color:#b9f36e}
.zone-phase-status.shrink{background:#352d21;border-color:#c48a4f;color:#ffddab}.zone-phase-status.shrink span{color:#ffe49c}
.hz-zone-alert{display:grid;gap:6px;padding:14px;margin:10px 0;border-radius:12px;background:#423021;border:2px solid #d6a352;color:#ffdfb0;font-size:13px;line-height:1.45}
.hz-zone-alert strong{font-size:14px}.hz-zone-alert span{font-weight:900;font-variant-numeric:tabular-nums;font-size:16px}
.hz-zone-alert small{font-size:11px}.hz-zone-alert.urgent,.hz-zone-alert.eliminated{border-color:#ff7a70;background:#542726;color:#ffe0df}
.hz-zone-alert.info{background:#22343c;color:#b9d9e6;border-color:#578ba2}
.match-country-note{font-size:11px;background:#2b2d2e;border:1px solid #806748;border-radius:10px;color:#ffddb4;line-height:1.5;padding:10px 12px;margin:9px 0 12px}
.zone-map-badge{position:absolute;z-index:12;left:50%;bottom:142px;transform:translateX(-50%);display:flex;align-items:center;gap:8px;white-space:nowrap;border:1px solid #a6dd75;background:#102821e8;border-radius:999px;box-shadow:0 6px 22px #0007;color:#e9fdd4;padding:9px 12px;font-size:11px;pointer-events:none;font-variant-numeric:tabular-nums}
.zone-map-badge.hidden{display:none}.zone-map-badge strong{color:#b7f56f}
.country-rules-shortcut{position:absolute;z-index:13;right:15px;top:188px;background:#33271cf2;color:#ffdbab;border:1px solid #daa97188;border-radius:12px;height:36px;width:36px;font-size:21px}
@media(max-width:880px){.zone-map-badge{bottom:170px;max-width:calc(100vw - 25px)}.country-rules-shortcut{top:170px}}

/* v0.8: Duration-based play radius and selectable meeting point. */
.meeting-card{padding:16px 14px;margin:16px 0;border:1px solid rgba(167,235,108,.26);border-radius:18px;background:rgba(157,228,116,.055)}
.meeting-card-title{display:flex;align-items:center;gap:10px;font-size:15px;color:#d7f3b8}
.meeting-card-title svg{width:19px;height:19px;flex:none}
.meeting-card p{margin:9px 0 12px;color:#c0ccd2;line-height:1.55;font-size:13px}
.meeting-summary{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;color:#e6edeb;font-size:12px}
.meeting-summary span{background:#19272c;padding:9px 10px;border-radius:10px}
.meeting-actions{display:flex;gap:9px;margin-top:13px;flex-wrap:wrap}
.meeting-actions .btn{min-width:0;flex:1 1 125px;padding:11px 9px;font-size:12px}
.meeting-card .notice{margin-top:12px;font-size:12px}
.meeting-marker{background:#16231d;border:2px solid #bbf66e;border-radius:50%;box-shadow:0 2px 11px #081013a8;color:#fff;width:40px;height:40px;display:flex;align-items:center;justify-content:center;font-size:22px;pointer-events:auto}

/* v0.9 MOBILE REPAIR: always leave a real map viewport, and allow touch scrolling */
@media (max-width:880px) {
  html,body{height:100%;overflow:hidden;overscroll-behavior:none}
  .app-shell{height:100vh;height:100dvh;min-height:0;overflow:hidden}
  .main-layout{position:relative;display:block;flex:1 1 auto;min-height:0;overflow:hidden}
  .map-stage{position:absolute;inset:0;width:100%;height:100%;min-height:0;z-index:1}
  .dashboard{
    position:absolute;left:0;right:0;bottom:0;z-index:8;
    height:var(--sheet-height,54%)!important;min-height:0;max-height:82%;
    display:flex;flex-direction:column;overflow:hidden;
    touch-action:auto;
  }
  .sheet-handle-row{position:relative;top:auto;left:auto;right:auto;flex:0 0 40px;height:40px;
    min-height:40px;pointer-events:auto;touch-action:manipulation;z-index:11;}
  .sheet-handle{height:36px;touch-action:pan-y}
  .map-peek{min-height:32px;min-width:125px;touch-action:manipulation}
  .dashboard-scroll{
    display:block;flex:1 1 auto;min-height:0;max-height:none;height:0;
    overflow-x:hidden;overflow-y:scroll!important;
    -webkit-overflow-scrolling:touch;touch-action:pan-y;
    overscroll-behavior-y:contain;
    padding:14px 19px calc(38px + env(safe-area-inset-bottom,0px))!important;
    scrollbar-width:thin;
  }
  .map-bottom-left,.map-right-controls{bottom:calc(var(--sheet-height,54%) + 12px)!important}
  .maplibregl-ctrl-bottom-right{bottom:var(--sheet-height,54%)!important}
  .zone-map-badge{bottom:calc(var(--sheet-height,54%) + 74px)!important}
}
@media(max-width:420px){.dashboard-scroll{padding-left:16px!important;padding-right:16px!important}}
@media(max-width:880px) and (max-height:580px){
  .dashboard{max-height:83%}
  .dashboard-scroll{padding-top:9px!important}
}
.city-area-hint{margin:9px 0 0!important;padding:8px 10px;border-radius:9px;background:#22312f;
 font-size:11px!important;line-height:1.5!important;color:#c9d9cf!important}
.city-area-hint strong{color:#d8ffb8}

/* v1.0: Mobile layout rebuilt with normal flex columns. No overlapping map/sheet. */
@media (max-width:880px) {
  html, body { height:100%; overflow:hidden; }
  .app-shell { height:100dvh; min-height:0; overflow:hidden; }
  .main-layout { position:relative; flex:1 1 auto; min-height:0; overflow:hidden;
    display:flex !important; flex-direction:column !important; }
  .map-stage {position:relative !important; inset:auto !important; z-index:1;
    flex:0 0 42%; width:100%; min-height:170px; height:auto !important; }
  .dashboard {position:relative !important; inset:auto !important; z-index:2;
    flex:1 1 auto; width:100%; height:auto !important; min-height:0; max-height:none;
    overflow:hidden; display:flex; flex-direction:column;
    border-radius:20px 20px 0 0; backdrop-filter:none; padding:0 !important;
    transition:none !important; }
  .sheet-handle-row { position:relative; inset:auto; display:flex;
    align-items:center; justify-content:space-between; flex:0 0 45px;
    height:45px; min-height:45px; padding:2px 17px 0;
    pointer-events:auto; touch-action:manipulation; z-index:5; }
  .sheet-handle { height:39px; min-width:64px; touch-action:manipulation; }
  .map-peek {height:36px; font-size:12px; padding:7px 11px; touch-action:manipulation; }
  .dashboard-scroll { display:block; flex:1 1 auto; min-height:0; height:auto !important;
    max-height:none; overflow-y:auto !important; overflow-x:hidden;
    -webkit-overflow-scrolling:touch; touch-action:pan-y; overscroll-behavior:contain;
    padding:15px 18px 48px !important; }
  .map-bottom-left {bottom:15px !important;left:12px;max-width:65%;}
  .map-right-controls {bottom:15px !important;right:12px;}
  .maplibregl-ctrl-bottom-right {bottom:0 !important;}
  .zone-map-badge {bottom:71px !important;}
  .map-top-left {top:12px;left:13px;}
  .map-title {font-size:clamp(22px,5.7vw,31px);margin-top:8px;}
  .map-subtitle {display:none;}
  .map-top-right {top:12px;right:10px;}
  .country-rules-shortcut {top:112px;right:12px;}
  .main-layout[data-sheet='collapsed'] .map-stage {flex:1 1 auto;}
  .main-layout[data-sheet='collapsed'] .dashboard {flex:0 0 46px;}
  .main-layout[data-sheet='collapsed'] .dashboard-scroll {display:none !important;}
  .main-layout[data-sheet='expanded'] .map-stage {flex:0 0 24%; min-height:125px;}
  .main-layout[data-sheet='expanded'] .dashboard {flex:1 1 auto;}
  .map-vignette {pointer-events:none;}
}
@media (max-width:880px) and (max-height:670px) {
  .map-stage {min-height:135px;flex-basis:38%;}
  .main-layout[data-sheet='expanded'] .map-stage {min-height:100px;flex-basis:20%;}
}