@layer components{.bold-look{--ink:var(--dark-blue);--bold-coral:#e9897b;--bold-sky:oklch(81% .095 236);--tone:var(--bold-sky);--octagon-dot:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpolygon points='3.9,2.7 6.1,2.7 7.3,3.9 7.3,6.1 6.1,7.3 3.9,7.3 2.7,6.1 2.7,3.9'/%3E%3C/svg%3E");--octagon-tile:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpolygon points='2.9,0 7.1,0 10,2.9 10,7.1 7.1,10 2.9,10 0,7.1 0,2.9'/%3E%3C/svg%3E")}.bold-look .tone-sky{--tone:var(--bold-sky)}.bold-look .tone-coral{--tone:var(--bold-coral);--tone-ink:var(--white)}.bold-look .tone-pink{--tone:var(--bright-pink)}.bold-look .pat{isolation:isolate;background-color:var(--pat-bg);position:relative}.bold-look .pat:after{content:"";z-index:-1;pointer-events:none;background:var(--pat-fg);-webkit-mask-image:var(--pat-mask);-webkit-mask-image:var(--pat-mask);mask-image:var(--pat-mask);-webkit-mask-size:var(--pat-cell,16px) var(--pat-cell,16px);-webkit-mask-size:var(--pat-cell,16px) var(--pat-cell,16px);mask-size:var(--pat-cell,16px) var(--pat-cell,16px);position:absolute;inset:0;-webkit-mask-repeat:repeat;mask-repeat:repeat}.bold-look .pat-dots{--pat-bg:var(--tone);--pat-fg:var(--ink);--pat-mask:var(--octagon-dot)}.bold-look .pat-tiles{--pat-bg:var(--ink);--pat-fg:var(--tone);--pat-mask:var(--octagon-tile)}.bold-look .pat-inverse{--pat-bg:var(--ink);--pat-fg:var(--tone);--pat-mask:var(--octagon-dot)}.bold-look .pat-field{isolation:isolate;background:color-mix(in oklab, var(--tone) 9%, var(--white));transition:--mx .5s ease-out,--my .5s ease-out;position:relative}.bold-look .pat-field-dark{background:color-mix(in oklab, var(--tone) 7%, var(--ink))}.bold-look .pat-field:after{content:"";z-index:-1;pointer-events:none;background:var(--tone);-webkit-mask-image:var(--field-mask,var(--octagon-dot)), radial-gradient(circle 460px at var(--mx) var(--my), #000 0%, #00000061 50%, #00000029 100%);-webkit-mask-image:var(--field-mask,var(--octagon-dot)), radial-gradient(circle 460px at var(--mx) var(--my), #000 0%, #00000061 50%, #00000029 100%);mask-image:var(--field-mask,var(--octagon-dot)), radial-gradient(circle 460px at var(--mx) var(--my), #000 0%, #00000061 50%, #00000029 100%);-webkit-mask-size:var(--pat-cell,18px) var(--pat-cell,18px), 100% 100%;-webkit-mask-size:var(--pat-cell,18px) var(--pat-cell,18px), 100% 100%;mask-size:var(--pat-cell,18px) var(--pat-cell,18px), 100% 100%;-webkit-mask-composite:source-in;position:absolute;inset:0;-webkit-mask-repeat:repeat,no-repeat;mask-repeat:repeat,no-repeat;-webkit-mask-composite:source-in;mask-composite:intersect}.bold-look .pat-field-tiles{--field-mask:var(--octagon-tile)}@media (prefers-reduced-motion:no-preference){.bold-look .pat-field:after{animation:60s linear infinite field-drift}.bold-look .pat-drift:after{animation:24s linear infinite pat-drift}@supports (animation-timeline:view()){.bold-look .reveal{animation:linear both reveal;animation-timeline:view();animation-range:entry cover 28%}}}}@property --mx{syntax:"<percentage>";inherits:true;initial-value:78%}@property --my{syntax:"<percentage>";inherits:true;initial-value:18%}@keyframes field-drift{to{-webkit-mask-position:calc(var(--pat-cell,18px) * 6) calc(var(--pat-cell,18px) * 3), 0 0;-webkit-mask-position:calc(var(--pat-cell,18px) * 6) calc(var(--pat-cell,18px) * 3), 0 0;mask-position:calc(var(--pat-cell,18px) * 6) calc(var(--pat-cell,18px) * 3), 0 0}}@keyframes pat-drift{to{-webkit-mask-position:calc(var(--pat-cell,16px) * 8) calc(var(--pat-cell,16px) * 4);-webkit-mask-position:calc(var(--pat-cell,16px) * 8) calc(var(--pat-cell,16px) * 4);mask-position:calc(var(--pat-cell,16px) * 8) calc(var(--pat-cell,16px) * 4)}}@keyframes reveal{0%{opacity:0;translate:0 48px}to{opacity:1;translate:0}}::view-transition-group(alpha-demo){animation-duration:.48s;animation-timing-function:cubic-bezier(.22,1,.36,1)}::view-transition-old(alpha-demo){object-fit:cover;height:100%;overflow:hidden}::view-transition-new(alpha-demo){object-fit:cover;height:100%;overflow:hidden}::view-transition-old(root){animation-duration:.32s}::view-transition-new(root){animation-duration:.32s}.pattern-glyph.svelte-qkah5d{position:absolute;inset:0;overflow:hidden}canvas.svelte-qkah5d{width:100%;height:100%;display:block}.pattern-field.svelte-v8ts1i{z-index:0;pointer-events:none;position:absolute;inset:0;overflow:hidden}canvas.svelte-v8ts1i{opacity:0;-webkit-mask-composite:source-in;width:100%;height:100%;transition:opacity 1s ease-out;display:block;-webkit-mask-image:radial-gradient(46% 30% at 50% 24%,#0000 0%,#000 100%),linear-gradient(#000 70%,#0000 100%);mask-image:radial-gradient(46% 30% at 50% 24%,#0000 0%,#000 100%),linear-gradient(#000 70%,#0000 100%);-webkit-mask-composite:source-in;mask-composite:intersect}canvas.painted.svelte-v8ts1i{opacity:1}canvas.open.svelte-v8ts1i{-webkit-mask-image:none;mask-image:none}
