/* Эффекты «Миледи»: вертикальные ламели на фоне поворачиваются за курсором и пропускают свет; рулетка замерщика на карточках изделий. */
:root{--fx-slat:#f6f5f9;--fx-slat-hi:#fbfafd;--fx-slat-lo:#ebe9f1;--fx-seam:#efedf4;--fx-gap:#f8ead0}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--fx-slat:#15131f;--fx-slat-hi:#1b1927;--fx-slat-lo:#110f19;--fx-seam:#181623;--fx-gap:#2a2420}}
:root[data-theme="dark"]{--fx-slat:#15131f;--fx-slat-hi:#1b1927;--fx-slat-lo:#110f19;--fx-seam:#181623;--fx-gap:#2a2420}

/* ламели лежат за содержимым: карточки и текст поверх */
.fx-blinds{position:fixed;inset:0;z-index:-1;pointer-events:none;width:100%;height:100%;display:block}

/* рулетка замерщика */
@media (hover:hover) and (pointer:fine){.card,.related a,.price-card{cursor:crosshair}.card a,.card button{cursor:pointer}}
.fx-tape{position:fixed;z-index:30;pointer-events:none}
.fx-rule{position:absolute;overflow:hidden;background-color:#f3c94e;box-shadow:0 1px 4px rgba(28,26,43,.28);
  transition:transform .38s cubic-bezier(.2,.8,.2,1)}
.fx-rule.h{left:0;top:-15px;width:100%;height:15px;transform-origin:left center;transform:scaleX(0);border-radius:3px 3px 0 0;
  background-image:repeating-linear-gradient(90deg,#1c1a2b 0 1px,transparent 1px 37.795px),repeating-linear-gradient(90deg,rgba(28,26,43,.75) 0 1px,transparent 1px 18.9px),repeating-linear-gradient(90deg,rgba(28,26,43,.55) 0 1px,transparent 1px 3.78px);
  background-size:100% 9px,100% 6px,100% 3.5px;background-repeat:no-repeat;background-position:0 100%,0 100%,0 100%}
.fx-rule.v{left:-15px;top:0;width:15px;height:100%;transform-origin:center top;transform:scaleY(0);border-radius:3px 0 0 3px;
  background-image:repeating-linear-gradient(180deg,#1c1a2b 0 1px,transparent 1px 37.795px),repeating-linear-gradient(180deg,rgba(28,26,43,.75) 0 1px,transparent 1px 18.9px),repeating-linear-gradient(180deg,rgba(28,26,43,.55) 0 1px,transparent 1px 3.78px);
  background-size:9px 100%,6px 100%,3.5px 100%;background-repeat:no-repeat;background-position:100% 0,100% 0,100% 0}
.fx-tape.on .fx-rule.h{transform:scaleX(1)}
.fx-tape.on .fx-rule.v{transform:scaleY(1);transition-delay:.06s}
.fx-rule b{position:absolute;font:600 8.5px/1 ui-monospace,Menlo,monospace;color:#1c1a2b}
.fx-rule.h b{top:1.5px;transform:translateX(-50%)}
.fx-rule.v b{left:1px;transform:translateY(-50%)}
.fx-size{position:absolute;right:4px;top:-28px;font:600 11px/1 ui-monospace,Menlo,monospace;color:#1c1a2b;background:#f3c94e;padding:3px 6px;border-radius:4px;box-shadow:0 1px 4px rgba(28,26,43,.25);opacity:0;transition:opacity .25s .25s}
.fx-lx,.fx-ly{position:absolute;opacity:0;transition:opacity .2s}
.fx-lx{top:0;left:var(--mx,0);height:var(--my,0);border-left:1.5px dashed rgba(229,154,47,.95)}
.fx-ly{left:0;top:var(--my,0);width:var(--mx,0);border-top:1.5px dashed rgba(229,154,47,.95)}
.fx-read{position:absolute;left:calc(var(--mx,0px) + 12px);top:calc(var(--my,0px) + 14px);background:#1c1a2b;color:#fff;font:500 11.5px/1.2 ui-monospace,Menlo,monospace;padding:4px 8px;border-radius:6px;white-space:nowrap;opacity:0;transition:opacity .2s}
.fx-note{position:absolute;right:8px;top:8px;background:rgba(255,255,255,.94);color:#1c1a2b;font:500 11.5px/1.2 system-ui,sans-serif;padding:5px 10px;border-radius:999px;box-shadow:0 2px 8px rgba(28,26,43,.18);opacity:0;transform:translateY(-4px);transition:opacity .3s .2s,transform .3s .2s;white-space:nowrap}
.fx-tape.sm .fx-note{top:calc(100% + 8px);right:0}
.fx-tape.on .fx-size,.fx-tape.on .fx-note{opacity:1;transform:none}
.fx-tape.move .fx-lx,.fx-tape.move .fx-ly,.fx-tape.move .fx-read{opacity:1}
@media (prefers-reduced-motion: reduce){.fx-rule,.fx-size,.fx-note{transition:none}}
