/* Robotrata · 5. korak, zemljevid v ozadju, gumbi na zemljevidu, urejanje točk */
/* ===== 5. korak: Priporočila – ozadje vrta (hiša zgoraj desno), steklene kartice kot na uvodni strani in v konfiguratorju ===== */
.s5-bg{display:none}
body.s5 .s5-bg{position:fixed;inset:0;z-index:0;pointer-events:none;
  background:url(slike/ozadje-priporocila.webp) right top/cover no-repeat}
body.s5 .s5-bg::before{content:"";position:absolute;inset:-12px;filter:blur(2.5px) saturate(1.05)}
body.s5 .s5-bg{background-image:none!important}
body.s5 .s5-bg::before{background:url(slike/ozadje-priporocila.webp) right top/cover no-repeat}
body.s5 .s5-bg::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,color-mix(in srgb,var(--md-surface) 22%,transparent) 0,color-mix(in srgb,var(--md-surface) 42%,transparent) 40%,color-mix(in srgb,var(--md-surface) 62%,transparent) 100%)}
@media (min-width:901px){body.s5 .s5-bg::after{background:linear-gradient(90deg,color-mix(in srgb,var(--md-surface) 82%,transparent) 0,color-mix(in srgb,var(--md-surface) 55%,transparent) 45%,color-mix(in srgb,var(--md-surface) 22%,transparent) 100%),linear-gradient(180deg,transparent 55%,color-mix(in srgb,var(--md-surface) 80%,transparent) 100%)}}
body.s5 #konfigurator,body.s5 footer,body.s5 .site-foot{position:relative;z-index:1}
body.s5 #konfigurator{background:transparent!important}
body.s5{background:var(--md-surface)}
/* naslov koraka */
body.s5 #wz-head h2{text-shadow:0 1px 18px color-mix(in srgb,var(--md-surface) 70%,transparent)}
body.s5 #wz-head .wz-k{background:var(--glass)!important;backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--glass-line)}
/* steklene kartice */
body.s5 #rezultat .rd,body.s5 #rezultat .rd-acts .btn,body.s5 #rezultat .sumbar>span,body.s5 #warns .warn,body.s5 #recs .rec,body.s5 #more-recs,body.s5 #recs details.out,
body.s5 #konfigurator>.wz-nav,body.s5 #povprasevanje{
  background:var(--glass)!important;backdrop-filter:var(--glass-blur)!important;-webkit-backdrop-filter:var(--glass-blur)!important;border:1px solid var(--glass-line)!important;box-shadow:0 8px 32px rgba(10,30,14,.14)!important}
body.s5 #recs .rec.top{border:2px solid var(--md-primary)!important;box-shadow:0 0 0 4px color-mix(in srgb,var(--md-primary) 18%,transparent),0 12px 40px rgba(10,30,14,.22)!important}
body.s5 #warns .warn.stop{background:color-mix(in srgb,var(--md-error-container) 70%,transparent)!important;border-color:color-mix(in srgb,var(--md-error) 45%,transparent)!important}
body.s5 #warns .warn.care{background:color-mix(in srgb,var(--md-warning-container) 70%,transparent)!important;border-color:color-mix(in srgb,var(--md-warning) 40%,transparent)!important}
body.s5 #warns .warn.ok{padding:8px 14px!important;border-radius:999px!important;display:inline-flex!important}
body.s5 #recs .rec .ph,body.s5 #lead-model .ph{background:color-mix(in srgb,var(--md-sc-lowest) 35%,transparent)!important}
body.s5 #rezultat .rd{border-radius:16px!important}
/* povzetek trate: oznake (kot na mobilnem prikazu) */
body.s5 #rezultat .sumbar{flex-wrap:wrap;gap:8px;margin:0!important;padding:0!important;background:none!important;border:0!important;box-shadow:none!important}
body.s5 #rezultat .sumbar::before,body.s5 #rezultat .sumbar>span::before{display:none!important;content:none!important}
body.s5 #rezultat .sumbar>span{display:inline-flex!important;align-items:center;gap:6px;height:38px!important;min-height:0!important;padding:0 14px!important;border-radius:999px!important;border-top:1px solid var(--glass-line)!important}
body.s5 #rezultat .sumbar>span .ms,body.s5 #rezultat .sumbar .sb-main::after{font-size:18px!important;color:var(--md-primary)}
body.s5 #rezultat .sumbar .sb-main::after{order:-1}
body.s5 #rezultat .sumbar>span b{font:700 14px/18px var(--font)!important}
body.s5 #rezultat .sumbar>span small{margin:0!important}
/* računalnik: en stolpec – povzetek analize in trate zgoraj, nato kosilnice */
@media (min-width:901px){
  body.s5 #konfigurator #rezultat{display:flex!important;flex-direction:column;}
  body.s5 #konfigurator #rezultat>*{position:static!important;margin:0!important}
  body.s5 #konfigurator #rezultat>.res-done{order:1;display:flex!important;}
  body.s5 #konfigurator #rezultat .rd{flex:1 1 520px;margin:0!important}
  body.s5 #konfigurator #rezultat .rd-acts{flex:0 0 auto;display:flex;flex-direction:row!important;align-items:center;gap:8px;margin:0!important}
  body.s5 #konfigurator #rezultat .rd-acts .btn{border-radius:999px!important;padding:0 16px 0 12px}
  body.s5 #konfigurator #rezultat>.sumbar{order:2}
  body.s5 #konfigurator #rezultat>#warns{order:3}
  body.s5 #konfigurator #rezultat>#recs{order:4}
  body.s5 #konfigurator #rezultat #warns:empty{display:none}
}
/* telefon: brez črt napredka, naslov in kartice čez sliko */
@media (max-width:900px){
  body.s5 #konfigurator>.wz-steps{display:none!important}
  
  body.s5 #rezultat .rd-acts .btn{border-radius:999px!important;}
  body.s5 #rezultat .rd-acts{gap:8px!important}
}

/* 5. korak, kartica kosilnice: poudarek 1) slika kosilnice, 2) ime modela, 3) znamka */
body.s5 #konfigurator #recs .rec.nc .hd{grid-template-columns:1fr!important;gap:10px!important;position:relative!important;}
body.s5 #konfigurator #recs .rec.nc .ph{grid-row:1;border-radius:16px!important;place-items:center;overflow:hidden}
body.s5 #konfigurator #recs .rec.nc .ph img{width:100%;height:100%;object-fit:contain;padding:4% 8%!important;filter:drop-shadow(0 14px 18px rgba(0,0,0,.35))}
body.s5 #konfigurator #recs .rec.nc .ph svg{max-height:100%}
body.s5 #konfigurator #recs .rec.nc.top .ph{height:190px!important}
body.s5 #konfigurator #recs .rec.nc .nm{grid-row:2;display:flex!important;flex-direction:column-reverse;gap:2px;padding:0 2px}
body.s5 #konfigurator #recs .rec.nc h3{font:800 24px/29px var(--font)!important;letter-spacing:-.02em!important}
body.s5 #konfigurator #recs .rec.nc.top h3{font-size:27px!important;line-height:32px!important}
body.s5 #konfigurator #recs .rec.nc .nm .brand{font:600 13px/18px var(--font)!important;letter-spacing:.02em!important;color:var(--md-on-surface-variant)!important;margin:0!important}
body.s5 #konfigurator #recs .rec.nc .nm .brand::before{display:inline-block!important;content:""!important;width:8px;height:8px;border-radius:50%;background:var(--brand);margin-right:6px;vertical-align:1px}
/* pokal in zvezdice na sliki zgoraj desno */
body.s5 #konfigurator #recs .rec.nc .podium-m{position:absolute!important;top:8px!important;right:8px!important;left:auto!important;flex-direction:column;align-items:center;gap:2px;padding:6px 8px;border-radius:12px;
  background:var(--glass);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--glass-line);z-index:2;transform:none!important}
/* oznaka vloge na sliki zgoraj levo */
body.s5 #konfigurator #recs .rec.nc{position:relative}
body.s5 #konfigurator #recs .rec.nc>.role{position:absolute;top:26px;left:26px;z-index:3;margin:0!important}
body.s5 #konfigurator #recs .rec.nc.top>.role{top:27px;left:27px}
body.s5 #konfigurator #recs .rec.nc>.role~.hd{margin-top:0!important}
@media (max-width:900px){
  body.s5 #konfigurator #recs .rec.nc .hd{grid-template-columns:1fr!important}
  body.s5 #konfigurator #recs .rec.nc .ph{height:170px!important}
}

/* slika kosilnice na zgornji sredini kartice */
body.s5 #konfigurator #recs .rec.nc .hd{display:flex!important;flex-direction:column!important;align-items:stretch!important;width:100%!important;max-width:none!important;align-self:stretch!important;grid-column:1 / -1!important;justify-self:stretch!important}
body.s5 #konfigurator #recs .rec.nc .ph{order:-1;align-self:center!important;width:100%!important;max-width:none!important;margin:0 auto!important;display:flex!important;align-items:center;justify-content:center;flex:none}
body.s5 #konfigurator #recs .rec.nc .ph img,body.s5 #konfigurator #recs .rec.nc .ph .ph-fb{margin:0 auto!important;object-position:50% 50%!important;display:flex;align-items:center;justify-content:center}
body.s5 #konfigurator #recs .rec.nc .ph .ph-fb[hidden],body.s5 #konfigurator #recs .rec.nc .ph img[hidden]{display:none!important}
body.s5 #konfigurator #recs .rec.nc .ph .ph-fb{width:100%;height:100%}
/* AI prikaz vrta */
.ls-fx .ls-aiw{position:absolute;right:14px;bottom:calc(var(--nav-h,72px) + 40px);display:flex;gap:8px;z-index:3}
#konfigurator:not([data-step="3"]):not([data-step="4"]) .ls-aiw{bottom:14px}
.ls-fx .ls-ai-re{pointer-events:auto;cursor:pointer;border:0}
.ls-fx .ls-ai-re:focus-visible{outline:3px solid #39ff7a;outline-offset:2px}
.ls-ai.busy .ms{animation:aivspin 1.1s linear infinite}
@keyframes aivspin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.ls-ai.busy .ms{animation:none}}
body.m-s3 #nastavitve .ls-fx .ls-aiw{display:contents}
/* nalaganje AI prikaza: kartica na sredini spodaj, robotska kosilnica kosi travo */
.ls-fx .ls-aiload{position:absolute;left:50%;transform:translateX(-50%);bottom:calc(var(--nav-h,72px) + 40px);z-index:3;display:flex;align-items:center;gap:14px;padding:10px 18px 10px 10px;border-radius:18px;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 10px 28px rgba(10,30,14,.25);color:#17211a;width:min(420px,calc(100% - 28px))}
#konfigurator:not([data-step="3"]):not([data-step="4"]) .ls-aiload{bottom:14px}
.aiv-tx{display:grid;gap:3px;min-width:0}.aiv-tx b{font:600 14px/1.25 var(--font)}.aiv-tx small{font-size:12px;color:#4d5b52}
.aiv-lawn{flex:0 0 128px;height:62px;border-radius:12px;background:#f3f7f1;display:grid;place-items:center;overflow:hidden}
.aiv-pic{width:124px;height:60px;overflow:hidden}
.aiv-pic .aiv-body,.aiv-pic .aiv-wheel,.aiv-pic .aiv-gl{stroke:#1d2a22;stroke-width:2.4}
.aiv-pic .aiv-line{stroke:#1d2a22;stroke-width:1.6;opacity:.5}
.aiv-pic .aiv-dash{stroke:#1d2a22;stroke-width:1.5;opacity:.3;animation:aivdash .6s linear infinite}
.aiv-pic .aiv-bl,.aiv-pic .aiv-tufts{stroke:#3f9a3f;stroke-width:2}
.aiv-pic .aiv-wheel{transform-box:fill-box;transform-origin:center;animation:aivwheel .6s linear infinite}
.aiv-pic .aiv-bot{animation:aivbump .3s ease-in-out infinite alternate}
.aiv-pic .aiv-tufts{animation:aivtuft .9s linear infinite}
.aiv-pic .aiv-bl{transform-box:fill-box;transform-origin:center;opacity:0;animation:aivclip 1.2s ease-out infinite}
.aiv-pic .b2{animation-delay:-.4s}.aiv-pic .b3{animation-delay:-.8s}
@keyframes aivwheel{to{transform:rotate(360deg)}}
@keyframes aivdash{to{transform:translateX(-24px)}}
@keyframes aivbump{to{transform:translateY(-.7px)}}
@keyframes aivtuft{0%{transform:translateX(6px);opacity:0}20%{opacity:1}80%{opacity:1}100%{transform:translateX(-10px);opacity:0}}
@keyframes aivclip{0%{transform:translate(14px,6px) rotate(0);opacity:0}15%{opacity:1}100%{transform:translate(-12px,-6px) rotate(-35deg);opacity:0}}
@media (prefers-reduced-motion:reduce){.aiv-pic *{animation:none!important}.aiv-pic .aiv-bl{opacity:1}}
@media (max-width:420px){.aiv-lawn{flex-basis:100px;height:52px}.aiv-pic{width:98px;height:48px}.ls-fx .ls-aiload{gap:10px;padding:8px 12px 8px 8px}}
body.m-s3 #nastavitve .ls-fx .ls-aiload{position:static!important;transform:none!important;width:100%;order:9;margin-top:4px}
/* telefon: pokončni AI prikaz se pod fiksnimi elementi pomika (drsanje po sliki), vse ostalo ostane na mestu */
@media (max-width:900px){
  body.m-s3 #nastavitve .lawn-stage.ai-tall .ls-img{overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y;display:grid;align-content:start;padding-bottom:calc(var(--nav-h,96px) + 34dvh);scrollbar-width:none;z-index:2}
  body.m-s3 #nastavitve .lawn-stage.ai-tall .ls-img::-webkit-scrollbar{display:none}
  body.m-s3 #nastavitve .lawn-stage.ai-tall .ls-img img{position:relative!important;inset:auto!important;grid-area:1/1;width:100%!important;height:auto!important;object-fit:fill;transform:none!important}
  body.m-s3 #nastavitve .lawn-stage.ai-tall .ls-sat{display:none}
  body.m-s3 #nastavitve .lawn-stage.ai-tall .ls-fx,body.m-s3 #nastavitve .lawn-stage.ai-tall::after{pointer-events:none}
}
.ls-fx .ls-src{display:none}
@media (max-width:900px){body.m-s3 #nastavitve .ls-fx .ls-src{display:block;flex-basis:100%;order:10;font-size:10.5px;line-height:14px;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.7);max-width:100%}}
#lawn-stage.is-ai .ls-cap{white-space:normal;width:max-content;max-width:min(760px,calc(100% - 32px));text-align:center}
/* 3D vodilo – vidno samo v načinu ?ai=test */
.ls-fx .ls-r3d{position:absolute;left:14px;bottom:calc(var(--nav-h,72px) + 40px);z-index:4;pointer-events:auto;cursor:zoom-in;width:240px;padding:4px;border:0;border-radius:12px;background:rgba(255,255,255,.95);box-shadow:0 8px 24px rgba(0,0,0,.3);display:grid;gap:4px;text-align:left}
.ls-fx .ls-r3d img{width:100%;height:auto;border-radius:8px;display:block}
.ls-fx .ls-r3d span{font:600 11px/1.3 var(--font);color:#7a2a12}
.ls-fx .ls-r3d.big{width:min(900px,calc(100% - 28px));cursor:zoom-out;z-index:30}
body.m-s3 #nastavitve .ls-fx .ls-r3d{position:fixed!important;left:10px!important;top:calc(var(--tb,69px) + 60px)!important;bottom:auto!important;width:150px}
body.m-s3 #nastavitve .ls-fx .ls-r3d.big{width:calc(100vw - 20px)}

/* gumbi na zemljevidu: okrogli; Razveljavi večji */

#konfigurator .map-wrap #undo{width:48px!important;height:48px!important}
#konfigurator .map-wrap #undo .ms{font-size:24px}
/* telefon: Popravi točke in Izbriši vse zgoraj desno v istem slogu kot iskanje in pomoč */
body.m-stage .m-top .act-btn{width:42px!important;height:42px!important;border-radius:50%!important;display:grid;place-items:center;padding:0;color:var(--md-on-surface);
  background:var(--m-glass)!important;border:1px solid var(--m-glass-line)!important;box-shadow:0 2px 8px rgba(0,0,0,.18)!important}
body.m-stage .m-top .act-btn[hidden]{display:none!important}
body.m-stage .m-top .act-btn .ms{font-size:21px}
body.m-stage .m-top #clear .ms{color:#e5484d}
body.m-stage #konfigurator[data-step="1"] .m-top :is(#edit-btn,#clear){display:none!important}
/* ===== koraka 3–4: zemljevid z vrtom v ozadju, vprašanja v kartici (brez ilustrativne/AI slike) ===== */
#konfigurator:is([data-step="3"],[data-step="4"]) .map-card{display:block!important}
#konfigurator:is([data-step="3"],[data-step="4"]) :is(#stage-left-map,.map-wrap>.tools,.map-wrap>.edit-tools,.map-fs-btn,#fs-hint,#finish-btn,#fs-close,#hint,#status,.grid-note,.map-grid-btn){display:none!important}
#konfigurator:is([data-step="3"],[data-step="4"]) #lawn-stage{background:transparent!important;pointer-events:none}
#konfigurator:is([data-step="3"],[data-step="4"]) #lawn-stage :is(.ls-img,.ls-sat,.ls-cap){display:none!important}
#konfigurator:is([data-step="3"],[data-step="4"]) #lawn-stage::after,#konfigurator:is([data-step="3"],[data-step="4"]) #lawn-stage::before{display:none!important}
#nastavitve .ls-fx .ls-cx{display:none!important}
.wd-list{list-style:none;margin:0;padding:0;display:grid}
.wd-list li{display:grid;grid-template-columns:22px minmax(0,1fr) auto;align-items:center;gap:8px;min-height:34px;padding:4px 0;border-top:1px solid color-mix(in srgb,var(--md-on-surface) 9%,transparent);font-size:13.5px}
.wd-list li:first-child{border-top:0}
.wd-list .ms{font-size:18px;color:var(--md-on-surface-variant)}
.wd-list li.ok .ms{color:var(--md-primary)}
.wd-k{color:var(--md-on-surface-variant)}
.wd-list b{font-weight:700;color:var(--md-on-surface);text-align:right}
.wd-list li:not(.ok) b{font-weight:400;color:var(--md-on-surface-variant)}
@media (min-width:901px){
  #konfigurator:is([data-step="3"],[data-step="4"]) #nastavitve{position:relative;z-index:1030;margin-top:calc(-1 * var(--stage-h))!important;height:var(--stage-h);pointer-events:none}
  #konfigurator:is([data-step="3"],[data-step="4"]) #nastavitve>#lawn-stage{height:var(--stage-h)!important}
  #konfigurator:is([data-step="3"],[data-step="4"]) #nastavitve :is(.q3-panel,#stage-left-set>*){pointer-events:auto}
  body.q3c #konfigurator #stage-left-set>#wz-lawn{display:block!important;}
  #konfigurator:is([data-step="3"],[data-step="4"]) #nastavitve .ls-fx{display:none!important}
}
@media (max-width:900px){
  body.m-s3 #konfigurator .map-card{margin:0!important;padding:0!important;background:none!important;border:0!important;box-shadow:none!important}
  body.m-s3 #konfigurator .map-wrap{position:fixed!important;left:0;right:0;top:var(--tb,45px);bottom:0;z-index:0;margin:0!important;border-radius:0!important;width:auto!important}
  body.m-s3 #konfigurator .map-wrap #map{width:100%!important;height:100%!important;max-height:none!important;min-height:0!important;aspect-ratio:auto!important;border-radius:0!important;margin:0!important}
  body.m-s3 #konfigurator .map-wrap .leaflet-control-zoom,body.m-s3 #konfigurator .map-wrap .lm-z{display:none!important}
  
  body.m-s3 #nastavitve .lawn-stage{z-index:2!important}
}

/* telefon, koraka 3–4: podatki o vrtu v kompaktni kartici zgoraj (namesto oznak na sliki) */
#q3-dots [data-q="5"]{display:none!important}
@media (max-width:900px){
  body.m-s3 #nastavitve .ls-fx{display:none!important}
  body.m-s3 #konfigurator #stage-left-set>#wz-lawn{display:block!important;position:fixed!important;left:10px;top:calc(var(--tb,45px) + 60px);z-index:14;margin:0!important;width:auto!important;border-radius:18px;background:var(--glass)!important;-webkit-backdrop-filter:var(--glass-blur);}
  body.m-s3 #wz-lawn .wd-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 10px}
  body.m-s3 #wz-lawn .wd-list li{grid-template-columns:18px minmax(0,1fr);min-height:22px;padding:0;border:0;font-size:12px}
  body.m-s3 #wz-lawn .wd-list .ms{font-size:15px}
  body.m-s3 #wz-lawn .wd-k{display:none}
  body.m-s3 #wz-lawn .wd-list b{text-align:left;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  body.m-s3 #wz-lawn .wd-list li:not(.ok) b{font-size:0}
  body.m-s3 #wz-lawn .wd-list li:not(.ok) b::before{content:attr(data-k);font-size:12px}
}

/* zemljevid: vsi gumbi okrogli oz. ovalni (enoten videz) */
#konfigurator .map-wrap :is(.act-btn,.map-fs-btn,.attr-btn,.m-tb){border-radius:999px!important}
#konfigurator .map-wrap :is(.segd,.passw,.edit-undo,.finish-btn,.fs-close){border-radius:999px!important}
#konfigurator .map-wrap .segd .tool,#konfigurator .map-wrap .edit-tools .tool{border-radius:999px!important}
#konfigurator .map-wrap .leaflet-bar{border:0!important;background:none!important;box-shadow:none!important;border-radius:0!important;overflow:visible!important;display:grid;gap:8px}
#konfigurator .map-wrap .leaflet-bar a{width:44px!important;height:44px!important;line-height:44px!important;border-radius:999px!important;border:1px solid var(--glass-line)!important;
  background:var(--glass)!important;backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);color:var(--md-on-surface)!important;box-shadow:0 2px 10px rgba(0,0,0,.2)!important;font-size:22px!important}
#konfigurator .map-wrap .leaflet-bar a.leaflet-disabled{opacity:.45}
#konfigurator .map-wrap .leaflet-control-layers{border-radius:999px!important;overflow:hidden}
#konfigurator .map-wrap .leaflet-control-layers-toggle{width:44px!important;height:44px!important;border-radius:999px!important}
#konfigurator .map-wrap .leaflet-control-layers-expanded{border-radius:18px!important}
#konfigurator .map-wrap .attr-btn{width:32px;height:32px}
.m-top .m-tb,.m-top .act-btn{border-radius:999px!important}

/* ===== gumbi na zemljevidu ostanejo na istih mestih (koraki 1–4, vsa stanja) ===== */
#konfigurator .map-wrap #edit-btn:disabled,.m-top #edit-btn:disabled{opacity:.4;cursor:default}
@media (max-width:900px){
  /* desni stolpec: zgoraj gumbi (iskanje, popravi, izbriši, pomoč), pod njimi vedno gumb za plasti in ⓘ */
  body:is(.m-stage,.m-s3) #konfigurator .map-wrap .leaflet-bottom.leaflet-right{top:62px!important;bottom:auto!important;right:12px!important}
  body:is(.m-stage,.m-s3) #konfigurator .map-wrap .leaflet-bottom.leaflet-right .leaflet-control{margin:0 0 8px!important;float:right;clear:both}
  body.m-stage #search-box{right:64px!important}
  body.m-s3 #konfigurator #stage-left-set>#wz-lawn{right:64px!important}
  /* spodnja plošča stalne višine: navodilo vedno v dveh vrsticah, zato orodja ne skačejo */
  body.m-stage .m-sheet #hint{display:-webkit-box!important;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:42px}
  body.m-stage .m-sheet #hint:empty{display:block!important}
  /* širina prehoda nad vrstico orodij (vrstica ostane na mestu) */
  body.m-stage #konfigurator .map-wrap>.tools .passw{position:absolute;left:0;bottom:calc(100% + 8px);margin:0}
}

/* ===== koraka 3–4: ločene kartice – površina (zelena, vedno zgoraj), lastnosti vrta, vaše želje ===== */
.wd-cards{display:flex;flex-direction:column;gap:10px}
.wd-c{border-radius:18px;padding:12px 14px;background:var(--glass);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--glass-line);box-shadow:0 8px 28px rgba(10,30,14,.16)}
.wd-areac{display:flex;justify-content:space-between;gap:10px;background:linear-gradient(150deg,#14713d,#22a659)!important;}
.wd-areac>div{display:grid;gap:2px;min-width:0}
.wd-areac b{letter-spacing:-.03em;}
.wd-areac b small{font-size:18px;font-weight:700}
.wd-areac span{font-size:13px;line-height:17px;}
.wd-edit{flex:none;background:color-mix(in srgb,#fff 15%,transparent);place-items:center;cursor:pointer}

.wd-ch{display:flex;align-items:center;gap:8px;width:100%;padding:0;border:0;background:none;color:var(--md-on-surface);font:inherit;text-align:left;cursor:default}
button.wd-ch[aria-expanded]{cursor:pointer}
.wd-ch b{font:700 15px/20px var(--font);flex:1}
.wd-ch small{font:600 12px/16px var(--font);color:var(--md-on-surface-variant)}
.wd-ci{font-size:19px;color:var(--md-primary)}
.wd-chev{font-size:20px;color:var(--md-on-surface-variant);}
.wd-ch[aria-expanded="true"] .wd-chev{transform:rotate(180deg)}
.wd-c .wd-list{margin-top:6px}
.wd-c.col .wd-list{display:none}


@keyframes wdIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes wdCol{from{opacity:.6;transform:scaleY(1.6);transform-origin:top}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.wd-c.anim,.wd-c.anim-col{animation:none}}
/* računalnik: kartice v levem stolpcu brez skupnega ozadja */
@media (min-width:901px){
  body.q3c #konfigurator #stage-left-set>#wz-lawn{background:none!important;border:0!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;padding:0 4px 4px 0!important;border-radius:0!important;max-height:calc(var(--stage-h) - 340px);overflow:auto;scrollbar-width:thin}
}
/* telefon: površina zgoraj, pod njo kompaktna kartica lastnosti (v 4. koraku strnjena v eno vrstico) */
@media (max-width:900px){
  body.m-s3 #konfigurator #stage-left-set>#wz-lawn{background:none!important;border:0!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;padding:0!important}
  body.m-s3 #wz-lawn .wd-cards{gap:6px}
  body.m-s3 #wz-lawn .wd-c{padding:8px 12px;border-radius:16px}
  body.m-s3 #wz-lawn .wd-areac{padding:8px 8px 8px 14px}
  body.m-s3 #wz-lawn .wd-areac>div{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
  
  body.m-s3 #wz-lawn .wd-areac span{font-size:12px}
  
  body.m-s3 #wz-lawn .wd-s4{display:none}
  body.m-s3 #wz-lawn .wd-ch b{font-size:13px}
  body.m-s3 #wz-lawn .wd-s3:not(.col) .wd-ch{display:none}
  body.m-s3 #wz-lawn .wd-s3:not(.col) .wd-list{margin-top:0}
}

/* zaklenjen zemljevid (koraka 3–4): brez gumbov za povečavo, običajen kazalec */
#map.map-locked{cursor:default!important}
#map.map-locked .leaflet-control-zoom{display:none!important}
#map.map-locked .leaflet-grab,#map.map-locked.leaflet-grab{cursor:default!important}

/* odprtost proti nebu: daljši odgovori – en stolpec, trije enaki gumbi */
body.q3c #nastavitve .opt[data-opt="sky"] .seg{grid-template-columns:minmax(0,1fr)!important}
/* ===== urejanje točk: enotni gumbi zgoraj desno (računalnik in telefon) ===== */
body:not(.m-editing) #konfigurator .map-wrap>.tools .segd.segd-ed{display:none!important}
body.m-editing #konfigurator .map-wrap>.tools .segd:not(.segd-ed){display:none!important}
body.m-editing #konfigurator .map-wrap>.tools .segd.segd-ed{display:flex!important}
.segd-ed .tool[data-edit="move"] .ms{color:var(--md-primary)}
#konfigurator .map-wrap>.edit-tools,.m-top~* #edit-tools{display:none!important}
#konfigurator #edit-btn.on,.m-top #edit-btn.on,body.m-stage .m-top #edit-btn.on{background:var(--md-primary)!important;color:var(--md-on-primary)!important;border-color:transparent!important;opacity:1}
#konfigurator #edit-btn.on .ms,.m-top #edit-btn.on .ms{color:var(--md-on-primary)!important}

/* računalnik: Razveljavi, Popravi točke in Izbriši vse enake velikosti */
#konfigurator .map-wrap>.tools .acts .act-btn{width:48px!important;height:48px!important}
@media (min-width:901px){#konfigurator .map-wrap>.tools .segd{min-height:48px;box-sizing:border-box;align-items:center}}

/* drsni trak strani je neviden (pomikanje deluje): vsebina in glava sta poravnani na vseh straneh, ne glede na dolžino strani */
html,body{scrollbar-width:none;-ms-overflow-style:none}
html::-webkit-scrollbar,body::-webkit-scrollbar{display:none;width:0;height:0}

/* ===== 5. korak: glava in koraki kot v korakih 1–4, kompakten povzetek, kartice takoj pod njim ===== */
body.s5 #konfigurator>.wz-steps{position:relative;margin-bottom:6px!important}
body.s5 #konfigurator>.wz-steps::before{content:"";position:absolute;z-index:-1;left:50%;width:100vw;transform:translateX(-50%);top:-40px;bottom:-26px;
  background:linear-gradient(180deg,var(--md-surface) 0,var(--md-surface) calc(100% - 26px),color-mix(in srgb,var(--md-surface) 0%,transparent) 100%)}
body.s5 #wz-head .wz-k,body.s5 #wz-head .wz-d,body.s5 #wz-head .wz-why{display:none!important}
body.s5 #wz-head{padding-bottom:0!important;margin-bottom:0!important;margin-top:10px!important}
body.s5 #rezultat .rd,body.s5 #rezultat>.sumbar,body.s5 #rezultat>#s-shape,body.s5 #warns .warn.ok{display:none!important}
body.s5 #warns:not(:has(.warn:not(.ok))){display:none!important}
body.s5 .s5-sum{display:flex;flex-wrap:wrap;align-items:center;gap:4px 0;margin:0;font:500 15px/22px var(--font);color:color-mix(in srgb,var(--md-on-surface) 82%,transparent);text-shadow:0 1px 12px color-mix(in srgb,var(--md-surface) 80%,transparent)}
body.s5 .s5-sum>span+span::before{content:"·";margin:0 9px;color:var(--md-outline)}
body.s5 .s5-sum b{font-weight:700;color:var(--md-on-surface)}
body.s5 .s5-sum .s5-ok{display:inline-flex;align-items:center;gap:4px;color:var(--md-primary);font-weight:600}
body.s5 .s5-sum .s5-ok .ms{font-size:17px}
body.s5 #rezultat .rd-acts .btn{background:transparent!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;box-shadow:none!important;border:1px solid var(--glass-line)!important;height:38px!important;font-size:14px}
body.s5 #warns .warn{padding:8px 14px!important;border-radius:14px!important;margin:0!important}
body.s5 #warns .warn b{font-size:14px!important;line-height:19px!important}
body.s5 #warns .warn>span:not(.ms){font-size:13px!important;line-height:18px!important}
@media (min-width:901px){body.s5 #konfigurator #rezultat>#warns:has(.warn:not(.ok)){display:grid!important;grid-template-columns:repeat(auto-fit,minmax(380px,1fr));gap:10px;width:100%}}
@media (min-width:901px){
  body.s5 #konfigurator #rezultat{gap:18px!important}
  body.s5 #konfigurator #rezultat>.res-done{align-items:center!important;flex-wrap:nowrap!important;gap:16px!important}
  body.s5 #konfigurator #rezultat .s5-sum{flex:1 1 auto;min-width:0}
  body.s5 #konfigurator #wz-head h2{margin-bottom:6px}
  /* kartice: navpično na sredini prostora nad spodnjo vrstico */
  body.s5 #konfigurator #rezultat>#recs{margin-top:10px!important}
  body.s5 #konfigurator #rezultat>:is(#live,.res-head){position:absolute!important}
}
@media (max-width:900px){
  body.s5 .s5-sum{font-size:14px;line-height:20px}
  body.s5 #rezultat>.res-done{display:grid!important;gap:10px!important}
}

/* ===== 5. korak: zemljevid z vrtom kot ozadje (ista slika kot v korakih 3–4, zaklenjen) ===== */
body.s5-map .s5-bg{display:none!important}
body.s5-map #konfigurator .map-card{display:block!important;position:static!important;padding:0!important;margin:0!important;background:none!important;border:0!important;box-shadow:none!important;height:0;overflow:visible!important}
body.s5-map #konfigurator .map-card>:not(.map-wrap){display:none!important}
body.s5-map #konfigurator .map-card>.map-wrap{position:fixed!important;inset:0!important;z-index:-2!important;margin:0!important;border-radius:0!important;width:auto!important;height:auto!important;pointer-events:none}
body.s5-map #konfigurator .map-wrap #map{width:100%!important;height:100%!important;max-height:none!important;min-height:0!important;aspect-ratio:auto!important;border-radius:0!important;margin:0!important}
body.s5-map #konfigurator .map-wrap>:not(#map){display:none!important}
body.s5-map #konfigurator .map-wrap .leaflet-control-container{display:none!important}
body.s5-map #konfigurator .map-wrap::after{content:"";position:absolute;inset:0;z-index:1001;pointer-events:none;
  background:linear-gradient(180deg,color-mix(in srgb,var(--md-surface) 30%,transparent) 0,color-mix(in srgb,var(--md-surface) 55%,transparent) 45%,color-mix(in srgb,var(--md-surface) 75%,transparent) 100%)}
@media (min-width:901px){body.s5-map #konfigurator .map-wrap::after{background:linear-gradient(90deg,color-mix(in srgb,var(--md-surface) 80%,transparent) 0,color-mix(in srgb,var(--md-surface) 50%,transparent) 45%,color-mix(in srgb,var(--md-surface) 10%,transparent) 100%),linear-gradient(180deg,transparent 55%,color-mix(in srgb,var(--md-surface) 75%,transparent) 100%)}}

/* ===== kartice priporočil: ena ocena ujemanja, kosilnica glede na vašo trato, barva znamke, odziv na miško, enaka višina ===== */
#konfigurator #recs .rec.nc .hd :is(.podium-m,.trophy,.stars,.grass),body.s5 #konfigurator #recs .rec.nc .hd :is(.podium-m,.trophy,.stars,.grass){display:none!important}
#konfigurator #recs .rec.nc .mring{position:absolute;top:8px;right:8px;z-index:2;border-radius:50%;display:grid;place-content:center;justify-items:center;text-align:center;
  background:radial-gradient(closest-side,var(--md-sc-lowest) 79%,transparent 80% 100%),conic-gradient(var(--md-primary) calc(var(--p)*1%),color-mix(in srgb,var(--md-on-surface) 14%,transparent) 0);box-shadow:0 4px 14px rgba(0,0,0,.22)}
#konfigurator #recs .rec.nc .mring b{font:800 18px/18px var(--font);letter-spacing:-.02em;color:var(--md-on-surface)}
#konfigurator #recs .rec.nc .mring b small{font-size:11px;font-weight:700;margin-left:1px}
#konfigurator #recs .rec.nc .mring span{font:600 8.5px/10px var(--font);letter-spacing:.04em;text-transform:uppercase;color:var(--md-on-surface-variant);}


/* zasedenost: vidna na kartici, tik pod imenom */
#konfigurator #recs .rec.nc .cap{display:grid!important;margin:0!important;padding:0!important;font-size:13px;line-height:18px}
#konfigurator #recs .rec.nc .cap .cap-t{color:var(--md-on-surface-variant)}
#konfigurator #recs .rec.nc .cap .cap-t b{color:var(--md-on-surface)}
#konfigurator #recs .rec.nc .cap .cap-k{font-weight:700;font-size:12px}
#konfigurator #recs .rec.nc .cap-ok .cap-k,#konfigurator #recs .rec.nc .cap-big .cap-k{color:var(--md-primary)}
#konfigurator #recs .rec.nc .cap-tight .cap-k{color:var(--md-warning)}
#konfigurator #recs .rec.nc .cap .cap-bar{grid-column:1/-1;height:6px;border-radius:99px;overflow:hidden;background:color-mix(in srgb,var(--md-on-surface) 12%,transparent)}
#konfigurator #recs .rec.nc .cap .cap-bar i{display:block;height:100%;border-radius:99px;background:var(--md-primary)}
#konfigurator #recs .rec.nc .cap-tight .cap-bar i{background:var(--md-warning)}
#konfigurator #recs .rec.nc .cap .cap-zone{display:none}
/* ključni podatki: večje vrednosti, ikona navigacije */
#konfigurator #recs .rec.nc .kf b{font:700 15px/20px var(--font)!important;display:flex;align-items:center;gap:4px}
#konfigurator #recs .rec.nc .kf span{font-size:11.5px!important;line-height:15px!important}
#konfigurator #recs .rec.nc .kf .kf-i{color:var(--md-primary)}
/* cena */
#konfigurator #recs .rec.nc .price{display:flex;margin:2px 0 0}
#konfigurator #recs .rec.nc .price b{letter-spacing:-.01em;color:var(--md-on-surface)}
#konfigurator #recs .rec.nc .price span{font-size:12px;}
/* slika: sij v barvi znamke in senca na tleh */
body.s5 #konfigurator #recs .rec.nc .ph{position:relative;background:radial-gradient(65% 70% at 50% 60%,color-mix(in srgb,var(--brand,#3a8f4a) 38%,transparent),transparent 72%),color-mix(in srgb,var(--md-sc-lowest) 30%,transparent)!important}
body.s5 #konfigurator #recs .rec.nc .ph::after{content:"";position:absolute;left:22%;right:22%;bottom:10%;height:12%;border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.38),transparent);z-index:0;pointer-events:none}
body.s5 #konfigurator #recs .rec.nc .ph>*{position:relative;z-index:1;}
body.s5 #konfigurator #recs .rec.nc .ph svg{width:78%!important}
/* odziv na miško */
@media (hover:hover){
  
  #konfigurator #recs .rec.nc:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--md-primary) 55%,transparent)!important}
  #konfigurator #recs .rec.nc:hover .ph>*{transform:scale(1.05)}
}
@media (prefers-reduced-motion:reduce){#konfigurator #recs .rec.nc,#konfigurator #recs .rec.nc .ph>*{transition:none!important}#konfigurator #recs .rec.nc:hover{transform:none}#konfigurator #recs .rec.nc:hover .ph>*{transform:none}}
/* enaka višina, gumbi poravnani na dno */
@media (min-width:901px){#konfigurator #recs{align-items:stretch!important}#konfigurator #recs .rec.nc{height:auto;margin-bottom:0!important}}
#konfigurator #recs .rec.nc .price{margin-top:auto!important}

#konfigurator #recs .rec.nc .price+.ft{margin-top:0!important}
#konfigurator #recs .rec.nc .ft .pick{min-height:40px}

/* kompaktneje: cela kartica nad spodnjo vrstico */
#konfigurator #recs .rec.nc .mring span{position:absolute;top:100%;left:50%;transform:translateX(-50%);margin-top:4px;padding:1px 6px;border-radius:99px;background:var(--md-sc-lowest);white-space:nowrap;font-size:9px!important}
#konfigurator #recs .rec.nc .mring,#konfigurator #recs .rec.nc.top .mring{width:56px;height:56px}
#konfigurator #recs .rec.nc .mring b,#konfigurator #recs .rec.nc.top .mring b{font-size:17px;line-height:17px}
@media (min-width:901px){
  body.s5 #konfigurator #recs .rec.nc{gap:9px!important;padding:14px 16px!important}
  body.s5 #konfigurator #recs .rec.nc .ph{height:128px!important}
  body.s5 #konfigurator #recs .rec.nc.top .ph{height:142px!important}
  body.s5 #konfigurator #recs .rec.nc .hd{gap:6px!important}
  body.s5 #konfigurator #recs .rec.nc h3{font-size:22px!important;line-height:26px!important}
  body.s5 #konfigurator #recs .rec.nc.top h3{font-size:24px!important;line-height:28px!important}
  body.s5 #konfigurator #recs .rec.nc .kf{padding:7px 0!important}
  body.s5 #konfigurator #recs .rec.nc .pros li{font-size:13px!important;line-height:18px!important}
  body.s5 #konfigurator #recs .rec.nc .price b{font-size:18px;line-height:22px}
  body.s5 #konfigurator #recs .rec.nc .ft{padding-top:9px!important}
}

#konfigurator #recs .rec.nc .price{align-items:center!important;gap:8px!important}
#konfigurator #recs .rec.nc .price b{font:700 15px/20px var(--font)!important}
#konfigurator #recs .rec.nc .price .pb-e{font:800 13px/1 var(--font);letter-spacing:.06em;color:var(--md-primary)}
#konfigurator #recs .rec.nc .price .pb-e i{font-style:normal;color:color-mix(in srgb,var(--md-on-surface) 22%,transparent)}
#konfigurator #recs .rec.nc .price .pb-l{font-size:12px;color:var(--md-on-surface-variant);margin-left:auto}

/* ===== telefon, koraka 3–4: en gumb Naprej (v kartici), Nazaj ob pikicah, brez spodnje vrstice ===== */
.q3-back{display:none}
@media (max-width:900px){
  body.m-s3 #konfigurator>.wz-nav,body.m-s3 #wz-nav{display:none!important}
  body.m-s3{--nav-h:calc(4px + env(safe-area-inset-bottom,0px))!important}
  body.m-s3 #q3-panel{padding-top:10px!important}
  body.m-s3 .q3-back{display:grid;place-items:center;position:absolute;top:8px;left:10px;z-index:3;width:36px;height:36px;border-radius:50%;border:1px solid var(--m-glass-line,var(--rt-line));background:transparent;color:var(--md-on-surface);padding:0}
  body.m-s3 .q3-back .ms{font-size:20px}
  body.m-s3 #q3-panel :is(#q3-dots,.w4-dots){padding-left:44px!important;min-height:36px;align-items:center}
}
.w4-go{display:none!important}
@media (max-width:900px){body.m-s3 .w4-sum .w4-go{display:inline-flex!important}}
.w4-h{margin:-4px 0 8px;font-size:13px;color:var(--md-on-surface-variant)}

/* ===== koraka 3–4: kartica s površino v istem slogu kot v 2. koraku (steklo, zelen pridih, oznaka, gumb Uredi) ===== */
.wd-areac{background:linear-gradient(160deg,color-mix(in srgb,var(--rt-accent-soft) 70%,transparent),color-mix(in srgb,var(--md-primary-container) 70%,transparent))!important;
  border-color:color-mix(in srgb,var(--md-primary) 22%,var(--glass-line))!important;color:var(--md-on-surface)!important;align-items:center}
.wd-areac .wd-ak{font:700 11px/14px var(--font);font-style:normal;letter-spacing:.08em;text-transform:uppercase;color:var(--md-primary)}
.wd-areac b{color:var(--md-on-surface)!important;font:800 34px/38px var(--font)!important}
.wd-areac b small{color:var(--md-on-surface)}
.wd-areac span{color:var(--md-on-surface-variant)!important}
.wd-areac .wd-edit{width:auto;height:36px;padding:0 14px 0 11px;gap:6px;display:inline-flex;align-items:center;border-radius:999px;
  border:1px solid var(--glass-line);background:color-mix(in srgb,var(--md-sc-lowest) 55%,transparent);color:var(--md-primary);font:600 14px/1 var(--font)}
.wd-areac .wd-edit .ms{font-size:18px;}
.wd-areac .wd-edit:hover{background:color-mix(in srgb,var(--md-primary) 14%,transparent)}
@media (max-width:900px){
  body.m-s3 #wz-lawn .wd-areac .wd-ak{display:none}
  body.m-s3 #wz-lawn .wd-areac b{font-size:26px!important;line-height:30px!important}
  body.m-s3 #wz-lawn .wd-areac .wd-edit{width:34px;height:34px;padding:0;justify-content:center}
  body.m-s3 #wz-lawn .wd-areac .wd-el{display:none}
}

/* najboljša izbira: ob prehodu z miško sveti močneje (ne šibkeje) */
@media (hover:hover){
  body #konfigurator #recs .rec.nc.top:hover{border-color:var(--md-primary)!important;
    box-shadow:0 0 0 5px color-mix(in srgb,var(--md-primary) 30%,transparent),0 0 38px color-mix(in srgb,var(--md-primary) 45%,transparent),0 16px 44px rgba(10,30,14,.28)!important}
}

/* ===== telefon, koraka 1–2: plasti in viri (ⓘ) manjša v spodnjem desnem kotu, Razveljavi takoj ob orodjih za risanje ===== */
@media (max-width:900px){
  body.m-stage #konfigurator .map-wrap>.tools{justify-content:flex-start!important;gap:8px!important}
  body.m-stage #konfigurator .map-wrap #map .leaflet-bottom.leaflet-right{top:auto!important;bottom:calc(var(--sheet-h,130px) + 10px)!important;right:12px!important;
    display:flex;flex-direction:column;align-items:flex-end;gap:6px}
  body.m-stage #konfigurator[data-step="1"] .map-wrap #map .leaflet-bottom.leaflet-right{bottom:calc(var(--sheet-h,130px) + 12px)!important}
  body.m-stage #konfigurator .map-wrap #map .leaflet-bottom.leaflet-right .leaflet-control{margin:0!important;float:none!important;clear:none!important}
  body.m-stage #konfigurator .map-wrap #map .leaflet-control-attribution{order:-2}
  body.m-stage #konfigurator .map-wrap #map .attr-btn{order:-1;width:26px!important;height:26px!important}
  body.m-stage #konfigurator .map-wrap #map .attr-btn .ms{font-size:15px}
  body.m-stage #konfigurator .map-wrap #map .leaflet-control-layers{order:0}
  body.m-stage #konfigurator .map-wrap #map .leaflet-control-layers-toggle{width:36px!important;height:36px!important;background-size:20px 20px!important}
  /* viri: manjši, levo spodaj nad orodji */
  body.m-stage #konfigurator .map-wrap #map.attr-open .leaflet-control-attribution{position:fixed!important;left:10px;right:auto;bottom:calc(var(--sheet-h,130px) + 66px);width:max-content;margin:0!important;
    max-width:min(300px,calc(100vw - 70px));font-size:8.5px!important;line-height:11px!important;padding:3px 7px!important;border-radius:8px!important;white-space:normal!important;opacity:.92!important}
  body.m-stage #konfigurator[data-step="1"] .map-wrap #map.attr-open .leaflet-control-attribution{bottom:calc(var(--sheet-h,130px) + 12px)}
}