/* PORIEŠIME — dizajn systém v1 (svetlá téma, mobile-first) */
:root{
  --bg:#F4F6F8; --surface:#FFFFFF; --surface2:#EBEFF3; --ink:#1B2430; --muted:#5B6B7C;
  --line:#D7DEE5; --accent:#E8730C; --accent-dark:#C25E06; --accent-soft:#FBEED9;
  --good:#2E7D5B; --good-bg:#E3F0EA; --warn:#B3402F; --warn-bg:#F6E7E4;
  --blue:#2C5F8A; --blue-bg:#E4EEF6; --gold:#8A6A1F; --gold-bg:#F6EFD8;
  --r:10px; --shadow:0 2px 10px rgba(27,36,48,.08);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0; background:var(--bg); color:var(--ink); font:16px/1.55 "IBM Plex Sans",system-ui,sans-serif;}
h1,h2,h3,h4{font-family:"IBM Plex Sans",system-ui,sans-serif; font-weight:700; line-height:1.15; text-wrap:balance; margin:0 0 .4em;}
h1{font-size:clamp(1.7rem,5vw,2.6rem); font-weight:700; letter-spacing:-.01em}
h2{font-size:1.35rem; font-weight:700; margin-top:1.6em}
h3{font-size:1.05rem; font-weight:700}
p{margin:.4em 0}
a{color:var(--accent-dark)}
img{max-width:100%}
.muted{color:var(--muted)} .small{font-size:.85rem}
.wrap{max-width:1440px; margin:0 auto; padding:0 20px}
@media(min-width:1700px){.wrap{max-width:1600px}}

/* Header */
.hdr{background:var(--ink); color:#fff; position:sticky; top:0; z-index:50}
.hdr .wrap{display:flex; align-items:center; gap:14px; min-height:58px}
.logo{font-family:"IBM Plex Sans",sans-serif; font-weight:800; font-size:1.3rem; color:#fff; text-decoration:none; letter-spacing:-.01em; display:flex; align-items:center}
.logo b{color:var(--accent)}
.logo img{height:22px; display:block}
.hdr nav{margin-left:auto; display:flex; gap:4px; flex-wrap:wrap}
.hdr nav a{color:#E8EDF2; text-decoration:none; padding:8px 12px; border-radius:8px; font-size:.92rem}
.hdr nav a:hover,.hdr nav a.on{background:rgba(255,255,255,.12)}
.langs{display:flex; gap:2px; margin-left:8px}
.langs .lang{background:none; border:1px solid rgba(255,255,255,.25); color:#B9C6D2; font:600 .68rem "IBM Plex Sans",sans-serif;
  padding:3px 7px; border-radius:6px; cursor:pointer; letter-spacing:.05em}
.langs .lang.on{background:var(--accent); border-color:var(--accent); color:#fff}
@media(max-width:720px){
  .hdr .wrap{flex-wrap:wrap; row-gap:0; padding-top:8px; padding-bottom:8px}
  .hdr nav{order:3; width:100%; margin-left:0; overflow-x:auto; flex-wrap:nowrap}
  .hdr nav a{padding:7px 10px; font-size:.85rem; white-space:nowrap}
  .langs{order:2; margin-left:auto}
}

/* Hero */
.hero{background:linear-gradient(180deg,var(--ink) 0%,#26333F 100%); color:#fff; padding:42px 0 48px; position:relative; overflow:hidden}
.hero::before{content:''; position:absolute; right:-150px; top:-150px; width:540px; height:540px; border-radius:50%; pointer-events:none;
  background:repeating-radial-gradient(circle, transparent 0 56px, rgba(232,115,12,.16) 56px 58px)}
.hero::after{content:''; position:absolute; left:-170px; bottom:-210px; width:470px; height:470px; border-radius:50%; pointer-events:none;
  background:repeating-radial-gradient(circle, transparent 0 56px, rgba(232,115,12,.10) 56px 58px)}
.hero .wrap{position:relative; z-index:1}
.hero h1{color:#fff; font-size:clamp(2rem,5.6vw,3.2rem); font-weight:800}
.hero h1 .hl{color:var(--accent); position:relative; display:inline-block}
.hero h1 .hl::after{content:''; position:absolute; left:2%; right:2%; bottom:.03em; height:.13em; background:var(--accent); opacity:.35; border-radius:99px}
.hero-steps{display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:8px 14px; margin:16px auto 4px; color:#DAE3EB; font-size:.95rem; font-weight:600}
.hero-steps > span{display:inline-flex; align-items:center}
.hero-steps i{display:inline-flex; width:24px; height:24px; margin-right:7px; border-radius:50%; background:var(--accent); color:#fff; font-style:normal; font-weight:800; font-size:.8rem; align-items:center; justify-content:center; flex:none}
.hero-steps .arr{color:var(--accent); font-weight:800}
.hero-search{background:#fff; border-radius:18px; padding:10px; box-shadow:0 14px 44px rgba(0,0,0,.35); max-width:840px; margin-left:auto; margin-right:auto}
.hero-search select,.hero-search input{border-color:transparent; background:#F1F4F7}
.hero .claim{color:#B9C6D2; font-size:1.05rem; max-width:60ch}
.hero-center{text-align:center}
.hero-center .claim{margin-left:auto; margin-right:auto}
.hero-center .row{justify-content:center; align-items:stretch; gap:10px}
.hero-center .row select,
.hero-center .row input,
.hero-center .row .btn{height:54px; border-radius:var(--r); box-sizing:border-box; font-size:1rem}
.hero-center .row select{padding:0 34px 0 14px; width:auto}
.hero-center .row input{padding:0 14px}
.hero-center .row .btn{padding-top:0; padding-bottom:0; display:inline-flex; align-items:center}

/* Centrované sekcie domovskej stránky */
.sec-title{text-align:center; margin-top:2em}
.sec-title::after{content:""; display:block; width:44px; height:4px; background:var(--accent); border-radius:2px; margin:10px auto 0}
.sec-sub{text-align:center; color:var(--muted); font-size:.95rem; margin:10px auto 20px; max-width:60ch}
/* 48 dlaždíc = vždy plné rady: 8 / 6 / 4 / 3 / 2 stĺpcov */
.cats{display:grid; gap:14px; grid-template-columns:repeat(8,1fr)}
@media(max-width:1399px){.cats{grid-template-columns:repeat(6,1fr)}}
@media(max-width:999px){.cats{grid-template-columns:repeat(4,1fr)}}
@media(max-width:699px){.cats{grid-template-columns:repeat(3,1fr)}}
@media(max-width:479px){.cats{grid-template-columns:repeat(2,1fr)}}
.center-cards .card{text-align:center}
.center-kpi .kpi{text-align:center}

/* Buttons & inputs */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; border:none; cursor:pointer;
  background:var(--accent); color:#fff; font:600 .95rem "IBM Plex Sans",sans-serif; padding:11px 18px; border-radius:var(--r);}
.btn:hover{background:var(--accent-dark)}
.btn.sec{background:var(--surface); color:var(--ink); border:1.5px solid var(--line)}
.btn.sec:hover{border-color:var(--muted); background:var(--surface)}
.btn.ghost{background:transparent; color:var(--accent-dark); border:1.5px solid var(--accent)}
.btn.big{padding:14px 24px; font-size:1.05rem}
.btn.sm{padding:6px 12px; font-size:.83rem; border-radius:8px}
.btn.danger{background:var(--warn)}
.btn:disabled{opacity:.5; cursor:not-allowed}
input,select,textarea{width:100%; padding:11px 12px; border:1.5px solid var(--line); border-radius:var(--r);
  font:1rem "IBM Plex Sans",sans-serif; background:var(--surface); color:var(--ink)}
input:focus,select:focus,textarea:focus{outline:2px solid var(--accent); outline-offset:1px; border-color:var(--accent)}
label{font-size:.85rem; font-weight:600; display:block; margin:12px 0 5px}
.field-row{display:grid; gap:10px; grid-template-columns:1fr 1fr}
@media(max-width:560px){.field-row{grid-template-columns:1fr}}

/* Cards & grids */
.card{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:16px; box-shadow:var(--shadow)}
.grid{display:grid; gap:14px}
.grid.c2{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
.grid.c3{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.grid.c4{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.cat-tile{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:14px 12px; text-align:center;
  cursor:pointer; transition:transform .12s, border-color .12s; text-decoration:none; color:var(--ink); display:block}
.cat-tile:hover{transform:translateY(-2px); border-color:var(--accent)}
.cat-tile .ic{font-size:1.9rem; display:block; margin-bottom:6px}
.cicon{width:1.06em; height:1.06em; vertical-align:-.15em; display:inline-block}
.cat-tile .ic .cicon{vertical-align:baseline}
.cat-tile .nm{font-weight:600; font-size:.9rem}

/* Provider card */
.prov{display:flex; gap:12px; align-items:flex-start}
.avatar{width:52px; height:52px; border-radius:50%; background:var(--surface2); display:flex; align-items:center; justify-content:center; font-size:1.6rem; flex:none}
.prov h3{margin:0}
.metrics{display:flex; flex-wrap:wrap; gap:6px 14px; margin-top:6px; font-size:.8rem; color:var(--muted)}
.metrics b{color:var(--ink)}

/* Badges */
.badge{display:inline-flex; align-items:center; gap:4px; font-size:.72rem; font-weight:700; letter-spacing:.03em;
  padding:2px 9px; border-radius:99px; text-transform:uppercase}
/* Odznaky dôvery podľa brandmanuálu: obrysové pilulky s farbou stavu */
.badge.overeny{background:var(--surface); color:var(--good); border:1.5px solid var(--good)}
.badge.prevereny{background:var(--surface); color:var(--blue); border:1.5px solid var(--blue)}
.badge.top{background:var(--surface); color:var(--gold); border:1.5px solid var(--gold)}
.badge.osoba{background:var(--surface2); color:var(--muted); text-transform:none; font-weight:600}
.badge.warn{background:var(--warn-bg); color:var(--warn); text-transform:none}
.badge.soft{background:var(--accent-soft); color:var(--accent-dark); text-transform:none}
.stars{color:var(--accent); letter-spacing:1px}

/* Chips */
.chips{display:flex; flex-wrap:wrap; gap:8px}
.chip{padding:7px 14px; border-radius:99px; border:1.5px solid var(--line); background:var(--surface);
  cursor:pointer; font:600 .87rem "IBM Plex Sans",sans-serif; color:var(--ink)}
.chip.on{background:var(--ink); color:#fff; border-color:var(--ink)}

/* Wizard steps */
.steps-bar{display:flex; gap:6px; margin:14px 0 20px}
.steps-bar i{flex:1; height:5px; border-radius:3px; background:var(--line)}
.steps-bar i.done{background:var(--accent)}

/* Calendar slots */
.slots{display:grid; grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); gap:8px}
.slot{padding:10px 8px; text-align:center; border:1.5px solid var(--line); border-radius:var(--r); cursor:pointer;
  background:var(--surface); font-size:.85rem; font-weight:600}
.slot:hover{border-color:var(--accent)}
.slot.sel{background:var(--accent); color:#fff; border-color:var(--accent)}
.slot.off{opacity:.35; cursor:not-allowed; text-decoration:line-through}

/* Tabs */
.tabs{display:flex; gap:2px; border-bottom:2px solid var(--line); margin:18px 0 16px; overflow-x:auto}
.tab{padding:10px 16px; cursor:pointer; font-weight:600; font-size:.92rem; color:var(--muted); border:none;
  background:none; border-bottom:3px solid transparent; margin-bottom:-2px; white-space:nowrap}
.tab.on{color:var(--ink); border-bottom-color:var(--accent)}

/* Tables */
.tablewrap{overflow-x:auto; border:1px solid var(--line); border-radius:var(--r); background:var(--surface)}
table{border-collapse:collapse; width:100%; font-size:.88rem; min-width:640px}
th{text-align:left; font-size:.72rem; text-transform:uppercase; letter-spacing:.07em; color:var(--muted);
  padding:10px 12px; border-bottom:2px solid var(--line); background:var(--surface2)}
td{padding:10px 12px; border-bottom:1px solid var(--line); vertical-align:top}
tr:last-child td{border-bottom:none}

/* Modal */
.modal-bg{position:fixed; inset:0; background:rgba(20,26,34,.55); z-index:100; display:none; align-items:flex-start; justify-content:center; padding:24px 12px; overflow-y:auto}
.modal-bg.open{display:flex}
.modal{background:var(--surface); border-radius:14px; max-width:640px; width:100%; padding:22px; position:relative; margin:auto 0}
.modal .x{position:absolute; top:10px; right:12px; background:none; border:none; font-size:1.5rem; cursor:pointer; color:var(--muted)}

/* Toast */
#toast{position:fixed; bottom:20px; left:50%; transform:translateX(-50%); background:var(--ink); color:#fff;
  padding:11px 20px; border-radius:99px; font-size:.9rem; z-index:200; opacity:0; transition:opacity .25s; pointer-events:none; max-width:90vw}
#toast.show{opacity:1}

/* Notices */
.notice{border-radius:var(--r); padding:12px 14px; font-size:.88rem; margin:10px 0}
.notice.warn{background:var(--warn-bg); color:var(--warn)}
.notice.good{background:var(--good-bg); color:var(--good)}
.notice.info{background:var(--blue-bg); color:var(--blue)}
.notice.soft{background:var(--accent-soft); color:var(--accent-dark)}

/* Utility */
.row{display:flex; gap:10px; align-items:center; flex-wrap:wrap}
.spread{display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap}
.sec-pad{padding:26px 0}
.center{text-align:center}
.num{font-variant-numeric:tabular-nums}
.divider{border:none; border-top:1px solid var(--line); margin:22px 0}
.hidden{display:none !important}
.kpi-grid{display:grid; gap:12px; grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
.kpi{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:12px 14px}
.kpi b{display:block; font-size:1.4rem; font-family:"IBM Plex Sans",sans-serif; font-weight:700; font-variant-numeric:tabular-nums}
.kpi span{font-size:.78rem; color:var(--muted)}
.foot{background:var(--ink); color:#93A3B3; padding:28px 0; margin-top:48px; font-size:.85rem}
.foot a{color:#C9D4DE}
.progressbar{height:8px; border-radius:4px; background:var(--surface2); overflow:hidden}
.progressbar i{display:block; height:100%; background:var(--accent)}
.progressbar i.danger{background:var(--warn)}
:focus-visible{outline:2px solid var(--accent); outline-offset:2px}

/* ==== Analytické centrum (paleta validovaná: #1E6FBF / #C25E06) ==== */
:root{--ch-a:#1E6FBF; --ch-b:#C25E06; --ch-grid:#E4E9EE}
.an-chart{display:flex; align-items:flex-end; gap:2px; height:150px; padding-top:22px;
  border-bottom:2px solid var(--ink); position:relative}
.abar{flex:1; min-width:3px; border-radius:4px 4px 0 0; position:relative; cursor:default; transition:opacity .1s}
.abar:hover{opacity:.75}
.abar .v{position:absolute; top:-20px; left:50%; transform:translateX(-50%); font:600 .72rem "IBM Plex Sans",sans-serif; font-variant-numeric:tabular-nums; color:var(--ink); white-space:nowrap}
.an-x{display:flex; justify-content:space-between; font:500 .72rem "IBM Plex Sans",sans-serif; font-variant-numeric:tabular-nums; color:var(--muted); margin-top:4px}
.funnel-row{display:grid; grid-template-columns:190px 1fr 90px; gap:10px; align-items:center; margin:8px 0}
.funnel-row .fbar{height:26px; border-radius:4px; min-width:4px}
.funnel-row .fv{font:600 .85rem "IBM Plex Sans",sans-serif; font-variant-numeric:tabular-nums; text-align:right}
.funnel-row .fl{font-size:.85rem; font-weight:600}
.updown{display:flex; gap:12px; flex-wrap:wrap}
.ud{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:10px 14px; min-width:150px}
.ud b{font-size:1.15rem; font-family:"IBM Plex Sans",sans-serif; font-weight:700; font-variant-numeric:tabular-nums}
.ud .dir{font-weight:700; font-size:.82rem}
.ud .dir.up{color:var(--good)} .ud .dir.down{color:var(--warn)}
.andon{display:grid; gap:10px; grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.andon a{display:flex; align-items:center; gap:12px; background:var(--surface); border:1px solid var(--line);
  border-left:5px solid var(--good); border-radius:var(--r); padding:12px 14px; text-decoration:none; color:var(--ink)}
.andon a.hot{border-left-color:var(--warn); background:var(--warn-bg)}
.andon b{font-size:1.5rem; font-family:"IBM Plex Sans",sans-serif; font-weight:700; min-width:34px; text-align:center}
.andon span{font-size:.85rem; line-height:1.3}

/* ==== Mapa a radar ==== */
#map{height:480px; border-radius:var(--r); border:1px solid var(--line); background:var(--surface2)}
.radar-wrap{position:absolute; z-index:640; pointer-events:none; transform:translate(-50%,-50%);
  border-radius:50%; overflow:hidden; border:2px solid rgba(232,115,12,.6);
  box-shadow:inset 0 0 40px rgba(232,115,12,.14), 0 0 22px rgba(232,115,12,.18);
  background:repeating-radial-gradient(circle, transparent 0 24.4%, rgba(232,115,12,.22) 24.4% 25%)}
.radar-cross::before{content:''; position:absolute; top:0; bottom:0; left:50%; width:1px; margin-left:-.5px; background:rgba(232,115,12,.28)}
.radar-cross::after{content:''; position:absolute; left:0; right:0; top:50%; height:1px; margin-top:-.5px; background:rgba(232,115,12,.28)}
.radar-sweep{position:absolute; inset:0; border-radius:50%;
  background:conic-gradient(rgba(232,115,12,.5), rgba(232,115,12,.1) 70deg, rgba(232,115,12,0) 115deg);
  animation:radar 2.4s linear infinite}
.radar-pulse{position:absolute; left:50%; top:50%; width:100%; height:100%; border:2px solid rgba(232,115,12,.5); border-radius:50%;
  transform:translate(-50%,-50%) scale(.05); opacity:0; animation:sonar 2.4s ease-out infinite}
.radar-pulse.p2{animation-delay:1.2s}
@keyframes radar{to{transform:rotate(360deg)}}
@keyframes sonar{0%{transform:translate(-50%,-50%) scale(.05); opacity:.85}70%{opacity:.2}100%{transform:translate(-50%,-50%) scale(1); opacity:0}}
.pinwrap{position:relative; width:36px; height:36px}
.pin-hit{position:absolute; left:50%; top:50%; width:36px; height:36px; border:3px solid var(--accent); border-radius:50%;
  transform:translate(-50%,-50%); animation:pinhit .9s ease-out forwards; pointer-events:none}
@keyframes pinhit{0%{transform:translate(-50%,-50%) scale(.4); opacity:1}100%{transform:translate(-50%,-50%) scale(2.4); opacity:0}}
.ppin{width:36px; height:36px; border-radius:50%; background:var(--surface); display:flex; align-items:center; justify-content:center;
  font-weight:700; font-size:.8rem; color:var(--ink); border:3px solid var(--good); box-shadow:0 2px 8px rgba(27,36,48,.35)}
.pinwrap .ppin{animation:pinpop .45s cubic-bezier(.2,1.6,.4,1)}
@keyframes pinpop{0%{transform:scale(0)}100%{transform:scale(1)}}
.ppin.prevereny{border-color:var(--blue)}
.ppin.top{border-color:var(--gold)}
.scan-dots::after{content:''; animation:dots 1.2s steps(1,end) infinite}
@keyframes dots{0%{content:''}25%{content:'.'}50%{content:'..'}75%{content:'...'}}
.map-res-card{animation:resin .4s ease both}
@keyframes resin{from{opacity:0; transform:translateY(8px)}to{opacity:1; transform:none}}
@media (prefers-reduced-motion: reduce){.radar-sweep,.radar-pulse,.pin-hit,.pinwrap .ppin,.scan-dots::after,.map-res-card{animation:none}}

/* ==== Inteligentné návrhy pod hero vyhľadávaním ==== */
#hero-sugg{background:var(--surface); border-radius:var(--r); padding:12px 14px; margin:12px auto 0;
  max-width:680px; text-align:left; box-shadow:0 8px 30px rgba(0,0,0,.25)}
.sugg-g{display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin:6px 0}
.sugg-g>span{font-size:.72rem; font-weight:700; color:var(--muted); min-width:52px; text-transform:uppercase; letter-spacing:.05em}
.sugg-chip{display:inline-flex; align-items:center; gap:6px; padding:7px 12px; border:1.5px solid var(--line);
  border-radius:99px; text-decoration:none; color:var(--ink); font-size:.88rem; font-weight:600; background:var(--surface)}
.sugg-chip:hover{border-color:var(--accent); color:var(--accent-dark)}

/* ==== Mobil — dokonalá verzia ==== */
@media(max-width:640px){
  .wrap{padding:0 14px}
  h1{font-size:1.5rem}
  .hero{padding:26px 0 30px}
  .hero-center .row{flex-direction:column; align-items:stretch; gap:8px}
  .hero-center .row select,.hero-center .row input{max-width:none !important; width:100%}
  .hero-center .row .btn{width:100%; justify-content:center}
  #hero-sugg{max-width:none}
  .btn.big{width:100%; justify-content:center}
  .cat-tile{padding:12px 6px}
  .cat-tile .ic{font-size:1.55rem; margin-bottom:4px}
  .cat-tile .nm{font-size:.78rem}
  #map{height:340px}
  .chat-shell{height:calc(100dvh - 200px); min-height:380px}
  .msg{max-width:88%}
  .hero-steps{flex-direction:column; gap:7px; align-items:flex-start; width:fit-content}
  .hero-steps .arr{display:none}
  .hero-search{padding:8px}
  .modal{padding:16px}
  .kpi b{font-size:1.15rem}
  .andon a{padding:10px 12px}
  .prov{flex-wrap:wrap}
  .spread{gap:8px}
  .sec-pad{padding:18px 0}
  .funnel-row{grid-template-columns:120px 1fr 64px}
}
/* ==== Chat (zákazník ↔ majster) ==== */
.chat-row{display:flex; align-items:center; gap:12px; text-decoration:none; color:var(--ink); padding:12px 14px; margin-bottom:10px}
.chat-row:hover{border-color:var(--accent)}
.chat-prev{display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%}
.unread-pill{background:var(--accent); color:#fff; border-radius:99px; font-size:.72rem; padding:2px 8px; font-weight:700}
.chat-shell{display:flex; flex-direction:column; height:min(70vh,620px); border:1.5px solid var(--line); border-radius:var(--r); background:var(--surface); overflow:hidden}
.chat-head{display:flex; align-items:center; gap:10px; padding:10px 14px; border-bottom:1.5px solid var(--line)}
.dot-on{width:8px; height:8px; border-radius:50%; background:var(--good); display:inline-block; margin-right:3px}
.chat-msgs{flex:1; overflow-y:auto; padding:16px 14px; display:flex; flex-direction:column; gap:6px; background:var(--surface2)}
.msg{max-width:78%; padding:9px 12px 6px; border-radius:14px; font-size:.95rem; line-height:1.4; overflow-wrap:break-word}
.msg.me{align-self:flex-end; background:var(--accent); color:#fff; border-bottom-right-radius:4px}
.msg.them{align-self:flex-start; background:var(--surface); border:1px solid var(--line); border-bottom-left-radius:4px}
.msg .mt{display:block; font-size:.68rem; opacity:.75; margin-top:3px; text-align:right}
.msg .ticks{font-style:normal}
.chat-day{align-self:center; text-align:center; font-size:.74rem; color:var(--muted); background:var(--surface); border:1px solid var(--line); padding:3px 12px; border-radius:99px; margin:8px 0 4px; max-width:92%}
.chat-input{display:flex; gap:8px; padding:10px; border-top:1.5px solid var(--line); background:var(--surface)}
.chat-input input{flex:1; margin:0}
.typing{align-self:flex-start; background:var(--surface); border:1px solid var(--line); border-radius:14px; border-bottom-left-radius:4px; padding:12px 14px; display:flex; gap:4px}
.typing i{width:7px; height:7px; border-radius:50%; background:var(--muted); animation:tp 1s infinite}
.typing i:nth-child(2){animation-delay:.15s}
.typing i:nth-child(3){animation-delay:.3s}
@keyframes tp{0%,60%,100%{transform:translateY(0); opacity:.5}30%{transform:translateY(-4px); opacity:1}}
.msg-in{animation:msgin .22s ease}
@keyframes msgin{from{opacity:0; transform:translateY(6px)}to{opacity:1; transform:none}}

/* Našepkávač miest v mapovom vyhľadávaní */
.m-addr-wrap{position:relative}
.msugg{position:absolute; top:calc(100% + 4px); left:0; right:0; background:var(--surface); border:1.5px solid var(--line); border-radius:12px; box-shadow:0 10px 30px rgba(27,36,48,.18); z-index:900; overflow:hidden}
.msugg-row{display:flex; justify-content:space-between; align-items:center; gap:10px; width:100%; min-height:44px; padding:10px 14px; background:none; border:0; border-bottom:1px solid var(--line); cursor:pointer; font:inherit; text-align:left}
.msugg-row:last-child{border-bottom:0}
.msugg-row:hover{background:var(--surface2)}
.msugg-row span{color:var(--muted); font-size:.8rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}

/* Dôvera + anti-spam */
.trust-row{display:flex; flex-wrap:wrap; gap:8px 18px; justify-content:center; margin-top:18px; font-size:.82rem; color:#93A3B3}
.trust-row span{white-space:nowrap}
.hp-field{position:absolute !important; left:-9999px; width:1px; height:1px; opacity:0; overflow:hidden}
@media (max-width:640px){ .trust-row{gap:6px 12px; font-size:.76rem} }

@media (prefers-reduced-motion: reduce){*{transition:none !important; animation:none !important}}
/* ═══════════════════════════════════════════════════════════════
   PORIEŠI.ME — MOBILE APP-LOOK PATCH v1 (syntéza 12 návrhov)
   Vložiť NA ÚPLNÝ KONIEC assets/style.css — cascade musí prebiť
   staršie bloky @media 720/699/640/479 px aj .trust-row (r. 322–325).
   ═══════════════════════════════════════════════════════════════ */

/* ---- GLOBÁLNE BEZPEČNÉ (mimo media — na desktope nič nemení) ---- */
#m-tabbar{display:none}
@keyframes viewIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes tbIn{from{transform:translateY(100%)}to{transform:none}}

/* ═══════════════════ MOBIL ≤ 640 px ═══════════════════ */
@media(max-width:640px){

/* 0) TOKENY — typo škála, spacing, tvar, tieň, výška tab lišty */
:root{
  --fs-h1:1.5rem; --fs-h2:1.25rem; --fs-h3:1rem; --fs-body:.9375rem; --fs-small:.8125rem;
  --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:20px; --sp-6:24px; --sp-8:32px;
  --r:12px; --r-lg:16px;
  --shadow:0 1px 2px rgba(27,36,48,.05),0 4px 14px rgba(27,36,48,.06);
  --m-tabbar:calc(58px + env(safe-area-inset-bottom));
}
body{font-size:var(--fs-body); line-height:1.5; padding-bottom:calc(64px + env(safe-area-inset-bottom))}
h1{font-size:var(--fs-h1); line-height:1.2; letter-spacing:-.015em; margin:0 0 .35em}
h2{font-size:var(--fs-h2); line-height:1.25; letter-spacing:-.01em; margin:1.3em 0 .4em}
h3{font-size:var(--fs-h3); line-height:1.35; margin:0 0 .35em}
p{margin:.45em 0}
.small{font-size:var(--fs-small)}
[data-view] h1[style]{font-size:var(--fs-h1)!important}
.sec-pad{padding:var(--sp-6) 0 var(--sp-8)}
.sec-title{margin-top:var(--sp-8)}
.sec-title::after{width:36px; height:3px; margin:8px auto 0}
.sec-sub{font-size:var(--fs-small); margin:6px auto 14px}
.divider{margin:var(--sp-5) 0}
.card{padding:var(--sp-4); border-radius:var(--r-lg)}
.grid{gap:var(--sp-3)}
.kpi-grid{gap:10px}
.kpi{padding:var(--sp-3) var(--sp-4)}
.kpi span{font-size:var(--fs-small)}
.modal{padding:var(--sp-5) var(--sp-4); border-radius:var(--r-lg)}
.hero-search,#hero-sugg{border-radius:var(--r-lg)}
.notice{font-size:var(--fs-small); padding:var(--sp-3) var(--sp-4); line-height:1.5; border-left:4px solid currentColor}
.notice.center{text-align:left}
.metrics{font-size:var(--fs-small); gap:6px 12px}
label{font-size:var(--fs-small); margin:14px 0 6px}
.steps-bar{margin:var(--sp-3) 0 var(--sp-4)}
#toast{bottom:calc(72px + env(safe-area-inset-bottom))}
.foot{margin-top:var(--sp-8)}
/* prepnutie hash-view = jemný fade; chat nie (fixed shell vnútri sekcie) */
section[data-view]:not(.hidden):not([data-view="chat"]){animation:viewIn .22s ease both}

/* 1) DOTYKOVÁ VRSTVA — jednotné výšky, tap feedback, focus */
.btn,.chip,.sugg-chip,.slot,.tab,.langs .lang,.cat-tile,.modal .x,.chat-row,.hdr nav a{-webkit-tap-highlight-color:transparent; touch-action:manipulation; -webkit-user-select:none; user-select:none}
input:not([type=checkbox]):not([type=range]):not(.hp-field),select,textarea{min-height:48px; padding:12px 14px; font-size:16px; border-radius:var(--r)}
textarea{min-height:112px}
.btn{min-height:48px; padding:10px 18px; line-height:1.2; border-radius:var(--r)}
.btn span{line-height:1}
.btn.big{min-height:50px; padding:10px 22px; font-size:1rem}
.btn.sm{min-height:44px; padding:8px 14px; font-size:.85rem}
.chips{gap:8px}
.chip{min-height:44px; padding:10px 16px; display:inline-flex; align-items:center; gap:6px; font-size:.9rem}
.sugg-chip{min-height:44px; padding:9px 14px}
.slot{min-height:44px; display:flex; align-items:center; justify-content:center; border-radius:var(--r)}
.tab{min-height:44px; padding:12px 16px}
.modal .x{width:44px; height:44px; top:2px; right:2px; display:flex; align-items:center; justify-content:center; border-radius:50%}
.modal .x:active{background:var(--surface2)}
.btn,.chip,.sugg-chip,.langs .lang,.cat-tile,.slot{transition:transform .15s ease,background-color .15s ease,border-color .15s ease,color .15s ease}
.btn:not(:disabled):active{transform:scale(.97)}
.chip:active,.sugg-chip:active,.langs .lang:active{transform:scale(.94)}
.slot:not(.off):active{transform:scale(.96)}
.cat-tile:hover{transform:none}
.cat-tile:active{transform:scale(.96); border-color:var(--accent)}
.chat-row{transition:background-color .15s ease}
.chat-row:active{background:var(--surface2)}
.btn:focus-visible,.chip:focus-visible,.sugg-chip:focus-visible,.slot:focus-visible,.langs .lang:focus-visible{outline:2px solid transparent; outline-offset:2px; box-shadow:0 0 0 2px var(--surface),0 0 0 4px var(--accent-dark)}

/* 2) HLAVIČKA — riadok 1: logo + segmentové jazyky; riadok 2: chip-nav */
.hdr{padding-top:env(safe-area-inset-top)}
.hdr .wrap{flex-wrap:wrap; align-items:center; gap:0; row-gap:0; min-height:0; padding:0 14px}
.logo{order:1; min-height:52px; display:flex; align-items:center}
.logo img{height:20px}
.langs{order:2; margin-left:auto; display:flex; gap:0; align-items:center; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12); border-radius:99px; padding:2px}
.langs .lang{border:none; background:none; color:#93A3B3; font:700 .7rem "IBM Plex Sans",sans-serif; letter-spacing:.06em; min-width:40px; min-height:32px; padding:0 8px; border-radius:99px; position:relative}
.langs .lang::after{content:''; position:absolute; inset:-8px -1px}
.langs .lang.on{background:var(--accent); border-color:var(--accent); color:#fff}
.hdr nav{order:3; width:auto; display:flex; flex-wrap:nowrap; gap:6px; margin:0 -14px; padding:2px 14px 8px; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; scroll-snap-type:x proximity; scroll-padding-left:14px; -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 14px,#000 calc(100% - 22px),transparent); mask-image:linear-gradient(90deg,transparent 0,#000 14px,#000 calc(100% - 22px),transparent)}
.hdr nav::-webkit-scrollbar{display:none}
.hdr nav a{flex:none; display:inline-flex; align-items:center; min-height:44px; padding:0 16px; border-radius:99px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12); color:#DAE3EB; font-size:.85rem; font-weight:600; white-space:nowrap; scroll-snap-align:start}
.hdr nav a:hover{background:rgba(255,255,255,.08)}
.hdr nav a:active{background:rgba(255,255,255,.22)}
.hdr nav a.on{background:var(--accent); border-color:var(--accent); color:#fff; font-weight:700}

/* 3) HERO — timeline kroky, karta s lupou, ikonové CTA (emoji spany skryté) */
.hero{padding:28px 0 26px}
.hero::before{width:360px; height:360px; right:-160px; top:-180px}
.hero::after{width:300px; height:300px; left:-160px; bottom:-170px}
.hero h1{font-size:1.7rem; line-height:1.12; letter-spacing:-.02em}
.hero .claim{font-size:.92rem; line-height:1.5; margin:6px auto 0; max-width:34ch}
.hero-steps{position:relative; flex-direction:column; align-items:stretch; gap:0; width:fit-content; max-width:100%; margin:14px auto 0; font-size:.84rem; text-align:left}
.hero-steps::before{content:''; position:absolute; left:9px; top:16px; bottom:16px; width:2px; border-radius:2px; background:linear-gradient(180deg,rgba(232,115,12,.6),rgba(232,115,12,.12))}
.hero-steps > span{position:relative; z-index:1; display:flex; align-items:flex-start; padding:5px 0; line-height:1.35}
.hero-steps i{width:20px; height:20px; font-size:.68rem; margin-right:10px; margin-top:-1px}
.hero-steps .arr{display:none}
.hero-search{padding:10px; box-shadow:0 12px 32px rgba(0,0,0,.32),0 2px 8px rgba(0,0,0,.18)}
.hero-center .row{gap:8px}
.hero-center .row select,.hero-center .row input{height:48px; border-radius:var(--r); font-size:.95rem}
#home-q{padding-left:42px; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235B6B7C' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='10' cy='10' r='7'/%3E%3Cpath d='M21 21l-6-6'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:13px center; background-size:18px 18px}
#hero-go > span:first-child,.hero-search .btn.sec > span:first-child{display:none}
#hero-go::before,.hero-search .btn.sec::before{content:''; flex:none; width:18px; height:18px; background:currentColor; -webkit-mask:var(--mi) center/contain no-repeat; mask:var(--mi) center/contain no-repeat}
#hero-go{--mi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='10' cy='10' r='7'/%3E%3Cpath d='M21 21l-6-6'/%3E%3C/svg%3E"); height:50px; border-radius:var(--r); font-weight:700; font-size:1rem; box-shadow:0 6px 16px rgba(232,115,12,.35)}
.hero-search .btn.sec{--mi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20h4L18.5 9.5a2.828 2.828 0 1 0 -4-4L4 16v4'/%3E%3Cpath d='M13.5 6.5l4 4'/%3E%3C/svg%3E"); height:48px; border:none; background:transparent; color:var(--accent-dark); font-weight:700; font-size:.95rem}
.hero-search .btn.sec:hover{background:rgba(232,115,12,.08)}
.hero-center > p.small{font-size:.78rem; line-height:1.45; padding:0 6px}
.hero-center > p.small > span{display:none}
/* trust prvky: 2×2 mriežka chipov namiesto rozbitého riadku */
.trust-row{display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:22px; font-size:.74rem; color:#C9D4DE; text-align:left}
.trust-row span{white-space:normal; display:flex; align-items:center; min-height:48px; padding:9px 11px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); border-radius:var(--r); font-weight:600; line-height:1.35}

/* 4) SPODNÁ TAB LIŠTA #m-tabbar (markup viď html_edits) */
#m-tabbar{display:grid; grid-template-columns:repeat(5,1fr); position:fixed; left:0; right:0; bottom:0; z-index:80; background:rgba(255,255,255,.94); -webkit-backdrop-filter:blur(14px) saturate(1.5); backdrop-filter:blur(14px) saturate(1.5); border-top:1px solid var(--line); box-shadow:0 -6px 24px rgba(27,36,48,.08); padding:0 2px env(safe-area-inset-bottom); animation:tbIn .25s ease both}
#m-tabbar .mt-i{display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; min-height:58px; padding:7px 2px 6px; text-decoration:none; color:var(--muted); font:600 .66rem/1 "IBM Plex Sans",sans-serif; letter-spacing:.01em; -webkit-tap-highlight-color:transparent; touch-action:manipulation; user-select:none}
#m-tabbar .mt-i svg{width:23px; height:23px; display:block; transition:transform .15s}
#m-tabbar .mt-i.on{color:var(--accent-dark)}
#m-tabbar .mt-i.on svg{stroke-width:2.2}
#m-tabbar .mt-i:active svg{transform:scale(.9)}
#m-tabbar .mt-ico{position:relative; display:block}
#m-tabbar .mt-pill{position:absolute; top:-4px; right:-9px; min-width:16px; height:16px; padding:0 4px; background:var(--accent); color:#fff; border-radius:99px; border:2px solid #fff; font:700 .62rem/12px "IBM Plex Sans",sans-serif; font-style:normal; display:flex; align-items:center; justify-content:center; box-sizing:content-box}
#m-tabbar .mt-pill:empty{display:none}
#m-tabbar .mt-fab-c{display:flex; align-items:center; justify-content:center; width:46px; height:46px; margin-top:-20px; border-radius:50%; color:#fff; background:linear-gradient(160deg,var(--accent) 20%,var(--accent-dark)); box-shadow:0 0 0 4px rgba(255,255,255,.94), 0 0 0 5px var(--line), 0 6px 16px rgba(232,115,12,.38); transition:transform .15s}
#m-tabbar .mt-fab-c svg{width:22px; height:22px}
#m-tabbar .mt-fab.on{color:var(--accent-dark)}
#m-tabbar .mt-fab.on .mt-fab-c{background:linear-gradient(160deg,var(--accent-dark),#A34F05)}
#m-tabbar .mt-fab:active .mt-fab-c{transform:scale(.94)}

/* 5) KATEGÓRIE — horizontálne 2-radové snap karusely, squircle ikony */
.cats{grid-template-columns:none; grid-auto-flow:column; grid-template-rows:repeat(2,1fr); grid-auto-columns:29%; gap:8px; overflow-x:auto; overscroll-behavior-x:contain; -webkit-overflow-scrolling:touch; scroll-snap-type:x proximity; scroll-padding-left:14px; margin:0 -14px; padding:4px 14px 14px; scrollbar-width:none}
.cats::-webkit-scrollbar{display:none}
#sezona{grid-template-rows:none}
.cats .cat-tile{scroll-snap-align:start; display:flex; flex-direction:column; align-items:center; justify-content:flex-start; gap:7px; padding:10px 4px 9px; min-height:92px; border-radius:14px; border:1px solid var(--line); box-shadow:0 1px 3px rgba(27,36,48,.06)}
.cats .cat-tile .ic{width:42px; height:42px; margin:0; border-radius:13px; background:rgba(232,115,12,.10); display:flex; align-items:center; justify-content:center; font-size:1.15rem}
.cats .cat-tile .ic .cicon{width:21px; height:21px; vertical-align:baseline}
.cats .cat-tile .nm{font-size:.72rem; line-height:1.2; font-weight:600; text-align:center; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; overflow-wrap:anywhere; hyphens:auto}

/* 6) KARTY MAJSTROV v zozname (#list-root) — natívna hierarchia */
#list-root .grid.c2{gap:12px}
#list-root .grid.c2>.card{padding:16px; border-radius:var(--r-lg); box-shadow:0 1px 3px rgba(27,36,48,.06)}
#list-root .prov{flex-wrap:nowrap; gap:12px}
#list-root .prov .avatar{width:48px; height:48px; font-size:1.35rem; box-shadow:0 0 0 2px var(--accent-soft)}
#list-root .prov h3{font-size:1.06rem; font-weight:800; line-height:1.3; letter-spacing:-.01em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
#list-root .prov h3+.row{gap:6px !important; margin:5px 0 0 !important}
#list-root .prov .badge{font-size:.68rem; padding:2.5px 8px}
#list-root .prov h3+.row+div{margin-top:6px}
#list-root .prov .stars{font-size:.95rem; letter-spacing:.5px}
#list-root .prov>div>p.small.muted{margin:10px 0 0 -60px !important; font-size:.86rem; line-height:1.45; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
#list-root .prov .metrics{margin:10px 0 0 -60px; padding:9px 12px; background:var(--surface2); border-radius:10px; gap:4px 14px; font-size:.78rem}
#list-root .prov .row:last-of-type{margin-top:12px !important; margin-left:-60px; gap:10px; flex-wrap:nowrap}
#list-root .prov .row:last-of-type .btn{flex:1 1 0; min-height:46px; padding:10px 8px; font-size:.92rem; border-radius:var(--r); white-space:nowrap}
#list-root .prov .row:last-of-type .btn:not(.sec){flex:1.4 1 0}
#list-root .prov .row:last-of-type .btn:not(.sec):active{background:var(--accent-dark)}
#list-root .prov .row:last-of-type .btn.sec:active{background:var(--surface2)}

/* 7) PROFIL MAJSTRA (#provider-root) — hooky .prov-hero/.prov-verif/.prov-cal/.rev-item/.prov-cta */
#provider-root>.btn.sm.ghost{min-height:44px; display:inline-flex; align-items:center; padding:0 16px; border-radius:99px}
#provider-root .prov-hero{border-radius:var(--r-lg); padding:20px 14px 16px}
#provider-root .prov-hero .prov{flex-direction:column; align-items:center; text-align:center; gap:10px}
#provider-root .prov-hero .avatar{width:76px!important; height:76px!important; font-size:2.3rem!important; box-shadow:0 0 0 3px var(--surface),0 0 0 4.5px rgba(232,115,12,.45),0 0 0 11px rgba(232,115,12,.09),0 0 0 12px rgba(232,115,12,.16)}
#provider-root .prov-hero h2{font-size:1.3rem}
#provider-root .prov-hero .row{justify-content:center}
#provider-root .prov-hero .prov p{max-width:52ch; margin-left:auto!important; margin-right:auto!important}
#provider-root .metrics{display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:10px; font-size:.75rem}
#provider-root .metrics span{background:var(--surface2); border-radius:10px; padding:8px 6px; text-align:center; line-height:1.35}
#provider-root .metrics span:last-child:nth-child(odd){grid-column:1/-1}
#provider-root .metrics b{font-size:.95rem; font-variant-numeric:tabular-nums}
#provider-root .card{border-radius:var(--r-lg); margin-top:12px!important}
#provider-root .card h3{margin-bottom:.5em}
#provider-root .prov-verif li{display:flex; align-items:flex-start; gap:10px; padding:10px 0!important; border-top:1px solid var(--line); font-size:.9rem}
#provider-root .prov-verif li:first-child{border-top:0; padding-top:2px!important}
#provider-root .prov-verif li>span:first-child{flex:none; width:22px; height:22px; border-radius:50%; background:var(--good-bg); display:inline-flex; align-items:center; justify-content:center; font-size:.78rem; margin-top:1px}
#provider-root .prov-cal .slots{grid-template-columns:1fr 1fr; gap:8px}
#provider-root .prov-cal .slot{min-height:46px; border-radius:var(--r); font-size:.82rem; font-variant-numeric:tabular-nums; padding:6px 4px}
#provider-root .prov-cal .slot.sel{box-shadow:0 4px 12px rgba(232,115,12,.35)}
#provider-root .prov-cal #btn-book{width:100%; min-height:50px; font-size:1rem; border-radius:var(--r)}
#provider-root .rev-item{padding:12px 0 10px!important}
#provider-root .rev-item .row{row-gap:2px}
#provider-root .rev-item .badge{font-size:.68rem}
#provider-root .prov-cta{position:sticky; bottom:var(--m-tabbar,0px); z-index:40; flex-wrap:nowrap; gap:8px; margin:16px -14px 0!important; padding:12px 14px 10px; background:linear-gradient(180deg,rgba(244,246,248,0),var(--bg) 32%)}
#provider-root .prov-cta .btn.big{width:auto; flex:1 1 0; min-height:50px; padding:8px 10px; font-size:.92rem; line-height:1.2; border-radius:var(--r)}
#provider-root .prov-cta .btn.big:not(.sec){flex:1.45 1 0; box-shadow:0 6px 16px rgba(232,115,12,.30)}
#provider-root .prov-cta .btn.big.sec{background:var(--surface)}

/* 8) DOPYT WIZARD (#dopyt-root) — progress s číslom kroku, sticky nav */
#dopyt-root h1{margin-bottom:2px}
#dopyt-root .card{padding:18px 16px 16px; box-shadow:0 10px 30px rgba(27,36,48,.07)}
#dopyt-root .card h2{font-size:1.05rem; margin:0 0 14px}
#dopyt-root .card h2::first-letter{color:var(--accent-dark)}
#dopyt-root .steps-bar{align-items:center; gap:5px; margin:10px 0 14px; counter-reset:wizstep 0}
#dopyt-root .steps-bar i{height:6px; border-radius:99px}
#dopyt-root .steps-bar i.done{counter-increment:wizstep}
#dopyt-root .steps-bar i.done:not(:has(~ i.done)){background:linear-gradient(90deg,var(--accent),var(--accent-dark))}
#dopyt-root .steps-bar::after{content:counter(wizstep) "/4"; flex:none; min-width:46px; text-align:center; padding:6px 0; border-radius:99px; background:var(--accent-soft); color:var(--accent-dark); font:800 .78rem/1 "IBM Plex Sans",system-ui,sans-serif}
#dopyt-root .chip.on{box-shadow:0 4px 12px rgba(27,36,48,.22)}
#dopyt-root label{font-weight:700; color:var(--muted); margin:16px 0 6px}
#dopyt-root input:not([type=checkbox]):not(.hp-field),#dopyt-root select{-webkit-appearance:none; appearance:none}
#dopyt-root select{background:var(--surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235B6B7C' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center/18px; padding-right:40px}
#dopyt-root #wiz-q{background:var(--surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235B6B7C' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='M21 21l-5.8-5.8'/%3E%3C/svg%3E") no-repeat 12px center/18px; padding-left:40px}
#dopyt-root input[type=checkbox]{min-height:0; width:22px !important; height:22px; accent-color:var(--accent)}
#dopyt-root label:has(input[type=checkbox]){min-height:44px; display:flex; align-items:center; font-size:.95rem; color:var(--ink)}
#dopyt-root .card>.row.wiz-nav{position:sticky; bottom:var(--m-tabbar,0px); z-index:5; flex-wrap:nowrap; gap:10px; margin-left:-16px; margin-right:-16px; padding:12px 16px; background:var(--surface); border-top:1px solid var(--line); box-shadow:0 -10px 18px -14px rgba(27,36,48,.25)}
#dopyt-root .card>.row.wiz-nav:last-child{margin-bottom:-16px; border-radius:0 0 var(--r-lg) var(--r-lg)}
#dopyt-root .wiz-nav .btn{flex:1 1 auto; min-height:50px; border-radius:var(--r); font-size:1rem; font-weight:700; white-space:nowrap}
#dopyt-root .wiz-nav .btn.sec{flex:0 0 auto; min-width:100px}

/* 9) CHAT — fullscreen messenger (prekryje aj tab lištu: z 90 > 80) */
.chat-row{padding:12px; gap:12px; margin-bottom:8px; border-radius:14px; min-height:72px}
.unread-pill{min-width:22px; height:22px; display:inline-flex; align-items:center; justify-content:center; padding:0 7px}
.chat-shell{position:fixed; inset:0; z-index:90; height:100vh; height:100dvh; min-height:0; border:0; border-radius:0}
.chat-head{min-height:58px; padding:8px 10px; padding-top:calc(8px + env(safe-area-inset-top)); gap:10px; background:var(--surface)}
.chat-head .btn.ghost{width:44px; height:44px; min-height:44px; flex:none; padding:0; border:none; background:transparent; color:var(--ink); font-size:1.45rem; border-radius:50%}
.chat-head .btn.ghost:active{background:var(--surface2)}
.chat-head b{display:block; font-size:1rem; line-height:1.2; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.chat-head .btn.sec{min-height:44px; border-radius:99px; padding:0 14px}
.chat-msgs{padding:12px 12px 16px; gap:5px; overscroll-behavior:contain}
.msg{max-width:82%; padding:8px 13px 5px; border-radius:18px; line-height:1.42}
.msg.me{border-bottom-right-radius:5px}
.msg.them{border:none; border-bottom-left-radius:5px; box-shadow:0 1px 1px rgba(27,36,48,.12)}
.msg.me+.msg.me{border-top-right-radius:6px}
.msg.them+.msg.them{border-top-left-radius:6px}
.msg .mt{font-size:.64rem; margin-top:2px}
.chat-day{border:none; background:rgba(27,36,48,.07); border-radius:12px; padding:4px 12px; line-height:1.45; margin:10px 0 4px; font-size:.72rem}
.typing{border:none; border-bottom-left-radius:5px; box-shadow:0 1px 1px rgba(27,36,48,.12)}
.chat-input{align-items:center; gap:8px; padding:8px 10px calc(8px + env(safe-area-inset-bottom))}
.chat-input .btn{flex:0 0 auto}
.chat-input input{min-height:44px; font-size:16px; padding:10px 16px; border-radius:22px; border-color:transparent; background:var(--surface2); caret-color:var(--accent)}
.chat-input input:focus{background:var(--surface); border-color:var(--accent); outline:none}
#chat-vid,#chat-send{width:48px; height:48px; flex:none; padding:0; border-radius:50%; font-size:0}
#chat-vid{background:transparent; border:none; color:var(--accent-dark)}
#chat-vid:active{background:var(--accent-soft)}
#chat-send:active{transform:scale(.92)}
#chat-vid::before{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 10l4.5-2.3a1 1 0 0 1 1.5.9v6.8a1 1 0 0 1-1.5.9L15 14z'/%3E%3Crect x='3' y='6' width='12' height='12' rx='2'/%3E%3C/svg%3E")}
#chat-send::before{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 14L21 3m0 0l-6.5 18a.55.55 0 0 1-1 0l-3.5-7l-7-3.5a.55.55 0 0 1 0-1z'/%3E%3C/svg%3E")}
#chat-vid::before,#chat-send::before{content:''; width:23px; height:23px; background:currentColor; -webkit-mask:var(--i) center/contain no-repeat; mask:var(--i) center/contain no-repeat}

/* 10) MAPA (#mapa-root) — appková mriežka, radar konzola, bottom-sheet */
#mapa-root>.spread{align-items:center}
#mapa-root>.spread h1{font-size:1.25rem !important}
#mapa-root>.spread .btn.sm{min-height:44px}
#mapa-root>.card{padding:14px; border-radius:var(--r-lg)}
#mapa-root>.card>.row{display:grid; grid-template-columns:1fr auto; gap:10px; grid-template-areas:"cat cat" "addr go" "rad rad" "me me"; align-items:stretch !important}
#mapa-root>.card>.row>div{min-width:0 !important}
#mapa-root>.card>.row>div:nth-of-type(1){grid-area:cat}
#mapa-root>.card>.row>div:nth-of-type(2){grid-area:addr}
#mapa-root>.card>.row>div:nth-of-type(3){grid-area:rad}
#m-go{grid-area:go; align-self:end; height:48px; padding:0 18px}
#m-me{grid-area:me; min-height:48px}
#mapa-root>.card label{margin:0 0 6px; font-size:.8rem; color:var(--muted)}
#mapa-root>.card select,#mapa-root>.card input:not([type=range]){height:48px; font-size:16px}
#mapa-root>.card>.row>div:nth-of-type(3) label{display:flex; justify-content:space-between; align-items:baseline}
#m-rv{color:var(--accent-dark); font-variant-numeric:tabular-nums}
#m-radius{-webkit-appearance:none; appearance:none; border:none; background:transparent; height:44px !important; min-height:44px}
#m-radius::-webkit-slider-runnable-track{height:6px; border-radius:99px; background:var(--line)}
#m-radius::-webkit-slider-thumb{-webkit-appearance:none; width:26px; height:26px; margin-top:-10px; border-radius:50%; background:var(--accent); border:3px solid #fff; box-shadow:0 2px 6px rgba(27,36,48,.3)}
#m-radius::-moz-range-track{height:6px; border-radius:99px; background:var(--line)}
#m-radius::-moz-range-thumb{width:26px; height:26px; border-radius:50%; background:var(--accent); border:3px solid #fff}
#mapa-root>.card #m-status:not(:empty){display:flex; flex-wrap:wrap; align-items:center; gap:6px 8px; margin:12px 0 0 !important; padding:10px 12px; border-radius:var(--r); font-size:.86rem; line-height:1.35; background:var(--ink); color:#E8EDF2; background-image:repeating-radial-gradient(circle at 100% 0, transparent 0 14px, rgba(232,115,12,.14) 14px 15px); border-left:0}
#mapa-root>.card #m-status b{color:var(--accent); font-variant-numeric:tabular-nums}
#mapa-root>.card #m-status .btn{min-height:44px}
#mapa-root>.card #m-status .btn.sec{background:rgba(255,255,255,.14); color:#fff; border-color:rgba(255,255,255,.3)}
#mapa-root>.card #m-status .btn.ghost{color:#fff; background:rgba(232,115,12,.18)}
#mapa-root #map{height:420px; height:min(58dvh,520px); margin:12px -14px 0 !important; border-radius:0; border-left:0; border-right:0; position:relative; z-index:0}
#mapa-root #map .btn.sm{min-height:44px}
#mapa-root #map-results:not(:empty){position:relative; z-index:1; margin:-18px -14px 0 !important; padding:8px 14px 20px; background:var(--bg); border-radius:18px 18px 0 0; box-shadow:0 -8px 24px rgba(27,36,48,.14)}
#mapa-root #map-results:not(:empty)::before{content:''; display:block; width:44px; height:5px; border-radius:99px; background:var(--line); margin:6px auto 14px}
#map-results .map-res-card{padding:14px; border-radius:14px}
#map-results .map-res-card .avatar{width:44px; height:44px; font-size:1.3rem}
#map-results .map-res-card .btn{flex:1; min-height:44px; border-radius:10px}
/* radar jemnejší a pomalší na mobile */
.radar-wrap{border-width:1.5px; box-shadow:inset 0 0 22px rgba(232,115,12,.11),0 0 12px rgba(232,115,12,.14)}
.radar-sweep{animation-duration:3s}
.radar-pulse{border-width:1.5px; animation-duration:3s}
.radar-pulse.p2{animation-delay:1.5s}

/* 11) PÄTIČKA — vertikálne sekcie + radarový motív značky */
.foot{padding:26px 0; font-size:var(--fs-small); line-height:1.7; text-align:center; background:repeating-radial-gradient(circle at 50% 140%, rgba(255,255,255,.035) 0 1px, transparent 1px 44px),radial-gradient(circle at 50% 140%, rgba(232,115,12,.14), transparent 58%),var(--ink)}
.foot .spread{flex-direction:column; align-items:stretch; gap:0}
.foot .spread>div{padding:12px 0}
.foot .spread>div:first-child{padding-top:0}
.foot .spread>div:last-child{padding-bottom:0}
.foot .spread>div+div{border-top:1px solid rgba(255,255,255,.09)}
.foot a{display:inline-block; padding:11px 8px; margin:-11px -8px; line-height:22px; border-radius:8px}

} /* ===== koniec @media(max-width:640px) ===== */

/* ---- REDUCED MOTION — animácie zabíja existujúci globálny kill-switch
        (style.css r. 327); tu dopĺňame len :active transformy a scroll ---- */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  .btn:active,.chip:active,.sugg-chip:active,.slot:active,.langs .lang:active,.cat-tile:active,#chat-send:active,#m-tabbar .mt-i:active svg,#m-tabbar .mt-fab:active .mt-fab-c{transform:none}
}