:root{--bg:#0A0C12;--card:#12151D;--card2:#181C27;--ink:#E8EAF2;--mut:#8B93A7;--line:#232838;--acc:#7C83FF;--L:#F5A524;--R:#38BDF8;--M:#34D399;--land:#1E2432;--sea:#0E1118;color-scheme:dark;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px)}
@media(prefers-color-scheme:light){:root:not([data-theme="dark"]){--bg:#F5F6FA;--card:#fff;--card2:#F1F3F9;--ink:#0F172A;--mut:#64748B;--line:#E2E6EF;--acc:#5B63F0;--L:#D97706;--R:#0284C7;--M:#059669;--land:#DCE2EE;--sea:#EDF1F8;color-scheme:light}}
:root[data-theme="light"]{--bg:#F5F6FA;--card:#fff;--card2:#F1F3F9;--ink:#0F172A;--mut:#64748B;--line:#E2E6EF;--acc:#5B63F0;--L:#D97706;--R:#0284C7;--M:#059669;--land:#DCE2EE;--sea:#EDF1F8;color-scheme:light}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
html,body{margin:0;background:var(--bg);color:var(--ink);font:500 1rem/1.55 'Manrope',system-ui,sans-serif}
body{min-height:100%;padding-bottom:calc(100px + env(safe-area-inset-bottom,0px));background:radial-gradient(900px 420px at 85% -80px,color-mix(in srgb,var(--acc) 20%,transparent),transparent),var(--bg)}
h1,h2,h3{margin:0;font-weight:800;letter-spacing:-.025em;line-height:1.15}
button{font:inherit;color:inherit;cursor:pointer}
button:focus-visible,input:focus-visible,a:focus-visible{outline:2px solid var(--acc);outline-offset:3px}
.flag{font-family:'Noto Color Emoji','Apple Color Emoji','Segoe UI Emoji',sans-serif}
.mut{color:var(--mut)}
a{color:var(--acc);font-weight:700}
header{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;display:flex;align-items:center;justify-content:space-between;padding:12px 20px;background:color-mix(in srgb,var(--bg) 78%,transparent);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.brand{font-size:1.1rem;font-weight:800;letter-spacing:-.02em}
.pill{border:1px solid var(--line);background:var(--card);border-radius:99px;padding:4px 12px;font-weight:700;font-size:.85rem;color:var(--mut)}
main{max-width:920px;margin:0 auto;padding:20px 16px}
.view{display:none}.view.on{display:block}
.box{background:var(--card);border:1px solid var(--line);border-radius:20px}
.hero{padding:28px 24px;margin-bottom:22px;background:linear-gradient(135deg,color-mix(in srgb,var(--acc) 26%,transparent),color-mix(in srgb,var(--R) 8%,transparent) 65%,transparent),var(--card)}
.hero h1{font-size:clamp(1.9rem,5.5vw,3rem);max-width:14em}
.hero p{margin:12px 0 20px;color:var(--mut);max-width:32em}
.btn{border:1px solid var(--line);border-radius:12px;padding:10px 16px;font-weight:700;background:var(--card2);transition:border-color .15s,transform .1s}
.btn:hover{border-color:var(--acc)}.btn:active{transform:scale(.97)}
.btn.go{background:var(--acc);border-color:var(--acc);color:#fff}
.btn.on{background:var(--M);border-color:var(--M);color:#05241a}
.btn:disabled{opacity:.5;cursor:not-allowed}
input[type=search],.fld{width:100%;padding:12px 16px;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--ink);font:inherit;font-weight:600;margin-bottom:12px}
.fld{margin:6px 0 12px}
input::placeholder{color:var(--mut)}
.chips{display:flex;gap:8px;overflow-x:auto;padding:2px 2px 12px}
.chip{border:1px solid var(--line);background:var(--card);border-radius:10px;padding:7px 14px;font-weight:700;white-space:nowrap;color:var(--mut)}
.chip.on{background:color-mix(in srgb,var(--acc) 20%,transparent);border-color:var(--acc);color:var(--ink)}
.cont{font-size:1.1rem;margin:26px 0 12px;color:var(--mut);font-weight:700}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}
.cc{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:16px;text-align:left;background:var(--card);border:1px solid var(--line);border-radius:18px;transition:transform .15s,border-color .15s}
.cc:hover{transform:translateY(-2px);border-color:var(--acc)}
.cc .flag{font-size:2.3rem;line-height:1.1}.cc b{font-size:1.02rem;font-weight:800}
.cc .ic{font-size:.85rem;font-weight:700;color:var(--mut);display:flex;gap:10px}
.cc .star{position:absolute;top:12px;right:14px}
.mapbox{overflow-x:auto;background:var(--sea)}
.mapbox svg{display:block;width:max(100%,900px);height:auto}
.legend{display:flex;gap:18px;flex-wrap:wrap;margin-top:14px;font-weight:700;color:var(--mut);font-size:.9rem}
.dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px}
nav{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(12px + env(safe-area-inset-bottom,0px));z-index:20;width:min(480px,calc(100% - 24px));display:flex;justify-content:space-around;padding:6px;border:1px solid var(--line);border-radius:20px;background:color-mix(in srgb,var(--card) 80%,transparent);backdrop-filter:blur(16px);box-shadow:0 12px 40px rgba(0,0,0,.35)}
nav button{background:none;border:0;display:flex;flex-direction:column;align-items:center;padding:6px 10px;border-radius:14px;color:var(--mut);font-weight:700;font-size:.72rem;flex:1}
nav button.on{background:color-mix(in srgb,var(--acc) 20%,transparent);color:var(--ink)}
nav .ni{font-size:1.25rem}
#sheet{position:fixed;inset:0;z-index:40;display:none;align-items:flex-end;justify-content:center;background:rgba(3,5,12,.65);backdrop-filter:blur(4px)}
#sheet.on{display:flex}
.sh{width:100%;max-width:620px;max-height:90vh;overflow:auto;background:var(--card);border:1px solid var(--line);border-bottom:0;border-radius:24px 24px 0 0;padding:22px 20px calc(24px + env(safe-area-inset-bottom,0px));animation:up .22s ease-out}
@media(min-width:700px){#sheet{align-items:center}.sh{border-bottom:1px solid var(--line);border-radius:24px}}
@keyframes up{from{transform:translateY(24px);opacity:0}}
.top{display:flex;align-items:center;gap:14px;margin-bottom:6px}.top .flag{font-size:3.2rem;line-height:1}.top h2{font-size:1.7rem}
.x{margin-left:auto;align-self:flex-start;width:40px;height:40px;border-radius:12px;padding:0}
.grp{font-size:.95rem;margin:20px 0 8px;color:var(--mut)}
.it{display:block;width:100%;text-align:left;padding:12px 14px;margin-bottom:8px;background:var(--card2);border:1px solid var(--line);border-left-width:4px;border-radius:14px}
.it .nm{display:flex;justify-content:space-between;gap:8px;font-weight:800}
.it small{display:block;font-size:.88rem;font-weight:600;color:var(--mut)}
.more{margin-top:10px;padding-top:10px;border-top:1px solid var(--line);font-weight:500}
.more .btn{font-size:.88rem;padding:7px 12px;margin:6px 6px 0 0}
.big{font-size:3rem;line-height:1}.center{text-align:center}.panel{padding:24px 20px}
.opt{display:block;width:100%;text-align:left;margin-bottom:8px;padding:13px 16px;border-radius:14px;border:1px solid var(--line);background:var(--card2);font-weight:700}
.opt:not(:disabled):hover{border-color:var(--acc)}
.opt.ok{background:color-mix(in srgb,var(--M) 22%,var(--card));border-color:var(--M)}
.opt.no{background:color-mix(in srgb,var(--L) 22%,var(--card));border-color:var(--L)}
.bar{height:6px;border-radius:99px;background:var(--line);overflow:hidden;margin:10px 0 18px}.bar i{display:block;height:100%;background:var(--acc)}
.h2{font-size:1.7rem;margin-bottom:6px}
.lbl{display:block;font-weight:700;margin:10px 0 2px}
.keyrow{display:flex;gap:10px;align-items:flex-start}.keyrow .btn{margin-top:6px}
.note{padding:12px 16px;margin-bottom:16px;border-color:var(--acc);background:color-mix(in srgb,var(--acc) 12%,var(--card));font-weight:700}
.lnk{background:none;border:0;padding:0;font-weight:800;text-decoration:underline;color:var(--acc)}
.msg{margin:12px 0 0;padding:10px 14px;border-radius:12px;font-weight:700;border:1px solid}
.msg.err{border-color:var(--L);background:color-mix(in srgb,var(--L) 14%,var(--card))}
.msg.ok{border-color:var(--M);background:color-mix(in srgb,var(--M) 14%,var(--card))}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.cc.empty{background:transparent;border-style:dashed}.cc.empty .flag{opacity:.8}
nav{width:min(540px,calc(100% - 24px))}nav button{padding:6px 2px;font-size:.66rem}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px}.stat{padding:14px;display:flex;flex-direction:column;gap:2px}.stat b{font-size:1.5rem;letter-spacing:-.02em}
.badges{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}.bdg{padding:14px;display:flex;flex-direction:column;gap:2px}.bdg .bi{font-size:1.8rem}.bdg small{color:var(--mut);font-weight:600}.bdg.lock{opacity:.4;filter:grayscale(1)}
.crow{display:grid;grid-template-columns:110px 1fr auto;gap:10px;align-items:center;margin:8px 0;font-weight:700;font-size:.9rem}
#toast{position:fixed;left:50%;bottom:calc(96px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:60;background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:12px;font-weight:700;max-width:90%;text-align:center;opacity:0;pointer-events:none;transition:opacity .2s}#toast.on{opacity:1}

/* roomier layout + place pages */
main{padding:28px 18px}
.hero{padding:34px 28px;margin-bottom:28px}
.grid{gap:16px}.cc{padding:22px 18px;gap:6px}
.cont{margin:40px 0 16px}
.chips{padding-bottom:18px}
.sh{padding:24px 22px calc(28px + env(safe-area-inset-bottom,0px))}
.grp{font-size:1rem;margin:28px 0 12px}
.pc{display:flex;gap:14px;align-items:center;width:100%;text-align:left;padding:16px;margin-bottom:14px;background:var(--card2);border:1px solid var(--line);border-radius:18px;transition:border-color .15s}
.pc:hover{border-color:var(--c)}
.pi{flex:none;width:54px;height:54px;border-radius:16px;display:grid;place-items:center;font-size:1.7rem;background:color-mix(in srgb,var(--c) 18%,transparent)}
.pm{flex:1;display:flex;flex-direction:column;gap:3px;min-width:0}.pm b{font-size:1.08rem;font-weight:800}.pm small{color:var(--c);font-weight:800;font-size:.85rem}.pf{color:var(--mut);font-size:.92rem;line-height:1.45}
.pr{font-size:1.4rem;color:var(--mut)}
.nav2{display:flex;justify-content:space-between}.nav2 .x{margin-left:0;align-self:auto}
.ph{display:flex;gap:16px;align-items:center;padding:22px 20px;border-radius:20px;margin:14px 0 16px;background:linear-gradient(135deg,color-mix(in srgb,var(--c) 28%,transparent),transparent),var(--card2);border:1px solid var(--line)}
.pe{font-size:3.2rem;line-height:1}.pt{font-weight:800;color:var(--mut);font-size:.88rem;margin-bottom:4px}.ph h2{font-size:1.8rem}
.facts{display:flex;gap:8px;flex-wrap:wrap}.fchip{padding:6px 12px;border-radius:99px;background:var(--card2);border:1px solid var(--line);font-weight:700;font-size:.88rem}
.sec{margin:22px 0}.sec h3{font-size:1.05rem;margin-bottom:8px}.sec p{margin:0;font-size:1.08rem;line-height:1.7}
.sec.why{padding:18px;border-radius:18px;background:color-mix(in srgb,var(--acc) 12%,var(--card));border:1px solid color-mix(in srgb,var(--acc) 40%,var(--line))}
.acts{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}

/* admin panel */
.admsec{margin-top:18px}
.arow{display:flex;align-items:center;gap:12px;padding:14px 0;border-top:1px solid var(--line)}
.arow:first-child{border-top:0}.arow .flag{font-size:1.7rem}
.am{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.am small{color:var(--mut);font-weight:600;overflow-wrap:anywhere}
.arow .btn{padding:7px 11px;font-size:.88rem}
.av{flex:none;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--acc) 22%,transparent);font-weight:800}
.crw{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:12px 4px;background:none;border:0;border-top:1px solid var(--line)}
.crw:hover{background:color-mix(in srgb,var(--acc) 8%,transparent)}.crw .flag{font-size:1.7rem}
.cn{display:flex;gap:12px;font-size:.88rem;font-weight:700;white-space:nowrap}.cn .z{opacity:.35}
.glist{max-height:62vh;overflow:auto}

/* Leaflet maps */
.lmap{position:relative;z-index:0;isolation:isolate;height:min(68vh,640px);min-height:380px;border:1px solid var(--line);border-radius:20px;overflow:hidden;background:var(--sea);font-family:inherit}
.lmap.mini{height:220px;min-height:0;border-radius:16px}
.leaflet-tile-pane{filter:invert(1) hue-rotate(180deg) brightness(.95) contrast(.9)}
@media(prefers-color-scheme:light){:root:not([data-theme="dark"]) .leaflet-tile-pane{filter:none}}
:root[data-theme="light"] .leaflet-tile-pane{filter:none}
.pinw{background:none;border:0}
.pin{width:30px;height:30px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:var(--c);display:grid;place-items:center;border:2px solid #fff;box-shadow:0 2px 6px rgba(0,0,0,.45)}
.pin span{transform:rotate(45deg);font-size:14px;line-height:1}
.pin.seen{border-color:#FFD54A}.pin.sel{transform:rotate(-45deg) scale(1.35);box-shadow:0 0 0 4px color-mix(in srgb,var(--c) 40%,transparent)}
.leaflet-container a{color:var(--acc)}
