/* Bebi Karta Zagreb — one-column app: header, filters, map, list; sheets slide up from the bottom */
:root{
  --bg:#EEF3F6; --surface:#FFFFFF; --ink:#1B2631; --muted:#5A6A77; --line:#D7E0E6;
  --accent:#1F5FA8; --accent-ink:#FFFFFF; --accent-soft:#DCE8F6;
  --star:#E2A21B; --danger:#B4372E; --ok:#2F7D4A;
  --c-changing:#2E7FC4; --c-playarea:#E07A2E; --c-playground:#3E9B4F; --c-nosmoke:#8A5A9E; --c-nursing:#D45886; --c-stroller:#4E7F87;
  --display:"Baloo 2","Trebuchet MS",system-ui,sans-serif;
  --body:"Atkinson Hyperlegible",system-ui,-apple-system,"Segoe UI",sans-serif;
  --r:14px;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){:root{
  --bg:#111A21; --surface:#1A252E; --ink:#E6EDF2; --muted:#9AAAB6; --line:#2B3843;
  --accent:#6FA8E8; --accent-ink:#0E1820; --accent-soft:#1F3247;
  --star:#F0B83A; --danger:#E5776D; --ok:#6CC28A; color-scheme:dark}}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg)}
body{color:var(--ink);font-family:var(--body);font-size:15px;line-height:1.45;padding-top:env(safe-area-inset-top,0px)}
.wrap{max-width:960px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-block:14px 110px;display:flex;flex-direction:column;gap:12px}
header{display:flex;align-items:center;gap:12px;justify-content:space-between;flex-wrap:wrap}
h1{font-family:var(--display);font-size:1.7rem;line-height:1;margin:0;letter-spacing:-.01em}
h1 small{display:block;font-family:var(--body);font-size:.8rem;font-weight:400;color:var(--muted);margin-top:4px}
.headr{display:flex;gap:8px;align-items:center}
.lang{display:flex;border:1px solid var(--line);border-radius:999px;overflow:hidden}
.lang button{border:0;background:transparent;color:var(--muted);font:700 .8rem var(--body);padding:6px 11px;cursor:pointer}
.lang button[aria-pressed="true"]{background:var(--accent);color:var(--accent-ink)}
.search input,select{width:100%;min-width:0;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;padding:10px 16px;font:inherit}
select{width:auto;padding:7px 14px;font-size:.85rem;font-weight:700}
.chips{display:flex;gap:8px;overflow-x:auto;padding-bottom:2px;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chip{flex:none;display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;padding:7px 12px;font:700 .85rem var(--body);cursor:pointer;white-space:nowrap}
.chip .dot,.dot{width:9px;height:9px;border-radius:50%;background:var(--c);flex:none}
.chip[aria-pressed="true"]{background:var(--c,var(--accent));border-color:var(--c,var(--accent));color:#fff}
.chip[aria-pressed="true"] .dot{background:#fff}
.mapbox{position:relative;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;height:min(56vh,480px)}
#map{width:100%;height:100%;background:var(--surface)}
.leaflet-container{font-family:var(--body)}
.pickbar{position:absolute;left:10px;right:10px;top:10px;z-index:500;background:var(--accent);color:var(--accent-ink);border-radius:10px;padding:8px 12px;font-weight:700;font-size:.85rem;display:flex;justify-content:space-between;gap:8px;align-items:center}
.pickbar button{background:transparent;border:1px solid currentColor;color:inherit;border-radius:8px;padding:3px 8px;font:inherit;cursor:pointer}
.listhead{display:flex;justify-content:space-between;align-items:baseline}
.listhead h2{font-family:var(--display);font-size:1.15rem;margin:0}
.count{color:var(--muted);font-size:.85rem;font-variant-numeric:tabular-nums}
.list{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.item{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:start;padding:12px 2px;border:0;border-bottom:1px solid var(--line);cursor:pointer;background:none;text-align:left;color:inherit;font:inherit;width:100%}
.item:hover{background:var(--surface)}
.item .swatch{width:12px;height:12px;border-radius:50%;margin-top:5px;background:var(--c)}
.item .name{font-weight:700}
.meta{color:var(--muted);font-size:.83rem}
.tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:5px}
.tag{font-size:.72rem;font-weight:700;padding:2px 8px;border-radius:999px;color:var(--c);background:color-mix(in srgb,var(--c) 14%,transparent)}
.rating{font-size:.83rem;color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums}
.rating b{color:var(--star)}
.empty{padding:28px 12px;text-align:center;color:var(--muted);border:1px dashed var(--line);border-radius:var(--r)}
.empty strong{display:block;color:var(--ink);font-family:var(--display);font-size:1.1rem;margin-bottom:4px}
.note{font-size:.8rem;color:var(--muted);margin:0}
.foot{text-align:center}
.fab{position:fixed;z-index:600;right:max(18px,calc(env(safe-area-inset-right,0px) + 18px));bottom:calc(env(safe-area-inset-bottom,0px) + 18px);background:var(--accent);color:var(--accent-ink);border:0;border-radius:999px;padding:13px 20px;font:700 .95rem var(--body);box-shadow:0 6px 18px rgba(20,40,60,.25);cursor:pointer}
.scrim{position:fixed;inset:0;z-index:1000;background:rgba(10,20,30,.42);display:flex;align-items:flex-end;justify-content:center}
.sheet{background:var(--surface);color:var(--ink);width:100%;max-width:640px;max-height:90vh;overflow-y:auto;border-radius:20px 20px 0 0;padding-block:18px calc(24px + env(safe-area-inset-bottom,0px));padding-left:max(18px,env(safe-area-inset-left,0px));padding-right:max(18px,env(safe-area-inset-right,0px));display:flex;flex-direction:column;gap:14px}
.sheet h3{font-family:var(--display);font-size:1.4rem;margin:0;line-height:1.1}
.sheethead{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.x{border:0;background:var(--bg);color:var(--ink);width:34px;height:34px;border-radius:50%;font-size:1.1rem;cursor:pointer;flex:none}
.btn{border:0;background:var(--accent);color:var(--accent-ink);border-radius:10px;padding:10px 16px;font:700 .9rem var(--body);cursor:pointer}
.btn.ghost{background:var(--accent-soft);color:var(--ink)}
.btn.small{padding:6px 12px;font-size:.8rem;border-radius:999px}
.btn:disabled{opacity:.5;cursor:default}
.row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
a.link{color:var(--accent);font-weight:700;text-decoration:none}
.f{display:flex;flex-direction:column;gap:6px;font-weight:700;font-size:.85rem}
.f input,.f textarea{font:inherit;font-weight:400;border:1px solid var(--line);border-radius:10px;padding:9px 11px;background:var(--bg);color:var(--ink);min-width:0;width:100%}
textarea{resize:vertical;min-height:70px}
.found{background:var(--bg);border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:8px}
.found .ok{color:var(--ok);font-weight:700;font-size:.85rem}
.checks{display:flex;flex-wrap:wrap;gap:8px}
.checks label{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:999px;padding:6px 11px;font-size:.85rem;font-weight:400;cursor:pointer}
.checks input{accent-color:var(--accent)}
.err{color:var(--danger);font-size:.85rem;font-weight:700;margin:0}
.stars{display:flex;gap:2px}
.stars button{border:0;background:none;font-size:1.7rem;line-height:1;color:var(--line);cursor:pointer;padding:0 2px}
.stars button.on{color:var(--star)}
.review{border-top:1px solid var(--line);padding-top:10px;display:flex;flex-direction:column;gap:6px}
.photos{display:flex;gap:8px;overflow-x:auto}
.photos img{height:120px;width:auto;border-radius:10px;object-fit:cover;background:var(--bg)}
.sec{font-family:var(--display);font-size:1.05rem;margin:4px 0 0}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(env(safe-area-inset-bottom,0px) + 80px);z-index:1100;background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:999px;font-weight:700;font-size:.9rem}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media (prefers-reduced-motion:no-preference){.sheet{animation:up .22s ease-out}@keyframes up{from{transform:translateY(24px);opacity:.6}}}
h1 .city{color:var(--accent)}