@layer reset,theme,tokens,base,composition,blocks,utilities;@property --px{syntax: "<integer>"; inherits: true; initial-value: 1440;}@layer blocks{.devices{--wf: var(--inkRGB);position:relative;container:stage / inline-size;contain:layout paint;inline-size:100%;aspect-ratio:4 / 3;padding:var(--space-16) var(--space-8) var(--space-8)}@media(prefers-reduced-motion:no-preference){.devices{transition:--px 1.4s var(--sineEasing)}}.devices>.paper-grid{position:absolute;top:0;right:0;bottom:0;left:0;--grid-size: 96px;--grid-ink: rgb(var(--wf) / .5);--grid-opacity: .1;--grid-mask: radial-gradient(closest-side, #000 55%, #0000)}.viewport-frame{position:relative;inline-size:calc((.36 + (var(--px) - 375) / 1065 * .64) * 100%);block-size:100%;margin-inline:auto;counter-reset:px calc(var(--px))}.viewport-frame:before,.viewport-frame:after{position:absolute;inset-inline:0;bottom:calc(100% + var(--space-4))}.viewport-frame:before{content:"";border-top:1px dashed rgb(var(--wf) / .45)}.viewport-frame:after{content:counter(px) " px";inline-size:-moz-fit-content;inline-size:fit-content;margin-inline:auto;translate:0 -.4em;font-size:.75em;font-variant-numeric:tabular-nums;letter-spacing:.08em;color:rgb(var(--wf) / .7)}.resize-handle{position:absolute;z-index:1;inset:50% auto auto 0;inline-size:6px;block-size:28px;translate:-50% -50%;border-radius:999px;background:var(--yellow)}.resize-handle:last-child{inset-inline:auto 0;translate:50% -50%}.viewport{--stack-gap: .75em;position:relative;container:screen / inline-size;block-size:100%;padding:.9em;border:1px solid rgb(var(--wf) / .6);border-radius:calc(.3em + (1440 - var(--px)) / 1065 * 1.1em);background:rgb(var(--wf) / .025);font-size:2.2cqi;overflow:hidden}.browser-chrome{flex:none;inline-size:2.1em;block-size:.5em;background:radial-gradient(circle,rgb(var(--wf) / .35) .18em,#0000 .2em) 0 50% / .7em .5em repeat-x}.wf-bar{--repel-gap: .6em;padding-block-end:.6em;border-bottom:1px solid rgb(var(--wf) / .25)}.wf-links{--cluster-gap: .8em}.wf-links>.wf-line{--wf-w: 2.4em;--wf-h: .4em}.wf-burger{display:none;inline-size:1.1em;block-size:.7em;border-block:2px solid rgb(var(--wf) / .6)}.wf-line[data-variant=title]{--wf-w: 85%;--wf-h: .8em;--wf-ink: rgb(var(--wf) / .75)}.wf-line[data-variant=logo]{--wf-w: 3.5em;--wf-h: .7em;--wf-ink: rgb(var(--wf) / .7)}.wf-line[data-variant=button]{--wf-w: 5em;--wf-h: 1.2em;--wf-ink: var(--yellow)}.wf-line[data-variant=price]{--wf-w: 2.5em;--wf-h: .5em;--wf-ink: rgb(var(--yellowRGB) / .85)}.wf-thumb{aspect-ratio:4 / 3;border:1px dashed rgb(var(--wf) / .4);border-radius:var(--r);background:rgb(var(--wf) / .08)}.wf-banner{--stack-gap: .5em;padding:1.1em;border:1px solid rgb(var(--wf) / .2);border-radius:var(--r);background:rgb(var(--wf) / .06)}.wf-products,.wf-cards{--stack-gap: .5em;display:grid;grid-template-columns:repeat(var(--cols, 2),minmax(0,1fr));gap:.7em}.wf-hero{--stack-gap: .5em;display:grid;grid-template-columns:var(--hero-cols, 1fr);align-items:center;gap:1em}.wf-card{padding:.8em;border:1px solid rgb(var(--wf) / .25);border-radius:var(--r)}.wf-card .dot{--dot-size: 1.4em;--dot-bg: transparent;--dot-ring: inset 0 0 0 2px var(--yellow)}@container screen (width < 20em){.devices[data-variant=site] .wf-cards{--cols: 1}.wf-links{display:none}.wf-burger{display:block}.browser-chrome{inline-size:32%;block-size:.45em;margin-inline:auto;border-radius:999px;background:rgb(var(--wf) / .45)}}@container screen (20em <= width < 32em){.browser-chrome{display:none}}@container screen (width >= 20em){.devices .wf-products,.devices .wf-cards{--cols: 3}}@container screen (width >= 32em){.devices .wf-products{--cols: 4}.wf-hero{--hero-cols: 1.2fr 1fr}}}