
:root{
  --bg:#0d1117;--surface:#161b22;--surface2:#1c2330;--border:#2d3748;
  --text:#e2e8f0;--muted:#64748b;--accent:#38bdf8;--accent2:#818cf8;
  /* CHANGED: bardziej nasycone, agresywne kolory */
  --ideal:#00c896;--good:#7ed321;--avg:#ffb700;--poor:#ff6b1a;--bad:#ff2e4c;
}
*{box-sizing:border-box;margin:0;padding:0}
html{touch-action:manipulation}
body{font-family:'DM Sans',sans-serif;background:var(--bg);color:var(--text);height:100vh;height:100dvh;display:flex;flex-direction:column;overflow:hidden;overscroll-behavior:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}

/* ═══════════════════════════════════════════════════════════════════════ */
/* MAP SCREEN — Light vintage atlas with floating UI in corners            */
/* ═══════════════════════════════════════════════════════════════════════ */

/* Vintage atlas color palette (only applied when body.mapping is active) */
body.mapping{background:#f1ead8}
body.mapping{--map-paper:#f1ead8;--map-paper-2:#e8dfc6;--map-ink:#3b2f1e;--map-ink-soft:#6b5a3e;--map-line:#a89472;--map-ocean-1:#cfe1e6;--map-ocean-2:#a9c8d2;--map-glow:#d4af37}

/* MAP — full screen */
#main{flex:1;display:flex;overflow:hidden;position:relative}
#wrap{flex:1;position:relative;overflow:hidden;background:radial-gradient(ellipse at 50% 40%,#dfe9eb 0%,#b8ccd3 60%,#92acb6 100%)}
#mc2{width:100%;height:100%;position:relative}
#relief{display:none}
#mc2 svg{position:absolute;inset:0;z-index:1}
/* v10.34: na mobile mapa nie blokuje touch dla floatów */
@media (max-width:760px), (orientation:landscape) and (max-height:620px){ #mc2 svg{touch-action:auto !important} }

/* Faux-3D country styling — bold contours, vibrant fills */
.country{cursor:pointer;stroke:#1a1208;stroke-width:1.05px;transition:filter .18s,transform .18s,stroke .15s,stroke-width .15s;transform-box:fill-box;transform-origin:center;filter:drop-shadow(0 1.5px 0 rgba(26,18,8,.45)) saturate(1.15)}
.country:hover{stroke:#000;stroke-width:1.8px;filter:drop-shadow(0 6px 12px rgba(184,134,11,.55)) brightness(1.12) saturate(1.4)}

/* (mtn-* / vol-* styles removed — pixelmap-style world view doesn't render topographic overlays.) */

/* Tooltip — vintage paper card */
#tip{position:absolute;background:rgba(248,242,225,.97);border:1px solid #b59b6a;border-radius:6px;padding:10px 13px;font-size:12px;pointer-events:none;display:none;z-index:50;max-width:220px;box-shadow:0 6px 20px rgba(60,40,15,.25),inset 0 0 0 1px rgba(255,255,255,.5);color:#3b2f1e;font-family:'DM Sans',sans-serif}
.ys-strip-wrap{cursor:ew-resize;user-select:none;-webkit-user-select:none;touch-action:none}
.ys-strip-wrap svg{display:block;pointer-events:none}
#tip h3{font-size:13px;font-weight:800;color:#2a1f10;margin-bottom:2px;letter-spacing:-.2px}
#tip .sub{font-size:10px;color:#6b5a3e;margin-bottom:7px;font-style:italic}
.bdg{display:inline-block;padding:2px 9px;border-radius:20px;font-size:10px;font-weight:700}
#st{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#6b5a3e;font-size:13px;pointer-events:none;text-align:center;font-family:'DM Sans',sans-serif}
.spin{width:28px;height:28px;border:2px solid rgba(107,90,62,.25);border-top-color:#6b5a3e;border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 10px}
@keyframes spin{to{transform:rotate(360deg)}}

/* ── FLOATING PANELS — vintage parchment cards in 4 corners ───────────── */
.fp{position:absolute;background:linear-gradient(180deg,rgba(248,242,225,.96),rgba(238,228,200,.94));border:1px solid #b59b6a;border-radius:10px;backdrop-filter:blur(10px);box-shadow:0 8px 28px rgba(60,40,15,.22),inset 0 1px 0 rgba(255,255,255,.6);z-index:30;font-family:'DM Sans',sans-serif;color:#3b2f1e;padding:10px 12px}
.fp-lbl{font-size:11px;font-weight:900;color:#2a1f10;letter-spacing:1.6px;text-transform:uppercase;margin-bottom:8px;display:flex;align-items:center;gap:7px;text-shadow:0 1px 0 rgba(255,255,255,.5)}
.fp-lbl::before{content:'';width:16px;height:2px;background:linear-gradient(90deg,#b8860b,transparent);border-radius:1px}


/* Top-left: logo + continents */
#fp-tl{top:14px;left:14px;display:flex;flex-direction:column;gap:6px;min-width:200px;background:transparent;border:none;box-shadow:none;backdrop-filter:none;padding:0}


.fp-views{display:flex;flex-wrap:wrap;gap:3px}
.fp-kompas-row{margin-top:6px}
.kompas-btn{display:inline-flex;align-items:center;gap:6px;background:#0d1117;color:#f4b942;border:1px solid #f4b942;border-radius:18px;padding:4px 12px;font-size:10px;font-family:inherit;font-weight:700;cursor:pointer;transition:all .12s;letter-spacing:.5px;text-transform:uppercase;text-decoration:none;box-shadow:0 1px 3px rgba(60,40,15,.2)}
.kompas-btn:hover{background:#f4b942;color:#0d1117}
.kompas-ic{display:inline-flex;align-items:center}
.wdrum2-item.wdrum2-kompas{color:#f4b942;font-weight:700}
.kompas-btn-mobile{display:none;align-items:center;gap:5px;background:#0d1117;color:#f4b942;border:1px solid #f4b942;border-radius:14px;padding:3px 10px;font-size:9px;font-weight:700;text-decoration:none;letter-spacing:.4px;text-transform:uppercase;pointer-events:auto;flex-shrink:0}
.kompas-btn-mobile svg{flex-shrink:0}
.fp-views .nb{background:#f8f2e1;color:#2a1f10;border:1px solid #8a6d3a;border-radius:18px;padding:3px 10px;font-size:9px;font-family:inherit;font-weight:700;cursor:pointer;transition:all .12s;letter-spacing:.3px;text-transform:uppercase;box-shadow:0 1px 3px rgba(60,40,15,.15)}
.fp-views .nb:hover{background:#ede2c4;border-color:#5a4521;color:#1a1208}
.fp-views .nb.on{background:#3b2f1e;color:#f1ead8;border-color:#3b2f1e;box-shadow:0 2px 6px rgba(59,47,30,.4);font-weight:800}

/* Top-right: travel style */
/* CHANGED: prawy panel pod tabsami i pod paszportem (top:72) */
#fp-tr{top:72px;right:14px;width:auto;background:transparent;border:none;box-shadow:none;backdrop-filter:none;padding:0}
.fp-styles{display:flex;flex-direction:column;gap:4px;align-items:stretch}
.fp-styles .gb{display:flex;align-items:center;justify-content:flex-start;gap:4px;background:rgba(248,242,225,.78);border:1px solid rgba(138,109,58,.55);border-radius:14px;padding:3px 8px;cursor:pointer;width:128px;font-family:inherit;font-size:9px;font-weight:700;color:#3b2f1e;transition:all .12s;white-space:nowrap;letter-spacing:.1px;box-shadow:0 1px 3px rgba(60,40,15,.08)}
.fp-styles .gb:hover{background:rgba(184,134,11,.2);border-color:#8a6d3a;color:#1a1208}
.fp-styles .gb.on{background:rgba(184,134,11,.42);border-color:#5a4521;color:#1a1208;box-shadow:0 2px 6px rgba(184,134,11,.3);font-weight:800}
.fp-styles .gb .ic{font-size:11px;width:auto;text-align:center;flex-shrink:0}

/* Bottom-left: legend — minimal, no background */
#fp-bl{bottom:14px;left:14px;min-width:140px;background:transparent;border:none;box-shadow:none;backdrop-filter:none;padding:4px 6px}
.fp-legend{display:flex;flex-direction:column;gap:3px}
.lr{display:flex;align-items:center;gap:6px;padding:2px 5px;font-size:11px;color:#1f1608;font-weight:800;text-shadow:0 1px 2px rgba(255,255,255,.9),0 0 3px rgba(255,255,255,.6);background:rgba(248,242,225,.5);border:1.5px solid #8a6d3a;border-radius:5px}
.ld{width:11px;height:11px;border-radius:2px;flex-shrink:0;border:1px solid rgba(60,40,15,.5);box-shadow:0 1px 2px rgba(0,0,0,.2)}

/* Bottom-center: months + slider — compact with background */
#fp-bottom{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);z-index:30;background:linear-gradient(180deg,rgba(248,242,225,.96),rgba(238,228,200,.94));border:1px solid #b59b6a;border-radius:8px;backdrop-filter:blur(10px);box-shadow:0 6px 20px rgba(60,40,15,.18),inset 0 1px 0 rgba(255,255,255,.5);padding:5px 12px 6px;display:flex;flex-direction:column;gap:3px;min-width:520px;max-width:calc(100vw - 380px)}

/* v10.23: kompensacja zoom przegladarki dla floatów — jak Google Maps */
:root{--ui-zoom-compensation:1}
#fp-tl{transform:scale(var(--ui-zoom-compensation));transform-origin:top left}
#fp-tabs{transform:translateX(-50%) scale(var(--ui-zoom-compensation));transform-origin:top center}
#fp-psp{transform:scale(var(--ui-zoom-compensation));transform-origin:top right}
#fp-lang{transform:scale(var(--ui-zoom-compensation));transform-origin:top right}
#fp-tr{transform:scale(var(--ui-zoom-compensation));transform-origin:top right}
#fp-bl{transform:scale(var(--ui-zoom-compensation));transform-origin:bottom left}
#fp-bottom{transform:translateX(-50%) scale(var(--ui-zoom-compensation));transform-origin:bottom center}
#feedback-fab{transform:scale(var(--ui-zoom-compensation));transform-origin:bottom right}
#fp-bottom #dL{font-size:10px;font-weight:700;color:#b8860b;background:transparent;padding:0;border:none;font-family:'DM Mono',monospace;text-align:center;align-self:center;letter-spacing:.5px}


.mc:hover{color:#2a1f10;background:rgba(184,134,11,.1);border-color:rgba(184,134,11,.35)}




#sl::-webkit-slider-runnable-track{height:3px;background:rgba(184,134,11,.3);border-radius:2px}

#sl::-moz-range-track{height:3px;background:rgba(184,134,11,.3);border-radius:2px}


/* (legacy nav/#sb/#datebar removed — replaced by floating panels #fp-tl/#fp-tr/#fp-bottom) */


/* PANEL — editorial, cinematic */
/* PANEL — slide-in z prawej, fullscreen overlay */
#panel{position:fixed;top:0;right:0;height:100vh;width:100vw;max-width:100vw;background:var(--surface);display:flex;flex-direction:column;transform:translateX(100%);transition:transform .35s cubic-bezier(.4,0,.2,1);z-index:200;box-shadow:-20px 0 60px rgba(0,0,0,.5)}
#panel.open{transform:translateX(0)}
#panel.ranking-mode .travel-meta{display:none !important}
#panel.ranking-mode .ph-desc-box{display:none !important}
#panel.ranking-mode .gallery-wrap{display:none !important}
#p-scroll{flex:1;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--border) transparent;display:flex;flex-direction:column}
#p-scroll::-webkit-scrollbar{width:8px}#p-scroll::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}
#pb-inner{max-width:1100px;margin:0 auto;width:100%;padding:0 32px 60px;flex:1}
#pb{padding:0}
/* Big back-to-map button */
#p-back{position:sticky;top:0;left:0;right:0;z-index:50;background:linear-gradient(180deg,rgba(15,23,42,.98),rgba(15,23,42,.92));backdrop-filter:blur(12px);border-bottom:1px solid var(--border);padding:12px 28px;display:flex;align-items:center;gap:18px;flex-shrink:0}
#p-back-btn{display:inline-flex;align-items:center;gap:10px;background:linear-gradient(135deg,#b8860b,#daa520);color:#1c1206;border:none;border-radius:10px;padding:11px 22px;font-family:inherit;font-size:13px;font-weight:800;cursor:pointer;letter-spacing:.3px;box-shadow:0 4px 14px rgba(184,134,11,.4);transition:all .15s}
#p-back-btn:hover{transform:translateX(-3px);box-shadow:0 6px 20px rgba(184,134,11,.55)}
#p-back-btn .arr{font-size:18px;line-height:1}
#p-back-title{color:var(--text);font-size:14px;font-weight:700;letter-spacing:-.2px;opacity:.7}
/* v10.30: tytuł kraju w sticky pasku — desktop ukryty, mobile widoczny */
@media (min-width:761px) and (min-height:621px){ #p-back-title{display:none} }
@media (max-width:760px), (orientation:landscape) and (max-height:620px){
  #pb-inner{padding:0 14px 50px}
  /* v10.30: sticky pasek z przyciskiem + tytuł kraju */
  #p-back{padding:10px 14px !important;background:rgba(13,17,23,0.92) !important;backdrop-filter:blur(12px);display:flex !important;align-items:center;border-bottom:1px solid rgba(148,163,184,0.12)}
  #p-back-btn{padding:9px 14px !important;font-size:12px !important;min-height:40px;flex-shrink:0}
  #p-back-title{display:inline-block !important;margin-left:10px;font-size:13px;font-weight:700;color:#e2e8f0;opacity:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}
  .ph-title{font-size:26px !important;line-height:1.2;letter-spacing:-.4px !important}
  .ph-hero-txt{padding:16px 14px 14px !important}
  #ph-hero{height:200px !important}
  /* v10.30: karta waluty — pełna szerokość pod budżetem (zamiast w rogu) */
  .travel-meta{padding-right:12px !important}
  .tm-currency-badge{position:static !important;width:100%;margin-top:10px;padding:8px 12px !important;transform:none !important;align-items:flex-start !important;background:rgba(251,191,36,0.08) !important;border:1px solid rgba(251,191,36,0.25) !important;border-radius:8px !important;box-sizing:border-box}
  .travel-meta .tm-row > div[style*="display:flex"]{flex-wrap:wrap !important}
  .ys-strip-wrap svg{min-height:180px !important}
  /* v10.28: karty atrakcji — 2 kolumny */
  .pgrid{grid-template-columns:repeat(2,1fr) !important;gap:8px !important}
  .qchip{min-height:40px !important;padding:9px 14px !important;font-size:13px !important}
  /* v10.30: tytuły i opisy kart atrakcji — max 2 linie z "..." */
  .pgrid .pcard-ttl{font-size:13px !important;line-height:1.25 !important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .pgrid .pcard-desc{font-size:11px !important;line-height:1.35 !important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
}

/* HERO — big cinematic with Ken Burns */
#ph-hero{position:relative;width:100%;height:420px;overflow:hidden;background:linear-gradient(135deg,#1c2330,#2d3748);flex-shrink:0}
.ph-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;animation:kenburns 20s ease-in-out infinite alternate;transform-origin:center}
@keyframes kenburns{from{transform:scale(1) translate(0,0)}to{transform:scale(1.12) translate(-1%,-1%)}}
.ph-ph{width:100%;height:100%;background:linear-gradient(135deg,#1c2330,#2d3748);display:flex;align-items:center;justify-content:center;font-size:56px}
.ph-hero-grad{position:absolute;inset:0;background:linear-gradient(180deg,rgba(13,17,23,0) 0%,rgba(13,17,23,.1) 45%,rgba(13,17,23,.82) 90%,rgba(13,17,23,.95) 100%);pointer-events:none}
.ph-hero-txt{position:absolute;left:0;right:0;bottom:0;padding:32px 40px 28px;z-index:2;max-width:1100px;margin:0 auto}
.ph-title{font-size:48px;font-weight:800;color:#fff;letter-spacing:-1.2px;line-height:1.02;text-shadow:0 2px 24px rgba(0,0,0,.5);margin:0}
.ph-cap{font-size:13px;color:rgba(255,255,255,.85);margin-top:8px;font-weight:500;letter-spacing:.3px;display:flex;align-items:center;gap:6px}
#px{display:none}

/* DESCRIPTION block */
.ph-desc-box{padding:22px 0;border-bottom:1px solid var(--border);background:linear-gradient(180deg,rgba(56,189,248,.02),transparent)}
.ph-desc{font-size:15px;color:#cbd5e1;line-height:1.7;font-weight:400;max-width:780px}

/* GALLERY — horizontal scroll */
.gallery-wrap{padding:12px 0 6px;border-bottom:1px solid var(--border)}
.gallery{display:flex;gap:8px;overflow-x:auto;padding:0 16px 4px;scrollbar-width:none;scroll-behavior:smooth;scroll-snap-type:x mandatory}
.gallery::-webkit-scrollbar{display:none}
/* CHANGED: removed onclick — gallery items are static visual decorations (img zoom kept) */
.gi{flex:0 0 auto;width:220px;height:150px;border-radius:14px;overflow:hidden;position:relative;cursor:default;background:#1c2330;border:1px solid rgba(255,255,255,.05);scroll-snap-align:start;animation:fadeUp .5s backwards}
.gi:nth-child(1){animation-delay:.05s}.gi:nth-child(2){animation-delay:.1s}.gi:nth-child(3){animation-delay:.15s}.gi:nth-child(4){animation-delay:.2s}.gi:nth-child(5){animation-delay:.25s}.gi:nth-child(6){animation-delay:.3s}
.gi img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s cubic-bezier(.4,0,.2,1)}
.gi:hover img{transform:scale(1.08)}
.gi-grad{position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(0,0,0,.85));pointer-events:none}
.gi-lbl{position:absolute;bottom:9px;left:11px;right:11px;font-size:12px;font-weight:700;color:#fff;letter-spacing:-.2px;text-shadow:0 1px 4px rgba(0,0,0,.8);line-height:1.2;z-index:1}


@keyframes fadeUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

/* CONTENT */
#pb-content{padding:14px 16px}
/* CHANGED: removed onclick — region cards are static informational tiles */
.rc{background:var(--surface2);border:1px solid var(--border);border-radius:12px;padding:10px 12px;margin-bottom:6px;cursor:default}
.rt{display:flex;justify-content:space-between;align-items:center;margin-bottom:5px;gap:8px}
.rn{font-size:12px;font-weight:700;color:var(--text);letter-spacing:-.2px}
.rs{font-size:12px;color:var(--muted);display:flex;gap:10px;flex-wrap:wrap}
.rs b{font-weight:700}
.slbl{font-size:9px;font-weight:800;color:var(--muted);letter-spacing:1.8px;text-transform:uppercase;margin:14px 0 8px;display:flex;align-items:center;gap:8px}
.slbl:before{content:'';flex:0 0 14px;height:1px;background:linear-gradient(90deg,var(--accent),transparent)}
.wn{font-size:11px;color:#fbbf24;background:rgba(251,191,36,.08);border:1px solid rgba(251,191,36,.2);border-radius:10px;padding:8px 10px;margin-bottom:8px;line-height:1.55;display:flex;gap:6px;align-items:flex-start}

/* PLACES — big editorial cards */
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px;margin-bottom:14px}
/* CHANGED: removed onclick — pcard is now a static visual decoration */
.pcard{position:relative;border-radius:12px;overflow:hidden;aspect-ratio:3/4;cursor:default;background:var(--surface2);border:1px solid var(--border);animation:fadeUp .5s backwards}
.pcard:nth-child(1){animation-delay:.1s}.pcard:nth-child(2){animation-delay:.15s}.pcard:nth-child(3){animation-delay:.2s}.pcard:nth-child(4){animation-delay:.25s}.pcard:nth-child(5){animation-delay:.3s}.pcard:nth-child(6){animation-delay:.35s}
.pcard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s cubic-bezier(.4,0,.2,1)}
.pcard:hover img{transform:scale(1.08)}
.pcard-grad{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.08) 0%,rgba(0,0,0,.15) 45%,rgba(0,0,0,.88) 100%);pointer-events:none}
.pcard-b{position:absolute;bottom:0;left:0;right:0;padding:10px 11px 11px;z-index:2}

.pnm{font-size:15px;font-weight:800;color:#fff;line-height:1.15;margin-bottom:5px;letter-spacing:-.3px;text-shadow:0 1px 4px rgba(0,0,0,.6)}
.pds{font-size:13.5px;color:rgba(255,255,255,.86);line-height:1.4;text-shadow:0 1px 3px rgba(0,0,0,.7);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ptag{position:absolute;top:8px;left:8px;background:rgba(13,17,23,.7);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.15);color:#fff;font-size:9px;font-weight:700;padding:3px 8px;border-radius:20px;letter-spacing:.3px;z-index:2}

/* ASK BUTTON */
/* REMOVED: chat — .ask-btn and .aidot styles deleted (button removed from panel) */
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.75)}}

/* COMPACT CLIMATE */
.climate-mini{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:8px 11px;background:rgba(148,163,184,.06);border:1px solid var(--border);border-radius:10px;font-size:11px;color:#cbd5e1;margin:6px 0 4px}
.climate-mini .cm-stats{color:#94a3b8}.climate-mini .cm-stats b{color:#e2e8f0}
.climate-mini .cm-date{margin-left:auto;font-size:10px;color:#64748b;letter-spacing:.3px}
.climate-fold{margin:6px 0 4px;border:1px solid var(--border);border-radius:10px;background:rgba(148,163,184,.04);overflow:hidden}
.climate-fold>summary{list-style:none;cursor:pointer;padding:9px 12px;display:flex;align-items:center;justify-content:space-between;font-size:13px;color:#cbd5e1;user-select:none}
.climate-fold>summary::-webkit-details-marker{display:none}
.climate-fold .cf-hint{font-size:11px;color:#64748b;text-transform:uppercase;letter-spacing:1.2px}
.climate-fold[open] .cf-hint{color:#94a3b8}
.climate-fold .cf-body{padding:4px 10px 10px;display:flex;flex-direction:column;gap:6px}
.rc-sm{padding:7px 10px}
.slbl-big{font-size:11px;color:#e2e8f0;letter-spacing:.4px;text-transform:none;font-weight:700}
.slbl-big:before{display:none}
.slbl-cnt{font-size:12px;color:#64748b;font-weight:500;letter-spacing:.2px}

/* QUICK ACTION CHIPS */
.qchips{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 4px}
.qchip{
  padding:8px 14px !important;
  min-height:32px !important; height:auto !important;
  background:rgba(255,255,255,.8) !important;
  border:1.5px solid #0f172a !important;
  border-radius:20px !important;
  color:#0f172a !important;
  font-family:inherit; font-weight:600; font-size:13px !important;
  letter-spacing:-.1px; line-height:1; cursor:pointer;
  transition:background .18s,border-color .18s,color .18s !important;
}

/* ADDED: placeholder topics — chip active state + expandable content */

.qchip-content{display:none;padding:14px 16px;background:rgba(56,189,248,.05);border:1px solid rgba(56,189,248,.2);border-radius:10px;margin:8px 0 16px;font-size:13px;color:#cbd5e1;line-height:1.6}
.qchip-content.open{display:block}
.pcard:nth-child(7){animation-delay:.4s}.pcard:nth-child(8){animation-delay:.45s}

/* (topographic overlay rules removed — pixelmap world has no mountain/volcano layers.) */

/* Visa icon overlay — emoji glyphs at country centroids */
.visa-ic{pointer-events:none;font-size:13px;text-anchor:middle;dominant-baseline:central;paint-order:stroke;stroke:rgba(255,255,255,.95);stroke-width:2.4px;stroke-linejoin:round}

/* Passport selector — small chip in top-left panel */

.psp-lbl{font-size:9px;font-weight:800;color:#8a7548;letter-spacing:1.2px;text-transform:uppercase}
.psp-sel{flex:1;background:transparent;border:none;color:#2a1f10;font-family:inherit;font-size:11px;font-weight:700;outline:none;cursor:pointer;padding:2px 4px}
.psp-sel option{background:#f1ead8;color:#2a1f10}

/* Dynamic legend rows for visa layer — icons not color swatches */




/* ── MAP LAYER TABS (Goals / Visa / Budget) ─────────────────────────── */
/* CHANGED: zsunięte w dół (top:24 zamiast 14) — bardziej widoczne */
#fp-tabs{position:absolute;top:24px;left:50%;transform:translateX(-50%);z-index:31;display:flex;align-items:center;gap:8px;background:linear-gradient(180deg,rgba(248,242,225,.96),rgba(238,228,200,.94));border:1px solid #b59b6a;border-radius:10px;padding:5px 5px 5px 5px;box-shadow:0 8px 28px rgba(60,40,15,.22),inset 0 1px 0 rgba(255,255,255,.6);font-family:'DM Sans',sans-serif}
/* ADDED: paszport jako pływający chip w prawym górnym rogu */
#fp-psp{position:absolute;top:14px;right:14px;z-index:31;display:flex;align-items:center;gap:6px;background:linear-gradient(180deg,#fff8e2,#f1e6c2);border:1.5px solid #b8860b;border-radius:8px;padding:5px 10px;box-shadow:0 3px 8px rgba(184,134,11,.3);font-family:'DM Sans',sans-serif}
#fp-psp .fp-psp-lbl{font-size:9px;font-weight:800;color:#7a5a10;letter-spacing:1.3px;text-transform:uppercase}
#fp-psp .fp-psp-sel{background:transparent;border:none;color:#2a1f10;font-family:inherit;font-size:12px;font-weight:800;outline:none;cursor:pointer;padding:2px 4px}
#fp-psp .fp-psp-sel option{background:#f1ead8;color:#2a1f10}
body.layer-goals #fp-psp{display:none !important}
/* USUNIĘTE: w warstwie Budżet paszport pokazujemy — wpływa na walutę przeliczenia */
#fp-lang{position:absolute;top:14px;right:265px;z-index:31;display:flex;align-items:center;gap:6px;background:linear-gradient(180deg,#fff8e2,#f1e6c2);border:1.5px solid #b8860b;border-radius:8px;padding:5px 10px;box-shadow:0 3px 8px rgba(184,134,11,.3);font-family:'DM Sans',sans-serif}
#fp-lang .fp-psp-lbl{font-size:11px;color:#7a5a10}
#fp-lang select{background:transparent;border:none;color:#2a1f10;font-family:inherit;font-size:12px;font-weight:800;outline:none;cursor:pointer;padding:2px 4px}
#fp-lang select option{background:#f1ead8;color:#2a1f10}
/* USUNIĘTE: Share button jest teraz fixed w prawym dolnym rogu, nie wymaga przesuwania */
body.layer-visa #fp-psp{box-shadow:0 4px 14px rgba(184,134,11,.5),inset 0 1px 0 rgba(255,255,255,.6);border-color:#7a5a10}
.lt{background:transparent;border:1px solid transparent;border-radius:9px;padding:10px 18px;font-size:12.5px;font-family:inherit;font-weight:700;color:#6b5a3e;cursor:pointer;letter-spacing:.5px;text-transform:uppercase;display:flex;align-items:center;gap:8px;transition:background .18s,color .18s,border-color .18s}


.lt .lt-ic{font-size:13px}
/* Hide goals-only UI when not on goals layer */
body.layer-visa #fp-tr,body.layer-budget #fp-tr,
body.layer-visa #fp-bottom,body.layer-budget #fp-bottom,
body.layer-visa #fp-when,body.layer-budget #fp-when{display:none !important}
/* CHANGED: lewy panel pod tabsami w KAŻDEJ warstwie. top:72 (więcej miejsca) */
#fp-tl,
body.layer-visa #fp-tl,
body.layer-budget #fp-tl,
body.layer-goals #fp-tl{top:72px;left:14px}
/* ADDED: Logo wander = klikalny powrót na landing */


#map-home-btn{background:#0f172a;border:1.5px solid #f97316;color:#f97316;font-size:16px;width:36px;height:36px;border-radius:10px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:background .18s,color .18s,transform .12s;box-shadow:0 2px 8px rgba(15,23,42,.25)}
#map-home-btn:hover{background:#f97316;color:#fff;transform:translateY(-1px);box-shadow:0 4px 14px rgba(249,115,22,.4)}
#map-home-btn:active{transform:translateY(0)}

#fp-tl .logo:hover{background:#0f172a;color:#f97316;border-color:#f97316}
#fp-tl .logo:hover em{color:#fff}

/* ── COUNTRY PANEL: VISA + BUDGET BADGES ─────────────────────────────── */
.travel-meta{display:flex;flex-direction:column;gap:6px;padding:10px 12px;background:linear-gradient(180deg,rgba(56,189,248,.04),rgba(129,140,248,.03));border:1px solid var(--border);border-radius:10px;margin:6px 0 4px;position:relative;padding-right:160px}
.tm-currency-badge{transform:scale(0.85);transform-origin:bottom right}
.tm-row{display:flex;align-items:center;gap:8px;font-size:11px;line-height:1.35}
.tm-ic{font-size:14px;flex-shrink:0;width:18px;text-align:center}
.tm-lbl{color:#94a3b8;font-weight:600;font-size:10px;text-transform:uppercase;letter-spacing:.6px;flex-shrink:0;width:54px}
.tm-val{color:#e2e8f0;font-weight:600;flex:1}
.tm-val b{color:#fff}
.tm-val .tm-sub{color:#64748b;font-size:12px;font-weight:500;margin-left:4px}
.tm-pill{display:inline-block;padding:2px 8px;border-radius:20px;font-size:10px;font-weight:700;letter-spacing:.2px}
.tm-pill.ok{background:rgba(0,200,150,.15);color:#00c896;border:1px solid rgba(0,200,150,.35)}
.tm-pill.eta{background:rgba(56,189,248,.15);color:#38bdf8;border:1px solid rgba(56,189,248,.35)}
.tm-pill.voa{background:rgba(126,211,33,.15);color:#7ed321;border:1px solid rgba(126,211,33,.35)}
.tm-pill.evisa{background:rgba(255,183,0,.15);color:#ffb700;border:1px solid rgba(255,183,0,.35)}

.tm-pill.no{background:rgba(255,46,76,.18);color:#ff2e4c;border:1px solid rgba(255,46,76,.4)}
.tm-pill.cheap{background:rgba(34,211,165,.15);color:#22d3a5;border:1px solid rgba(34,211,165,.35)}
.tm-pill.mid{background:rgba(251,191,36,.15);color:#fbbf24;border:1px solid rgba(251,191,36,.35)}
.tm-pill.exp{background:rgba(244,63,94,.18);color:#f43f5e;border:1px solid rgba(244,63,94,.4)}
.tm-disclaimer{font-size:11px;color:#64748b;font-style:italic;margin-top:2px;line-height:1.4}
.tm-disclaimer a{color:#38bdf8;text-decoration:none}
.tm-disclaimer a:hover{text-decoration:underline}

/* LAZY IMAGE SLOTS */
.pimg-wrap{position:absolute;inset:0;background:linear-gradient(135deg,#1c2330,#2d3748);overflow:hidden}
.gi .pimg-wrap,.pcard .pimg-wrap{position:absolute;inset:0}
.pimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s cubic-bezier(.4,0,.2,1),opacity .35s}
.gi:hover .pimg,.pcard:hover .pimg{transform:scale(1.08)}
.lazyimg{background:linear-gradient(135deg,#1c2330,#2d3748);background-size:200% 200%;animation:shim 1.6s ease-in-out infinite;display:flex;align-items:center;justify-content:center}
.lazyimg::after{content:'🗺️';font-size:24px;opacity:.22}
.lazyimg.img-loaded{animation:none;background-size:cover;background-position:center;background-repeat:no-repeat;transition:opacity .4s}
.lazyimg.img-loaded::after{content:none}
.lazyimg.img-miss{animation:none;background:linear-gradient(135deg,#1c2330,#2d3748)}
.lazyimg.img-miss::after{content:'🗺️';font-size:32px;opacity:.35}
@keyframes shim{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}

/* Hero shimmer while loading */
.ph-shim{position:absolute;inset:0;background:linear-gradient(110deg,#1c2330 8%,#2d3748 18%,#1c2330 33%);background-size:200% 100%;animation:shim 1.6s ease-in-out infinite;display:flex;align-items:center;justify-content:center;font-size:48px;opacity:.4}
.ph-shim::before{content:'🌍';filter:grayscale(1)}

/* CHAT */
/* REMOVED: chat — all #chat / .cm / .chat-* selectors deleted (Anthropic chat retired) */

/* ═══════════════════════════════════════════════════════════════════════ */
/* LANDING SCREEN — Cinematic intro with 3D travel style cards            */
/* ═══════════════════════════════════════════════════════════════════════ */
#landing{position:fixed;inset:0;z-index:500;background:linear-gradient(135deg,#0f172a 0%,#1e1b4b 40%,#312e81 70%,#1e1b4b 100%);overflow:hidden;transition:opacity .8s cubic-bezier(.4,0,.2,1),transform .8s cubic-bezier(.4,0,.2,1)}
#landing.hide{opacity:0;transform:scale(1.05);pointer-events:none}
body.mapping #landing{display:none}

/* Animated background — wyłączone, chcemy czyste zdjęcie hero */
#land-bg{display:none}
@keyframes bgspin{to{transform:rotate(360deg)}}

/* Floating orbs — wyłączone (tworzyły fioletową szybę na zdjęciu) */
.orb{display:none}
.orb1,.orb2,.orb3,.orb4{display:none}
@keyframes float{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(60px,-40px) scale(1.1)}66%{transform:translate(-50px,30px) scale(.95)}}

/* Hero photo background — pełne, czyste zdjęcie */
#land-photo{position:absolute;inset:0;background:url('/wander-img/hero-bg.webp') center/cover no-repeat;opacity:1;z-index:0;animation:heroDrift 40s ease-in-out infinite alternate;will-change:transform}
@keyframes heroDrift{from{transform:scale(1.05) translate(-1%,-1%)}to{transform:scale(1.15) translate(1%,1%)}}

/* Subtelna ciemna winieta tylko dla czytelności tekstu (bez fioletu) */
#land-vig{position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(0,0,0,0) 0%,rgba(0,0,0,.25) 60%,rgba(0,0,0,.65) 100%);z-index:2;pointer-events:none}

/* Grain texture — wyłączone */
#land-grain{display:none}

/* Content container */
#land-content{position:relative;z-index:10;width:100%;height:100%;display:flex;flex-direction:column;padding:24px 40px;overflow-y:auto}
/* v10.42: lepszy styl landing SEO copy + tagi (zgodny z hero, czytelny na zdjęciu) */
.land-seo{
  margin:22px auto 14px;
  max-width:820px;
  font-size:16px;
  line-height:1.65;
  color:rgba(255,255,255,.97);
  text-align:center;
  font-weight:400;
  letter-spacing:.01em;
  text-shadow:0 2px 16px rgba(0,0,0,.45),0 1px 2px rgba(0,0,0,.55);
  padding:0 12px;
}
.land-seo strong{
  color:#fbbf24;
  font-weight:700;
  font-size:18px;
  display:inline-block;
  margin-right:4px;
  letter-spacing:.005em;
  text-shadow:0 1px 3px rgba(0,0,0,.95),0 2px 8px rgba(0,0,0,.8),0 0 22px rgba(0,0,0,.55);
}
.land-tags{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:center;
  margin:14px auto 24px;
  max-width:820px;
  padding:0 12px;
}
.land-tags .ltag{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:8px 16px;
  font-size:13.5px;
  font-weight:600;
  color:#fff;
  background:linear-gradient(135deg,rgba(255,255,255,.16),rgba(255,255,255,.08));
  border:1px solid rgba(251,191,36,.35);
  border-radius:24px;
  backdrop-filter:blur(14px) saturate(140%);
  -webkit-backdrop-filter:blur(14px) saturate(140%);
  white-space:nowrap;
  box-shadow:0 4px 20px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.18);
  letter-spacing:.015em;
  transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
/* v12.17: chipy są opisowe, nie klikalne — bez efektu hover sugerującego aktywność */
.land-tags .ltag{cursor:default}
@media (max-width:760px), (orientation:landscape) and (max-height:620px){
  .land-seo{
    font-size:13.5px;
    line-height:1.55;
    margin:14px auto 8px;
    padding:0 8px;
  }
  .land-seo strong{
    font-size:15px;
    display:block;
    margin:0 0 4px;
  }
  .land-tags{
    gap:6px;
    margin:8px auto 14px;
    padding:0 8px;
  }
  .land-tags .ltag{
    padding:6px 12px;
    font-size:11.5px;
    gap:5px;
    font-weight:600;
  }
}
#land-head{display:flex;align-items:center;justify-content:space-between;flex-shrink:0}
#land-logo{font-size:24px;font-weight:800;letter-spacing:-1px;color:#fff;display:inline-flex;align-items:center;gap:8px}
#land-logo em{font-style:normal;background:linear-gradient(135deg,#38bdf8,#818cf8);-webkit-background-clip:text;background-clip:text;color:transparent}
/* BETA badge */


/* Feedback FAB (lewy dolny róg) */
#feedback-fab{position:fixed;bottom:20px;right:86px;z-index:50;display:flex;align-items:center;gap:6px;background:linear-gradient(180deg,#1e293b,#0f172a);border:2px solid #38bdf8;color:#e2e8f0;font-family:'DM Sans',sans-serif;font-size:12px;font-weight:700;padding:10px 14px;border-radius:24px;cursor:pointer;box-shadow:0 4px 14px rgba(56,189,248,.3),0 2px 6px rgba(0,0,0,.4);transition:all .2s}

#feedback-fab .fb-icon{font-size:16px}
@media (max-width: 600px){#feedback-fab{font-size:11px;padding:8px 12px}#feedback-fab .fb-label{display:none}}
/* v10.28: touch action dla suwaka i map — lepsze gesty na telefonie */
#sl{touch-action:manipulation}
.ys-strip-wrap{touch-action:none}


#land-head-r{display:flex;align-items:center;gap:10px}
#land-share-btn{background:#f97316;border:1.5px solid #f97316;color:#fff;font-family:inherit;font-size:12px;font-weight:800;padding:9px 18px;border-radius:10px;cursor:pointer;box-shadow:0 4px 14px rgba(249,115,22,.35);transition:background .18s,box-shadow .18s,transform .12s;letter-spacing:.3px}
#land-share-btn:hover{background:#ea580c;box-shadow:0 6px 20px rgba(249,115,22,.5);transform:translateY(-1px)}
#fp-share-btn{position:fixed;bottom:20px;right:20px;top:auto;z-index:50;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#fff8e2,#f1e6c2);border:2px solid #b8860b;color:#5a3a08;font-family:'DM Sans',sans-serif;font-size:18px;font-weight:800;width:52px;height:52px;padding:0;border-radius:50%;cursor:pointer;box-shadow:0 4px 14px rgba(184,134,11,.5),0 2px 6px rgba(0,0,0,.3);transition:all .2s}


#land-lang{position:relative;display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);color:#e2e8f0;font-family:inherit;font-size:12px;font-weight:600;padding:7px 12px 7px 11px;border-radius:100px;cursor:pointer;backdrop-filter:blur(12px);transition:all .2s;letter-spacing:.2px}

#land-lang .lf{font-size:15px;line-height:1}
#land-lang .lt{letter-spacing:.4px;color:#fff !important;font-weight:800 !important}
#land-lang select{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer;font-family:inherit}
#land-lang::after{content:'▾';font-size:9px;color:#94a3b8;margin-left:2px}

/* Hero text — compact */
#land-hero{text-align:center;margin:28px auto 0;max-width:900px;animation:heroIn 1s cubic-bezier(.2,.7,.2,1);flex-shrink:0}
@keyframes heroIn{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
.land-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(56,189,248,.1);border:1px solid rgba(56,189,248,.25);color:#38bdf8;font-size:10px;font-weight:700;padding:5px 12px;border-radius:100px;letter-spacing:2px;text-transform:uppercase;margin-bottom:16px;backdrop-filter:blur(8px)}
.land-badge .bd{width:6px;height:6px;border-radius:50%;background:#38bdf8;box-shadow:0 0 10px #38bdf8;animation:pulse 2s infinite}
#land-title{font-size:clamp(32px,5.5vw,64px);font-weight:800;line-height:1.05;letter-spacing:-2px;color:#fff;margin-bottom:14px}
#land-title span{display:block;background:linear-gradient(135deg,#38bdf8 0%,#818cf8 50%,#f472b6 100%);-webkit-background-clip:text;background-clip:text;color:transparent;background-size:200% 200%;animation:grad 6s ease-in-out infinite}
@keyframes grad{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}


/* 3D Cards grid — FANNED layout: each card slightly rotated/offset */
#land-cards-wrap{padding:20px 0 16px;perspective:1800px;flex-shrink:0;position:relative}
#land-cards{display:flex;justify-content:center;align-items:flex-end;gap:0;max-width:1200px;margin:0 auto;padding:0 40px;min-height:300px}
#land-cards .lcard{flex:0 0 auto;width:200px;margin:0 -14px;transition:transform .5s cubic-bezier(.2,.7,.2,1),box-shadow .4s,z-index 0s .2s}
/* Initial fan positions — left cards rotated left, right cards rotated right */
#land-cards .lcard:nth-child(1){transform:rotate(-8deg) translateY(24px)}
#land-cards .lcard:nth-child(2){transform:rotate(-4deg) translateY(8px)}
#land-cards .lcard:nth-child(3){transform:rotate(0deg) translateY(-8px);z-index:2}
#land-cards .lcard:nth-child(4){transform:rotate(4deg) translateY(8px)}
#land-cards .lcard:nth-child(5){transform:rotate(8deg) translateY(24px)}
/* Group hover — spread cards further apart when hovering over the fan */
#land-cards:hover .lcard:nth-child(1){transform:rotate(-12deg) translate(-12px,22px)}
#land-cards:hover .lcard:nth-child(2){transform:rotate(-6deg) translate(-4px,6px)}
#land-cards:hover .lcard:nth-child(3){transform:rotate(0deg) translateY(-14px)}
#land-cards:hover .lcard:nth-child(4){transform:rotate(6deg) translate(4px,6px)}
#land-cards:hover .lcard:nth-child(5){transform:rotate(12deg) translate(12px,22px)}
/* Individual card hover — lift out of the fan, straighten, highlight */
#land-cards .lcard:hover{transform:rotate(0deg) translateY(-28px) scale(1.08) !important;z-index:10;transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s,z-index 0s}

@media (max-width:900px){
  #land-cards{flex-wrap:wrap;gap:12px;padding:0 16px;min-height:auto}
  #land-cards .lcard{margin:0;width:calc(33.333% - 8px)}
  #land-cards .lcard:nth-child(n){transform:none}
  #land-cards:hover .lcard:nth-child(n){transform:none}
  #land-cards .lcard:hover{transform:translateY(-8px) scale(1.04) !important}
}
/* v10.31: hamburger menu — domyślnie ukryte (desktop) */
.m-burger{display:none;position:absolute;top:8px;z-index:36;background:rgba(248,242,225,0.5);border:1px solid rgba(181,155,106,0.5);border-radius:8px;width:42px;height:42px;font-size:20px;color:#2a1f10;cursor:pointer;box-shadow:0 4px 12px rgba(60,40,15,.2);align-items:center;justify-content:center;font-family:inherit;line-height:1;padding:0}
.m-burger:active{transform:scale(0.95)}
#m-burger-left{left:8px}
#m-burger-right{right:8px;font-size:18px}
.m-sheet{display:none;position:fixed;inset:0;z-index:300;pointer-events:none}
.m-sheet.open{display:block;pointer-events:auto}
.m-sheet-bg{position:absolute;inset:0;background:rgba(0,0,0,0.5);opacity:0;transition:opacity .25s;backdrop-filter:blur(2px)}
.m-sheet.open .m-sheet-bg{opacity:1}
.m-sheet-content{position:absolute;left:0;right:0;top:0;background:linear-gradient(180deg,#fff8e2,#f1e6c2);border-bottom-left-radius:18px;border-bottom-right-radius:18px;padding:calc(14px + env(safe-area-inset-top, 0px)) 16px 18px;max-height:85vh;overflow-y:auto;transform:translateY(-100%);transition:transform .3s cubic-bezier(.4,0,.2,1);box-shadow:0 8px 32px rgba(0,0,0,.25);border-bottom:2px solid #b59b6a}
.m-sheet.open .m-sheet-content{transform:translateY(0)}
.m-sheet-content::before{content:'';position:absolute;bottom:6px;left:50%;transform:translateX(-50%);width:36px;height:4px;background:#b59b6a;border-radius:2px;opacity:.5}
.m-sheet-header{display:flex;align-items:center;justify-content:space-between;padding:8px 0 12px;border-bottom:1px solid rgba(138,109,58,.25);margin-bottom:12px;font-size:15px;font-weight:800;color:#2a1f10;font-family:'DM Sans',sans-serif}
.m-sheet-close{background:transparent;border:none;font-size:20px;color:#2a1f10;cursor:pointer;width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:6px;font-family:inherit;padding:0;line-height:1}
.m-sheet-close:active{background:rgba(138,109,58,.15)}

.m-sheet-section:last-child{margin-bottom:0}
.m-sheet-lbl{font-size:11px;font-weight:800;color:#7a5a10;text-transform:uppercase;letter-spacing:.8px;margin-bottom:8px;padding-left:2px}
.m-mirror-grid{display:flex;flex-wrap:wrap;gap:6px}
/* v12.13: hamburger — wąski panel (60%) przy prawej krawędzi, wszystko do prawej */
@media (max-width:760px), (orientation:landscape) and (max-height:620px){
  #m-sheet-right .m-sheet-content{
    left:auto !important;
    right:0 !important;
    width:62% !important;
    min-width:210px !important;
    max-width:290px !important;
    border-bottom-left-radius:18px !important;
    border-bottom-right-radius:0 !important;
    padding:calc(12px + env(safe-area-inset-top,0px)) 12px 14px !important;
  }
  #m-sheet-right .m-sheet-header{justify-content:space-between !important}
  #m-sheet-right #m-sheet-right-title{font-size:14px !important}
  #m-sheet-right .m-sheet-lbl{text-align:right !important;font-size:9px !important;margin-bottom:5px !important}
  #m-sheet-right .m-sheet-section{margin-bottom:10px !important}
  #m-mirror-tabs > *,
  #m-mirror-ranking > *{
    justify-content:flex-end !important;
    text-align:right !important;
    font-size:11px !important;
    padding:6px 10px !important;
    min-height:32px !important;
  }
}

/* v12.12: hamburger — WSZYSTKO w jednej kolumnie, zwarte.
   Koniec z rozjeżdżaniem się kafelków w bok. */
.m-sheet-section{margin-bottom:12px !important}
.m-sheet-lbl{font-size:10px !important;margin-bottom:6px !important}

/* Warstwy mapy: jedna pod drugą, pełna szerokość, tekst do lewej */
#m-mirror-tabs{display:flex !important;flex-direction:column !important;gap:5px !important}
#m-mirror-tabs > *{flex:none !important;width:100% !important;justify-content:flex-start !important;text-align:left !important;font-size:12px !important;padding:8px 12px !important;min-height:36px !important;border-radius:8px !important}

/* Ranking: tak samo jak warstwy (bo to też warstwa) */
#m-mirror-ranking{display:flex !important;flex-direction:column !important}
#m-mirror-ranking > *{width:100% !important;justify-content:flex-start !important;text-align:left !important;font-size:12px !important;padding:8px 12px !important;min-height:36px !important;border-radius:8px !important}

/* Paszport i Język: zwarte pola, nie na całą szerokość */
#m-mirror-psp, #m-mirror-lang{display:block !important}
#m-mirror-psp > *, #m-mirror-lang > *{width:auto !important;max-width:170px !important}
.m-mirror-grid > *{flex-shrink:0}
.m-mirror-grid .nb,.m-mirror-grid .lt,.m-mirror-grid .gb{font-size:12px !important;padding:8px 14px !important;min-height:38px !important;border-radius:18px !important;display:inline-flex !important;align-items:center !important;white-space:nowrap !important}
.m-mirror-grid select{background:#fff;border:1px solid #b59b6a;border-radius:8px;padding:8px 12px;font-family:inherit;font-size:13px;color:#2a1f10;outline:none;width:100%;min-height:40px}
.m-mirror-grid > .fp-psp-lbl{font-size:11px;color:#7a5a10;margin-right:4px}

/* v10.32+v10.33: RESET mobile layout (do 760px) — jedna spójna sekcja */
@media (max-width:760px), (orientation:landscape) and (max-height:620px){
  /* v10.33: wyłącz transformy floatów (były przeskalowywane przez updateZoomComp) */
  #fp-tl,#fp-tabs,#fp-psp,#fp-lang,#fp-tr,#fp-bl,#fp-bottom,#feedback-fab,.m-burger{transform:none !important}
  /* === HAMBURGERY (widoczne na mobile) === */
 .m-burger{display:inline-flex !important;pointer-events:auto !important;z-index:40 !important;touch-action:manipulation}
 /* v12.09: lewy hamburger jest pusty (Styl+Kontynent w bębnach, Ranking w Ustawieniach) */
 #m-burger-left{display:none !important}

  /* === LOGO POŚRODKU GÓRY (między hamburgerami) === */
  #fp-tl{position:absolute !important;top:8px !important;left:6px !important;right:60px !important;max-width:none !important;width:auto !important;padding:4px 6px !important;background:transparent !important;border:none !important;display:flex !important;flex-direction:row !important;justify-content:center !important;align-items:center !important;gap:0 !important;pointer-events:none !important;z-index:34 !important;box-shadow:none !important}
  #fp-tl .logo{font-size:13px !important;pointer-events:auto !important;display:inline-flex !important}
  #fp-tl .fp-views{display:none !important}
  .fp-kompas-row{display:none !important}
  .kompas-btn-mobile{display:inline-flex !important}

  /* === UKRYTE NA MOBILE (przeniesione do hamburgerów) === */
  #fp-tabs{display:none !important}
  #fp-tr{display:none !important}
  #fp-psp{display:none !important}
  #fp-lang{display:none !important}

  /* === SUWAK DAT (dolny pasek) === */
  #fp-bottom{min-width:0 !important;max-width:calc(100vw - 28px) !important;width:calc(100vw - 28px) !important;left:14px !important;right:14px !important;transform:none !important;bottom:calc(10px + env(safe-area-inset-bottom, 0px)) !important;padding:5px 8px 6px !important;box-shadow:0 -2px 12px rgba(0,0,0,.15),0 6px 20px rgba(60,40,15,.18),inset 0 1px 0 rgba(255,255,255,.5) !important;border-width:1.5px;z-index:55 !important;touch-action:pan-x}
  #mrow{display:flex !important;flex-wrap:nowrap !important;gap:2px !important;justify-content:space-between !important;padding-right:0 !important;padding-left:0 !important;box-sizing:border-box !important;overflow:hidden !important}
  #fp-bottom #mrow{order:3}
  .mc{flex:1 1 calc(8.3333% - 2px) !important;font-size:9px !important;padding:4px 1px !important;min-height:26px;min-width:0 !important;touch-action:manipulation}
  #slrow{order:2;height:30px !important;margin-top:2px;touch-action:pan-x}
  #sl{touch-action:pan-x !important;width:100% !important;height:20px !important;-webkit-appearance:none !important;background:transparent !important}
  #sl::-webkit-slider-thumb{width:44px !important;height:24px !important;margin-top:-9px !important;border-radius:6px !important;-webkit-appearance:none !important;cursor:pointer}
  #sl::-moz-range-thumb{width:44px !important;height:28px !important;border-radius:7px !important;cursor:pointer}
  #sl::-webkit-slider-runnable-track{height:6px !important;border-radius:3px !important}
  #sl::-moz-range-track{height:6px !important;border-radius:3px !important}

  /* === LEGENDA — portrait, v12.02: naprawione na PRAWDZIWEJ strukturze (.collapsed), poprzedni blok celował w nieistniejącą .open === */
  #fp-bl{display:block !important;position:absolute !important;bottom:calc(230px + env(safe-area-inset-bottom, 0px)) !important;left:8px !important;max-width:150px !important;width:auto !important;padding:8px 10px !important;background:rgba(248,242,225,.97) !important;border:1px solid #b59b6a !important;border-radius:10px !important;backdrop-filter:blur(10px) !important;box-shadow:0 8px 24px rgba(60,40,15,.22) !important;z-index:60 !important;pointer-events:auto !important;max-height:40vh !important;overflow-y:auto !important}
  #fp-bl-lbl{font-size:9px !important;margin-bottom:4px !important}
  #fp-bl-content .lr{font-size:9px !important;gap:5px !important}
  #fp-bl-content .ld{width:11px !important;height:11px !important}
  #fp-bl.collapsed{max-width:0 !important;max-height:none !important;overflow:visible !important;padding:0 !important;background:transparent !important;border:none !important;box-shadow:none !important}
  #fp-bl.collapsed #fp-bl-open{display:inline-flex !important;padding:8px 12px !important;font-size:11px !important}


  /* === FEEDBACK FAB (prawy dolny) === */
  #feedback-fab{bottom:calc(160px + env(safe-area-inset-bottom, 0px)) !important;right:8px !important;font-size:10px !important;padding:8px 12px !important;min-height:40px !important;min-width:44px;border-width:1.5px;touch-action:manipulation;z-index:35 !important}
  #feedback-fab .fb-label{display:none}
  #feedback-fab .fb-icon{font-size:16px !important}

  /* === PILLE WEWNĄTRZ BOTTOM-SHEET (gdy w modalu) === */
  .m-mirror-grid .nb,.m-mirror-grid .lt,.m-mirror-grid .gb{font-size:12px !important;padding:10px 16px !important;min-height:42px !important;border-radius:18px !important;display:inline-flex !important;align-items:center !important;white-space:nowrap !important;touch-action:manipulation}

  /* === 'Najlepszy czas' wzmocniony === */
  div[style*="background:#00c89615"],
  div[style*="background:#7ed32115"],
  div[style*="background:#ffb70015"]{
    font-size:13px !important;
    padding:10px 14px !important;
    line-height:1.5 !important;
  }
}
@media (max-width:760px) and (orientation:landscape){
  #fp-bottom{bottom:4px !important;padding:4px 8px 6px !important}
  #fp-bl{bottom:calc(100px + env(safe-area-inset-bottom,0px)) !important}
  #feedback-fab{bottom:calc(100px + env(safe-area-inset-bottom,0px)) !important}
}

/* v11.22: RESET LANDSCAPE dla WSZYSTKICH telefonów w orientacji poziomej,
   niezależnie od szerokości — kryterium to ORIENTACJA + NISKA WYSOKOŚĆ
   ekranu (typowy telefon w landscape ma wysokość ekranu poniżej ~500px).
   Bez tego bloku telefony szerokie w landscape (>760px szerokości) dostają
   layout desktopowy, którego elementy nakładają się na siebie. */
@media (orientation:landscape) and (max-height:620px){
  /* Wyłącz transformy floatów, jak w resecie portrait */
  #fp-tl,#fp-tabs,#fp-psp,#fp-lang,#fp-tr,#fp-bl,#fp-bottom,#feedback-fab,.m-burger{transform:none !important}

  /* === HAMBURGERY widoczne, jak na portrait === */
  .m-burger{display:inline-flex !important;pointer-events:auto !important;z-index:40 !important;touch-action:manipulation;top:6px !important}
  #m-burger-left{display:none !important}
  #m-burger-right{right:6px !important}

  /* === v12.35: BĘBNY (Obszar + Styl) — brakowało ich w landscape, przez co telefon w poziomie dostawał layout desktopowy === */
  .wdrum2-box{display:block !important;top:44px !important}
  #wdrum2-area{left:6px !important}
  #wdrum2-style{right:6px !important}
  #map-home-btn{display:none !important}


  /* === LOGO POŚRODKU GÓRY, mniejsze bo mało miejsca w pionie === */
  #fp-tl{position:absolute !important;top:6px !important;left:6px !important;right:54px !important;max-width:none !important;width:auto !important;padding:2px 4px !important;background:transparent !important;border:none !important;display:flex !important;flex-direction:row !important;justify-content:center !important;align-items:center !important;gap:0 !important;pointer-events:none !important;z-index:34 !important;box-shadow:none !important}
  #fp-tl .logo{font-size:11px !important;pointer-events:auto !important;display:inline-flex !important}
  #fp-tl .fp-views{display:none !important}
  .fp-kompas-row{display:none !important}
  .kompas-btn-mobile{display:inline-flex !important}

  /* === UKRYTE — przeniesione do hamburgerów (jak na portrait) === */
  #fp-tabs{display:none !important}
  #fp-tr{display:none !important}
  #fp-psp{display:none !important}
  #fp-lang{display:none !important}

  /* === PASEK DAT — niski, węższy margines boczny bo szerokości jest dużo === */
  #fp-bottom{min-width:0 !important;max-width:calc(100vw - 120px) !important;width:calc(100vw - 120px) !important;left:60px !important;right:60px !important;transform:none !important;bottom:calc(6px + env(safe-area-inset-bottom,0px)) !important;padding:4px 8px 5px !important;box-shadow:0 -2px 12px rgba(0,0,0,.15),0 6px 20px rgba(60,40,15,.18),inset 0 1px 0 rgba(255,255,255,.5) !important;border-width:1.5px;z-index:55 !important;touch-action:pan-x}
  #mrow{display:flex !important;flex-wrap:nowrap !important;gap:3px !important;justify-content:space-between !important}
  #fp-bottom #mrow{order:3}
  .mc{flex:1 1 calc(8.3333% - 3px) !important;font-size:9px !important;padding:3px 1px !important;min-height:22px;min-width:0 !important;touch-action:manipulation}
  #slrow{order:2;height:20px !important;margin-top:1px;touch-action:pan-x}
  #sl{touch-action:pan-x !important;width:100% !important;height:22px !important;-webkit-appearance:none !important;background:transparent !important}
  #sl::-webkit-slider-thumb{width:36px !important;height:20px !important;margin-top:-9px !important;border-radius:6px !important;-webkit-appearance:none !important;cursor:pointer}
  #sl::-moz-range-thumb{width:36px !important;height:20px !important;border-radius:6px !important;cursor:pointer}
  #sl::-webkit-slider-runnable-track{height:5px !important;border-radius:3px !important}
  #sl::-moz-range-track{height:5px !important;border-radius:3px !important}

  /* === LEGENDA — landscape, v12.01: naprawione na PRAWDZIWEJ strukturze (.collapsed, realne przyciski), poprzedni blok celował w nieistniejącą klasę .open === */
  #fp-bl{display:block !important;position:absolute !important;top:auto !important;bottom:calc(64px + env(safe-area-inset-bottom, 0px)) !important;left:6px !important;max-width:170px !important;width:auto !important;padding:6px 8px !important;background:rgba(248,242,225,.97) !important;border:1px solid #b59b6a !important;border-radius:10px !important;backdrop-filter:blur(10px) !important;box-shadow:0 8px 24px rgba(60,40,15,.22) !important;z-index:35 !important;pointer-events:auto !important;max-height:calc(100vh - 60px) !important;overflow-y:auto !important}
  #fp-bl-lbl{font-size:8px !important;margin-bottom:3px !important}
  #fp-bl-content .lr{font-size:8px !important;gap:4px !important}
  #fp-bl-content .ld{width:9px !important;height:9px !important}
  #fp-bl.collapsed{max-width:0 !important;max-height:none !important;overflow:visible !important;padding:0 !important;background:transparent !important;border:none !important;box-shadow:none !important}
  #fp-bl.collapsed #fp-bl-open{display:inline-flex !important;padding:5px 9px !important;font-size:10px !important}


  /* === FEEDBACK FAB — prawy górny obszar, pod hamburgerem, NIE w stosie nad paskiem dat === */
  #feedback-fab{position:fixed !important;top:48px !important;bottom:auto !important;right:6px !important;font-size:9px !important;padding:6px 9px !important;min-height:36px !important;min-width:36px;border-width:1.5px;touch-action:manipulation;z-index:35 !important}
  #feedback-fab .fb-label{display:none}
  #feedback-fab .fb-icon{font-size:14px !important}

  /* === PILLE WEWNĄTRZ BOTTOM-SHEET (modal) — bez zmian względem portrait === */
  .m-mirror-grid .nb,.m-mirror-grid .lt,.m-mirror-grid .gb{font-size:11px !important;padding:8px 14px !important;min-height:38px !important;border-radius:16px !important;display:inline-flex !important;align-items:center !important;white-space:nowrap !important;touch-action:manipulation}

  /* === Bottom-sheet modale — ograniczyć wysokość, bo mało miejsca w pionie === */
  .m-sheet-content{max-height:90vh !important}
}
@media (max-width:380px){
  /* v10.30: logo zostaje — branding musi być widoczny */
  #fp-tl .logo{font-size:10px !important;display:inline-flex !important}
  #fp-tabs .lt{font-size:10px !important;padding:6px 9px !important;min-height:32px}
  .mc{font-size:10px !important;min-width:38px}
  .fp-styles .gb{font-size:9px !important;padding:4px 7px !important}
  
  #fp-psp{font-size:10px !important;padding:3px 6px !important}
}
@media (max-width:600px){
  #land-cards .lcard{width:calc(50% - 6px)}
}

.lcard{position:relative;aspect-ratio:2/3;border-radius:16px;overflow:hidden;cursor:pointer;background:#1c2330;border:2px solid rgba(255,255,255,.12);transform-style:preserve-3d;transition:transform .4s cubic-bezier(.4,0,.2,1),box-shadow .4s;animation:cardIn .8s backwards cubic-bezier(.2,.7,.2,1);will-change:transform;max-height:310px;box-shadow:0 16px 36px rgba(0,0,0,.55),0 4px 8px rgba(0,0,0,.4)}
.lcard:nth-child(1){animation-delay:.15s}.lcard:nth-child(2){animation-delay:.25s}.lcard:nth-child(3){animation-delay:.35s}.lcard:nth-child(4){animation-delay:.45s}.lcard:nth-child(5){animation-delay:.55s}.lcard:nth-child(6){animation-delay:.65s}
@keyframes cardIn{from{opacity:0;transform:translateY(40px) rotateX(-8deg)}to{opacity:1;transform:translateY(0) rotateX(0)}}
.lcard:hover{box-shadow:0 40px 90px -20px rgba(0,0,0,.85),0 20px 40px -10px rgba(56,189,248,.3),0 0 0 1px rgba(255,255,255,.15)}
.lcard-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s cubic-bezier(.4,0,.2,1);transform:scale(1.08)}
.lcard[data-g="nature"] .lcard-bg{object-position:center center}
.lcard:hover .lcard-bg{transform:scale(1.18)}
/* v10.49: subtle vignette + środkowe zaciemnienie — czytelność tytułów nad jasnymi fragmentami zdjęć (np. mgła w lesie) */
.lcard-grad{
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:1;
  background:
    radial-gradient(ellipse at center, rgba(0,0,0,0) 35%, rgba(0,0,0,.25) 100%),
    linear-gradient(180deg, rgba(0,0,0,.15) 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,0) 60%, rgba(0,0,0,.15) 100%);
  transition:opacity .4s;
}
.lcard:hover .lcard-grad{opacity:.6}
.lcard-glow{display:none}
.lcard:hover .lcard-glow{display:none}
.lcard-body{position:absolute;bottom:0;left:0;right:0;padding:42px 14px 16px;z-index:2;transform:translateZ(30px);background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.55) 45%,rgba(0,0,0,.88) 100%);border-radius:0 0 14px 14px}
.lcard-icon{font-size:20px;line-height:1;margin-bottom:4px;filter:drop-shadow(0 4px 12px rgba(0,0,0,.7));transform:translateZ(20px);transition:transform .4s}
.lcard:hover .lcard-icon{transform:translateZ(50px) scale(1.15)}
.lcard-title{font-size:14px;font-weight:800;color:#fff;line-height:1.15;letter-spacing:-.3px;margin-bottom:5px;text-shadow:0 2px 14px rgba(0,0,0,.85),0 1px 2px rgba(0,0,0,.9)}
.lcard-desc{font-size:11px;color:rgba(255,255,255,.95);line-height:1.35;text-shadow:0 1px 8px rgba(0,0,0,.9),0 1px 2px rgba(0,0,0,.85);font-weight:600;letter-spacing:.1px}
.lcard-arrow{position:absolute;top:12px;right:12px;width:30px;height:30px;background:rgba(255,255,255,.08);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.15);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:13px;font-weight:700;z-index:2;opacity:0;transform:translate(8px,-8px) scale(.8);transition:all .35s cubic-bezier(.2,.7,.2,1)}
.lcard:hover .lcard-arrow{opacity:1;transform:translate(0,0) scale(1);background:rgba(56,189,248,.35);border-color:rgba(56,189,248,.5)}

/* Image loading status badge */



/* Wild Adventure button: rządek ikon sportów zamiast pojedynczej ikony */


/* Wild Adventure: bez kolorowego filtra, lżejszy gradient, siatka sportów jako ikona */
.lcard-adventure .lcard-grad{background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.05) 45%,rgba(0,0,0,.7) 100%)}
.lcard-adventure:hover .lcard-grad{background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.1) 35%,rgba(0,0,0,.85) 100%)}
.lcard-sports{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;font-size:14px;line-height:1;margin-bottom:8px;width:fit-content;padding:6px 8px;border-radius:8px;background:rgba(0,0,0,.35);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.15);filter:drop-shadow(0 4px 10px rgba(0,0,0,.5))}
.lcard-sports span{display:inline-block;transition:transform .3s}
.lcard-adventure:hover .lcard-sports span:nth-child(odd){transform:translateY(-2px) rotate(-6deg)}
.lcard-adventure:hover .lcard-sports span:nth-child(even){transform:translateY(2px) rotate(6deg)}

/* Footer */
#land-foot{display:flex;align-items:center;justify-content:center;gap:20px;padding:16px 0 0;font-size:10px;color:#64748b;font-weight:500;letter-spacing:.3px;flex-shrink:0}
#land-foot .dot{width:3px;height:3px;border-radius:50%;background:#475569}
#land-foot span:hover{color:#94a3b8;cursor:default}

/* ═══════════════════════════════════════════════════════════════════════ */
/* 3D KEYCAP BUTTONS — cyber/mechanical feel                              */
/* ═══════════════════════════════════════════════════════════════════════ */

/* Central MAP button — massive retro keycap like Enter/Space bar */
/* v10.46: vintage atlas medalion CTA */
#map-cta-wrap{display:flex;justify-content:center;align-items:center;margin:36px auto 28px;perspective:1200px}
#map-cta{position:relative;width:220px;height:130px;cursor:pointer;user-select:none;background:none;border:none;padding:0;font-family:inherit;animation:ctaFloat 4.5s ease-in-out infinite;transition:transform .15s cubic-bezier(.2,.7,.2,1)}
@keyframes ctaFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
#map-cta-top{position:absolute;inset:0;background:linear-gradient(160deg,#1e293b 0%,#0f172a 100%);border:2px solid #f97316;border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:#3b2f1e;font-weight:800;letter-spacing:2px;font-size:20px;transform:translateZ(14px);transition:transform .15s,box-shadow .2s;box-shadow:inset 0 2px 0 rgba(255,255,255,.75),inset 0 -3px 0 rgba(120,90,40,.18),inset 0 -10px 20px rgba(120,90,40,.12),0 4px 0 #8a7548,0 10px 22px rgba(60,40,15,.35),0 0 0 4px rgba(212,175,55,.12)}
#map-cta-top::before{content:'';position:absolute;top:14px;left:50%;transform:translateX(-50%);width:48px;height:48px;border-radius:50%;background:radial-gradient(circle at 35% 30%, rgba(255,255,255,.6), rgba(212,175,55,.18) 60%, transparent 70%);border:1.5px solid rgba(184,134,11,.5);box-shadow:inset 0 1px 2px rgba(255,255,255,.5),inset 0 -2px 3px rgba(120,90,40,.25);pointer-events:none}
#map-cta-top::after{content:'';position:absolute;bottom:14px;left:24px;right:24px;height:1px;background:linear-gradient(90deg,transparent,rgba(120,90,40,.4) 20%,rgba(184,134,11,.6) 50%,rgba(120,90,40,.4) 80%,transparent);pointer-events:none}
#map-cta-glow{position:absolute;inset:-10px;border-radius:18px;background:radial-gradient(ellipse at center, rgba(249,115,22,.55), rgba(234,88,12,.22) 50%, transparent 75%);filter:blur(18px);opacity:.65;z-index:-1;transition:all .35s;animation:ctaGlow 4s ease-in-out infinite}
@keyframes ctaGlow{0%,100%{opacity:.55;filter:blur(18px)}50%{opacity:.85;filter:blur(24px)}}
#map-cta-side{position:absolute;inset:0;background:#020617;border-radius:14px;transform:translateZ(0);box-shadow:0 0 0 1px #f97316,0 14px 32px rgba(0,0,0,.5),0 0 40px rgba(249,115,22,.15)}
#map-cta-icon{position:relative;font-size:30px;line-height:1;margin-top:6px;filter:drop-shadow(0 1px 3px rgba(249,115,22,.6));transition:transform .5s cubic-bezier(.2,.7,.2,1);z-index:1}
#map-cta:hover #map-cta-icon{transform:rotate(360deg) scale(1.12)}
#map-cta-label{font-family:'DM Mono',monospace;font-size:13px;letter-spacing:3.5px;color:#f97316;text-shadow:0 1px 0 rgba(0,0,0,.3);font-weight:700}
#map-cta:hover{transform:translateY(-2px)}





#map-cta:hover #map-cta-glow{opacity:.9;filter:blur(30px)}
#map-cta:active{transform:translateY(4px)}
#map-cta:active #map-cta-top{transform:translateZ(8px);box-shadow:inset 0 2px 0 rgba(255,255,255,.15),inset 0 -2px 0 rgba(0,0,0,.4),inset 0 -4px 8px rgba(0,0,0,.3),0 2px 0 #060709,0 4px 8px rgba(0,0,0,.5),0 0 30px rgba(56,189,248,.2)}
.cta-hint{font-family:'DM Mono',monospace;font-size:10px;color:#94a3b8;letter-spacing:3px;text-transform:uppercase;margin-top:24px;text-align:center}
.cta-hint .kbd{display:inline-block;background:linear-gradient(180deg,#3a4150 0%,#1e232d 100%);border:1px solid #0a0c10;border-top-color:#4a5263;border-radius:3px;padding:2px 7px;margin:0 3px;color:#e2e8f0;box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 1px 0 #060709,0 2px 2px rgba(0,0,0,.4);font-size:9px}

/* ═══════════════════════════════════════════════════════════════════════ */
/* MAP UI — mechanical/machine aesthetic                                  */
/* ═══════════════════════════════════════════════════════════════════════ */

/* Enhanced nav — retro mechanical keyboard keys (IBM Model M vibes) */
nav{background:linear-gradient(180deg,#1a1e26 0%,#10131a 100%);border-bottom:2px solid #0a0c10;box-shadow:0 4px 12px rgba(0,0,0,.5),inset 0 -2px 0 rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.04)}
.nb{position:relative;background:#1e232d;border:1px solid #2a303c;border-radius:8px;color:#cbd5e1;transition:background .18s,color .18s,border-color .18s;padding:8px 16px;font-size:12px;font-weight:700;letter-spacing:.5px;text-transform:uppercase}




/* Datebar — cockpit/machine panel with deep key wells */
#datebar{background:linear-gradient(180deg,#0a0c10 0%,#12151c 35%,#151920 100%);border-bottom:2px solid #000;padding:12px 16px 14px;box-shadow:inset 0 2px 4px rgba(0,0,0,.6),0 2px 8px rgba(0,0,0,.4);position:relative}
#datebar::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(56,189,248,.4) 30%,rgba(129,140,248,.4) 50%,rgba(56,189,248,.4) 70%,transparent)}

/* Month keys — chunky 3D retro keycaps */
#mrow{display:flex;gap:3px;padding:0}
.mc{flex:1;position:relative;text-align:center;padding:3px 2px 4px;font-family:'DM Mono',monospace;font-size:10px;font-weight:700;color:#94a3b8;cursor:pointer;text-transform:uppercase;letter-spacing:1px;background:linear-gradient(180deg,#3a4150 0%,#252b36 100%);border:1px solid #0c0e13;border-top-color:#4a5263;border-radius:3px;transition:transform .08s,box-shadow .08s;user-select:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 1px 0 #060709,0 2px 3px rgba(0,0,0,.35);text-shadow:0 -1px 0 rgba(0,0,0,.6);line-height:1.2}
.mc:hover{color:#e2e8f0;background:linear-gradient(180deg,#434a5a 0%,#2e3440 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 1px 0 #060709,0 2px 4px rgba(0,0,0,.45)}
.mc.on2{color:#7dd3fc;background:linear-gradient(180deg,#334155 0%,#0f172a 100%);border-color:#0a0f1a;box-shadow:inset 0 1px 0 rgba(125,211,252,.2),0 1px 0 #020617,0 0 5px rgba(56,189,248,.2),0 2px 3px rgba(0,0,0,.4);text-shadow:0 -1px 0 rgba(0,0,0,.6),0 0 5px rgba(56,189,248,.6)}
.mc:active{transform:translateY(1px);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 0 0 #060709,0 1px 2px rgba(0,0,0,.4)}

/* Slider — machine rail with illuminated track */
#slrow{position:relative;height:24px;margin-top:6px;padding:0 4px}
#slrow::before{content:'';position:absolute;top:50%;left:4px;right:4px;height:8px;background:linear-gradient(180deg,#0a0e14 0%,#050709 100%);border:1px solid rgba(0,0,0,.6);border-radius:10px;transform:translateY(-50%);box-shadow:inset 0 2px 4px rgba(0,0,0,.8),inset 0 -1px 0 rgba(255,255,255,.03);pointer-events:none}
#slrow::after{content:'';position:absolute;top:50%;left:8px;right:8px;height:2px;background:linear-gradient(90deg,rgba(56,189,248,.1),rgba(56,189,248,.35) 50%,rgba(56,189,248,.1));transform:translateY(-50%);border-radius:2px;pointer-events:none;box-shadow:0 0 8px rgba(56,189,248,.4)}
#sl{display:block;width:100%;height:24px;background:transparent;-webkit-appearance:none;appearance:none;cursor:pointer;position:relative;z-index:2}
#sl::-webkit-slider-runnable-track{height:24px;background:transparent}
#sl::-webkit-slider-thumb{-webkit-appearance:none;width:var(--tw,32px);height:18px;border-radius:4px;background:linear-gradient(180deg,#38bdf8 0%,#0284c7 100%);border:1px solid rgba(255,255,255,.3);margin-top:3px;cursor:grab;box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 0 12px rgba(56,189,248,.6),0 2px 4px rgba(0,0,0,.4);transition:box-shadow .15s}
#sl::-webkit-slider-thumb:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 0 18px rgba(56,189,248,.8),0 3px 6px rgba(0,0,0,.5)}
#sl::-webkit-slider-thumb:active{cursor:grabbing}
#sl::-moz-range-track{height:24px;background:transparent}
#sl::-moz-range-thumb{width:var(--tw,32px);height:18px;border-radius:4px;background:linear-gradient(180deg,#38bdf8 0%,#0284c7 100%);border:1px solid rgba(255,255,255,.3);cursor:grab;box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 0 12px rgba(56,189,248,.6),0 2px 4px rgba(0,0,0,.4)}

/* Date label — digital readout */
#dL{background:linear-gradient(180deg,#0a0e14 0%,#050709 100%);color:#38bdf8;border:1px solid rgba(56,189,248,.25);padding:6px 14px;border-radius:6px;font-family:'DM Mono',monospace;font-size:11px;font-weight:700;letter-spacing:1px;box-shadow:inset 0 1px 2px rgba(0,0,0,.6),0 0 8px rgba(56,189,248,.15);text-shadow:0 0 6px rgba(56,189,248,.5)}

/* Travel style sidebar — chunky retro keycaps */
#sb{background:linear-gradient(180deg,#10131a 0%,#0a0c10 100%);box-shadow:inset -2px 0 4px rgba(0,0,0,.4)}
.gb{background:#1e232d;border:1px solid #2a303c;border-radius:8px;padding:11px 14px 12px;transition:background .18s,color .18s,border-color .18s;position:relative;color:#cbd5e1;margin-bottom:6px}



/* ───────────────────────────────────────────────────────────────────────
   Reduced-motion + a11y baseline
   - Honour OS-level prefers-reduced-motion: kill Ken Burns, drift, spins, parallax.
   - Keep functional transitions (panel slide-in) but shorten to 1ms so layout still updates.
   - Visible focus ring for keyboard users on every interactive element.
   ─────────────────────────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important; animation-iteration-count:1 !important;
    transition-duration:.001ms !important; scroll-behavior:auto !important;
  }
  .ph-img,#land-photo,#land-bg,.orb{animation:none !important; transform:none !important}
}
:focus-visible{outline:2px solid #38bdf8 !important; outline-offset:2px; border-radius:4px}
button:focus-visible,[role="button"]:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:2px solid #38bdf8 !important; outline-offset:2px;
}
.pcard:focus-visible,.qchip:focus-visible,.gi:focus-visible,.rc:focus-visible{
  outline:2px solid #b8860b !important; outline-offset:2px;
}
/* v11.52: UNIFIED UI STYLE v2 — transparent white + navy borders + strong active */

/* ═══ 1. TOOLBAR CELE PODRÓŻY / WIZY / BUDŻET ═══ */
#fp-tabs{
  background:rgba(255,255,255,.5) !important;
  border:1.5px solid #0f172a !important;
  border-radius:12px !important;
  padding:5px !important;
  box-shadow:0 4px 16px rgba(15,23,42,.12) !important;
  backdrop-filter:blur(8px) !important;
  -webkit-backdrop-filter:blur(8px) !important;
}
.lt{
  background:transparent !important;
  border:1.5px solid transparent !important;
  border-radius:8px !important;
  padding:10px 18px !important;
  font-size:12px !important;
  font-weight:700 !important;
  color:#334155 !important;
  letter-spacing:.5px !important;
  text-transform:uppercase !important;
  box-shadow:none !important;
  text-shadow:none !important;
  transition:background .18s,color .18s,border-color .18s !important;
  min-height:38px !important;
}
.lt:hover{
  background:rgba(15,23,42,.05) !important;
  color:#0f172a !important;
  border-color:transparent !important;
}

/* ═══ 2. KONTYNENTY WORLD / EUROPE / ASIA ═══ */
.nb{
  background:rgba(255,255,255,.5) !important;
  border:1.5px solid #0f172a !important;
  border-radius:10px !important;
  padding:9px 16px !important;
  font-size:12px !important;
  font-weight:700 !important;
  color:#0f172a !important;
  letter-spacing:.4px !important;
  text-transform:uppercase !important;
  box-shadow:0 2px 4px rgba(15,23,42,.08) !important;
  text-shadow:none !important;
  transition:background .18s,color .18s,border-color .18s !important;
  min-height:38px !important;
  transform:none !important;
  backdrop-filter:blur(6px) !important;
  -webkit-backdrop-filter:blur(6px) !important;
}
.nb:hover{
  background:rgba(255,255,255,.98) !important;
  color:#0f172a !important;
  border-color:#0d9488 !important;
  transform:none !important;
  box-shadow:0 3px 8px rgba(15,23,42,.12) !important;
}
.nb:active{
  background:#0f766e !important;
  transform:none !important;
}

/* ═══ 3. STYLE PODRÓŻY (Ogólny / Słońce / City break / Natura / Kultura / Dzika) ═══ */
.gb{
  background:rgba(255,255,255,.5) !important;
  border:1.5px solid #0f172a !important;
  border-radius:10px !important;
  padding:11px 16px !important;
  font-size:13px !important;
  font-weight:600 !important;
  color:#0f172a !important;
  letter-spacing:.1px !important;
  text-transform:none !important;
  box-shadow:0 2px 4px rgba(15,23,42,.08) !important;
  text-shadow:none !important;
  transition:background .18s,color .18s,border-color .18s !important;
  min-height:42px !important;
  transform:none !important;
  margin-bottom:6px !important;
  width:auto !important;
  backdrop-filter:blur(6px) !important;
  -webkit-backdrop-filter:blur(6px) !important;
}
.gb:hover{
  background:rgba(255,255,255,.98) !important;
  color:#0f172a !important;
  border-color:#0d9488 !important;
  transform:none !important;
  box-shadow:0 3px 8px rgba(15,23,42,.12) !important;
}
.gb:active{
  background:#0f766e !important;
  transform:none !important;
}

/* ═══ 4. LOGO mytravelcast (widok mapy) ═══ */
#fp-tl .logo{
  background:rgba(255,255,255,.5) !important;
  border:1.5px solid #0f172a !important;
  border-radius:10px !important;
  padding:9px 14px !important;
  color:#0f172a !important;
  font-size:14px !important;
  font-weight:800 !important;
  letter-spacing:-.3px !important;
  cursor:pointer !important;
  transition:background .18s,border-color .18s !important;
  min-height:38px !important;
  display:inline-flex !important;
  align-items:center !important;
  box-shadow:0 2px 6px rgba(15,23,42,.1) !important;
  backdrop-filter:blur(6px) !important;
  -webkit-backdrop-filter:blur(6px) !important;
}
#fp-tl .logo em{
  color:#0d9488 !important;
  font-style:normal !important;
  font-weight:800 !important;
}
#fp-tl .logo:hover{
  background:rgba(255,255,255,.98) !important;
  border-color:#0d9488 !important;
  opacity:1 !important;
}

/* ═══ 5. PRZYCISK HOME (dom) ═══ */
#map-home-btn{
  background:rgba(255,255,255,.5) !important;
  border:1.5px solid #0f172a !important;
  color:#0d9488 !important;
  width:38px !important;
  height:38px !important;
  border-radius:10px !important;
  cursor:pointer !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:0 !important;
  transition:background .18s,color .18s !important;
  box-shadow:0 2px 6px rgba(15,23,42,.1) !important;
  backdrop-filter:blur(6px) !important;
  -webkit-backdrop-filter:blur(6px) !important;
}
#map-home-btn:hover{
  background:#0d9488 !important;
  border-color:#0f172a !important;
  color:#ffffff !important;
  transform:none !important;
}
#map-home-btn:active{
  background:#0f766e !important;
}

/* ═══ 6. PRZYCISK JĘZYKA ═══ */
#fp-lang{
  background:rgba(255,255,255,.5) !important;
  border:1.5px solid #0f172a !important;
  border-radius:10px !important;
  padding:8px 12px !important;
  color:#0f172a !important;
  font-size:12px !important;
  font-weight:700 !important;
  box-shadow:0 2px 6px rgba(15,23,42,.1) !important;
  transition:background .18s,border-color .18s !important;
  min-height:38px !important;
  backdrop-filter:blur(6px) !important;
  -webkit-backdrop-filter:blur(6px) !important;
}
#fp-lang:hover{
  background:rgba(255,255,255,.98) !important;
  border-color:#0d9488 !important;
}

/* ═══ 7. PRZYCISK PASZPORT ═══ */
#fp-psp{
  background:rgba(255,255,255,.5) !important;
  border:1.5px solid #0f172a !important;
  border-radius:10px !important;
  padding:8px 12px !important;
  color:#0f172a !important;
  font-size:12px !important;
  font-weight:700 !important;
  box-shadow:0 2px 6px rgba(15,23,42,.1) !important;
  transition:background .18s,border-color .18s !important;
  min-height:38px !important;
  backdrop-filter:blur(6px) !important;
  -webkit-backdrop-filter:blur(6px) !important;
}
#fp-psp:hover{
  background:rgba(255,255,255,.98) !important;
  border-color:#0d9488 !important;
}

/* ═══ 8. DOLNY SUWAK MIESIĘCY ═══ */
#fp-bottom{
  background:rgba(255,255,255,.5) !important;
  border:1.5px solid #0f172a !important;
  border-radius:12px !important;
  box-shadow:0 4px 16px rgba(15,23,42,.12) !important;
  backdrop-filter:blur(8px) !important;
  -webkit-backdrop-filter:blur(8px) !important;
}
#fp-bottom .mo,
#mrow > *{
  color:#0f172a !important;
  font-weight:700 !important;
}

/* ═══ 9. LEGENDA MAPY ═══ */

/* ═══ 10. TOOLTIP ═══ */
#tip{
  background:rgba(255,255,255,.95) !important;
  border:1.5px solid #0f172a !important;
  border-radius:10px !important;
  color:#0f172a !important;
  box-shadow:0 6px 24px rgba(15,23,42,.15) !important;
  backdrop-filter:blur(8px) !important;
  -webkit-backdrop-filter:blur(8px) !important;
}

/* ═══ 11. FEEDBACK FAB ═══ */
#feedback-fab{
  background:rgba(255,255,255,.9) !important;
  border:1.5px solid #0f172a !important;
  color:#0f172a !important;
  border-radius:24px !important;
  box-shadow:0 4px 16px rgba(15,23,42,.15) !important;
  backdrop-filter:blur(8px) !important;
  -webkit-backdrop-filter:blur(8px) !important;
}
#feedback-fab:hover{
  background:#0d9488 !important;
  border-color:#0f172a !important;
  color:#ffffff !important;
  transform:translateY(-1px) !important;
  box-shadow:0 6px 20px rgba(13,148,136,.3) !important;
}

/* ═══ 12. UDOSTĘPNIJ (round FAB) ═══ */
#fp-share-btn:hover{
  background:#0d9488 !important;
  border-color:#0f172a !important;
  color:#ffffff !important;
  transform:translateY(-2px) scale(1.03) !important;
  box-shadow:0 6px 20px rgba(13,148,136,.3) !important;
}


/* ═══ 14. CHIPY PANELU KRAJU ═══ */
.qchip:hover{
  background:rgba(255,255,255,.98) !important;
  border-color:#0d9488 !important;
  color:#0d9488 !important;
  transform:none !important;
}
.qchip.active{
  padding:8px 14px !important;
  min-height:32px !important; height:auto !important;
  background:#eab308 !important;
  border:1.5px solid #eab308 !important;
  color:#0f172a !important;
  font-weight:900 !important; font-size:13px !important;
}

/* ═══ v11.57: ocean = tło strony, termin wyróżniony, mocniejsze aktywne ═══ */

/* ═══ TŁO STRONY + OCEAN — ten sam kolor (globus znika, zostaje zarys) ═══ */
:root{
  --map-ocean-1:#a5e2ec !important;
  --map-ocean-2:#7ac9d8 !important;
}
#wrap{
  background:radial-gradient(ellipse at 50% 40%,#e0f7fa 0%,#a5e2ec 45%,#7ac9d8 100%) !important;
}

/* ═══ TERMIN "KIEDY JEDZIESZ? 31 MARCH – 13 APRIL" ═══ */
#fp-bottom > #fp-when{
  gap:10px !important;
  font-size:14px !important;
  font-weight:800 !important;
  color:#0f172a !important;
  letter-spacing:.5px !important;
  text-transform:uppercase !important;
  text-shadow:none !important;
  padding:6px 12px !important;
  border-radius:8px !important;
  background:rgba(255,255,255,.6) !important;
  border:2px solid #eab308 !important;
  display:inline-flex !important;
  align-items:center !important;
  margin:0 auto 4px !important;
  width:auto !important;
  align-self:center !important;
}
#dL{
  color:#a16207 !important;
  font-family:'DM Mono',monospace !important;
  font-size:15px !important;
  font-weight:800 !important;
  letter-spacing:.5px !important;
  background:transparent !important;
  border:none !important;
  padding:0 !important;
  text-shadow:none !important;
  box-shadow:none !important;
}

/* ═══ TOOLBAR CELE PODRÓŻY / WIZY / BUDŻET ═══ */
.lt{
  padding:8px 14px !important;
  font-size:12px !important;
  font-weight:700 !important;
  min-height:34px !important;
}

/* ═══ KONTYNENTY ═══ */
.nb{
  padding:7px 13px !important;
  font-size:12px !important;
  min-height:34px !important;
  border-width:1.5px !important;
}

/* ═══ STYLE PODRÓŻY ═══ */
.gb{
  padding:8px 14px !important;
  font-size:13px !important;
  min-height:38px !important;
  border-width:1.5px !important;
}


/* ═══ LOGO ═══ */

/* ═══ HOME + JĘZYK + PASZPORT ═══ */
#map-home-btn{
  width:38px !important;
  height:38px !important;
  border-width:1.5px !important;
}
#fp-lang,
#fp-psp{
  font-size:12px !important;
  padding:7px 12px !important;
  min-height:38px !important;
  border-width:1.5px !important;
}

/* ═══ MIESIĄCE SUWAKA ═══ */
.mc{
  background:transparent !important;
  border:2px solid transparent !important;
  color:#0f172a !important;
  font-family:'DM Mono',monospace !important;
  font-size:12px !important;
  font-weight:700 !important;
  letter-spacing:.6px !important;
  text-transform:uppercase !important;
  padding:6px 4px !important;
  border-radius:8px !important;
  cursor:pointer !important;
  transition:border-color .18s,background .18s !important;
  min-height:32px !important;
  box-shadow:none !important;
  text-shadow:none !important;
  transform:none !important;
}
.mc:hover{
  background:rgba(15,23,42,.06) !important;
  color:#0f172a !important;
}
.mc.on2{
  background:transparent !important;
  color:#0f172a !important;
  border:2px solid rgba(234,179,8,.5) !important;
}
.mc:active{
  background:rgba(234,179,8,.1) !important;
}

/* ═══ LEGENDA — z krzyżykiem X ═══ */
#fp-bl{
  position:absolute !important;
  bottom:14px !important;
  left:14px !important;
  background:rgba(255,255,255,.5) !important;
  border:1.5px solid #0f172a !important;
  border-radius:12px !important;
  padding:10px 12px !important;
  box-shadow:0 4px 16px rgba(15,23,42,.12) !important;
  backdrop-filter:blur(8px) !important;
  -webkit-backdrop-filter:blur(8px) !important;
  transition:all .25s !important;
}
#fp-bl-close{
  position:absolute !important;
  top:6px !important;
  right:6px !important;
  width:24px !important;
  height:24px !important;
  background:transparent !important;
  border:none !important;
  color:#0f172a !important;
  font-size:22px !important;
  line-height:1 !important;
  cursor:pointer !important;
  padding:0 !important;
  border-radius:6px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  transition:background .18s,color .18s !important;
  z-index:5 !important;
}
#fp-bl-close:hover{
  background:rgba(15,23,42,.08) !important;
  color:#eab308 !important;
}
#fp-bl-open{display:none !important}
#fp-bl.collapsed{
  padding:0 !important;
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
#fp-bl.collapsed #fp-bl-close,
#fp-bl.collapsed #fp-bl-lbl,
#fp-bl.collapsed #fp-bl-content{display:none !important}
#fp-bl.collapsed #fp-bl-open{
  display:inline-flex !important;
  align-items:center !important;
  gap:6px !important;
  padding:8px 14px !important;
  font-size:12px !important;
  font-weight:700 !important;
  color:#0f172a !important;
  background:rgba(255,255,255,.5) !important;
  border:1.5px solid #0f172a !important;
  border-radius:10px !important;
  cursor:pointer !important;
  backdrop-filter:blur(8px) !important;
  -webkit-backdrop-filter:blur(8px) !important;
  box-shadow:0 2px 8px rgba(15,23,42,.1) !important;
}
#fp-bl.collapsed #fp-bl-open:hover{border-color:#eab308 !important}
#fp-bl-lbl{display:flex !important;padding-right:24px !important}

/* ═══ OTWÓRZ MAPĘ ═══ */
#map-cta-top{
  background:#ffffff !important;
  border:2px solid #0f172a !important;
  box-shadow:0 6px 24px rgba(15,23,42,.15) !important;
}
#map-cta:hover #map-cta-top{
  background:rgba(255,255,255,.95) !important;
  border:3px solid #eab308 !important;
  box-shadow:0 8px 32px rgba(0,0,0,.2) !important;
}
#map-cta-label{
  color:#0f172a !important;
  font-size:13px !important;
  text-shadow:none !important;
}
#map-cta-side{
  background:#0f172a !important;
  box-shadow:0 0 0 1px #0f172a,0 14px 32px rgba(15,23,42,.4) !important;
}
#map-cta-glow{background:radial-gradient(ellipse at center, rgba(234,179,8,.35), rgba(234,179,8,.12) 50%, transparent 75%) !important}
#map-cta-icon{filter:drop-shadow(0 1px 3px rgba(234,179,8,.4)) !important}

/* ═══ LANDING TAGS ═══ */
.ltag{
  background:rgba(255,255,255,.15) !important;
  border:1.5px solid rgba(255,255,255,.3) !important;
  color:#ffffff !important;
  border-radius:10px !important;
  padding:8px 16px !important;
  font-size:13px !important;
  font-weight:600 !important;
  backdrop-filter:blur(12px) saturate(140%) !important;
  -webkit-backdrop-filter:blur(12px) saturate(140%) !important;
  box-shadow:0 2px 8px rgba(0,0,0,.15) !important;
}
/* v12.17: bez żółtej ramki — żółty oznacza stan AKTYWNY w reszcie aplikacji, to myliło */
.ltag{cursor:default !important}

/* ═══ LANDING SHARE + LANG ═══ */
#land-share-btn,
#land-lang{
  background:rgba(255,255,255,.15) !important;
  border:1.5px solid rgba(255,255,255,.3) !important;
  color:#ffffff !important;
  font-size:12px !important;
  font-weight:700 !important;
  padding:8px 14px !important;
  border-radius:10px !important;
  box-shadow:none !important;
  backdrop-filter:blur(12px) !important;
  -webkit-backdrop-filter:blur(12px) !important;
}
#land-share-btn:hover,
#land-lang:hover{background:rgba(255,255,255,.25) !important;border-color:#eab308 !important;transform:none !important}

/* ═══ FEEDBACK / SHARE FAB ═══ */
#feedback-fab,
#fp-share-btn{
  background:rgba(255,255,255,.5) !important;
  border:1.5px solid #0f172a !important;
  color:#0f172a !important;
  box-shadow:none !important;
  backdrop-filter:blur(8px) !important;
  -webkit-backdrop-filter:blur(8px) !important;
}
#feedback-fab:hover,
#fp-share-btn:hover{border-color:#eab308 !important;transform:translateY(-1px) !important}

/* ═══ CHIPY PANELU KRAJU ═══ */
/* v11.58: Przeźroczystość mapy — kraje półprzezroczyste, ocean = tło */
#mc2 svg path[class*="c-"]{
  fill-opacity:0.88 !important;
  transition:fill-opacity .2s !important;
}
#mc2 svg path[class*="c-"]:hover{
  fill-opacity:1 !important;
}
#mc2 svg path.borders,
#mc2 svg path[stroke="#000"]{
  stroke-opacity:0.5 !important;
}
#mc2 svg path[fill="none"][stroke]:not([class]){
  stroke:rgba(15,23,42,0.35) !important;
  stroke-width:1 !important;
}
/* v11.60: mniejsze pola przycisków + ukryj emoji ikony */
.lt-ic{ display:none !important; }
.nb, .gb{
  font-family:'Inter','Helvetica Neue',Arial,sans-serif !important;
  font-variant-emoji:text !important;
}
.lt{ padding:5px 12px !important; font-size:12px !important; min-height:28px !important; line-height:1 !important; }
.nb{ padding:5px 12px !important; font-size:12px !important; min-height:28px !important; line-height:1 !important; }
.gb{ padding:6px 12px !important; font-size:12px !important; min-height:30px !important; line-height:1.1 !important; }

#map-home-btn{ width:30px !important; height:30px !important; }
/* v11.62: kompaktowe proporcje + ukryj ikony styli podróży */
.gb .ic{ display:none !important; }
button.nb{
  font-family:'Inter','Helvetica Neue',Arial,sans-serif !important;
  font-variant-emoji:text !important;
}
button.lt{
  padding:6px 14px !important; font-size:11px !important;
  min-height:30px !important; height:30px !important;
  line-height:1 !important; letter-spacing:.4px !important;
}
button.lt.on{
  padding:5px 13px !important; font-size:12px !important;
  height:30px !important; min-height:30px !important; font-weight:900 !important;
}
button.nb{
  padding:5px 11px !important; font-size:11px !important;
  min-height:26px !important; height:26px !important;
  line-height:1 !important; letter-spacing:.3px !important;
}
button.nb.on{
  padding:4px 10px !important; font-size:12px !important;
  height:26px !important; min-height:26px !important; font-weight:900 !important;
}
#fp-tl .logo{
  padding:5px 12px !important; font-size:12px !important;
  min-height:28px !important; height:28px !important; line-height:1 !important;
}
button#map-home-btn{
  width:28px !important; height:28px !important;
  min-height:28px !important; padding:0 !important;
}
#map-home-btn svg{ width:14px !important; height:14px !important; }
#fp-lang, #fp-psp{
  padding:4px 10px !important; font-size:10px !important;
  min-height:28px !important; height:28px !important; line-height:1 !important;
}
.mc{
  padding:3px 2px !important; font-size:9px !important;
  min-height:22px !important; height:22px !important; line-height:1 !important;
}
#fp-bottom > #fp-when{
  padding:3px 10px !important; font-size:9px !important;
  gap:5px !important; min-height:auto !important; height:auto !important;
  letter-spacing:.3px !important; font-weight:800 !important;
}
#dL, #dL[style]{
  color:#0f172a !important; font-size:10px !important;
  font-weight:900 !important; letter-spacing:.3px !important;
  background:transparent !important; border:none !important; padding:0 !important;
}
#fp-bl{ padding:6px 9px !important; font-size:10px !important; }
#fp-bl-close{ width:20px !important; height:20px !important; font-size:18px !important; }
#fp-bl.collapsed #fp-bl-open{
  padding:4px 10px !important; font-size:10px !important;
  height:28px !important; min-height:28px !important;
}
/* v11.65: etykiety, większe czcionki stylów, puchar */
.fp-group{ display:flex !important; flex-direction:column !important; align-items:stretch !important; gap:2px !important; }
/* v11.66: layout language + kapitaliki stylów */
#fp-lang::before{
  content:"LANGUAGE" !important; position:absolute !important;
  bottom:100% !important; left:50% !important; transform:translateX(-50%) !important;
  font-family:'Inter','Helvetica Neue',Arial,sans-serif !important;
  font-size:8px !important; font-weight:800 !important; letter-spacing:1.5px !important;
  color:#64748b !important; margin-bottom:3px !important;
  white-space:nowrap !important; pointer-events:none !important;
}
#fp-tr{ position:relative !important; }
#fp-tr::before{
  content:"TRAVEL STYLE" !important; display:block !important;
  font-family:'Inter','Helvetica Neue',Arial,sans-serif !important;
  font-size:8px !important; font-weight:800 !important; letter-spacing:1.5px !important;
  color:#64748b !important; text-align:center !important;
  margin-bottom:6px !important; padding-top:2px !important;
}
#ranking-toggle-btn .lt-ic{
  display:inline-block !important; font-size:15px !important;
  margin-right:5px !important; visibility:visible !important; opacity:1 !important;
}
/* v11.67: FIX #fp-tr + typografia rankingu */
@media (min-width:761px) and (min-height:621px){
#fp-tr{
  display:flex !important; flex-direction:column !important; gap:5px !important;
  position:absolute !important; top:72px !important; right:14px !important;
  width:auto !important; min-width:150px !important; max-width:180px !important;
  background:transparent !important; border:none !important; box-shadow:none !important;
  backdrop-filter:none !important; padding:0 !important; z-index:15 !important;
}
}
.fp-group{ display:block !important; position:relative !important; }
#fp-tr::before{
  content:"TRAVEL STYLE" !important; display:block !important;
  font-family:'Inter','Helvetica Neue',Arial,sans-serif !important;
  font-size:8px !important; font-weight:800 !important; letter-spacing:1.5px !important;
  color:#64748b !important; text-align:center !important; margin-bottom:6px !important;
}

#fp-lang{ position:relative !important; }
#fp-lang::before{
  content:"LANGUAGE" !important; position:absolute !important;
  bottom:calc(100% + 3px) !important; left:50% !important; transform:translateX(-50%) !important;
  font-family:'Inter','Helvetica Neue',Arial,sans-serif !important;
  font-size:8px !important; font-weight:800 !important; letter-spacing:1.5px !important;
  color:#64748b !important; white-space:nowrap !important; pointer-events:none !important;
}
button.gb:hover{ border-color:#eab308 !important; background:rgba(255,255,255,.95) !important; }
#ranking-toggle-btn{
  display:flex !important; align-items:center !important; justify-content:center !important;
  gap:6px !important; width:100% !important; padding:8px 12px !important;
  font-family:'Inter','Helvetica Neue',Arial,sans-serif !important;
  font-size:11px !important; font-weight:700 !important; letter-spacing:.4px !important;
  text-transform:uppercase !important; line-height:1.2 !important;
  background:rgba(255,255,255,.85) !important; border:1.5px solid #0f172a !important;
  border-radius:10px !important; color:#0f172a !important; min-height:44px !important;
  box-shadow:0 2px 4px rgba(15,23,42,.08) !important;
  backdrop-filter:blur(6px) !important; -webkit-backdrop-filter:blur(6px) !important;
  transition:border-color .18s,background .18s !important;
  margin-top:6px !important; text-align:center !important; white-space:normal !important;
}
#ranking-toggle-btn:hover{ border-color:#eab308 !important; background:rgba(255,255,255,.95) !important; }
#ranking-toggle-btn.on{
  background:rgba(255,255,255,.9) !important; color:#0f172a !important;
  border:3px solid #eab308 !important; padding:7px 11px !important;
  font-size:12px !important; font-weight:900 !important; box-shadow:none !important;
}
#ranking-toggle-btn .lt-txt{
  display:inline-block !important; text-align:left !important; line-height:1.2 !important;
  font-family:'Inter','Helvetica Neue',Arial,sans-serif !important;
}
/* v11.68: force dimensions + font */
#fp-tr button.gb, #fp-tr #ranking-toggle-btn{
  width:100% !important; max-width:170px !important; box-sizing:border-box !important;
}
#ranking-toggle-btn .lt-ic{
  display:inline-block !important; font-size:16px !important; margin:0 4px 0 0 !important;
  visibility:visible !important; opacity:1 !important; flex-shrink:0 !important;
}
button.gb, button.nb, button.lt, #ranking-toggle-btn, #fp-lang, #fp-psp{
  font-family:'Inter','Helvetica Neue',Arial,sans-serif !important;
}
/* v11.69: kontynenty w jednej linii + ukryj style w wizy/budżet + .fp-group off */
#fp-tl .fp-views{ flex-wrap:nowrap !important; gap:4px !important; width:auto !important; }
body.layer-visa #fp-tr, body.layer-budget #fp-tr{ display:none !important; }
.fp-group{ display:contents !important; }
.fp-group-lbl{ display:none !important; }
/* v11.70: fix pozycji fp-lang + wymuszenie ukrycia stylów na wizy */
@media (min-width:761px) and (min-height:621px){
#fp-lang{
  position:absolute !important;
  top:14px !important;
  right:265px !important;
  left:auto !important;
  bottom:auto !important;
  width:auto !important;
  max-width:110px !important;
  display:inline-flex !important;
  align-items:center !important;
  gap:6px !important;
  z-index:31 !important;
  transform:scale(var(--ui-zoom-compensation,1)) !important;
  transform-origin:top right !important;
}
}
#fp-lang::before{
  white-space:nowrap !important;
  width:auto !important;
  max-width:none !important;
}
body.layer-visa div#fp-tr,
body.layer-budget div#fp-tr,
body.layer-visa div#fp-tr[style],
body.layer-budget div#fp-tr[style]{
  display:none !important;
  visibility:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
}
/* v11.71: mniejsze style + wyrównanie rankingu */
#ranking-toggle-btn{
  justify-content:center !important;
  text-align:center !important;
  padding:6px 10px !important;
  gap:6px !important;
  font-size:10px !important;
  min-height:36px !important;
}
#ranking-toggle-btn .lt-txt{
  text-align:center !important;
  flex:0 1 auto !important;
  padding:0 !important;
  margin:0 !important;
}
#ranking-toggle-btn .lt-ic{
  flex:0 0 auto !important;
  margin:0 !important;
}
/* v11.73: force centering ranking button */
button#ranking-toggle-btn{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
  gap:6px !important;
  padding:6px 10px !important;
  line-height:1.15 !important;
}
button#ranking-toggle-btn .lt-txt{
  display:inline-block !important;
  text-align:center !important;
  flex:0 1 auto !important;
  padding:0 !important;
  margin:0 !important;
  line-height:1.15 !important;
}
button#ranking-toggle-btn .lt-ic{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex:0 0 auto !important;
  margin:0 !important;
  padding:0 !important;
  font-size:14px !important;
  line-height:1 !important;
}
/* v11.75: FINALNA naprawa wyśrodkowania - symetryczny padding góra/dół */
button#ranking-toggle-btn{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:7px 10px !important;
  gap:6px !important;
  line-height:1 !important;
  min-height:38px !important;
  height:38px !important;
}
button#ranking-toggle-btn .lt-txt{
  display:inline-block !important;
  text-align:center !important;
  line-height:1.1 !important;
  padding:0 !important;
  margin:0 !important;
  font-size:10px !important;
}
button#ranking-toggle-btn .lt-ic{
  display:inline-flex !important;
  align-items:center !important;
  flex:0 0 auto !important;
  margin:0 !important;
  padding:0 !important;
  font-size:15px !important;
  line-height:1 !important;
}
button#ranking-toggle-btn.on{
  padding:6px 9px !important;
  height:38px !important;
  min-height:38px !important;
}

/* ═══ v11.97: BĘBEN mobile-only — bez tła/ramki, ciaśniejszy promień ═══ */
.wdrum2-box{
  display:none;
  position:absolute;
  z-index:20;
  top:56px;
  background:transparent;
  border:none;
  box-shadow:none;
  padding:4px;
  width:118px;
}
#wdrum2-area{ left:8px; }
#wdrum2-style{ right:8px; }
.wdrum2-viewport{ position:relative; }
.wdrum2-lbl{
  font-size:10px;
  font-weight:800;
  letter-spacing:.5px;
  text-transform:uppercase;
  color:#fff;
  text-align:center;
  margin-bottom:3px;
  text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000;
}
.wdrum2{
  position:relative;
  height:72px;
  overflow-y:scroll;
  scroll-snap-type:y mandatory;
  -webkit-overflow-scrolling:touch;
  perspective:140px;
  scrollbar-width:none;
}
.wdrum2::-webkit-scrollbar{display:none}
.wdrum2-item{
  height:24px;
  display:flex;
  align-items:center;
  justify-content:center;
  scroll-snap-align:center;
  font-size:13px;
  font-weight:800;
  color:#fff;
  cursor:pointer;
  white-space:nowrap;
  text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000,0 2px 4px rgba(0,0,0,.9);
}
.wdrum2-centerline{
  position:absolute;
  top:24px;
  left:4px;
  right:4px;
  height:24px;
  background:rgba(0,0,0,.10);
  border-top:1px solid rgba(255,255,255,.5);
  border-bottom:1px solid rgba(255,255,255,.5);
  border-radius:6px;
  pointer-events:none;
}
@media (max-width:760px), (orientation:landscape) and (max-height:620px){
  .wdrum2-box{display:block !important}
  #map-home-btn{display:none !important}
}


/* ═══ v11.77: MOBILE UX — celowane ulepszenia ═══ */
@media (max-width:760px), (orientation:landscape) and (max-height:620px){
  #p-scroll{-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain}
  .m-sheet-content{overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding-bottom:calc(18px + env(safe-area-inset-bottom, 0px)) !important}
  .m-mirror-grid select{font-size:16px !important}
  #p-back{padding-top:calc(12px + env(safe-area-inset-top, 0px)) !important}
  .m-burger:active,.mc:active,.fp-styles .gb:active,
  .m-mirror-grid .nb:active,.m-mirror-grid .lt:active,.m-mirror-grid .gb:active,
  #feedback-fab:active,#fp-share-btn:active{transform:scale(0.94);transition:transform .06s}
}
/* ═══ v12.09: etykieta terminu OSOBNO nad suwakiem (mobile) ═══ */
#fp-when{
  display:none;
  position:absolute;
  z-index:56;
  right:8px;
  bottom:calc(76px + env(safe-area-inset-bottom, 0px));
  background:rgba(248,242,225,.97);
  border:1.5px solid #b8860b;
  border-radius:10px;
  padding:6px 10px;
  font-size:11px;
  font-weight:800;
  color:#1a1208;
  text-transform:uppercase;
  letter-spacing:.4px;
  box-shadow:0 4px 12px rgba(60,40,15,.2);
  text-align:right;
  line-height:1.4;
}
/* v12.31: przywrócone dla desktopu — zniknęło przez v12.09, które schowało to tylko dla mobile */
@media (min-width:761px) and (min-height:621px){
  #fp-when{
    display:block;
    left:50%;
    right:auto;
    transform:translateX(-50%);
    bottom:calc(78px + env(safe-area-inset-bottom, 0px));
  }
}
#fp-when #dL{
  display:block;
  color:#b8860b;
  font-family:'DM Mono',monospace;
  font-size:12px;
  font-weight:700;
  text-transform:none;
}
/* v12.32: gdy JS przeniesie #fp-when do wnętrza #fp-bottom (tylko desktop), etykieta wygląda jak część panelu suwaka zamiast pływać nad nim */
@media (min-width:761px) and (min-height:621px){
  #fp-bottom > #fp-when{
    position:static !important;
    display:inline-flex !important;
    align-items:center !important;
    left:auto !important;
    right:auto !important;
    bottom:auto !important;
    transform:none !important;
    gap:8px !important;
    margin:0 auto 6px !important;
    width:auto !important;
    align-self:center !important;
    background:rgba(255,255,255,.6) !important;
    border:2px solid #eab308 !important;
    border-radius:8px !important;
    padding:6px 12px !important;
    box-shadow:none !important;
    text-align:left !important;
  }
  #fp-bottom > #fp-when #dL{
    background:transparent !important;
    border:none !important;
    padding:0 !important;
    color:#a16207 !important;
    font-weight:800 !important;
  }
}
@media (max-width:760px), (orientation:landscape) and (max-height:620px){
  #fp-when{display:block}
}
/* ═══ v12.10: legenda zwinięta domyślnie (HTML), rozwijana tylko na desktopie ═══ */
@media (min-width:761px) and (min-height:621px){
  #fp-bl.collapsed{max-width:none !important;padding:8px 10px !important;background:rgba(255,255,255,.5) !important;border:1.5px solid #0f172a !important;box-shadow:0 4px 16px rgba(15,23,42,.12) !important}
  #fp-bl.collapsed #fp-bl-close,
  #fp-bl.collapsed #fp-bl-lbl,
  #fp-bl.collapsed #fp-bl-content{display:block !important}
  #fp-bl.collapsed #fp-bl-open{display:none !important}
}
/* ═══ v12.10: suwak bez tła — tylko ramka; tło zostaje pod miesiącami (oszczędza miejsce) ═══ */
@media (max-width:760px), (orientation:landscape) and (max-height:620px){
  /* v12.39: JEDNA ramka — miesiace SA w ramce suwaka, nie osobnym paskiem */
  #fp-bottom{background:rgba(255,255,255,.5) !important;border:1.5px solid #0f172a !important;box-shadow:0 4px 16px rgba(15,23,42,.12) !important;backdrop-filter:blur(8px) !important;-webkit-backdrop-filter:blur(8px) !important;padding:6px 14px 8px !important}
  #mrow{background:transparent !important;border-radius:0 !important;padding:0 !important;margin:0 !important}
}
/* ═══ v12.14: przyciski w hamburgerze mają szerokość DO TREŚCI, nie do okna ═══ */
@media (max-width:760px), (orientation:landscape) and (max-height:620px){
  #m-sheet-right .m-sheet-content{
    width:auto !important;
    min-width:0 !important;
    max-width:240px !important;
  }
  #m-mirror-tabs{align-items:flex-end !important}
  #m-mirror-tabs > *{
    width:auto !important;
    flex:0 0 auto !important;
    min-width:0 !important;
    white-space:nowrap !important;
  }
  #m-mirror-ranking{align-items:flex-end !important}
  #m-mirror-ranking > *{
    width:auto !important;
    flex:0 0 auto !important;
    min-width:0 !important;
    white-space:nowrap !important;
  }
}
/* ═══ v12.15: mobile — share off, logo do lewej, legenda wyżej, wąski select języka ═══ */
@media (max-width:760px), (orientation:landscape) and (max-height:620px){
  #fp-share-btn{display:none !important}
  #m-sheet-right .m-sheet-lbl{text-align:right !important}
}
/* ═══ v12.16: minimum szerokości selectów, legenda niżej, logo do lewej ═══ */
@media (max-width:760px), (orientation:landscape) and (max-height:620px){
  #fp-tl{left:0 !important;margin-left:0 !important;padding-left:0 !important}
  #fp-bl{bottom:calc(140px + env(safe-area-inset-bottom, 0px)) !important}
  #m-mirror-psp select,
  #m-mirror-lang select{
    width:64px !important;
    min-width:0 !important;
    max-width:64px !important;
    font-size:11px !important;
    padding:3px 4px !important;
    box-sizing:border-box !important;
  }
  #m-mirror-psp > *,
  #m-mirror-lang > *{
    width:auto !important;
    min-width:0 !important;
    max-width:none !important;
    flex:0 0 auto !important;
  }
}
/* ═══ v12.20: tło hamburgera 50% przezroczyste, paszport/język do prawej ═══ */
@media (max-width:760px), (orientation:landscape) and (max-height:620px){
  #m-mirror-psp,
  #m-mirror-lang{
    display:flex !important;
    justify-content:flex-end !important;
    width:100% !important;
  }
}
/* ═══ v12.21: puchar widoczny + tło 40% ═══ */
@media (max-width:760px), (orientation:landscape) and (max-height:620px){
  #m-sheet-right .m-sheet-content{
    background:linear-gradient(180deg,rgba(255,248,226,.4),rgba(241,230,194,.4)) !important;
    backdrop-filter:blur(10px) !important;
    -webkit-backdrop-filter:blur(10px) !important;
  }
  #m-mirror-ranking .lt-ic{
    display:inline-block !important;
    visibility:visible !important;
    opacity:1 !important;
    font-size:14px !important;
    margin-right:5px !important;
  }
  #m-mirror-ranking .lt-txt{display:inline-block !important;text-align:right !important;line-height:1.25 !important}
  #m-mirror-ranking .lt-txt br{display:block !important}
}
/* v12.27 SCALONE — 6 selektorów, każdy raz, finalny obliczony wynik */
.gb.on{background:rgba(255,255,255,.85) !important;color:#0f172a !important;border-color:#0f172a !important;box-shadow:none !important;text-shadow:none !important;transform:none !important;font-weight:900 !important;border:3px solid #eab308 !important;padding:5px 11px !important;font-size:13px !important;}
.nb.on{background:rgba(255,255,255,.85) !important;color:#0f172a !important;border-color:#0f172a !important;box-shadow:none !important;text-shadow:none !important;transform:none !important;border:3px solid #eab308 !important;padding:4px 11px !important;font-size:13px !important;font-weight:900 !important;letter-spacing:.6px !important;}
.mc.on{color:#0f172a !important;background:transparent !important;border-color:#0e1a3a;border-top-color:#7dd3fc;box-shadow:none !important;text-shadow:0 -1px 0 rgba(0,0,0,.4),0 0 4px rgba(255,255,255,.3);border:3px solid #eab308 !important;padding:2px 1px !important;font-size:10px !important;font-weight:900 !important;height:22px !important;min-height:22px !important;}
.lt.on{background:rgba(255,255,255,.85) !important;color:#0f172a !important;border-color:#0f172a !important;box-shadow:none !important;border:3px solid #eab308 !important;padding:4px 11px !important;font-size:13px !important;font-weight:900 !important;letter-spacing:.5px !important;}
button.gb{font-family:"Inter","Helvetica Neue",Arial,sans-serif !important;font-variant-emoji:text !important;padding-left:12px !important;padding:6px 10px !important;font-size:10px !important;min-height:26px !important;height:26px !important;line-height:1 !important;letter-spacing:.4px !important;font-weight:700 !important;text-transform:uppercase !important;display:flex !important;align-items:center !important;justify-content:center !important;width:100% !important;background:rgba(255,255,255,.85) !important;border:1.5px solid #0f172a !important;border-radius:10px !important;color:#0f172a !important;box-shadow:0 2px 4px rgba(15,23,42,.08) !important;transition:border-color .18s,background .18s !important;cursor:pointer !important;margin:0 !important;}
button.gb.on{padding:5px 9px !important;font-size:11px !important;height:26px !important;min-height:26px !important;font-weight:900 !important;letter-spacing:.5px !important;background:rgba(255,255,255,.9) !important;color:#0f172a !important;border:3px solid #eab308 !important;box-shadow:none !important;}
