/* Průvodce „Plán bytu“ – jen /smart-home/ (build.mjs, PAGE_ASSETS). Bez JavaScriptu: půdorys s popisky a popis všech místností.
   .is-live (smart-plan.mjs) zapne výběr: třída .on rozsvítí místnost, nakreslí kabel z rozvaděče a ukáže body zařízení. */
.sp-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:clamp(28px,4.5vw,64px);align-items:start}
.sp-figure{margin:0;padding:clamp(14px,2.4vw,28px) clamp(14px,2.4vw,28px) 18px;border-radius:var(--radius);background:var(--soft)}
.sp-figure .caption{margin-top:14px}
.sp-plan{position:relative}
.sp-art{display:block;width:100%;height:auto}
.sp-base{fill:var(--bg)}
.sp-floor{fill:#2448ed12;opacity:0;transition:opacity .5s}
.sp-floor.on{opacity:1}
.sp-furn *{fill:none;stroke:var(--line);stroke-width:1.6;stroke-linejoin:round}
.sp-doors path{fill:none;stroke:var(--muted);stroke-width:1;stroke-dasharray:3 4;opacity:.55}
.sp-walls{fill:none;stroke:var(--ink);stroke-width:5}
.sp-outer{fill:none;stroke:var(--ink);stroke-width:8;stroke-linejoin:miter}
.sp-windows rect{fill:var(--bg)}
.sp-windows path{fill:none;stroke:var(--muted);stroke-width:1.4}
.sp-cable{fill:none;stroke:var(--blue);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;opacity:0;transition:stroke-dashoffset 1s cubic-bezier(.6,0,.3,1),opacity .25s}
.sp-cable.on{stroke-dashoffset:0;opacity:1}
.sp-dev{transform-box:fill-box;transform-origin:50% 50%;transform:scale(0);transition:transform .35s cubic-bezier(.2,.9,.3,1.4)}
.sp-dev.on{transform:scale(1);transition-delay:calc(.7s + var(--i) * .12s)}
.sp-dev circle{fill:var(--bg);stroke:var(--blue);stroke-width:2}
.sp-dev .sp-dev-core{fill:var(--blue);stroke:none}
/* místnosti: tlačítka HTML položená přes půdorys */
.sp-rooms{position:absolute;inset:0}
.sp-room{position:absolute;display:flex;align-items:flex-start;justify-content:flex-start;padding:clamp(7px,1.3vw,14px);border:0;border-radius:3px;background:transparent;color:var(--muted);font:inherit;text-align:left;cursor:pointer;transition:background .3s,color .3s}
.sp-room span{white-space:nowrap;padding:3px 8px;border-radius:99px;background:var(--bg);font-size:clamp(10.5px,1.2vw,13px);font-weight:600;letter-spacing:-.005em;line-height:1.25;box-shadow:0 0 0 1px var(--line);transition:box-shadow .3s,color .3s,background .3s}
.sp-room:disabled{cursor:default;color:var(--muted)}
.sp-room:not(:disabled):hover{background:#2448ed0a;color:var(--ink)}
.sp-room[aria-pressed=true]{color:var(--blue)}
.sp-room[aria-pressed=true] span{box-shadow:0 0 0 1.5px var(--blue)}
.sp-room:focus-visible{outline:2px solid var(--blue);outline-offset:-5px}
/* panel s popisem místnosti */
.sp-detail{padding:0 0 24px;margin:0 0 24px;border-bottom:1px solid var(--line)}
.sp-detail h3{font-size:clamp(26px,2.6vw,34px);font-weight:560;letter-spacing:-.04em;line-height:1.05;margin:0 0 14px}
.sp-smart{font-size:16px;line-height:1.55;margin:0 0 22px;max-width:44ch}
.sp-detail h4{font-size:13px;font-weight:700;margin:0 0 8px}
.sp-detail ul{list-style:none;margin:0;padding:0}
.sp-detail li{position:relative;padding:11px 0 11px 26px;border-top:1px solid var(--line);font-size:14.5px;line-height:1.45}
.sp-detail li::before{content:"";position:absolute;left:1px;top:17px;width:8px;height:8px;border-radius:50%;border:2px solid var(--blue)}
.sp.is-live .sp-detail{display:none;border:0;margin:0;padding:0}
.sp.is-live .sp-detail.is-active{display:block;animation:spIn .45s ease both}
@keyframes spIn{from{opacity:0;transform:translateY(6px)}}
.sp-next{margin-top:22px;font-size:13px}
/* noc: vybraná místnost svítí teple, kabel září */
html[data-appearance=night] .sp-base,html[data-appearance=night] .sp-windows rect{fill:#141a24}
html[data-appearance=night] .sp-figure.is-lit .sp-floor{fill:url(#sp-warm)}
html[data-appearance=night] .sp-cable{stroke:var(--g-warm);filter:drop-shadow(0 0 3px var(--g-halo))}
html[data-appearance=night] .sp-dev circle{fill:#141a24;stroke:var(--g-warm)}
html[data-appearance=night] .sp-dev .sp-dev-core{fill:var(--g-warm)}
html[data-appearance=night] .sp-room[aria-pressed=true]{color:var(--g-warm)}
html[data-appearance=night] .sp-room[aria-pressed=true] span{box-shadow:0 0 0 1.5px var(--g-warm),0 0 14px #ffb54744}
html[data-appearance=night] .sp-detail li::before{border-color:var(--g-warm)}
@media(max-width:900px){.sp-grid{grid-template-columns:minmax(0,1fr)}}
@media(max-width:480px){.sp-room{padding:4px}.sp-room span{padding:2px 5px;font-size:11px;letter-spacing:-.01em}}