.ev-bg{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
body:has(main[class*="bg-"]){background:transparent}
html:has(main[class*="bg-"]){background:var(--color-linen-canvas)}
main[class*="bg-"] .ov-main,main[class*="bg-"] .ev-house-stage,main[class*="bg-"] .ev-light{background:transparent}
/* 1 Креслення: міліметрівка, що проявляється по краях */
.ev-bg-grid{background-image:linear-gradient(color-mix(in oklch,var(--color-walnut-ink) 9%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in oklch,var(--color-walnut-ink) 9%,transparent) 1px,transparent 1px),linear-gradient(color-mix(in oklch,var(--color-walnut-ink) 4%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in oklch,var(--color-walnut-ink) 4%,transparent) 1px,transparent 1px);background-size:100px 100px,100px 100px,20px 20px,20px 20px;background-position:-1px -1px;-webkit-mask-image:linear-gradient(90deg,#000,rgba(0,0,0,.25) 28%,rgba(0,0,0,.25) 72%,#000);mask-image:linear-gradient(90deg,#000,rgba(0,0,0,.25) 28%,rgba(0,0,0,.25) 72%,#000)}
/* 2 Вапняна штукатурка: хмарні плями + дрібне зерно */
.ev-bg-plaster{background-color:color-mix(in oklch,var(--color-linen-canvas) 85%,var(--color-placeholder-stone));background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .25 0 0 0 0 .22 0 0 0 0 .2 .32 0 0 0 -.1'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1400' height='1400'%3E%3Cfilter id='c'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.0035' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 .98 0 0 0 0 .95 .9 0 0 0 -.3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23c)'/%3E%3C/svg%3E");background-size:260px 260px,1400px 1400px}
/* 3 Велике ім'я: wordmark на весь екран, повзе зі скролом */
.ev-bg-word{display:flex;align-items:flex-end}
.ev-bg-word span{display:block;white-space:nowrap;font-size:38vw;line-height:.78;font-weight:400;letter-spacing:-0.056em;color:color-mix(in oklch,var(--color-placeholder-stone) 38%,var(--color-linen-canvas));transform:translateX(calc(var(--ev-scroll,0) * -38vw));margin-bottom:-3vw;font-feature-settings:"ss01","cv11"}
/* 4 Річні кільця дуба */
.ev-bg-rings svg{position:absolute;inset:0;width:100%;height:100%}
.ev-bg-rings ellipse{fill:none;stroke:var(--color-walnut-ink);stroke-opacity:.09;stroke-width:1}
/* 5 Паркет «французька ялинка» */
.ev-bg-parquet{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='56'%3E%3Cg fill='none' stroke='%23403a34' stroke-opacity='.11'%3E%3Cpath d='M0 0L80 56M0 -56L80 0M0 56L80 112M80 56L160 0M80 0L160 -56M80 112L160 56M.5 0V56M80.5 0V56'/%3E%3C/g%3E%3C/svg%3E");background-size:160px 56px;-webkit-mask-image:radial-gradient(ellipse 55% 60% at 50% 45%,rgba(0,0,0,.18),#000 90%);mask-image:radial-gradient(ellipse 55% 60% at 50% 45%,rgba(0,0,0,.18),#000 90%)}
/* 6 Світло за курсором */
.ev-bg-cursor{background:radial-gradient(520px circle at var(--mx,70vw) var(--my,30vh),oklch(0.985 0.012 85),transparent 70%),color-mix(in oklch,var(--color-linen-canvas) 72%,var(--color-placeholder-stone))}
/* 7 Тон зі скролом */
.ev-bg-tone{--s:var(--ev-scroll,0);background:linear-gradient(180deg,color-mix(in oklch,var(--color-linen-canvas),oklch(0.9 0.018 75) calc(var(--s) * 100%)),color-mix(in oklch,var(--color-linen-canvas),oklch(0.86 0.024 68) calc(var(--s) * 100%)))}
.ev-tone-sun{position:absolute;width:62vmax;height:62vmax;right:-14vmax;top:calc(-30vmax + var(--s) * 95vh);border-radius:50%;background:radial-gradient(circle,color-mix(in oklch,oklch(0.99 0.02 85),oklch(0.93 0.03 75) calc(var(--s) * 100%)) 0,transparent 62%);opacity:calc(.9 - var(--s) * .25)}
.ev-tone-hz{position:absolute;left:0;right:0;bottom:0;height:46vh;background:repeating-linear-gradient(180deg,transparent 0 calc(14px + var(--s) * 10px),color-mix(in oklch,var(--color-walnut-ink) 7%,transparent) calc(14px + var(--s) * 10px) calc(15px + var(--s) * 10px));-webkit-mask-image:linear-gradient(transparent,#000);mask-image:linear-gradient(transparent,#000);opacity:calc(.3 + var(--s) * .7)}
.ev-tone-grain{position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .25 0 0 0 0 .22 0 0 0 0 .2 .34 0 0 0 -.08'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");opacity:.85}
.ev-tone-weave{position:absolute;inset:0;background-image:repeating-linear-gradient(0deg,color-mix(in oklch,var(--color-walnut-ink) 3.5%,transparent) 0 1px,transparent 1px 3px),repeating-linear-gradient(90deg,color-mix(in oklch,var(--color-walnut-ink) 2.5%,transparent) 0 1px,transparent 1px 4px)}
/* 8 Креслення будинку, що домальовується зі скролом */
.ev-bg-house svg{position:absolute;right:2vw;bottom:0;width:min(78vw,1100px);height:92vh}
.ev-bg-house path{fill:none;stroke:var(--color-walnut-ink);stroke-width:1;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:calc(1 - min(1, var(--ev-scroll,0) * 2.2 + .04))}
.ev-hs path{stroke-opacity:.16}.ev-hd path{stroke-opacity:.12}
.ev-bg-house text{font-size:13px;letter-spacing:.08em;fill:var(--color-walnut-ink);fill-opacity:calc(.35 * min(1, var(--ev-scroll,0) * 3));font-variant-numeric:tabular-nums}
/* 9 Лінійки на полях */
.ev-rl{position:absolute;top:0;bottom:0;width:28px;opacity:.3}
.ev-rl{background-image:repeating-linear-gradient(transparent 0 99px,var(--color-walnut-ink) 99px 100px),repeating-linear-gradient(transparent 0 49px,var(--color-walnut-ink) 49px 50px),repeating-linear-gradient(transparent 0 9px,var(--color-walnut-ink) 9px 10px);background-size:20px 100%,11px 100%,5px 100%;background-repeat:no-repeat repeat;background-position:0 calc(var(--ev-y,0px) * -1)}
.ev-rl.l{left:0;border-right:1px solid color-mix(in oklch,var(--color-walnut-ink) 40%,transparent)}
.ev-rl.r{right:0;transform:scaleX(-1);border-right:1px solid color-mix(in oklch,var(--color-walnut-ink) 40%,transparent)}
.ev-rl-mark{position:absolute;left:0;right:0;top:50%;border-top:1px dashed color-mix(in oklch,var(--color-walnut-ink) 18%,transparent)}
.ev-rl-mark span{position:absolute;right:36px;top:6px;font-size:var(--text-label,10px);font-weight:500;letter-spacing:.1em;color:var(--color-slate-whisper);font-variant-numeric:tabular-nums}
/* 10 Зразки матеріалів */
.ev-bg-swatch{left:auto;width:64px;border-left:var(--border-hairline)}
.ev-sw{display:flex;flex-direction:column;transform:translateY(calc(var(--ev-scroll,0) * -140vh))}
.ev-sw div{height:22vh;position:relative;border-bottom:var(--border-hairline)}
.ev-sw span{position:absolute;left:50%;bottom:12px;writing-mode:vertical-rl;transform:translateX(-50%) rotate(180deg);font-size:10px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--color-walnut-ink);mix-blend-mode:normal;background:var(--color-linen-canvas);padding:6px 2px}
.ev-bg-switch{position:fixed;left:16px;bottom:16px;z-index:9999;display:flex;flex-wrap:wrap;gap:4px;max-width:calc(100vw - 32px);padding:4px;background:var(--color-walnut-ink);border-radius:999px}
.ev-bg-switch button{display:flex;align-items:center;gap:6px;border:0;background:transparent;color:var(--color-linen-canvas);font:500 12px/1 inherit;font-family:inherit;padding:8px 12px;border-radius:999px;cursor:pointer;opacity:.7}
.ev-bg-switch button:hover{opacity:1}
.ev-bg-switch button.on{background:var(--color-linen-canvas);color:var(--color-walnut-ink);opacity:1}
.ev-bg-switch b{font-weight:600;font-variant-numeric:tabular-nums;opacity:.6}