:root{color-scheme:light;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}html{min-width:20rem;height:100%;background:#f6faf8}body{min-width:20rem;min-height:100%;margin:0;color:#102724;background:#f6faf8}button,a{font:inherit}button:focus-visible,a:focus-visible{outline:3px solid #18a47e;outline-offset:3px}.demo-skip-link{position:fixed;z-index:100;top:.75rem;left:.75rem;padding:.75rem 1rem;border-radius:.65rem;color:#fff;background:#0d3835;text-decoration:none;transform:translateY(-180%)}.demo-skip-link:focus{transform:translateY(0)}.demo-visually-hidden{position:absolute;overflow:hidden;width:1px;height:1px;margin:-1px;padding:0;border:0;clip:rect(0 0 0 0);white-space:nowrap}.demo-shell{container-type:inline-size;max-width:100%;min-height:100%;min-width:0;overflow-x:clip;background:radial-gradient(circle at 78% 10%,rgba(104,239,190,.15),transparent 25rem),linear-gradient(180deg,#fbfdfc,#f3f8f6 45%,#edf5f2)}.demo-topbar{position:sticky;z-index:10;top:0;display:flex;align-items:center;justify-content:space-between;min-height:4.5rem;min-width:0;max-width:100%;padding:.75rem clamp(1rem,4vw,3rem);border-bottom:1px solid rgba(11,58,50,.09);background:#fbfdfcd4;-webkit-backdrop-filter:blur(1rem);backdrop-filter:blur(1rem)}.demo-brand{display:inline-flex;flex:1 1 auto;align-items:center;gap:.75rem;min-width:0;color:inherit;text-decoration:none}.demo-brand__mark{display:grid;width:2.65rem;height:2.25rem;place-items:center;border-radius:.75rem;color:#effff9;background:#0d3835;box-shadow:0 .5rem 1.25rem #053a3133;font-size:.7rem;font-weight:850;letter-spacing:-.03em}.demo-brand strong,.demo-brand small{display:block}.demo-brand strong{overflow:hidden;letter-spacing:-.02em;text-overflow:ellipsis;white-space:nowrap}.demo-brand small{margin-top:.1rem;color:#64817b;font-size:.72rem}.demo-topbar__actions{display:flex;flex:0 0 auto;align-items:center;gap:.55rem;color:#55736d;font-size:.78rem;font-weight:700}.demo-state-dot{width:.45rem;height:.45rem;border-radius:50%;background:#9db0ac}.demo-state-dot.is-active{background:#18a47e;box-shadow:0 0 0 .25rem #18a47e21}.demo-icon-button{display:grid;width:2.75rem;height:2.75rem;place-items:center;border:1px solid #d6e4df;border-radius:.7rem;color:#153b35;background:#fff;cursor:pointer}.demo-icon-button:hover:not(:disabled){border-color:#98cabb;background:#effaf6}.demo-icon-button:disabled{cursor:not-allowed;opacity:.38}.demo-content{width:min(72rem,100%);max-width:100%;min-width:0;margin-inline:auto;padding:0 clamp(1rem,4vw,3rem) 2rem}.demo-content>*{min-width:0;max-width:100%}.demo-hero{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(15rem,.8fr);align-items:center;gap:clamp(2rem,6vw,6rem);min-height:min(36rem,62vh);padding-block:clamp(3.5rem,8vw,7rem)}.demo-eyebrow{margin:0 0 .8rem;color:#138566;font-size:.72rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}.demo-hero h1{max-width:13ch;margin:0;color:#0a2f2b;font-size:clamp(2.8rem,6vw,5.7rem);font-weight:820;letter-spacing:-.07em;line-height:.94}.demo-lead{max-width:38rem;margin:1.6rem 0 0;color:#55736d;font-size:clamp(1rem,2vw,1.2rem);line-height:1.7}.demo-hero__actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.7rem}.demo-button{display:inline-flex;min-height:2.85rem;align-items:center;justify-content:center;gap:.45rem;padding:.7rem 1rem;border:1px solid transparent;border-radius:.8rem;cursor:pointer;font-size:.82rem;font-weight:780;text-decoration:none}.demo-button--primary{color:#f1fff9;background:#0d3835;box-shadow:0 .75rem 1.8rem #0d38352e}.demo-button--primary:hover{background:#14534b}.demo-button--secondary{border-color:#cfe1db;color:#174a41;background:#ffffffbf}.demo-button--secondary:hover{border-color:#94c8b8;background:#fff}.demo-pills{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:1.5rem}.demo-pills span{padding:.45rem .75rem;border:1px solid #d4e8e1;border-radius:999px;color:#315f56;background:#ffffffb8;font-size:.75rem;font-weight:700}.demo-hero__visual{position:relative;aspect-ratio:1;width:min(22rem,100%);margin-inline:auto}.demo-orbit{position:absolute;inset:8%;border:1px solid rgba(24,164,126,.22);border-radius:42% 58% 53% 47%;animation:demo-spin 18s linear infinite}.demo-orbit--inner{inset:24%;border-style:dashed;animation-duration:12s;animation-direction:reverse}.demo-cube{position:absolute;inset:30%;display:grid;place-items:center;border:1px solid rgba(255,255,255,.4);border-radius:2rem;color:#effff9;background:linear-gradient(145deg,#20c997,#0b5b4f);box-shadow:0 2rem 5rem #0b70584d;transform:rotate(-8deg)}.demo-cube:after{position:absolute;inset:.55rem;border:1px solid rgba(255,255,255,.24);border-radius:1.55rem;content:""}.demo-cube span{font-size:clamp(3rem,8vw,5rem);font-weight:850}.demo-particle{position:absolute;width:.65rem;height:.65rem;border-radius:.2rem;background:#20c997;box-shadow:0 0 1.5rem #20c997b3}.demo-particle--one{top:12%;left:22%}.demo-particle--two{right:12%;bottom:30%;width:.4rem;height:.4rem}.demo-particle--three{bottom:10%;left:30%;width:.85rem;height:.85rem}.demo-playground{padding:clamp(1.2rem,3vw,2.25rem);border:1px solid rgba(15,79,68,.1);border-radius:1.5rem;background:#fffc;box-shadow:0 1.5rem 4rem #204d4314;-webkit-backdrop-filter:blur(1rem);backdrop-filter:blur(1rem)}.demo-quick-start{margin-bottom:1rem;padding:clamp(1.2rem,3vw,2.25rem);border:1px solid rgba(15,79,68,.1);border-radius:1.5rem;background:#eef7f4;box-shadow:0 1.5rem 4rem #204d430f}.demo-snippet-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.5rem;margin-top:1.5rem}.demo-snippet-tabs button{display:flex;min-width:0;min-height:3.25rem;align-items:center;gap:.55rem;padding:.65rem;border:1px solid #d2e4de;border-radius:.8rem;color:#456861;background:#ffffffad;cursor:pointer;font-size:.72rem;font-weight:750;text-align:left}.demo-snippet-tabs button:hover,.demo-snippet-tabs button.is-selected{border-color:#62b99f;color:#0d4c40;background:#fff}.demo-snippet-tabs button.is-selected{box-shadow:0 .5rem 1.25rem #0f604b1a}.demo-snippet-tabs button span{display:grid;flex:0 0 auto;width:1.55rem;height:1.55rem;place-items:center;border-radius:.48rem;color:#f2fff9;background:#168665;font-size:.68rem}.demo-snippet{overflow:hidden;margin-top:.75rem;border:1px solid rgba(181,227,213,.2);border-radius:1rem;color:#dffbf1;background:#102d2a;box-shadow:0 1rem 2.5rem #0728231f}.demo-snippet__header{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.85rem 1rem;border-bottom:1px solid rgba(255,255,255,.09);background:#ffffff08}.demo-snippet__header span{color:#9de8cf;font:.7rem/1.4 ui-monospace,SFMono-Regular,Menlo,monospace}.demo-snippet__header p{margin:.2rem 0 0;color:#91b8af;font-size:.72rem;line-height:1.45}.demo-copy-button{min-width:4.5rem;min-height:2.75rem;border:1px solid rgba(168,242,217,.25);border-radius:.65rem;color:#dffbf1;background:#ffffff12;cursor:pointer;font-size:.72rem;font-weight:750}.demo-copy-button:hover{border-color:#7ff0ca;background:#7ff0ca1a}.demo-snippet pre{overflow:auto;max-height:31rem;margin:0;padding:1rem;color:#c5f7e6;font:.74rem/1.65 ui-monospace,SFMono-Regular,Menlo,monospace;tab-size:2}.demo-snippet code{font:inherit}.demo-section-heading{display:flex;align-items:end;justify-content:space-between;gap:1rem}.demo-section-heading h2{margin:0;color:#123b35;font-size:clamp(1.6rem,3vw,2.25rem);letter-spacing:-.04em}.demo-section-heading>p{max-width:28rem;margin:0;color:#66817b;font-size:.9rem;line-height:1.6}.demo-toolbar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem;margin-top:1.5rem}.demo-behaviors{display:grid;grid-template-columns:minmax(12rem,1.4fr) 1fr 1fr auto;gap:.75rem;margin-top:.75rem}.demo-width-control,.demo-behavior-toggle,.demo-reset-button{min-height:4.1rem;padding:.8rem;border:1px solid #dce9e5;border-radius:.9rem;color:#4e6d66;background:#f9fcfb}.demo-width-control>span{display:flex;justify-content:space-between;color:#718b85;font-size:.67rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.demo-width-control output{color:#186f59}.demo-width-control input{width:100%;min-height:1.7rem;margin-top:.25rem;accent-color:#18a47e;cursor:pointer}.demo-behavior-toggle,.demo-reset-button{display:flex;align-items:center;justify-content:space-between;gap:.65rem;cursor:pointer;font-size:.72rem;text-align:left}.demo-behavior-toggle:hover,.demo-reset-button:hover{border-color:#98cabb;background:#effaf6}.demo-behavior-toggle strong{color:#168665}.demo-reset-button{min-width:4.75rem;justify-content:center;color:#295e54;font-weight:780}.demo-command-bar{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:.75rem;padding:.85rem;border:1px dashed #c8ded7;border-radius:.9rem;background:#f6fbf9}.demo-command-bar small,.demo-command-bar strong{display:block}.demo-command-bar small{color:#718b85;font-size:.62rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.demo-command-bar strong{margin-top:.25rem;color:#315f56;font-size:.76rem}.demo-command-bar code{color:#147657;font-size:.72rem}.demo-command-bar>div:last-child{display:flex;flex-wrap:wrap;gap:.4rem}.demo-command-bar button{min-height:2.75rem;padding:.55rem .7rem;border:1px solid #cfe1db;border-radius:.65rem;color:#315f56;background:#fff;cursor:pointer;font-size:.7rem;font-weight:750}.demo-command-bar button:hover{border-color:#72bda7;color:#0d5a49}.demo-control-group{min-width:0;margin:0;padding:.85rem;border:1px solid #dce9e5;border-radius:1rem}.demo-control-group>legend,.demo-control-group>span{display:block;padding:0;color:#718b85;font-size:.67rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.demo-control-group>span{margin-bottom:.65rem}.demo-segmented{display:grid;grid-template-columns:1fr 1fr;gap:.3rem;margin-top:.5rem;padding:.25rem;border-radius:.7rem;background:#edf4f1}.demo-segmented button,.demo-setting-button{min-height:2.4rem;border:0;border-radius:.55rem;color:#4e6d66;background:transparent;cursor:pointer;font-size:.8rem;font-weight:750}.demo-control-help{display:block;margin-top:.55rem;color:#718b85;font-size:.65rem;line-height:1.4}.demo-segmented button.is-selected{color:#0c5445;background:#fff;box-shadow:0 .2rem .7rem #12473c1a}.demo-setting-button{display:flex;width:100%;align-items:center;justify-content:space-between;padding-inline:.75rem;background:#edf4f1}.demo-theme-swatch{width:1rem;height:1rem;border:.2rem solid #fff;border-radius:50%;background:linear-gradient(135deg,#18a47e 50%,#15162e 50%);box-shadow:0 0 0 1px #bcd1cb}.demo-event-card{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:center;gap:1rem;margin-top:1rem;padding:1rem;border-radius:1rem;color:#dffbf1;background:#0d3835}.demo-event-card>div{display:flex;min-width:0;align-items:center;gap:.8rem}.demo-event-card__icon{display:grid;flex:0 0 auto;width:2.25rem;height:2.25rem;place-items:center;border:1px solid rgba(255,255,255,.12);border-radius:.65rem;color:#7ff0ca;background:#ffffff0f}.demo-event-card small,.demo-event-card strong{display:block}.demo-event-card small,.demo-event-card dt{color:#85afa5;font-size:.64rem;font-weight:750;letter-spacing:.08em;text-transform:uppercase}.demo-event-card strong{margin-top:.2rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.8rem}.demo-event-card dl{display:grid;grid-template-columns:.7fr .6fr 1.7fr;gap:.75rem;min-width:0;margin:0}.demo-event-card dl>div{min-width:0}.demo-event-card dt{margin:0}.demo-event-card dd{margin:.25rem 0 0;overflow:hidden;color:#f1fff9;text-overflow:ellipsis;white-space:nowrap;font-size:.76rem}.demo-route{margin-top:1rem;padding:clamp(1.5rem,4vw,3rem);border:1px solid rgba(15,79,68,.09);border-radius:1.5rem;background:#ffffffa6}.demo-route h2{max-width:18ch;margin:0;color:#123b35;font-size:clamp(1.7rem,4vw,3rem);letter-spacing:-.05em}.demo-route>p{max-width:44rem;color:#5b7771;line-height:1.7}.demo-feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem;margin-top:1.5rem}.demo-feature{min-height:8rem;padding:1rem;border:1px solid #dfebe7;border-radius:1rem;background:#f9fcfb}.demo-feature span{color:#18a47e;font-size:.7rem;font-weight:850}.demo-feature h3{margin:.7rem 0 .35rem;color:#214a43;font-size:.95rem}.demo-feature p{margin:0;color:#6a847e;font-size:.78rem;line-height:1.55}.demo-code{overflow-x:auto;margin-top:1.5rem;padding:1rem;border-radius:.9rem;color:#c5f7e6;background:#102d2a;font:.78rem/1.7 ui-monospace,SFMono-Regular,Menlo,monospace;white-space:pre}.demo-route-actions{display:flex;flex-wrap:wrap;gap:.65rem;margin-top:1.5rem}.demo-route-actions a{display:inline-flex;min-height:2.8rem;align-items:center;padding:.7rem 1rem;border:1px solid #cfe2dc;border-radius:.75rem;color:#0d5546;background:#fff;font-size:.78rem;font-weight:800;text-decoration:none}.demo-route-actions a:hover{border-color:#62b99f;box-shadow:0 .5rem 1.25rem #0f604b17}.demo-guide-steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;margin:1.5rem 0 0;padding:0;list-style:none}.demo-guide-steps li{display:flex;min-width:0;gap:.8rem;padding:1rem;border:1px solid #dfebe7;border-radius:1rem;background:#f9fcfb}.demo-guide-steps li>span{display:grid;flex:0 0 2rem;width:2rem;height:2rem;place-items:center;border-radius:50%;color:#effff9;background:#168665;font-size:.72rem;font-weight:850}.demo-guide-steps h3,.demo-release-list h3{margin:0;color:#214a43;font-size:.95rem}.demo-guide-steps p,.demo-release-list p{margin:.35rem 0 0;color:#66817b;font-size:.78rem;line-height:1.55}.demo-guide-steps code{overflow-wrap:anywhere;color:#12624f;font-size:.74rem}.demo-release-list{display:grid;gap:.75rem;margin-top:1.5rem}.demo-release-list section{padding:1rem;border:1px solid #dfebe7;border-radius:1rem;background:#f9fcfb}.demo-release-list section>div{display:flex;align-items:center;gap:.6rem;margin-bottom:.65rem}.demo-release-list strong{color:#168665;font-size:.78rem}.demo-release-list span{padding:.2rem .45rem;border-radius:999px;color:#0d5546;background:#daf4ea;font-size:.6rem;font-weight:850;letter-spacing:.05em;text-transform:uppercase}.demo-footer{display:flex;justify-content:space-between;gap:1rem;padding:2rem 0 .5rem;color:#718983;font-size:.72rem}.demo-footer nav{display:flex;gap:.9rem}.demo-footer a{color:#416b62;font-weight:700;text-decoration-thickness:1px;text-underline-offset:.2rem}@keyframes demo-spin{to{transform:rotate(1turn)}}@media(max-width:52rem){.demo-hero{grid-template-columns:1fr;min-height:auto}.demo-hero__visual{width:min(18rem,70vw)}.demo-toolbar,.demo-behaviors,.demo-feature-grid,.demo-guide-steps{grid-template-columns:1fr}.demo-snippet-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}.demo-command-bar{align-items:start;flex-direction:column}.demo-event-card{grid-template-columns:1fr}}@media(max-width:36rem){.demo-topbar{min-height:4rem}.demo-brand small,.demo-topbar__actions>[data-testid=menu-state],.demo-section-heading>p{display:none}.demo-content{padding-inline:.85rem}.demo-hero{gap:1.5rem;padding-block:2.75rem}.demo-hero h1{font-size:clamp(2.35rem,13cqi,4rem)}.demo-hero__visual{display:none}.demo-snippet-tabs{grid-template-columns:1fr}.demo-snippet__header{align-items:start}.demo-snippet__header p{display:none}.demo-section-heading,.demo-footer{align-items:start;flex-direction:column}.demo-event-card dl{grid-template-columns:.8fr .6fr 1.6fr}.demo-footer nav{flex-wrap:wrap}}@media(prefers-reduced-motion:reduce){.demo-orbit{animation:none}}@media(forced-colors:active){.demo-state-dot.is-active,.demo-snippet-tabs button span,.demo-button--primary{border:1px solid ButtonText}}