/* Sdílená světelná vrstva celého webu (build.mjs ji načítá na všech stránkách).
   Noc: html[data-appearance=night]. Světla rozsvěcuje lights.mjs třídou .is-lit na prvcích s data-light.
   Omezení pohybu řeší globální pravidla ve styles.css. Návrh: docs/superpowers/specs/2026-09-29-nocni-svetla-web-design.md */
:root{--g-warm:#ffcf6e;--g-core:#fff4d8;--g-halo:#ffb547;--g-cool:#6f8cff;--g-xray:#8fd3ff}
/* ── Služby s ikonami: bez JavaScriptu jsou ikony celé; .is-live je nejdřív skryje a .is-drawn nakreslí ── */
.service-list.has-icons .service-row{grid-template-columns:60px 56px minmax(220px,1fr) 1fr 28px}
.service-icon{width:56px;height:56px;border-radius:15px;background:var(--soft);display:grid;place-items:center;transition:background .4s,box-shadow .5s}
.service-row:hover .service-icon,.service-row:focus-visible .service-icon{background:var(--bg);box-shadow:0 0 0 1px var(--line)}
.service-icon svg{width:40px;height:40px;overflow:visible}
.service-icon .d{fill:none;stroke:var(--ink);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:0}
.service-icon .sk{fill:none;stroke:var(--ink);stroke-width:2;stroke-dasharray:3 3}
.service-icon .spark,.service-icon .bar,.service-icon .tile,.service-icon .led{fill:var(--blue)}
.service-icon .spark{opacity:0}
.service-icon .led{opacity:.35}
.service-icon .w{opacity:.25}
.service-icon .bar{transform-box:fill-box;transform-origin:bottom}
.service-icon .tile{transform-box:fill-box;transform-origin:center}
[data-service-icons].is-live .service-icon .d{transition:stroke-dashoffset 1s cubic-bezier(.6,0,.3,1) var(--dl,0s),filter .6s}
[data-service-icons].is-live:not(.is-drawn) .service-icon .d{stroke-dashoffset:1}
.is-playing .service-icon .l1{animation:svcDraw .7s .05s both}
.is-playing .service-icon .l2{animation:svcDraw .7s .25s both}
.is-playing .service-icon .tr{animation:svcDraw .9s .25s both}
.is-playing .service-icon .hb{animation:svcDraw 1.3s linear both}
@keyframes svcDraw{from{stroke-dashoffset:1}}
.is-playing .service-icon .ph{animation:svcPhone .8s cubic-bezier(.2,.9,.3,1.3) both}
@keyframes svcPhone{from{transform:translateX(7px);opacity:0}}
.is-playing .service-icon .spark{animation:svcSpark 1.4s cubic-bezier(.5,0,.3,1) both}
@keyframes svcSpark{0%{opacity:0;transform:none}10%{opacity:1}45%{transform:translate(28px,-12px);opacity:1}50%{transform:translate(28px,-12px);opacity:0}55%{transform:none;opacity:0}60%{opacity:1}95%{transform:translate(28px,12px);opacity:1}100%{opacity:0;transform:translate(28px,12px)}}
.is-playing .service-icon .bar{animation:svcGrow .7s cubic-bezier(.2,.9,.3,1.3) both}
.is-playing .service-icon .b2{animation-delay:.1s}.is-playing .service-icon .b3{animation-delay:.2s}
@keyframes svcGrow{from{transform:scaleY(.25)}}
.is-playing .service-icon .w{animation:svcWave 1.2s ease-out both}
.is-playing .service-icon .w2{animation-delay:.18s}.is-playing .service-icon .w3{animation-delay:.36s}
@keyframes svcWave{40%{opacity:1}}
.is-playing .service-icon .tile{animation:svcTile .6s .35s cubic-bezier(.2,.9,.3,1.5) both}
@keyframes svcTile{from{opacity:0;transform:scale(.4)}}
.is-playing .service-icon .led{animation:svcLed 1.3s ease-in-out both}
.is-playing .service-icon .led2{animation-delay:.4s}
@keyframes svcLed{50%{opacity:1}}
html[data-appearance=night] .service-icon .spark,html[data-appearance=night] .service-icon .bar,html[data-appearance=night] .service-icon .tile,html[data-appearance=night] .service-icon .led{fill:var(--g-warm)}
@media(max-width:1100px){.service-list.has-icons .service-row{grid-template-columns:35px 48px minmax(210px,1fr) 1fr 24px}.service-list.has-icons .service-icon{width:48px;height:48px;border-radius:13px}.service-list.has-icons .service-icon svg{width:34px;height:34px}}
@media(max-width:850px){.service-list.has-icons .service-row{grid-template-columns:48px 1fr 26px}.service-list.has-icons .service-no{display:none}.service-list.has-icons .service-icon{grid-row:1/3}}
@media(max-width:700px){.service-list.has-icons .service-row{grid-template-columns:40px 1fr 20px}.service-list.has-icons .service-icon{width:40px;height:40px;border-radius:11px}.service-list.has-icons .service-icon svg{width:28px;height:28px}}
/* ── Postup s linkou: bez JavaScriptu plná linka a rozsvícené kroky ── */
.process-wrap{position:relative;padding-top:15px}
.process-line{position:absolute;left:15px;right:calc(25% - 41px);top:15px;height:2px;background:var(--line);border-radius:2px}
.process-line b{position:absolute;inset:0;background:var(--blue);border-radius:2px;transform-origin:left;transition:transform 1.6s cubic-bezier(.6,0,.3,1)}
.process-line b::after{content:"";position:absolute;right:-5px;top:-4px;width:10px;height:10px;border-radius:50%;background:var(--blue);opacity:0}
.process.has-line li>span{position:relative;z-index:1;display:grid;place-items:center;width:30px;height:30px;margin:-15px 0 40px;padding:0;border:2px solid var(--blue);border-radius:50%;background:var(--blue);color:#fff;font-weight:700;font-size:11px;transition:border-color .4s,background .4s,color .4s,box-shadow .6s}
.process.has-line li>p{transition:opacity .5s}
.process-wrap.is-entering .process.has-line li:nth-child(1)>span,.process-wrap.is-entering .process.has-line li:nth-child(1)>p{transition-delay:.12s}
.process-wrap.is-entering .process.has-line li:nth-child(2)>span,.process-wrap.is-entering .process.has-line li:nth-child(2)>p{transition-delay:.653s}
.process-wrap.is-entering .process.has-line li:nth-child(3)>span,.process-wrap.is-entering .process.has-line li:nth-child(3)>p{transition-delay:1.187s}
.process-wrap.is-entering .process.has-line li:nth-child(4)>span,.process-wrap.is-entering .process.has-line li:nth-child(4)>p{transition-delay:1.72s}
.process-wrap.is-live:not(.is-run) .process-line b{transform:scaleX(0)}
.process-wrap.is-live:not(.is-run) .process.has-line li>span{border-color:var(--line);background:var(--soft);color:var(--muted)}
.process-wrap.is-live:not(.is-run) .process.has-line li>p{opacity:.35}
html[data-appearance=night] .process-line b{background:linear-gradient(90deg,#ffcf6e33,var(--g-warm));box-shadow:0 0 12px #ffb54799}
html[data-appearance=night] .process-line b::after{background:var(--g-core);box-shadow:0 0 14px 5px #ffb547aa;opacity:1}
html[data-appearance=night] .process.has-line li>span{border-color:#3b4a66;background:#1e2430;color:var(--muted)}
@media(max-width:850px){.process-line{display:none}.process.has-line li>span{margin:0 0 24px}}
/* ── Noční světla u ikon služeb a linky postupu ── */
html[data-appearance=night] .is-lit .service-icon{box-shadow:inset 0 0 0 1px #6f8cff33}
html[data-appearance=night] .is-lit .service-icon .d,html[data-appearance=night] .is-lit .service-icon .sk{filter:drop-shadow(0 0 2.5px #6f8cffaa)}
html[data-appearance=night] .is-lit .service-icon .led{opacity:1;filter:drop-shadow(0 0 3px var(--g-halo))}
html[data-appearance=night] .process-wrap:not(.is-live) .process.has-line li.is-lit>span,html[data-appearance=night] .process-wrap.is-run .process.has-line li.is-lit>span{border-color:#ffe2a8;background:radial-gradient(circle at 50% 35%,#fffaf0,#ffcf6e 55%,#f5a524);color:#3b2500;box-shadow:0 0 22px 6px #ffb54766}
/* ── Ikony Build: okna, nátěr a pohyby (návrh 2026-09-29, kap. 5) ── */
.service-icon .win{fill:#e6ebff;transition:fill .5s,filter .5s}
html[data-appearance=night] .service-icon .win{fill:#232b3b}
.service-icon .paint{fill:none;stroke:var(--blue);stroke-width:5;stroke-linecap:round;opacity:.22;stroke-dasharray:1}
.service-icon .grip{stroke-width:3.2}
.service-icon .roller,.service-icon .key,.service-icon .hook,.service-icon .cable{transform-box:fill-box}
.is-playing .service-icon .roller{animation:svcRoll 1.2s cubic-bezier(.4,0,.2,1)}
@keyframes svcRoll{40%{transform:translateY(11px)}}
.is-playing .service-icon .paint{animation:svcDraw 1.2s cubic-bezier(.4,0,.2,1) both}
.is-playing .service-icon .key{transform-origin:50% 12%;animation:svcSwing 1.1s cubic-bezier(.3,.8,.3,1)}
@keyframes svcSwing{25%{transform:rotate(-22deg)}55%{transform:rotate(12deg)}80%{transform:rotate(-4deg)}}
.is-playing .service-icon .win{animation:svcWinOn 1.2s both}
.is-playing .service-icon .wn2{animation-delay:.18s}.is-playing .service-icon .wn3{animation-delay:.36s}
@keyframes svcWinOn{30%{fill:#ffcf6e}}
.is-playing .service-icon .cable{transform-origin:top;animation:svcCable 1.3s cubic-bezier(.4,0,.2,1)}
@keyframes svcCable{45%{transform:scaleY(1.78)}}
.is-playing .service-icon .hook{animation:svcHook 1.3s cubic-bezier(.4,0,.2,1)}
@keyframes svcHook{45%{transform:translateY(7px)}}
html[data-appearance=night] .is-lit .service-icon .win{fill:var(--g-warm);filter:drop-shadow(0 0 3px var(--g-halo))}
html[data-appearance=night] .is-lit .service-icon .paint{stroke:#6f8cff;opacity:.3}
/* ── Ikony Smart home: kontrolky, rtuť a pohyby (návrh 2026-09-29, kap. 5) ── */
.feature-grid.has-icons .feature-number{margin-bottom:18px}
.feature-grid .service-icon{margin-bottom:22px}
.service-icon .knob{fill:var(--blue);opacity:.45;transition:fill .5s,opacity .5s,filter .5s}
.service-icon .merc{fill:none;stroke:var(--blue);stroke-width:3;stroke-linecap:round;opacity:.55;stroke-dasharray:1}
.service-icon .slats,.service-icon .shackle,.service-icon .k1,.service-icon .k2{transform-box:fill-box}
.is-playing .service-icon .slats{transform-origin:center;animation:svcSlats 1.1s ease-in-out}
@keyframes svcSlats{45%{transform:scaleY(.35)}}
.is-playing .service-icon .merc{animation:svcMerc 1.3s cubic-bezier(.4,0,.2,1)}
@keyframes svcMerc{from{stroke-dashoffset:.8}}
.is-playing .service-icon .shackle{animation:svcLock .9s cubic-bezier(.3,.9,.3,1.4)}
@keyframes svcLock{from{transform:translateY(-3px)}}
.is-playing .service-icon .k1{animation:svcK1 1s cubic-bezier(.3,.9,.3,1.3)}
.is-playing .service-icon .k2{animation:svcK2 1s .15s cubic-bezier(.3,.9,.3,1.3)}
@keyframes svcK1{50%{transform:translateX(7px)}}
@keyframes svcK2{50%{transform:translateX(-7px)}}
html[data-appearance=night] .is-lit .service-icon .knob{fill:var(--g-warm);opacity:1;filter:drop-shadow(0 0 3px var(--g-halo))}
html[data-appearance=night] .is-lit .service-icon .merc{stroke:var(--g-warm);opacity:1;filter:drop-shadow(0 0 3px var(--g-halo))}
/* ── Okna v AI ilustracích: maska nad obrázkem, světlo jen v noci (návrh 2026-09-29, kap. 6) ── */
.lit-win{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.lit-win .lw{opacity:0;transition:opacity .4s}
html[data-appearance=night] .lit-win.is-lit .lw{opacity:1;transition:opacity .55s calc(.35s + var(--i) * .14s)}
html.lights-instant .lit-win .lw{transition:none!important}
img.has-windows,.world-card>.photo img.has-windows{transition:transform .8s,filter 1.1s}
html[data-appearance=night] img.has-windows{filter:brightness(.36) saturate(.62) hue-rotate(10deg)}
.world-card>.photo .lit-win,.stage--photo .lit-win,.dvur-band .lit-win{transition:transform .8s}
.world-card:hover>.photo .lit-win{transform:scale(1.035)}
.work-link:hover .stage--photo .lit-win{transform:scale(1.03)}
.dvur-band:hover .lit-win{transform:scale(1.02)}
/* ── Noční fotografie (lights.mjs, initNightPhoto) ──
   img.night-img leží přesně na denním snímku (stejný ořez, sizes a zvětšení jako img.has-night); po načtení se prolne přes ztlumený denní snímek.
   Dům (.to-night): masky místností ukazují zhasnutou noční fotografii. S .go se dům spolu s noční fotografií setmí
   a místnosti se pak postupně rozsvítí (zhasnutý výřez zmizí); konečný stav je čistá noční fotografie. */
img.night-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;pointer-events:none}
img.night-img,.world-card>.photo img.night-img{transition:opacity .8s ease,transform .8s}
html[data-appearance=night] img.night-img.is-ready{opacity:1}
img.has-night,.world-card>.photo img.has-night{transition:transform .8s,filter 1.1s}
html[data-appearance=night] img.has-night{filter:brightness(.36) saturate(.62) hue-rotate(10deg)}
.lit-win.to-night{opacity:0}
.lit-win.to-night,.world-card>.photo .lit-win.to-night{transition:opacity .8s,transform .8s}
html[data-appearance=night] .lit-win.to-night.go{opacity:1}
.lit-win.to-night .lw{opacity:1;transition:none}
html[data-appearance=night] .lit-win.to-night.go .lw{opacity:0;transition:opacity .7s calc(1s + var(--i) * .22s)}
.lit-win.to-night.no-dusk{display:none}
html.lights-instant .lit-win.to-night{transition:none!important}
/* ── Úvodní stránka a sdílené prvky (návrh 2026-09-29, kap. 7; záře výzvy o 20 % menší a světlo pod tlačítkem bez ostré hrany podle uživatele) ──
   Prvky s data-reveal nedostávají vlastní transition (přepsal by odhalení z .reveal-ready); světlo nesou vnořené prvky. */
.fusion-bridge>span,.fusion-bridge strong{transition:background .8s,box-shadow .8s,color .8s,text-shadow .8s}
html[data-appearance=night] .fusion-bridge.is-lit>span{background:linear-gradient(90deg,#6f8cff00,#6f8cff);box-shadow:0 0 12px #6f8cff66}
html[data-appearance=night] .fusion-bridge.is-lit>span:last-child{background:linear-gradient(90deg,#6f8cff,#6f8cff00)}
html[data-appearance=night] .fusion-bridge.is-lit strong{color:var(--g-warm);text-shadow:0 0 14px #ffb54799}
.digital-card-art{transition:background .9s}
.digital-card-art svg{transition:transform .65s,filter .9s}
html[data-appearance=night] .digital-card-art{background:#16258c}
html[data-appearance=night] .digital-card.is-lit .digital-card-art svg{filter:drop-shadow(0 0 18px #9ab1ffaa)}
.bridge-mark{position:relative}
.bridge-mark::after{content:"";position:absolute;left:calc(50% - 1px);top:33%;height:27%;width:2px;border-radius:2px;background:var(--g-core);box-shadow:0 0 10px 3px #ffb547cc,0 0 26px 8px #ffb54755;opacity:0;transition:opacity .9s;pointer-events:none}
html[data-appearance=night] .smart-bridge.is-lit .bridge-mark::after{opacity:1}
.work-card .stage:is(.stage--app,.stage--pwa,.stage--web,.stage--media)::before{content:"";position:absolute;inset:0;background:#05070d;opacity:0;transition:opacity .9s;pointer-events:none}
html[data-appearance=night] .work-card.is-lit .stage:is(.stage--app,.stage--pwa,.stage--web,.stage--media)::before{opacity:.52}
/* Karty typu media: text leží nad vrstvou a v noci má barvu spočítanou pro ztmavenou scénu (--stage-ink-night z components.mjs). */
.work-card .stage--media>:is(.stage-kicker,strong){position:relative}
html[data-appearance=night] .work-card.is-lit .stage--media{color:var(--stage-ink-night,var(--stage-ink))}
.work-card .dev-browser{transition:transform .5s cubic-bezier(.2,.7,.2,1),box-shadow .9s}
.work-card .dev-phone,.hero-devices .dev-browser,.hero-devices .dev-phone{transition:box-shadow .9s}
html[data-appearance=night] .work-card.is-lit .dev-browser,html[data-appearance=night] .hero-devices.is-lit .dev-browser{box-shadow:0 0 0 1px #ffffff14,0 0 46px 8px #c8d4ff30,0 30px 70px #0008}
html[data-appearance=night] .work-card.is-lit .dev-phone,html[data-appearance=night] .hero-devices.is-lit .dev-phone{box-shadow:0 0 0 1px #ffffff2e,0 0 32px 6px #c8d4ff38,0 24px 50px #0009}
.work-card .stage{transition:box-shadow .5s,color .9s}
html[data-appearance=night] .work-card.is-lit .work-link:is(:hover,:focus-visible) .stage{box-shadow:0 0 0 1px #6f8cff66,0 0 24px #6f8cff33}
.contact-band{overflow:clip;transition:background .9s}
.contact-band .button.light{position:relative;transition:background .2s,color .2s,border-color .2s,transform .2s,box-shadow .8s}
.contact-band .button.light::after{content:"";position:absolute;left:-36%;right:-36%;top:100%;height:64px;background:radial-gradient(ellipse at 50% 0,#ffb5473d,#ffb54700 70%);-webkit-mask-image:linear-gradient(#0000,#000 11px);mask-image:linear-gradient(#0000,#000 11px);opacity:0;transition:opacity .9s;pointer-events:none}
html[data-appearance=night] .contact-band{background:#101c4d}
html[data-appearance=night] .contact-band.is-lit .button.light{background:var(--g-warm);color:#2a1c00;border-color:#ffe2a8;box-shadow:0 0 0 1px #ffe2a8,0 0 30px 6px #ffb54755}
html[data-appearance=night] .contact-band.is-lit .button.light:hover{background:#ffe2a8}
html[data-appearance=night] .contact-band.is-lit .button.light::after{opacity:1}
.check-list li>span{transition:color .6s,text-shadow .6s}
html[data-appearance=night] .check-list li.is-lit>span{color:var(--g-warm);text-shadow:0 0 10px #ffb547aa}
.tags span{transition:border-color .6s,box-shadow .6s}
html[data-appearance=night] .tags.is-lit span{border-color:#6f8cff66;box-shadow:0 0 12px #6f8cff22}
.team-roles article{position:relative}
.team-roles article::before{content:"";position:absolute;left:0;right:0;top:-1px;height:1px;background:#6f8cff99;box-shadow:0 0 12px #6f8cff66;opacity:0;transition:opacity .6s;pointer-events:none}
html[data-appearance=night] .team-roles article.is-lit::before{opacity:1}
html[data-appearance=night] #project-brief :is(input:not([type=radio]),textarea,select):focus{border-color:var(--g-warm);box-shadow:0 0 0 3px #ffcf6e33,0 0 22px #ffb54733}
html[data-appearance=night] #project-brief button[type=submit]:not(:disabled){background:var(--g-warm);color:#2a1c00;border-color:#ffe2a8;box-shadow:0 0 24px 5px #ffb54740}
html[data-appearance=night] #project-brief button[type=submit]:not(:disabled):hover{background:#ffe2a8}