:root{--columns: 4;--gutter: 16px;--margin: 16px;--max: none;--start: 1;--span: 4;--edge: 16px;--colw: calc((100% - (var(--columns) - 1) * var(--gutter)) / var(--columns));--inset: calc( (var(--start) - 1) * (var(--colw) + var(--gutter)) + var(--edge) );--ink: #0a0a0b;--muted: #8b9099;--line: #e7e8ec;--surface: #ffffff;--bg: #fcfcfd;--col: rgba(10, 10, 11, .04);--col-line: rgba(10, 10, 11, .11);--pink: #ff3b6b;--glow-strong: rgba(10, 10, 11, .16);--glow-soft: rgba(10, 10, 11, .09);--sans: "Bricolage Grotesque", -apple-system, "Helvetica Neue", sans-serif;--serif: "Fraunces", Georgia, serif;--mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;color-scheme:light}@media(min-width:768px){:root{--columns: 8;--gutter: 24px;--margin: 32px;--start: 2;--span: 6;--edge: 0px}}@media(min-width:1280px){:root{--columns: 12;--gutter: 24px;--margin: 64px;--start: 3;--span: 8;--edge: 0px}}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased}.backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;pointer-events:none;background-color:var(--bg)}.backdrop-grid{position:absolute;top:0;right:0;bottom:0;left:0;padding-inline:var(--edge);display:grid;grid-template-columns:repeat(var(--columns),1fr);column-gap:var(--gutter);-webkit-mask-image:linear-gradient(90deg,#000,transparent 26%,transparent 74%,#000);mask-image:linear-gradient(90deg,#000,transparent 26%,transparent 74%,#000)}.backdrop-grid span{background:var(--col);border-inline:1px solid var(--col-line)}@media(max-width:767px){.backdrop-grid span:nth-child(n+5),.loader-grid span:nth-child(n+5){display:none}}@media(min-width:768px)and (max-width:1279px){.backdrop-grid span:nth-child(n+9),.loader-grid span:nth-child(n+9){display:none}}.backdrop:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(60% 70% at -6% 22%,var(--glow-strong),transparent 62%),radial-gradient(55% 65% at -10% 78%,var(--glow-soft),transparent 64%),radial-gradient(60% 70% at 106% 26%,var(--glow-strong),transparent 62%),radial-gradient(55% 65% at 110% 82%,var(--glow-soft),transparent 64%)}:root[data-theme=dark]{--ink: #f2f4f6;--bg: #08090b;--surface: #14171c;--line: #23262c;--muted: #7d848f;--col: rgba(255, 255, 255, .035);--col-line: rgba(255, 255, 255, .09);--glow-strong: rgba(255, 255, 255, .13);--glow-soft: rgba(255, 255, 255, .07);color-scheme:dark}:root[data-theme=dark] .pill.dark,:root[data-theme=dark] .tab.on{background:#f2f4f6;color:#08090b}:root[data-theme=dark] .mark{background:#f2f4f6}:root[data-theme=dark] .code code,:root[data-theme=dark] .cmd code{color:#c9d1d9}:root[data-theme=dark] .copy{background:#1b1f25;color:#c9d1d9}:root[data-theme=dark] .tr:hover{background:#171b21}:root[data-theme=dark] .track li{color:#c3c8cf}:root[data-theme=dark] .links a,:root[data-theme=dark] .badge,:root[data-theme=dark] .note{color:#aab0b8}@media(max-width:767px){:root{--col: rgba(10, 10, 11, .05);--col-line: rgba(10, 10, 11, .16)}:root[data-theme=dark]{--col: rgba(255, 255, 255, .05);--col-line: rgba(255, 255, 255, .16)}.backdrop-grid{-webkit-mask-image:linear-gradient(90deg,#000,transparent 40%,transparent 60%,#000);mask-image:linear-gradient(90deg,#000,transparent 40%,transparent 60%,#000)}}.loader{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:grid;place-items:center;background:var(--bg);transition:opacity .35s ease}.loader.done{opacity:0;pointer-events:none}:root[data-loading],:root[data-loading] body{overflow:hidden}.loader-grid{position:absolute;top:0;right:0;bottom:0;left:0;padding-inline:var(--edge);display:grid;grid-template-columns:repeat(var(--columns),1fr);column-gap:var(--gutter)}.loader-grid span{background:var(--col);border-inline:1px solid var(--col-line);transform:scaleY(0);transform-origin:bottom;animation:stand .7s cubic-bezier(.16,1,.3,1) var(--in) forwards}.loader.done .loader-grid span{animation:none;transform:scaleY(0);transform-origin:top;transition:transform .55s cubic-bezier(.7,0,.3,1) var(--out)}@keyframes stand{0%{transform:scaleY(0)}to{transform:scaleY(1)}}.loader-name{position:relative;margin:0;max-width:none;font-size:clamp(30px,5vw,54px);font-weight:700;letter-spacing:-.03em;line-height:1;color:var(--ink);opacity:0;animation:land .8s cubic-bezier(.16,1,.3,1) .35s forwards}.loader-name em{font-family:var(--serif);font-style:italic;font-weight:400;color:var(--pink)}.loader.done .loader-name{animation:none;opacity:0;transform:translateY(-14px);transition:opacity .4s ease,transform .5s cubic-bezier(.7,0,.3,1)}@keyframes land{0%{opacity:0;transform:translateY(18px);filter:blur(8px)}to{opacity:1;transform:none;filter:none}}@media(prefers-reduced-motion:reduce){.loader-grid span,.loader-name{animation:none;opacity:1;transform:none}}@keyframes reveal{0%{opacity:0;transform:translateY(20px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}.topbar,.badge,h1,.lead,.cta,.tabs,.stage,.strip{opacity:0}:root[data-ready] .topbar,:root[data-ready] .badge,:root[data-ready] h1,:root[data-ready] .lead,:root[data-ready] .cta,:root[data-ready] .tabs,:root[data-ready] .stage,:root[data-ready] .strip{animation:reveal .75s cubic-bezier(.16,1,.3,1) both}:root[data-ready] .topbar{animation-delay:0ms}:root[data-ready] .badge{animation-delay:40ms}:root[data-ready] h1{animation-delay:90ms}:root[data-ready] .lead{animation-delay:.16s}:root[data-ready] .cta{animation-delay:.22s}:root[data-ready] .tabs{animation-delay:.28s}:root[data-ready] .stage{animation-delay:.34s}:root[data-ready] .strip{animation-delay:.42s}@media(prefers-reduced-motion:reduce){.topbar,.badge,h1,.lead,.cta,.tabs,.stage,.strip{opacity:1}:root[data-ready] .topbar,:root[data-ready] .badge,:root[data-ready] h1,:root[data-ready] .lead,:root[data-ready] .cta,:root[data-ready] .tabs,:root[data-ready] .stage,:root[data-ready] .strip{animation:none}}.actions{display:flex;align-items:center;gap:8px;justify-self:end}.theme{width:34px;height:34px;display:grid;place-items:center;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--ink);font-size:14px;line-height:1;cursor:pointer}.theme:hover{border-color:var(--muted)}.topbar{position:relative;z-index:100;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:20px 28px}@media(max-width:767px){.topbar{padding:16px}}.wordmark{display:inline-flex;align-items:center;gap:8px;font-size:17px;font-weight:700;letter-spacing:-.02em;color:var(--ink);text-decoration:none}.wordmark em{font-family:var(--serif);font-style:italic;font-weight:500}.mark{width:13px;height:13px;background:var(--ink);clip-path:polygon(50% 0,61% 39%,100% 50%,61% 61%,50% 100%,39% 61%,0 50%,39% 39%)}.links{display:flex;gap:26px;justify-content:center}.links a{color:#4b5058;text-decoration:none;font-size:14px;font-weight:500}.links a:hover{color:var(--ink)}.links a.to-docs{color:var(--ink);font-weight:600;border-bottom:2px solid var(--pink)}.menu-btn{display:none;flex-direction:column;justify-content:center;gap:4px;width:34px;height:34px;padding:0 8px;border:1px solid var(--line);border-radius:999px;background:var(--surface);cursor:pointer}.menu-btn:hover{border-color:var(--muted)}.menu-btn i{height:2px;border-radius:2px;background:var(--ink);transition:transform .18s ease,opacity .18s ease}.menu-btn.on i:nth-child(1){transform:translateY(6px) rotate(45deg)}.menu-btn.on i:nth-child(2){opacity:0}.menu-btn.on i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}.menu{position:fixed;top:0;right:0;bottom:0;left:0;z-index:90;display:flex;flex-direction:column;justify-content:center;gap:6px;padding:96px 24px 48px;background:var(--bg);animation:menu-in .22s ease}@keyframes menu-in{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}.menu a{padding:12px 0;border-bottom:1px solid var(--line);color:var(--ink);text-decoration:none;font-size:30px;font-weight:700;letter-spacing:-.02em}.menu a:last-child{border-bottom:0}.menu a:hover,.menu a.to-docs{color:var(--pink)}@media(prefers-reduced-motion:reduce){.menu{animation:none}}@media(max-width:900px){.topbar{grid-template-columns:1fr auto}.links{display:none}.menu-btn{display:inline-flex}}@media(min-width:901px){.menu{display:none}}.pill{display:inline-flex;align-items:center;gap:10px;padding:14px 26px;border:0;border-radius:999px;font:inherit;font-weight:600;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease}.pill:hover{transform:translateY(-1px)}.pill.sm{padding:9px 18px;font-size:13px}.pill.dark{background:var(--ink);color:#fff;font-family:var(--mono);font-size:13px;box-shadow:0 6px 20px #0a0a0b2e}.pill.dark:hover{box-shadow:0 10px 28px #0a0a0b3d}.pill.light{background:var(--surface);color:var(--ink);border:1px solid var(--line);font-size:14px;box-shadow:0 6px 20px #0a0a0b0f}.pill.light:hover{border-color:var(--muted)}.pill.light .keys{border-left-color:var(--line);color:var(--muted)}.pill.light kbd{background:#0a0a0b0d;color:var(--muted)}:root[data-theme=dark] .pill.light kbd{background:#ffffff14}.pill .keys{display:inline-flex;align-items:center;gap:2px;padding-left:10px;margin-left:2px;border-left:1px solid rgb(255 255 255 / .18);color:#ffffff73;font-size:10px}.pill kbd{padding:2px 5px;border-radius:4px;background:#ffffff24;color:#fffc;font-family:var(--mono);font-size:10px}:root[data-theme=dark] .pill.dark .keys{border-left-color:#0a0b0d26;color:#0a0b0d73}:root[data-theme=dark] .pill.dark kbd{background:#0a0b0d1a;color:#0a0b0db3}@media(max-width:700px){.pill .keys{display:none}}.hero{padding:36px var(--inset) 64px;text-align:center}.badge{display:inline-block;margin-bottom:26px;color:#4b5058;font-size:13px;font-weight:500}h1{margin:0 auto;max-width:26ch;font-size:clamp(32px,4.6vw,56px);font-weight:700;line-height:1.08;letter-spacing:-.03em}h1 em{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:-.01em}.fade{color:var(--pink)}.lead{margin:24px auto 0;max-width:52ch;color:var(--muted);font-size:16px}.cta{display:flex;justify-content:center;align-items:center;gap:16px;margin-top:32px;flex-wrap:wrap}.tabs{display:inline-flex;gap:4px;margin:56px 0 20px;padding:4px;border-radius:999px;border:1px solid var(--line);background:var(--surface)}.tab{padding:8px 20px;border:0;border-radius:999px;background:none;color:var(--muted);font:inherit;font-size:13px;font-weight:600;cursor:pointer;transition:background .16s ease,color .16s ease}.tab:hover{color:var(--ink)}.tab.on{background:var(--ink);color:#fff;box-shadow:0 4px 12px #0a0a0b29}.stage{position:relative}.frame{position:absolute;top:0;left:50%;container-type:inline-size;transform-origin:top center;border-radius:16px;border:1px solid var(--line);background:var(--surface);box-shadow:0 24px 60px #0a0a0b1a;overflow:hidden;text-align:left;transition:width .45s cubic-bezier(.22,1,.36,1),transform .45s cubic-bezier(.22,1,.36,1)}.frame-grid,.frame-page{display:grid;grid-template-columns:repeat(var(--c),1fr);column-gap:var(--g);padding-inline:var(--m)}.frame-grid{position:absolute;top:0;right:0;bottom:0;left:0}.frame-grid span{background:var(--pink);opacity:.09}.frame-page{position:relative;align-content:start;row-gap:22px;padding-block:28px}.site-bar{grid-column:1 / -1;display:flex;align-items:center;gap:18px;margin-bottom:6px}.site-logo{font-weight:800;font-size:15px;letter-spacing:-.02em;color:var(--ink)}.site-logo em{font-style:normal;color:var(--pink)}.site-nav{display:flex;gap:16px;margin-left:auto;font-size:12px;color:var(--muted)}.site-cta{padding:6px 12px;border-radius:999px;background:var(--ink);color:var(--bg);font-size:11px;font-weight:600;white-space:nowrap}.site-burger{display:none;flex-direction:column;gap:4px;flex:none}.site-burger i{width:18px;height:2px;border-radius:2px;background:var(--ink)}.site-title{grid-column:1 / -1;margin:0;max-width:18ch;font-size:30px;line-height:1.08;letter-spacing:-.025em;font-weight:800;color:var(--ink)}.site-lead{grid-column:1 / -1;margin:0;max-width:44ch;font-size:13px;line-height:1.5;color:var(--muted)}.site-cards{grid-column:1 / -1;display:grid;grid-template-columns:subgrid;row-gap:18px;margin-top:4px}.site-cards figure{grid-column:span 4;display:grid;gap:8px;margin:0}.site-img{height:96px;border-radius:10px;border:1px solid var(--line)}.site-img.a{background:radial-gradient(120% 100% at 15% 0%,rgb(255 255 255 / .4),transparent 45%),linear-gradient(140deg,#ffd9e2,#ff3b6b 55%,#55112d)}.site-img.b{background:radial-gradient(120% 100% at 80% 10%,rgb(255 255 255 / .35),transparent 45%),linear-gradient(215deg,#d9e6ff,#4f7cff 55%,#101c4d)}.site-img.c{background:radial-gradient(130% 110% at 30% 100%,rgb(255 255 255 / .3),transparent 50%),linear-gradient(160deg,#ffedd6,#ff9a3b 60%,#45210d)}.site-cards figcaption{display:flex;align-items:baseline;justify-content:space-between;gap:10px;font-size:12px;font-weight:600;color:var(--ink)}.site-cards figcaption small{font-size:11px;font-weight:400;color:var(--muted)}@container (max-width: 640px){.site-nav{display:none}.site-cta{margin-left:auto}.site-burger{display:flex}.site-title{font-size:24px}}.frame-chip{position:absolute;left:16px;bottom:16px;display:flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;border:1px solid var(--line);background:var(--surface);box-shadow:0 6px 18px #0a0a0b1a;font-family:var(--mono);font-size:12px}.blip{width:7px;height:7px;border-radius:50%;background:var(--pink);animation:pulse 1.6s ease-in-out infinite}@keyframes pulse{50%{opacity:.3}}.strip{display:flex;align-items:center;gap:40px;padding:28px var(--inset);border-block:1px solid var(--line);background:var(--surface)}.strip-label{flex:none;color:var(--muted);font-size:13px;line-height:1.35}.marquee{flex:1;min-width:0;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}.track{display:flex;align-items:center;width:max-content;animation:marquee var(--duration, 20s) linear infinite}.marquee:hover .track{animation-play-state:paused}.seq{display:flex;align-items:center;width:max-content;margin:0;padding:0;list-style:none}.seq li{display:flex;align-items:center;gap:10px;margin-right:clamp(28px,4vw,56px);font-size:18px;font-weight:600;letter-spacing:-.01em;white-space:nowrap;color:#3d424a}.seq li svg{width:20px;height:20px;flex:none}@keyframes marquee{to{transform:translate(var(--shift, -50%))}}@media(prefers-reduced-motion:reduce){.track{animation:none}}.docs{display:grid;grid-template-columns:repeat(var(--columns),1fr);column-gap:var(--gutter);row-gap:72px;padding:88px var(--edge)}.block{grid-column:var(--start) / span var(--span);display:grid;grid-template-columns:subgrid;row-gap:20px}.block-head,.block-body{grid-column:1 / -1}@media(min-width:1024px){.block-head{grid-column:1 / span 3;position:sticky;top:32px;align-self:start}.block-body{grid-column:4 / -1}}.block h2{margin:0 0 12px;font-size:26px;font-weight:700;letter-spacing:-.02em}.block p{margin:0;color:var(--muted)}.block-body>*+*{margin-top:16px}.note{padding:12px 16px;border:0;border-left:2px solid var(--pink);border-radius:0 8px 8px 0;background:#ff3b6b0f;color:var(--muted);font-size:14px}.install{margin-bottom:28px}.tabs.mini{display:inline-flex;margin:0 0 12px;padding:3px}.tabs.mini .tab{padding:6px 16px;font-family:var(--mono);font-size:12px}.cmd{display:flex;align-items:center;gap:16px;padding:14px 14px 14px 18px;border:1px solid var(--line);border-radius:12px;background:var(--surface);box-shadow:0 8px 24px #0a0a0b0a}.cmd code{flex:1;min-width:0;overflow-x:auto;font-family:var(--mono);font-size:13px;color:#24292f;white-space:nowrap}.cmd .prompt{color:var(--muted);margin-right:8px}.copy{flex:none;padding:7px 14px;border:1px solid var(--line);border-radius:8px;background:#fbfcfd;color:#4b5058;font:inherit;font-size:12px;font-weight:600;cursor:pointer}.copy:hover{background:#f3f5f7;color:var(--ink)}.themes{display:grid;grid-template-columns:repeat(auto-fill,minmax(108px,1fr));gap:10px}.swatch{padding:0;border:1px solid var(--line);border-radius:12px;background:var(--surface);cursor:pointer;overflow:hidden;text-align:left;transition:border-color .15s ease,transform .15s ease}.swatch:hover{transform:translateY(-2px)}.swatch.on{border-color:var(--pink);box-shadow:0 0 0 1px var(--pink)}.swatch-preview{display:grid;grid-template-columns:8px 1fr;align-content:start;gap:6px 8px;padding:12px;height:74px;border-bottom:1px solid}.swatch-dot{width:8px;height:8px;border-radius:50%;background:var(--pink)}.swatch-bar{height:5px;border-radius:3px}.swatch-bar:nth-of-type(2){width:70%}.swatch-bar:nth-of-type(3){grid-column:2;width:90%}.swatch-field{grid-column:1 / -1;height:16px;border-radius:5px;border:1px solid}.swatch-name{display:block;padding:8px 12px;color:var(--muted);font-family:var(--mono);font-size:11px}.swatch.on .swatch-name{color:var(--ink)}.why{display:grid;grid-template-columns:repeat(var(--columns),1fr);column-gap:var(--gutter);row-gap:36px;padding:96px var(--edge) 0}.why-head{grid-column:var(--start) / span var(--span)}.why-head h2{margin:0 0 14px;max-width:22ch;font-size:clamp(28px,3.4vw,40px);line-height:1.1;letter-spacing:-.03em}.why-head p{margin:0;max-width:46ch;color:var(--muted);font-size:16px}.why-cards{grid-column:var(--start) / span var(--span);display:grid;grid-template-columns:subgrid;row-gap:16px}.why-card{grid-column:1 / -1;padding:24px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}@media(min-width:768px){.why-card{grid-column:span 3}.why-card.answer{grid-column:1 / -1}}@media(min-width:1280px){.why-card{grid-column:span 4}}.why-card h3{margin:0 0 10px;font-size:17px;letter-spacing:-.01em}.why-card p{margin:0;color:var(--muted);font-size:15px;line-height:1.6}.why-card.answer{border-color:var(--pink)}.why-card.answer h3{color:var(--pink)}.panel-live{display:flex;align-items:center;gap:40px;flex-wrap:wrap;justify-content:space-evenly;padding:32px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}.panel-copy{flex:1;min-width:280px;max-width:460px}.panel-list{margin:0 0 24px;padding:0;list-style:none}.panel-list li{margin-bottom:14px;padding-left:18px;position:relative;color:var(--muted);font-size:15px;line-height:1.6}.panel-list li:before{content:"";position:absolute;left:0;top:9px;width:6px;height:6px;border-radius:50%;background:var(--pink)}.panel-list b{color:var(--ink);font-weight:600}.panel-copy .note{margin-top:14px}.doc-layout{display:grid;grid-template-columns:repeat(var(--columns),1fr);column-gap:var(--gutter);padding:48px var(--edge) 96px}.doc-nav{display:none}.doc-content{grid-column:var(--start) / span var(--span)}@media(min-width:1280px){.doc-nav{display:block;grid-column:3 / span 2;position:sticky;top:28px;align-self:start;max-height:calc(100vh - 56px);overflow-y:auto;padding-block:8px}.doc-content{grid-column:5 / span 6}}.doc-group{margin-bottom:26px}.doc-group-title{display:block;margin-bottom:10px;color:var(--muted);font-size:12px;font-weight:600;letter-spacing:.03em}.doc-links{margin:0;padding:0;list-style:none;border-left:1px solid var(--line)}.doc-link{display:block;margin-left:-1px;padding:7px 0 7px 14px;border-left:2px solid transparent;color:#4b5058;text-decoration:none;font-size:14px;line-height:1.35}.doc-link:hover{color:var(--ink)}.doc-link.on{color:var(--pink);border-left-color:var(--pink);font-weight:600}.doc-intro{padding-bottom:48px}.doc-intro h1{margin:14px 0 0;max-width:18ch;text-align:left}.doc-intro .lead{margin-left:0}.doc-section{scroll-margin-top:88px;padding-bottom:64px}.doc-content{padding-bottom:30vh}.doc-section h2{margin:0 0 12px;font-size:26px;font-weight:700;letter-spacing:-.02em}.doc-section p{margin:0;color:var(--muted)}.doc-section>*+*{margin-top:16px}.mock-stage{display:flex;justify-content:center;padding:32px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}.mock-stage.editing{justify-content:space-evenly;align-items:center;gap:32px;flex-wrap:wrap}.custom{display:grid;gap:8px;width:260px}.custom-row{display:grid;grid-template-columns:60px 32px 1fr;align-items:center;gap:10px;font-family:var(--mono);font-size:12px;cursor:pointer}.custom-key{color:var(--muted)}.custom-row input[type=color]{width:32px;height:24px;padding:0;border:1px solid var(--line);border-radius:6px;background:none;cursor:pointer}.custom-row input[type=color]::-webkit-color-swatch-wrapper{padding:2px}.custom-row input[type=color]::-webkit-color-swatch{border:none;border-radius:4px}.custom-row output{color:var(--ink)}.custom-reset{justify-self:start;margin-top:4px;padding:6px 14px;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--muted);font-family:var(--mono);font-size:12px;cursor:pointer}.custom-reset:hover{color:var(--ink);border-color:var(--muted)}.mock{width:232px;box-sizing:border-box;padding:10px 12px 12px;border:1px solid;border-radius:10px;box-shadow:0 8px 24px #0000002e;font-family:var(--mono);font-size:11px;line-height:1.4;-webkit-user-select:none;user-select:none}.mock-head{display:flex;align-items:center;gap:6px;margin-bottom:10px}.mock-head strong{font-weight:600;letter-spacing:.02em}.mock-head>span:nth-of-type(2){margin-left:auto}.mock-dot{width:8px;height:8px;border-radius:50%;flex:none}.mock-fold{display:grid;place-items:center;width:18px;height:18px;border:1px solid;border-radius:6px;font-size:12px;line-height:1}.mock-row{display:grid;grid-template-columns:52px 1fr 34px;align-items:center;gap:8px;margin-bottom:6px}.mock-rail{position:relative;height:3px;border-radius:3px}.mock-thumb{position:absolute;top:50%;width:11px;height:11px;margin-left:-5px;border-radius:50%;translate:0 -50%}.mock-colour{height:20px;border:1px solid;border-radius:4px}.mock-row output{text-align:right;font-variant-numeric:tabular-nums}.mock-actions{display:flex;gap:6px;margin-top:10px}.mock-actions span{flex:auto;padding:6px 8px;border:1px solid;border-radius:6px;font-size:10px;text-align:center;white-space:nowrap}.mock-hint{display:grid;gap:3px;margin-top:10px;font-size:10px}.mock-hint span{display:flex;justify-content:space-between;gap:12px;white-space:nowrap}.mock-hint b{font-weight:600}.keys-row{grid-template-columns:190px 1fr;align-items:center}.keys-row kbd{padding:3px 8px;margin-right:4px;border:1px solid var(--line);border-bottom-width:2px;border-radius:6px;background:var(--bg);color:var(--ink);font-family:var(--mono);font-size:11px}.code{border:1px solid var(--line);border-radius:12px;background:var(--surface);overflow:hidden;box-shadow:0 8px 24px #0a0a0b0a}.code-tab{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 16px;border-bottom:1px solid var(--line);color:var(--muted);font-family:var(--mono);font-size:12px}.code-tab .copy{padding:5px 12px}.code pre{margin:0;padding:18px 20px;overflow-x:auto}.code code{font-family:var(--mono);font-size:13px;line-height:1.7;color:#24292f;white-space:pre}.table{border:1px solid var(--line);border-radius:12px;background:var(--surface);overflow:hidden}.tr{display:grid;grid-template-columns:160px 190px 1fr;gap:16px;padding:12px 18px;border-top:1px solid var(--line);font-size:14px}.tr:first-child{border-top:0}.tr:hover{background:#fafbfc}.prop{font-family:var(--mono);font-size:13px}.val{font-family:var(--mono);font-size:13px;color:var(--muted)}.role{color:var(--muted)}.outro{padding:0 var(--inset) 96px}.outro-card{position:relative;max-width:var(--max);margin-inline:auto;padding:clamp(56px,9vw,104px) 24px;border-radius:28px;border:1px solid var(--line);background:var(--surface);text-align:center;overflow:hidden}.outro-card:before,.outro-card:after{content:"";position:absolute;left:50%;translate:-50% 0;background:linear-gradient(90deg,transparent,var(--pink),transparent)}.outro-card:before{top:0;width:62%;height:1px}.outro-card:after{top:-34px;width:42%;height:70px;filter:blur(34px);opacity:.55}.outro-card h2{margin:0;font-size:clamp(28px,3.6vw,42px);font-weight:700;letter-spacing:-.03em}.outro-card p{margin:16px auto 0;max-width:46ch;color:var(--muted)}.outro-cta{display:flex;justify-content:center;gap:12px;margin-top:32px;flex-wrap:wrap}a.pill{text-decoration:none}.outro-cta .pill{font-family:var(--mono);font-size:13px}.outro-cta svg{width:16px;height:16px;flex:none}.arrow{transition:translate .16s ease}.outro-cta .pill:hover .arrow{translate:3px 0}footer{display:grid;justify-items:center;text-align:center;gap:10px;padding:40px var(--inset);border-top:1px solid var(--line);font-size:13px}footer .muted{max-width:62ch}footer .muted{color:var(--muted)}footer code{font-family:var(--mono);font-size:12px}.credit{color:var(--ink)}.credit a{color:var(--ink);font-weight:700;text-decoration:none;border-bottom:1px solid var(--line);transition:border-color .15s ease}.credit a:hover{border-bottom-color:var(--pink)}.heart{color:var(--pink);display:inline-block;animation:beat 1.8s ease-in-out infinite}@keyframes beat{0%,to{transform:scale(1)}15%{transform:scale(1.25)}30%{transform:scale(1)}}@media(prefers-reduced-motion:reduce){.heart{animation:none}}@media(max-width:767px){.tr{grid-template-columns:1fr auto;gap:4px 12px}.role{grid-column:1 / -1}.strip{flex-direction:column;align-items:stretch;gap:16px}}