@font-face{font-family:Nunito;font-style:normal;font-weight:500;font-display:swap;src:url(/_next/static/media/abfec168c8990f67-s.woff2) format("woff2");unicode-range:u+0460-052f,u+1c80-1c8a,u+20b4,u+2de0-2dff,u+a640-a69f,u+fe2e-fe2f}@font-face{font-family:Nunito;font-style:normal;font-weight:500;font-display:swap;src:url(/_next/static/media/3131c862d4942660-s.woff2) format("woff2");unicode-range:u+0301,u+0400-045f,u+0490-0491,u+04b0-04b1,u+2116}@font-face{font-family:Nunito;font-style:normal;font-weight:500;font-display:swap;src:url(/_next/static/media/6a9c36ea9dc9b36b-s.woff2) format("woff2");unicode-range:u+0102-0103,u+0110-0111,u+0128-0129,u+0168-0169,u+01a0-01a1,u+01af-01b0,u+0300-0301,u+0303-0304,u+0308-0309,u+0323,u+0329,u+1ea0-1ef9,u+20ab}@font-face{font-family:Nunito;font-style:normal;font-weight:500;font-display:swap;src:url(/_next/static/media/e1694c6cb47c173f-s.woff2) format("woff2");unicode-range:u+0100-02ba,u+02bd-02c5,u+02c7-02cc,u+02ce-02d7,u+02dd-02ff,u+0304,u+0308,u+0329,u+1d00-1dbf,u+1e00-1e9f,u+1ef2-1eff,u+2020,u+20a0-20ab,u+20ad-20c0,u+2113,u+2c60-2c7f,u+a720-a7ff}@font-face{font-family:Nunito;font-style:normal;font-weight:500;font-display:swap;src:url(/_next/static/media/ee40bb094c99a29a-s.p.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+0304,u+0308,u+0329,u+2000-206f,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}@font-face{font-family:Nunito;font-style:normal;font-weight:600;font-display:swap;src:url(/_next/static/media/abfec168c8990f67-s.woff2) format("woff2");unicode-range:u+0460-052f,u+1c80-1c8a,u+20b4,u+2de0-2dff,u+a640-a69f,u+fe2e-fe2f}@font-face{font-family:Nunito;font-style:normal;font-weight:600;font-display:swap;src:url(/_next/static/media/3131c862d4942660-s.woff2) format("woff2");unicode-range:u+0301,u+0400-045f,u+0490-0491,u+04b0-04b1,u+2116}@font-face{font-family:Nunito;font-style:normal;font-weight:600;font-display:swap;src:url(/_next/static/media/6a9c36ea9dc9b36b-s.woff2) format("woff2");unicode-range:u+0102-0103,u+0110-0111,u+0128-0129,u+0168-0169,u+01a0-01a1,u+01af-01b0,u+0300-0301,u+0303-0304,u+0308-0309,u+0323,u+0329,u+1ea0-1ef9,u+20ab}@font-face{font-family:Nunito;font-style:normal;font-weight:600;font-display:swap;src:url(/_next/static/media/e1694c6cb47c173f-s.woff2) format("woff2");unicode-range:u+0100-02ba,u+02bd-02c5,u+02c7-02cc,u+02ce-02d7,u+02dd-02ff,u+0304,u+0308,u+0329,u+1d00-1dbf,u+1e00-1e9f,u+1ef2-1eff,u+2020,u+20a0-20ab,u+20ad-20c0,u+2113,u+2c60-2c7f,u+a720-a7ff}@font-face{font-family:Nunito;font-style:normal;font-weight:600;font-display:swap;src:url(/_next/static/media/ee40bb094c99a29a-s.p.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+0304,u+0308,u+0329,u+2000-206f,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}@font-face{font-family:Nunito;font-style:normal;font-weight:700;font-display:swap;src:url(/_next/static/media/abfec168c8990f67-s.woff2) format("woff2");unicode-range:u+0460-052f,u+1c80-1c8a,u+20b4,u+2de0-2dff,u+a640-a69f,u+fe2e-fe2f}@font-face{font-family:Nunito;font-style:normal;font-weight:700;font-display:swap;src:url(/_next/static/media/3131c862d4942660-s.woff2) format("woff2");unicode-range:u+0301,u+0400-045f,u+0490-0491,u+04b0-04b1,u+2116}@font-face{font-family:Nunito;font-style:normal;font-weight:700;font-display:swap;src:url(/_next/static/media/6a9c36ea9dc9b36b-s.woff2) format("woff2");unicode-range:u+0102-0103,u+0110-0111,u+0128-0129,u+0168-0169,u+01a0-01a1,u+01af-01b0,u+0300-0301,u+0303-0304,u+0308-0309,u+0323,u+0329,u+1ea0-1ef9,u+20ab}@font-face{font-family:Nunito;font-style:normal;font-weight:700;font-display:swap;src:url(/_next/static/media/e1694c6cb47c173f-s.woff2) format("woff2");unicode-range:u+0100-02ba,u+02bd-02c5,u+02c7-02cc,u+02ce-02d7,u+02dd-02ff,u+0304,u+0308,u+0329,u+1d00-1dbf,u+1e00-1e9f,u+1ef2-1eff,u+2020,u+20a0-20ab,u+20ad-20c0,u+2113,u+2c60-2c7f,u+a720-a7ff}@font-face{font-family:Nunito;font-style:normal;font-weight:700;font-display:swap;src:url(/_next/static/media/ee40bb094c99a29a-s.p.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+0304,u+0308,u+0329,u+2000-206f,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}@font-face{font-family:Nunito;font-style:normal;font-weight:800;font-display:swap;src:url(/_next/static/media/abfec168c8990f67-s.woff2) format("woff2");unicode-range:u+0460-052f,u+1c80-1c8a,u+20b4,u+2de0-2dff,u+a640-a69f,u+fe2e-fe2f}@font-face{font-family:Nunito;font-style:normal;font-weight:800;font-display:swap;src:url(/_next/static/media/3131c862d4942660-s.woff2) format("woff2");unicode-range:u+0301,u+0400-045f,u+0490-0491,u+04b0-04b1,u+2116}@font-face{font-family:Nunito;font-style:normal;font-weight:800;font-display:swap;src:url(/_next/static/media/6a9c36ea9dc9b36b-s.woff2) format("woff2");unicode-range:u+0102-0103,u+0110-0111,u+0128-0129,u+0168-0169,u+01a0-01a1,u+01af-01b0,u+0300-0301,u+0303-0304,u+0308-0309,u+0323,u+0329,u+1ea0-1ef9,u+20ab}@font-face{font-family:Nunito;font-style:normal;font-weight:800;font-display:swap;src:url(/_next/static/media/e1694c6cb47c173f-s.woff2) format("woff2");unicode-range:u+0100-02ba,u+02bd-02c5,u+02c7-02cc,u+02ce-02d7,u+02dd-02ff,u+0304,u+0308,u+0329,u+1d00-1dbf,u+1e00-1e9f,u+1ef2-1eff,u+2020,u+20a0-20ab,u+20ad-20c0,u+2113,u+2c60-2c7f,u+a720-a7ff}@font-face{font-family:Nunito;font-style:normal;font-weight:800;font-display:swap;src:url(/_next/static/media/ee40bb094c99a29a-s.p.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+0304,u+0308,u+0329,u+2000-206f,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}@font-face{font-family:Nunito Fallback;src:local("Arial");ascent-override:99.71%;descent-override:34.82%;line-gap-override:0.00%;size-adjust:101.39%}.__className_215da5{font-family:Nunito,Nunito Fallback;font-style:normal}.__variable_215da5{--font-nunito:"Nunito","Nunito Fallback"}@font-face{font-family:mono;src:url(/_next/static/media/11c6b193c5e34829-s.p.ttf) format("truetype");font-display:swap}@font-face{font-family:mono Fallback;src:local("Arial");ascent-override:96.74%;descent-override:29.02%;line-gap-override:0.00%;size-adjust:103.37%}.__className_7a4089{font-family:mono,mono Fallback}.__variable_7a4089{--font-mono:"mono","mono Fallback"}@font-face{font-family:handwritten;src:url(/_next/static/media/3765b5faba1f73f2-s.p.otf) format("opentype");font-display:swap}@font-face{font-family:handwritten Fallback;src:local("Arial");ascent-override:105.83%;descent-override:26.79%;line-gap-override:0.00%;size-adjust:89.95%}.__className_b7db58{font-family:handwritten,handwritten Fallback}.__variable_b7db58{--font-handwritten:"handwritten","handwritten Fallback"}:root{--canvas:#f2f2f4;--card:#fbfbfb;--card-border:#e4e4e9;--ink:#1a1a1a;--muted:#6b6b73;--muted-soft:#9a9aa2;--accent:#ffb1ee;--accent-ink:#1a1a1a;--r-card:20px;--r-inner:12px;--r-pill:999px}[data-theme=dark]{--canvas:#232326;--card:#17171a;--card-border:#2f2f34;--ink:#f2f2f4;--muted:#9a9aa5;--muted-soft:#6e6e76;--accent:#ffb1ee;--accent-ink:#1a1a1a}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}@property --scroll-mask-t-from{syntax:"<length-percentage>";inherits:false;initial-value:100%}@property --scroll-mask-b-from{syntax:"<length-percentage>";inherits:false;initial-value:100%}@property --scroll-mask-l-from{syntax:"<length-percentage>";inherits:false;initial-value:100%}@property --scroll-mask-r-from{syntax:"<length-percentage>";inherits:false;initial-value:100%}@keyframes scroll-mask-y-scroll{0%{--scroll-mask-t-from:100%}10%,to{--scroll-mask-t-from:var(--scroll-mask-fade-from-t,100%)}0%,90%{--scroll-mask-b-from:var(--scroll-mask-fade-from-b,100%)}to{--scroll-mask-b-from:100%}}@keyframes scroll-mask-x-scroll{0%{--scroll-mask-l-from:100%}10%,to{--scroll-mask-l-from:var(--scroll-mask-fade-from-l,100%)}0%,90%{--scroll-mask-r-from:var(--scroll-mask-fade-from-r,100%)}to{--scroll-mask-r-from:100%}}@supports (animation-timeline:scroll()){[class*=" scroll-mask-"],[class^=scroll-mask-]{--scroll-mask-t:linear-gradient(to top,black,black var(--scroll-mask-t-from),transparent);--scroll-mask-b:linear-gradient(to bottom,black,black var(--scroll-mask-b-from),transparent);--scroll-mask-l:linear-gradient(to left,black,black var(--scroll-mask-l-from),transparent);--scroll-mask-r:linear-gradient(to right,black,black var(--scroll-mask-r-from),transparent);-webkit-mask-image:var(--scroll-mask-t),var(--scroll-mask-b),var(--scroll-mask-l),var(--scroll-mask-r);mask-image:var(--scroll-mask-t),var(--scroll-mask-b),var(--scroll-mask-l),var(--scroll-mask-r);mask-composite:intersect;-webkit-mask-composite:source-in;animation:scroll-mask-y-scroll linear,scroll-mask-x-scroll linear;animation-timeline:scroll(self block),scroll(self inline)}}.scroll-mask-t{--scroll-mask-fade-from-t:80%}.scroll-mask-b{--scroll-mask-fade-from-b:80%}.scroll-mask-y{--scroll-mask-fade-from-t:80%;--scroll-mask-fade-from-b:80%}.scroll-mask-l{--scroll-mask-fade-from-l:80%}.scroll-mask-r{--scroll-mask-fade-from-r:80%}.scroll-mask-x{--scroll-mask-fade-from-l:80%;--scroll-mask-fade-from-r:80%}::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--card-border);border-radius:5px}*{scrollbar-width:thin;scrollbar-color:var(--card-border) transparent;margin:0;padding:0;box-sizing:border-box}body,html{height:100%}body{background-color:var(--canvas);color:var(--ink);font-family:var(--font-nunito),sans-serif;-webkit-font-smoothing:antialiased}body:before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background-image:linear-gradient(to right,color-mix(in srgb,var(--ink) 6%,transparent) 1px,transparent 1px),linear-gradient(to bottom,color-mix(in srgb,var(--ink) 6%,transparent) 1px,transparent 1px),linear-gradient(to right,color-mix(in srgb,var(--ink) 12%,transparent) 1px,transparent 1px),linear-gradient(to bottom,color-mix(in srgb,var(--ink) 12%,transparent) 1px,transparent 1px);background-size:24px 24px,24px 24px,120px 120px,120px 120px;background-position:0 100%;opacity:0;transition:opacity .4s ease}body.blueprint-visible:before{opacity:1}.blueprint-angle-guide{opacity:0;transition:opacity .4s ease}.blueprint-visible .blueprint-angle-guide{opacity:1}::selection{background:color-mix(in srgb,var(--accent) 18%,transparent);color:var(--accent)}::-moz-selection{background:color-mix(in srgb,var(--accent) 18%,transparent);color:var(--accent)}.preloader{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;background:var(--canvas)}.preloader-logo__center{opacity:1}.page{height:100dvh;display:flex;flex-direction:column;padding:40px clamp(40px,calc(33.33vw - 360px),280px);gap:10px;overflow:hidden}.bento{flex:1 1;display:grid;grid-template-columns:380px 1fr 1fr;grid-template-rows:1fr 1.3fr;grid-gap:14px;gap:14px}.bento,.box{min-height:0;min-width:0}.box{background:var(--card);border:1px solid var(--card-border);border-radius:var(--r-card)}.sidebar{position:relative;grid-column:1;grid-row:1/span 2;display:flex;flex-direction:column;gap:22px;padding:26px 24px;overflow:hidden}.sponsor-link{position:absolute;right:24px;bottom:26px;display:inline-flex;align-items:center;gap:8px;color:var(--muted);text-decoration:none;cursor:pointer}.sponsor-link__label{font-family:var(--font-nunito),sans-serif;font-size:12px;font-weight:700}.sponsor-btn{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;flex-shrink:0;border:1px solid var(--card-border);border-radius:8px;background:var(--card);color:var(--muted)}[data-theme=dark] .sponsor-btn{color:var(--accent)}.sponsor-btn svg{display:block}.sponsor-link:hover{color:var(--ink)}.sponsor-link:hover .sponsor-btn{border-color:var(--accent)}.sidebar__title-row{display:flex;align-items:center;gap:10px}.sidebar__title-row svg{flex-shrink:0}.sidebar__title{font-size:25px;font-weight:800;letter-spacing:-.3px;line-height:1.1;text-transform:capitalize;white-space:nowrap}.sidebar__tagline{font-size:15.5px;color:var(--muted);line-height:1.5;margin-top:8px}.badges{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}.badge{display:inline-flex;align-items:center;gap:4px;background:var(--canvas);border:1px solid var(--card-border);color:var(--muted);font-size:11.5px;font-weight:700;line-height:1;border-radius:8px;padding:4px 10px;text-decoration:none}.badge svg{display:block;flex-shrink:0}.badge--accent{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}.badge:hover{border-color:var(--accent);color:var(--ink)}.sidebar__section{gap:8px;min-height:0}.install-box,.sidebar__section{display:flex;flex-direction:column}.install-box{gap:10px;background:var(--canvas);border:1px solid var(--card-border);border-radius:var(--r-inner);padding:12px}.install-box .code-row{background:var(--card)}.sidebar__label{font-size:11px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:var(--muted-soft)}.tabs{display:flex;gap:14px;flex-wrap:wrap}.tab{position:relative;background:none;border:none;padding:4px 2px 8px;font-size:11.5px;font-weight:700;font-family:var(--font-nunito),sans-serif;color:var(--muted);cursor:pointer}.tab--active{color:var(--ink)}.tab__underline{position:absolute;left:2px;right:2px;bottom:0;height:2px;border-radius:var(--r-pill);background:var(--accent)}.code-row{display:flex;align-items:center;justify-content:space-between;gap:8px;background:var(--canvas);border-radius:var(--r-inner);padding:9px 8px 9px 12px}.code-row code{font-family:var(--font-mono),ui-monospace,monospace;letter-spacing:.05em;font-size:12.5px;color:var(--ink);white-space:pre;min-width:0;overflow:hidden;text-overflow:ellipsis}.code-block{background:var(--canvas);border:1px solid var(--card-border);border-radius:var(--r-inner);padding:10px 12px 4px}.code-block__scroll{font-family:var(--font-mono),ui-monospace,monospace;letter-spacing:.05em;font-size:12.5px;color:var(--ink);white-space:pre;line-height:1.6;overflow-x:auto;scrollbar-width:none;padding-bottom:6px}.code-block__scroll::-webkit-scrollbar{display:none}.copy{position:relative;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border:1px solid var(--card-border);border-radius:8px;background:var(--card);color:var(--muted);cursor:pointer;overflow:hidden}.copy:hover{border-color:var(--accent);color:var(--ink)}.theme-btn{position:absolute;left:24px;bottom:26px;width:34px;height:34px}[data-theme=dark] .theme-btn{color:var(--accent)}.blueprint-btn{position:absolute;left:68px;bottom:26px;width:34px;height:34px}[data-theme=dark] .blueprint-btn{color:var(--accent)}.copy__icon{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}.copy-ring{width:16px;height:16px;transform-origin:50% 50%;animation:copy-ring-spin .75s linear infinite}[data-theme=dark] .copy-ring__progress{stroke:var(--accent)}@keyframes copy-ring-spin{to{transform:rotate(1turn)}}.playground{position:relative;grid-column:2/span 2;grid-row:1;overflow:hidden;background-color:var(--card);background-image:radial-gradient(var(--card-border) 1px,transparent 1px);background-size:32px 32px}.playground__content{width:100%;height:100%;display:grid;grid-template-columns:1fr 1fr;grid-gap:0;gap:0}.playground__code-panel{z-index:1;background:var(--card)}.playground__code-content,.playground__code-panel{position:absolute;overflow:hidden;border:1px solid var(--card-border)}.playground__code-content{top:40px;left:6px;right:6px;bottom:6px;box-sizing:border-box;background:var(--canvas);border-radius:var(--r-inner)}.playground__code-snippet{width:100%;height:100%;box-sizing:border-box;padding:12px 14px;font-family:var(--font-mono),ui-monospace,monospace;letter-spacing:.05em;font-size:12.5px;color:var(--ink);white-space:pre;line-height:1.6;overflow:auto;scrollbar-width:none}.playground__code-snippet::-webkit-scrollbar{display:none}.playground__code-btn{position:absolute;z-index:1;display:flex;align-items:center;justify-content:center;width:30px;height:30px;background:none;border:none;outline:none;color:var(--muted);cursor:pointer}.playground__code-btn:focus-visible{box-shadow:0 0 0 2px var(--accent);border-radius:8px}.playground__code-copy{position:absolute;top:8px;right:8px;z-index:1}.playground__preview{display:flex;align-items:center;justify-content:center;padding:24px;min-width:0;--bcp-color-focus:var(--accent)}.bracket-annotation{position:fixed;width:20px;color:color-mix(in srgb,var(--ink) 40%,transparent);pointer-events:none;opacity:0;transition:opacity .4s ease}[data-theme=dark] .bracket-annotation{color:color-mix(in srgb,var(--accent) 55%,transparent)}.bracket-annotation__cap{position:absolute;left:0}.bracket-annotation__cap--top{top:0}.bracket-annotation__cap--bottom{bottom:0}.bracket-annotation__text{position:absolute;left:calc(100% + 12px);top:60%;transform:translateY(-50%);font-family:var(--font-handwritten),cursive;font-size:20px;line-height:1;white-space:nowrap}.bracket-annotation__line{position:absolute;top:2.25px;bottom:2.25px;left:0;width:20px;height:calc(100% - 4.5px)}@media (min-width:1201px){body.blueprint-visible .bracket-annotation{opacity:1;transition-delay:.15s}}.playground__settings{display:flex;flex-direction:column;min-width:0;min-height:0;padding:32px}.playground__settings-box{background:var(--card);border:1px solid var(--card-border);border-radius:var(--r-inner);overflow:hidden}.playground__settings-box,.playground__settings-scroll{flex:1 1;min-height:0;display:flex;flex-direction:column}.playground__settings-scroll{gap:10px;padding:24px;overflow-y:auto;scrollbar-width:none}.playground__settings-scroll::-webkit-scrollbar{display:none}.control{display:flex;flex-direction:column;gap:6px}.color-select{position:relative;height:46px;display:flex;align-items:center;justify-content:flex-end;border-radius:var(--r-inner);background:var(--canvas);border:1px solid var(--card-border);padding:0 6px 0 12px}.color-select__label{position:absolute;top:50%;left:12px;transform:translateY(-50%);font-family:var(--font-nunito),sans-serif;font-size:12.5px;font-weight:600;color:var(--muted)}.color-select__group{display:flex;align-items:center;gap:0;background:var(--card);border-radius:calc(var(--r-inner) - 4px)}.color-select__swatches{position:relative;width:106px;height:30px;overflow:hidden}.color-select__stack{display:flex;flex-direction:column}.color-select__row{gap:10px;padding:0 4px 0 10px}.color-select__icon-box,.color-select__row{height:30px;flex-shrink:0;display:flex;align-items:center}.color-select__icon-box{width:30px;justify-content:center;background:transparent;border:none;outline:none;color:var(--muted-soft);cursor:pointer;transition:color .15s ease-out}.color-select__icon-box:hover{color:var(--accent)}.color-select__icon-box:focus-visible{box-shadow:0 0 0 2px var(--accent);border-radius:calc(var(--r-inner) - 8px)}.caret-up-down-icon,.color-select__item{display:flex;align-items:center;justify-content:center}.color-select__item{background:none;border:none;outline:none;padding:2px;cursor:pointer}.color-select__item:disabled{cursor:not-allowed}.color-select__swatch{position:relative;display:flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;border:1px solid rgba(26,26,26,.08);transition:transform .15s ease-out}.color-select__item:hover .color-select__swatch{transform:scale(1.08)}.color-select__item:focus-visible .color-select__swatch{box-shadow:0 0 0 2px var(--accent)}.color-select__check{display:flex;align-items:center;justify-content:center;color:#fff}.toggle-select{position:relative;height:46px;display:flex;align-items:center;justify-content:flex-end;border-radius:var(--r-inner);background:var(--canvas);border:1px solid var(--card-border);padding:0 6px 0 12px}.toggle-select__label{position:absolute;top:50%;left:12px;transform:translateY(-50%);font-family:var(--font-nunito),sans-serif;font-size:12.5px;font-weight:600;color:var(--muted)}.toggle-select__group{gap:4px;background:var(--card);border-radius:calc(var(--r-inner) - 4px);padding:0 6px}.toggle-select__group,.toggle-select__option{position:relative;display:flex;align-items:center;height:30px}.toggle-select__option{justify-content:center;width:30px;background:none;border:none;outline:none;color:var(--muted-soft);cursor:pointer;transition:color .15s ease-out}.toggle-select__option[data-active]{color:var(--ink)}.toggle-select__option:focus-visible{box-shadow:0 0 0 2px var(--accent);border-radius:calc(var(--r-inner) - 8px)}.toggle-select__underline{position:absolute;left:0;bottom:3px;height:2px;border-radius:var(--r-pill);background:var(--accent);pointer-events:none}.selector{position:relative;height:46px;display:flex;align-items:center;justify-content:flex-end;border-radius:var(--r-inner);background:var(--canvas);border:1px solid var(--card-border);padding:0 6px}.selector__label{position:absolute;top:50%;left:12px;transform:translateY(-50%);font-size:12.5px;font-weight:600;color:var(--muted);transition:opacity .15s ease-out}.selector__label[data-hidden]{opacity:0}.selector__group{display:flex;align-items:center;gap:0;background:var(--card);border-radius:calc(var(--r-inner) - 4px);transition:gap .4s cubic-bezier(.34,1.3,.64,1),background-color .2s ease-out}.selector__group[data-expanded]{gap:6px;background:transparent}.selector__shape{display:flex;align-items:center;height:30px;background:transparent;border-radius:calc(var(--r-inner) - 4px) 0 0 calc(var(--r-inner) - 4px);padding:0 1px 0 4px;transition:border-radius .4s cubic-bezier(.34,1.3,.64,1),background-color .2s ease-out,padding .4s cubic-bezier(.34,1.3,.64,1)}.selector__shape[data-expanded]{border-radius:calc(var(--r-inner) - 4px);background:var(--card);padding:0 4px}.selector__row{position:relative;display:flex;align-items:center}.selector__option{position:relative;flex-shrink:0;overflow:hidden;background:none;border:none;outline:none;max-width:120px;padding:6px;font-family:var(--font-nunito),sans-serif;font-size:12.5px;font-weight:700;color:var(--muted);text-transform:capitalize;cursor:pointer;white-space:nowrap;filter:blur(0);transition:max-width .46s cubic-bezier(.34,1.35,.64,1),padding .46s cubic-bezier(.34,1.35,.64,1),opacity .28s ease-out,filter .28s ease-out,color .15s ease-out}.selector__option[data-active]{color:var(--ink)}.selector__option[data-hidden]{max-width:0;padding-left:0;padding-right:0;opacity:0;filter:blur(1.5px);pointer-events:none}.selector__option:focus-visible{box-shadow:0 0 0 2px var(--accent);border-radius:calc(var(--r-inner) - 8px)}.selector__option-underline{position:absolute;left:0;bottom:2px;height:2px;border-radius:var(--r-pill);background:var(--accent);pointer-events:none}.selector__option-label{position:relative}.selector__icon-box{flex-shrink:0;overflow:hidden;display:flex;align-items:center;justify-content:center;width:30px;height:30px;background:transparent;border:none;outline:none;border-radius:0 calc(var(--r-inner) - 4px) calc(var(--r-inner) - 4px) 0;color:var(--muted-soft);cursor:pointer;transition:border-radius .4s cubic-bezier(.34,1.3,.64,1),background-color .2s ease-out,box-shadow .2s ease-out}.selector__icon-box[data-expanded]{border-radius:calc(var(--r-inner) - 4px);background:var(--card);box-shadow:0 0 0 1.5px var(--accent)}.selector__icon-box:focus-visible{box-shadow:0 0 0 2px var(--accent)}.selector__caret-icon{display:flex;align-items:center;color:var(--muted-soft)}.selector__caret-icon svg{transform:rotate(90deg)}.elastic-slider{--es-height:46px;--es-radius:var(--r-inner);--es-bg:var(--canvas);--es-fill:color-mix(in srgb,var(--ink) 5%,transparent);--es-fill-active:color-mix(in srgb,var(--ink) 9%,transparent);--es-hash:color-mix(in srgb,var(--ink) 16%,transparent);--es-handle:var(--ink);--es-label:var(--muted);--es-focus:var(--accent);position:relative;height:var(--es-height)}.elastic-slider__track{position:absolute;inset:0;display:block;cursor:pointer;touch-action:none;overflow:hidden;border-radius:var(--es-radius);background:var(--es-bg);border:1px solid var(--card-border);outline:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.elastic-slider__track[data-focus-visible]{box-shadow:0 0 0 3px var(--es-focus)}.elastic-slider__hashes{position:absolute;inset:0;pointer-events:none}.elastic-slider__hash{position:absolute;top:50%;width:1px;height:12px;transform:translate(-50%,-50%);border-radius:var(--r-pill);background:transparent;transition:background-color .2s ease-out}.elastic-slider__track[data-active] .elastic-slider__hash{background:var(--es-hash)}.elastic-slider__fill{position:absolute;inset:0 auto 0 0;pointer-events:none;background:var(--es-fill);transition:background-color .2s ease-out}.elastic-slider__track[data-active] .elastic-slider__fill{background:var(--es-fill-active)}.elastic-slider__handle{position:absolute;top:50%;width:4px;height:24px;border-radius:var(--r-pill);background:var(--es-handle);pointer-events:none}.elastic-slider__label{left:12px;font-size:12.5px}.elastic-slider__label,.elastic-slider__value{position:absolute;top:50%;transform:translateY(-50%);pointer-events:none;font-weight:600;color:var(--es-label)}.elastic-slider__value{right:12px;font-family:var(--font-mono),ui-monospace,monospace;letter-spacing:.05em;font-size:12px;transition:color .2s ease-out}.elastic-slider__track[data-active] .elastic-slider__value{color:var(--ink)}.flower-video{grid-column:2;grid-row:2;padding:20px;overflow:hidden}.flower-video__inner{position:relative;width:100%;height:100%;border:1px solid var(--card-border);border-radius:var(--r-inner)}.flower-video__media{position:absolute;inset:0;overflow:hidden;border-radius:var(--r-inner);background:var(--card)}.flower-video__tabs{position:absolute;top:-1px;left:-1px;z-index:1;gap:12px;padding:6px 10px;background:var(--card);border:1px solid var(--card-border);border-top:none;border-left:none;border-radius:var(--r-inner) 0 var(--r-inner) 0}.flower-video__tabs .tab{display:flex;align-items:center;padding:4px 2px 6px}.flower-video__notch{position:absolute;width:13px;height:13px;background:radial-gradient(circle at bottom right,transparent 12px,var(--card-border) 12px,var(--card-border) 13px,var(--card) 13px)}.flower-video__notch--bl{top:100%;left:0}.flower-video__notch--tr{top:0;left:100%}.flower-video__source{position:absolute;inset:0;z-index:0;width:100%;height:100%;object-fit:cover;overflow:hidden;pointer-events:none}.flower-video__canvas{position:relative;z-index:1;display:block;width:100%;height:100%;object-fit:cover;image-rendering:pixelated}.flower-video__canvas[data-style=halftone]{image-rendering:auto}.flower-video__loading{position:absolute;inset:0;z-index:1;display:flex;align-items:center;justify-content:center;background:var(--card)}.golden-ratio-icon{width:min(40%,160px);height:auto}.golden-ratio-icon__bottom-line,.golden-ratio-icon__bottom-right-line,.golden-ratio-icon__center-line,.golden-ratio-icon__left-line,.golden-ratio-icon__mid-line,.golden-ratio-icon__right-line,.golden-ratio-icon__small-center-line,.golden-ratio-icon__spiral-arc-1,.golden-ratio-icon__spiral-arc-2,.golden-ratio-icon__spiral-arc-3,.golden-ratio-icon__spiral-arc-4,.golden-ratio-icon__spiral-arc-5,.golden-ratio-icon__spiral-arc-6,.golden-ratio-icon__spiral-arc-7,.golden-ratio-icon__spiral-arc-8,.golden-ratio-icon__spiral-arc-9,.golden-ratio-icon__top-line,.golden-ratio-icon__top-right-line{fill:none;stroke:var(--ink);stroke-dasharray:1;stroke-dashoffset:1;animation-duration:7s;animation-timing-function:ease-in;animation-iteration-count:infinite}.golden-ratio-icon__center-line{animation-name:golden-ratio-draw-center}.golden-ratio-icon__bottom-line{animation-name:golden-ratio-draw-bottom}.golden-ratio-icon__left-line{animation-name:golden-ratio-draw-left}.golden-ratio-icon__top-line{animation-name:golden-ratio-draw-top}.golden-ratio-icon__top-right-line{animation-name:golden-ratio-draw-top-right}.golden-ratio-icon__right-line{animation-name:golden-ratio-draw-right}.golden-ratio-icon__bottom-right-line{animation-name:golden-ratio-draw-bottom-right}.golden-ratio-icon__mid-line{animation-name:golden-ratio-draw-mid}.golden-ratio-icon__small-center-line{animation-name:golden-ratio-draw-small-center}.golden-ratio-icon__spiral-arc-1{animation-name:golden-ratio-draw-spiral-1}.golden-ratio-icon__spiral-arc-2{animation-name:golden-ratio-draw-spiral-2}.golden-ratio-icon__spiral-arc-3{animation-name:golden-ratio-draw-spiral-3}.golden-ratio-icon__spiral-arc-4{animation-name:golden-ratio-draw-spiral-4}.golden-ratio-icon__spiral-arc-5{animation-name:golden-ratio-draw-spiral-5}.golden-ratio-icon__spiral-arc-6{animation-name:golden-ratio-draw-spiral-6}.golden-ratio-icon__spiral-arc-7{animation-name:golden-ratio-draw-spiral-7}.golden-ratio-icon__spiral-arc-8{animation-name:golden-ratio-draw-spiral-8}.golden-ratio-icon__spiral-arc-9{animation-name:golden-ratio-draw-spiral-9}@keyframes golden-ratio-draw-center{0%{stroke-dashoffset:1}4.45%,50%{stroke-dashoffset:0}54.45%,to{stroke-dashoffset:-1}}@keyframes golden-ratio-draw-bottom{0%,4.45%{stroke-dashoffset:1}54.45%,8.85%{stroke-dashoffset:0}58.85%,to{stroke-dashoffset:-1}}@keyframes golden-ratio-draw-left{0%,8.85%{stroke-dashoffset:1}13.3%,58.85%{stroke-dashoffset:0}63.3%,to{stroke-dashoffset:-1}}@keyframes golden-ratio-draw-top{0%,13.3%{stroke-dashoffset:1}17.7%,63.3%{stroke-dashoffset:0}67.7%,to{stroke-dashoffset:-1}}@keyframes golden-ratio-draw-top-right{0%,17.7%{stroke-dashoffset:1}20.45%,67.7%{stroke-dashoffset:0}70.45%,to{stroke-dashoffset:-1}}@keyframes golden-ratio-draw-right{0%,20.45%{stroke-dashoffset:1}24.9%,70.45%{stroke-dashoffset:0}74.9%,to{stroke-dashoffset:-1}}@keyframes golden-ratio-draw-bottom-right{0%,24.9%{stroke-dashoffset:1}27.6%,74.9%{stroke-dashoffset:0}77.6%,to{stroke-dashoffset:-1}}@keyframes golden-ratio-draw-mid{0%,27.6%{stroke-dashoffset:1}30.35%,77.6%{stroke-dashoffset:0}80.35%,to{stroke-dashoffset:-1}}@keyframes golden-ratio-draw-small-center{0%,30.35%{stroke-dashoffset:1}32.05%,80.35%{stroke-dashoffset:0}82.05%,to{stroke-dashoffset:-1}}@keyframes golden-ratio-draw-spiral-1{0%,32.05%{stroke-dashoffset:1}39%,82.05%{stroke-dashoffset:0}89%,to{stroke-dashoffset:-1}}@keyframes golden-ratio-draw-spiral-2{0%,39%{stroke-dashoffset:1}43.3%,89%{stroke-dashoffset:0}93.3%,to{stroke-dashoffset:-1}}@keyframes golden-ratio-draw-spiral-3{0%,43.3%{stroke-dashoffset:1}45.95%,93.3%{stroke-dashoffset:0}95.95%,to{stroke-dashoffset:-1}}@keyframes golden-ratio-draw-spiral-4{0%,45.95%{stroke-dashoffset:1}47.6%,95.95%{stroke-dashoffset:0}97.6%,to{stroke-dashoffset:-1}}@keyframes golden-ratio-draw-spiral-5{0%,47.6%{stroke-dashoffset:1}48.6%,97.6%{stroke-dashoffset:0}98.6%,to{stroke-dashoffset:-1}}@keyframes golden-ratio-draw-spiral-6{0%,48.6%{stroke-dashoffset:1}49.25%,98.6%{stroke-dashoffset:0}99.25%,to{stroke-dashoffset:-1}}@keyframes golden-ratio-draw-spiral-7{0%,49.25%{stroke-dashoffset:1}49.6%,99.25%{stroke-dashoffset:0}99.6%,to{stroke-dashoffset:-1}}@keyframes golden-ratio-draw-spiral-8{0%,49.6%{stroke-dashoffset:1}49.85%,99.6%{stroke-dashoffset:0}99.85%,to{stroke-dashoffset:-1}}@keyframes golden-ratio-draw-spiral-9{0%,49.85%{stroke-dashoffset:1}50%,99.85%{stroke-dashoffset:0}to{stroke-dashoffset:-1}}.props-panel{grid-column:3;grid-row:2;display:flex;flex-direction:column;gap:10px;padding:20px 24px;overflow:hidden}.props-panel__header{flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:12px}.props-panel__label{font-size:11px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:var(--muted-soft)}.props-panel__tabs{gap:12px}.props-panel__viewport{flex:1 1;min-height:0;display:flex;overflow:hidden}.props-panel__track{width:200%}.props-panel__pane,.props-panel__track{display:flex;flex-shrink:0;min-height:0}.props-panel__pane{width:50%;flex-direction:column;min-width:0}.props-panel__head-row{flex-shrink:0;display:grid;grid-template-columns:1fr 1fr auto;grid-gap:8px;gap:8px;padding:10px 12px 6px;font-size:11px;font-weight:700;color:var(--muted-soft)}.props-panel__list{min-height:0;border:1px solid var(--card-border);border-radius:var(--r-inner);overflow:hidden}.props-panel__list,.props-panel__scroll{flex:1 1;display:flex;flex-direction:column}.props-panel__scroll{min-width:0;overflow-y:auto;padding:6px;scrollbar-width:none}.props-panel__scroll::-webkit-scrollbar{display:none}.props-panel__row{position:relative;background:var(--canvas);border-left:1px solid var(--card-border);border-right:1px solid var(--card-border);margin-bottom:0;transition:background-color .2s ease-out,border-radius .34s cubic-bezier(.34,1.3,.64,1),margin-bottom .34s cubic-bezier(.34,1.3,.64,1)}.props-panel__row[data-group-start]{border-top:1px solid var(--card-border);border-top-left-radius:var(--r-inner);border-top-right-radius:var(--r-inner)}.props-panel__row[data-group-end]{border-bottom:1px solid var(--card-border);border-bottom-left-radius:var(--r-inner);border-bottom-right-radius:var(--r-inner);margin-bottom:9px}.props-panel__row[data-group-end]:last-child{margin-bottom:0}.props-panel__row[data-open]{background:var(--card)}.props-panel__head{display:grid;grid-template-columns:1fr 1fr auto;align-items:center;grid-gap:8px;gap:8px;width:100%;padding:8px 10px;background:none;border:none;outline:none;cursor:pointer;text-align:left}.props-panel__head:focus-visible{box-shadow:0 0 0 2px var(--accent);border-radius:var(--r-inner);position:relative;z-index:1}.props-panel__name{font-family:var(--font-mono),ui-monospace,monospace;letter-spacing:.05em;font-size:12.5px;font-weight:600;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.props-panel__name[data-pill]{justify-self:start;max-width:100%;padding:3px 9px;font-size:11px;font-weight:400;border:1px solid var(--card-border);border-radius:8px;background:var(--card)}.props-panel__row[data-open] .props-panel__name[data-pill]{background:var(--canvas)}.props-panel__type{font-family:var(--font-mono),ui-monospace,monospace;letter-spacing:.05em;font-size:12px;color:var(--ink)}.props-panel__caret,.props-panel__type[data-fn]{color:var(--muted-soft)}.props-panel__caret{display:flex;align-items:center;justify-content:center}.props-panel__detail{overflow:hidden}.props-panel__detail-inner{display:flex;flex-direction:column;gap:8px;padding:0 10px 12px}.props-panel__desc{font-size:12.5px;line-height:1.5;color:var(--muted)}.props-panel__meta{display:flex;align-items:baseline;gap:10px}.props-panel__meta-label{flex-shrink:0;width:48px;font-size:11px;font-weight:700;color:var(--muted-soft)}.props-panel__meta-value{font-family:var(--font-mono),ui-monospace,monospace;letter-spacing:.05em;font-size:12px;color:var(--muted)}.blueprint-angle-guide{position:fixed;left:0;bottom:0;z-index:-1;pointer-events:none;color:var(--ink)}.footer-strip{flex:none;height:30px;display:flex;align-items:center;justify-content:center;font-size:12px;color:#9a9aa2}.footer-strip a{position:relative;color:inherit;font-weight:700;text-decoration:underline}[data-theme=dark] .footer-strip a{color:var(--accent)}.footer-annotation{display:inline-flex;position:absolute;left:calc(100% + 10px);top:100%;transform:translateY(-70%) rotate(-4deg);flex-direction:column-reverse;align-items:flex-start;gap:2px;color:color-mix(in srgb,var(--ink) 40%,transparent);font-weight:400;text-decoration:none;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .4s ease}[data-theme=dark] .footer-annotation{color:color-mix(in srgb,var(--accent) 55%,transparent)}.footer-annotation__text{display:inline-block;font-family:var(--font-handwritten),cursive;font-size:20px;line-height:1;margin-left:30px;transform:translateY(12px) rotate(6deg)}body.blueprint-visible .footer-annotation{opacity:1;transition-delay:.15s}@media (max-width:1200px) and (min-width:901px){.page{padding:40px 20px}.bento{grid-template-columns:280px 1fr 1fr;gap:10px}.sidebar{padding:22px 18px}.sidebar__title{font-size:20px}}@media (max-width:900px){.page{height:auto;padding:20px;overflow:auto}.bento{grid-template-columns:1fr;grid-template-rows:none}.flower-video,.playground,.props-panel,.sidebar{grid-column:1;grid-row:auto}.sidebar{order:1;padding-bottom:92px}.playground{order:2;height:640px}.props-panel{order:3;height:420px}.flower-video{order:4;min-height:200px}.playground__content{grid-template-columns:1fr;grid-template-rows:1fr 1fr}.playground__settings{padding:16px}.playground__settings-scroll{padding:16px;gap:8px}}