/* ---------- Twoje odkryte kraje ---------- */
:root{--eu:#3b82f6;--as:#ef4565;--af:#f59e0b;--na:#22c55e;--sa:#06b6d4;--oc:#a855f7}
.kraje{display:grid;grid-template-columns:minmax(0,1fr) 340px;height:100vh}
.mapwrap{--m-bg:#f7f8f8;--m-land:#e6e9ea;--m-stroke:#ffffff;--m-hover:#d3d9db;--m-ui:#ffffff;--m-ink:#10283a;--m-muted:#6b7b87;--m-line:#e3e8ea;
  position:relative;background:var(--m-bg);overflow:hidden;min-width:0;transition:background .25s}
.mapwrap[data-mode="dark"]{--m-bg:#0f1c26;--m-land:#253744;--m-stroke:#0f1c26;--m-hover:#33495a;--m-ui:#1a2a36;--m-ink:#e8f0f3;--m-muted:#93a6b3;--m-line:#2c3f4c}
.mapwrap svg.world{position:absolute;inset:0;width:100%;height:100%;display:block;cursor:grab;overflow:visible}
.mapwrap svg.world:active{cursor:grabbing}
.land{fill:var(--m-land);stroke:var(--m-stroke);stroke-width:.6;vector-effect:non-scaling-stroke;transition:fill .2s}
.land.ok{cursor:pointer}
.land.ok:hover{fill:var(--m-hover)}
.land.v{fill:var(--c)}
.land.v:hover{fill:var(--c);filter:brightness(1.08)}
.land.sel{stroke:var(--m-ink);stroke-width:1.6}
.tiny{fill:var(--m-land);stroke:var(--m-muted);stroke-width:1;vector-effect:non-scaling-stroke;cursor:pointer}
.tiny.v{fill:var(--c);stroke:#fff}
.city{fill:#fff;stroke:var(--c);stroke-width:1.8;vector-effect:non-scaling-stroke;pointer-events:none}
.mtop{position:absolute;top:14px;left:16px;right:16px;display:flex;justify-content:center;gap:10px;align-items:center;z-index:2;pointer-events:none}
.mtop>*{pointer-events:auto;min-width:0}
.legend{display:flex;align-items:center;gap:12px;background:var(--m-ui);color:var(--m-ink);border:1px solid var(--m-line);border-radius:20px;padding:6px 14px;font-size:11px;box-shadow:0 2px 10px rgba(16,40,58,.06);white-space:nowrap;overflow-x:auto;scrollbar-width:none;font-variant-numeric:tabular-nums}
.legend::-webkit-scrollbar{display:none}
.legend span{display:flex;align-items:center;gap:5px}
.legend i{width:8px;height:8px;border-radius:2px;background:var(--c)}
.legend em{font-style:normal;color:var(--m-muted);padding-left:6px;border-left:1px solid var(--m-line)}
.mode{display:flex;background:var(--m-ui);border:1px solid var(--m-line);border-radius:20px;padding:3px;flex:none}
.mode button{font-size:11px;padding:5px 12px;border-radius:16px;color:var(--m-muted)}
.mode button.on{background:var(--m-ink);color:var(--m-bg);font-weight:600}
.zoom{position:absolute;right:16px;bottom:16px;display:flex;flex-direction:column;background:var(--m-ui);border:1px solid var(--m-line);border-radius:12px;overflow:hidden;z-index:2}
.zoom button{width:36px;height:36px;font-size:18px;color:var(--m-ink)}
.zoom button+button{border-top:1px solid var(--m-line)}
.hint{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);background:var(--m-ui);color:var(--m-muted);border:1px solid var(--m-line);font-size:11px;padding:7px 14px;border-radius:20px;z-index:2;white-space:nowrap}
.pop-over{position:absolute;z-index:4;background:var(--card);color:var(--ink);border-radius:14px;box-shadow:0 12px 34px rgba(16,40,58,.22);padding:14px;width:230px;transform:translate(-50%,calc(-100% - 14px))}
.pop-over::after{content:"";position:absolute;left:50%;bottom:-6px;width:12px;height:12px;background:var(--card);transform:translateX(-50%) rotate(45deg)}
.pop-over .h{display:flex;gap:10px;align-items:center}
.pop-over .h b{font-size:14px;display:block;line-height:1.2}
.pop-over .h small{font-size:11px;color:var(--muted)}
.pop-over .st{font-size:11px;color:var(--muted);margin:10px 0 12px}
.pop-over .x{position:absolute;top:8px;right:10px;color:var(--muted);font-size:16px;line-height:1}
.pop-over .act{display:flex;gap:8px}
.btn{flex:1;font-size:12px;font-weight:600;padding:9px 10px;border-radius:10px;background:var(--teal);color:#fff;transition:background .15s}
.btn:hover{background:var(--teal-d)}
.btn.ghost{background:var(--card);color:#c2374f;border:1px solid #f1c9d1}
.btn.ghost:hover{background:var(--danger-bg)}
.flag{font-family:"Noto Color Emoji","Apple Color Emoji","Segoe UI Emoji",sans-serif;font-size:20px;line-height:1;flex:none;width:26px;text-align:center}

.kpanel{background:var(--card);border-left:1px solid var(--line);display:flex;flex-direction:column;min-height:0}
.kp-head{padding:18px 18px 12px;display:flex;flex-direction:column;gap:12px;border-bottom:1px solid var(--line)}
.ktabs{display:grid;grid-template-columns:1fr 1fr;background:var(--soft);border-radius:10px;padding:3px}
.ktabs button{font-size:12px;padding:8px;border-radius:8px;color:var(--muted)}
.ktabs button.on{background:var(--card);color:var(--ink);font-weight:600;box-shadow:0 1px 4px rgba(16,40,58,.08)}
.ksearch{display:flex;align-items:center;gap:10px;background:var(--soft);border:1px solid var(--line);border-radius:10px;padding:0 12px;height:40px;color:var(--muted)}
.ksearch input{border:0;outline:0;background:none;width:100%;font-size:12.5px;color:var(--ink)}
.ksearch svg{width:16px;height:16px}
.kp-body{flex:1;overflow-y:auto;padding:4px 18px 24px}
.lbl{font-size:10px;font-weight:700;letter-spacing:.9px;color:var(--muted);text-transform:uppercase;margin:18px 0 8px}
.big{font-size:52px;font-weight:800;line-height:1;letter-spacing:-1.5px;font-variant-numeric:tabular-nums}
.big span{font-size:20px;color:var(--muted);font-weight:500;letter-spacing:0}
.seg{display:flex;height:6px;border-radius:6px;background:var(--soft2);overflow:hidden;margin:12px 0 10px}
.seg i{background:var(--c);height:100%}
.trio{display:flex;justify-content:space-between;font-size:11.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.trio b{color:var(--ink)}
.conts{display:flex;flex-direction:column;gap:6px}
.crow{position:relative;display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;background:var(--soft);overflow:hidden;font-size:12px;text-align:left;width:100%}
.crow::before{content:"";position:absolute;inset:0 auto 0 0;width:var(--p);background:var(--c);opacity:.16}
.crow>*{position:relative}
.crow i{width:8px;height:8px;border-radius:50%;background:var(--c)}
.crow b{font-weight:600}
.crow span{margin-left:auto;font-variant-numeric:tabular-nums;color:var(--muted)}
.crow span strong{color:var(--ink)}
.crow:hover{background:var(--soft2)}
.list{display:flex;flex-direction:column}
.row{display:flex;align-items:center;gap:10px;padding:10px 4px 10px 10px;border-bottom:1px solid var(--line);position:relative}
.row::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:3px;border-radius:3px;background:var(--c)}
.row .t{flex:1;min-width:0}
.row b{font-size:12.5px;font-weight:600;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row small{font-size:11px;color:var(--muted)}
.row .d{font-size:10.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.row .rm{width:28px;height:28px;border-radius:8px;color:var(--muted);font-size:16px}
.row .rm:hover{background:var(--danger-bg);color:#c2374f}
.row .add{font-size:11px;font-weight:600;color:var(--teal-d);background:var(--teal-l);padding:6px 10px;border-radius:8px}
.row .add.on{background:var(--soft);color:var(--muted)}
.row.clk{cursor:pointer}
.row.clk:hover{background:var(--soft)}
.gh{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;margin:18px 0 4px}
.gh i{width:8px;height:8px;border-radius:50%;background:var(--c)}
.gh span{color:var(--muted);font-weight:500}
.empty{font-size:12px;color:var(--muted);padding:16px 4px}

@media (max-width:1000px){.kraje{grid-template-columns:minmax(0,1fr) 300px}}
@media (max-width:720px){
  .kraje{display:block;height:auto}
  .mapwrap{height:400px}
  .mapwrap svg.world{top:84px;bottom:46px;height:auto}
  .mtop{flex-direction:column}
  .mtop{top:10px;gap:6px}
  .hint{bottom:12px;font-size:10.5px}
  .zoom{right:12px;bottom:52px}
  .kpanel{border-left:0;padding-bottom:84px}
  .kp-head{padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
  .kp-body{overflow:visible;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
  .pop-over{width:210px}
}

@media (max-height:820px) and (min-width:721px){.side-art{height:110px}.side-art p{display:none}}
.land.home{stroke:var(--m-ink);stroke-width:1.4;stroke-dasharray:3 2}
.tiny.home{stroke:var(--m-ink);stroke-width:1.6}
.mapwrap.no-cities .city,.mapwrap.no-small .tiny{display:none}