.components-page,.components-fullscreen{--cs-bg:#040507;--cs-panel:#06080c;--cs-line:#ffffff14;--cs-line-strong:#ffffff24;--cs-text:#f8fafc;--cs-muted:#94a3b8;--cs-dim:#64748b;--cs-brand:#052a20;--cs-lime:#2bbf94;--cs-lime-soft:#2bbf9424;--cs-cyan:#67e8f9;--cs-cyan-soft:#67e8f91f;--cs-ease:cubic-bezier(.22, 1, .36, 1);background:var(--cs-bg);color:#fff;width:100%;min-height:100dvh;font-family:var(--font-poppins), sans-serif}.components-window{background:radial-gradient(900px 420px at 85% -10%,#67e8f917,#0000 60%),radial-gradient(700px 380px at 30% -15%,#2bbf940f,#0000 60%),#070a10;grid-template-columns:264px minmax(0,1fr);width:100%;height:100dvh;display:grid;overflow:hidden}.components-mobile-bar,.components-icon-button.components-menu-close,.components-backdrop{display:none}.components-icon-button{border:1px solid var(--cs-line-strong);color:#e2e8f0;cursor:pointer;width:34px;height:34px;transition:background .2s ease, border-color .2s ease, color .2s ease, transform .2s var(--cs-ease);background:#ffffff0a;border-radius:10px;flex:none;place-items:center;display:grid}.components-icon-button:hover{color:#fff;background:var(--cs-cyan-soft);border-color:#67e8f973}.components-icon-button:active{transform:scale(.94)}.components-icon-button.is-disabled{opacity:.3;pointer-events:none}.components-page :focus-visible{outline:2px solid var(--cs-cyan);outline-offset:2px}.components-brand-link{color:var(--cs-text);align-items:center;gap:10px;text-decoration:none;display:flex}.components-brand-mark{width:34px;height:34px;transition:transform .5s var(--cs-ease);background:#052a20;border:1px solid #ffffff26;border-radius:50%;flex:none;place-items:center;display:grid;box-shadow:0 0 18px #10b98140,inset 0 1px 1px #ffffff1f}.components-brand-link:hover .components-brand-mark{transform:rotate(60deg)}.components-brand-name{letter-spacing:-.02em;font-size:17px;font-weight:700}.components-brand-name b{font-weight:inherit}.components-sidebar{border-right:1px solid var(--cs-line);background:#05070bd1;flex-direction:column;min-height:0;display:flex}.components-brand{border-bottom:1px solid var(--cs-line);flex:none;align-items:center;gap:12px;height:72px;padding:0 18px;display:flex}.components-sidebar-search{border:1px solid var(--cs-line-strong);height:38px;color:var(--cs-dim);background:#ffffff08;border-radius:11px;flex:none;align-items:center;gap:8px;margin:14px 14px 10px;padding:0 10px;transition:border-color .2s,box-shadow .2s,background .2s;display:flex}.components-sidebar-search:focus-within{background:#67e8f90a;border-color:#67e8f980;box-shadow:0 0 0 3px #67e8f91a}.components-sidebar-search input{color:#e2e8f0;width:100%;min-width:0;font:500 12px/1 var(--font-poppins), sans-serif;background:0 0;border:0;outline:0}.components-sidebar-search input:focus-visible{outline:0}.components-sidebar-search input::placeholder{color:var(--cs-dim)}.components-sidebar-search kbd{border:1px solid var(--cs-line-strong);min-width:20px;color:var(--cs-muted);font:600 10px/1 var(--font-geist-mono), monospace;text-align:center;background:#ffffff0a;border-radius:6px;padding:3px 6px}.components-search-clear{color:#e2e8f0;cursor:pointer;background:#ffffff1a;border:0;border-radius:50%;flex:none;place-items:center;width:20px;height:20px;display:grid}.components-search-clear:hover{background:#fff3}.components-sidebar nav{overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#ffffff24 transparent;flex:1;min-height:0;padding:2px 10px 12px;overflow-y:auto}.components-sidebar nav::-webkit-scrollbar{width:6px}.components-sidebar nav::-webkit-scrollbar-thumb{background:#ffffff24;border-radius:999px}.components-menu-group+.components-menu-group{margin-top:2px}.components-menu-heading{width:100%;color:var(--cs-muted);font:600 11px/1 var(--font-geist-mono), monospace;letter-spacing:.08em;text-align:left;text-transform:uppercase;cursor:pointer;background:0 0;border:0;border-radius:10px;justify-content:space-between;align-items:center;padding:10px;transition:color .2s,background .2s;display:flex}.components-menu-heading:hover{color:#fff;background:#ffffff0a}.components-menu-heading.is-current{color:#fff}.components-menu-heading span{align-items:center;gap:7px;display:flex}.components-menu-heading svg{color:var(--cs-dim);transition:transform .25s var(--cs-ease), color .2s ease}.components-menu-heading.is-open svg{transform:rotate(90deg)}.components-menu-heading.is-current svg{color:var(--cs-lime)}.components-menu-heading small{min-width:26px;color:var(--cs-dim);text-align:center;background:#ffffff0d;border-radius:6px;padding:3px 6px;font-size:10px}.components-menu-heading.is-current small{color:#fff;background:var(--cs-brand);box-shadow:inset 0 0 0 1px #2bbf948c,0 0 14px #2bbf942e}.components-menu-children{border-left:1px solid var(--cs-line);animation:cs-fade-down .25s var(--cs-ease);margin:2px 0 8px 16px;padding-left:8px}.components-menu-item{width:100%;color:var(--cs-dim);font:500 12px/1.25 var(--font-poppins), sans-serif;text-align:left;cursor:pointer;transition:color .2s ease, background .2s ease, transform .2s var(--cs-ease);background:0 0;border:0;border-radius:8px;margin:1px 0;padding:8px 10px;display:block;position:relative}.components-menu-item:hover{color:#e2e8f0;background:#ffffff0a;transform:translate(2px)}.components-menu-item.is-active{color:#fff;background:linear-gradient(90deg, var(--cs-cyan-soft), transparent)}.components-menu-item.is-active:before{content:"";background:var(--cs-cyan);width:2px;height:18px;box-shadow:0 0 10px var(--cs-cyan);border-radius:2px;position:absolute;top:50%;left:-9.5px;transform:translateY(-50%)}.components-menu-empty{color:var(--cs-dim);font:500 12px/1.5 var(--font-poppins), sans-serif;margin:0;padding:16px 10px}.components-sidebar-footer{border-top:1px solid var(--cs-line);color:var(--cs-dim);font:500 10px/1 var(--font-geist-mono), monospace;flex:none;justify-content:space-between;align-items:center;gap:8px;padding:12px 18px;display:flex}.components-sidebar-footer a{color:var(--cs-muted);align-items:center;gap:5px;text-decoration:none;transition:color .2s;display:inline-flex}.components-sidebar-footer a:hover{color:#fff}.components-content{scrollbar-width:thin;scrollbar-color:#ffffff24 transparent;min-width:0;position:relative;overflow:hidden auto}.components-topbar{z-index:5;border-bottom:1px solid var(--cs-line);-webkit-backdrop-filter:blur(14px);background:#070a10c7;justify-content:space-between;align-items:center;gap:12px;height:60px;padding:0 clamp(16px,3vw,36px);display:flex;position:sticky;top:0}.components-breadcrumb{min-width:0;color:var(--cs-dim);font:500 12px/1 var(--font-poppins), sans-serif;white-space:nowrap;align-items:center;gap:8px;display:flex}.components-breadcrumb a{color:var(--cs-muted);text-decoration:none;transition:color .2s}.components-breadcrumb a:hover{color:#fff}.components-breadcrumb span{color:#fff;text-overflow:ellipsis;overflow:hidden}.components-topbar-actions{align-items:center;gap:8px;display:flex}.components-position{color:#e2e8f0;font:600 11px/1 var(--font-geist-mono), monospace;font-variant-numeric:tabular-nums;margin-right:6px}.components-position i{color:var(--cs-dim);margin:0 4px;font-style:normal}.components-inner{width:100%;max-width:1480px;animation:cs-fade-up .45s var(--cs-ease);margin:0 auto;padding:clamp(32px,6vw,64px) clamp(16px,2.5vw,32px) 72px}.components-hero{margin-bottom:36px}.components-eyebrow{border:1px solid var(--cs-line-strong);color:var(--cs-muted);font:600 10px/1 var(--font-geist-mono), monospace;letter-spacing:.12em;text-transform:uppercase;background:#ffffff08;border-radius:999px;align-items:center;gap:8px;padding:6px 12px;display:inline-flex}.components-eyebrow i{background:var(--cs-lime);width:6px;height:6px;box-shadow:0 0 8px var(--cs-lime);border-radius:50%}.components-hero h1{font:700 clamp(34px, 5.5vw, 56px)/1.05 var(--font-poppins), sans-serif;letter-spacing:-.04em;background:linear-gradient(#fff 30%,#ffffff8c);color:#0000;-webkit-background-clip:text;background-clip:text;margin:18px 0 12px}.components-hero p{max-width:560px;color:var(--cs-muted);font:400 15px/1.65 var(--font-poppins), sans-serif;margin:0}.components-hero-chips{flex-wrap:wrap;gap:8px;margin-top:20px;display:flex}.components-hero-chips span{border:1px solid var(--cs-line);color:#cbd5e1;font:500 11px/1 var(--font-geist-mono), monospace;background:#ffffff06;border-radius:8px;padding:6px 11px}.components-list{flex-direction:column;gap:72px;display:flex}.components-example{scroll-margin-top:76px;position:relative}.components-example-heading{align-items:center;gap:12px;margin-bottom:14px;display:flex}.components-example-index{border:1px solid var(--cs-line-strong);width:30px;height:30px;color:var(--cs-muted);font:600 11px/1 var(--font-geist-mono), monospace;border-radius:9px;flex:none;place-items:center;transition:color .3s,border-color .3s,background .3s;display:grid}.components-example.is-active .components-example-index{color:#fff;background:var(--cs-brand);border-color:#0000;box-shadow:inset 0 0 0 1px #2bbf948c,0 0 14px #2bbf942e}.components-example-heading h2{color:#f1f5f9;min-width:0;font:600 18px/1.2 var(--font-poppins), sans-serif;letter-spacing:-.01em;text-overflow:ellipsis;white-space:nowrap;margin:0;overflow:hidden}.components-example-heading code{color:var(--cs-dim);font:500 10px/1 var(--font-geist-mono), monospace;background:#ffffff0a;border-radius:7px;flex:none;padding:5px 8px}.components-example-tools{flex:none;align-items:center;gap:8px;margin-left:auto;display:flex}.components-viewport{border:1px solid var(--cs-line-strong);background:#ffffff08;border-radius:10px;gap:2px;padding:3px;display:flex}.components-viewport button{width:28px;height:26px;color:var(--cs-dim);cursor:pointer;background:0 0;border:0;border-radius:7px;place-items:center;transition:color .2s,background .2s;display:grid}.components-viewport button:hover{color:#e2e8f0}.components-viewport button.is-selected{color:#fff;background:var(--cs-brand);box-shadow:inset 0 0 0 1px #2bbf948c,0 0 14px #2bbf942e}.components-stage{z-index:1;border:1px solid var(--cs-line);background:radial-gradient(circle at 50% 0,#67e8f90d,#0000 60%),radial-gradient(#ffffff12 1px,#0000 1px) 0 0/18px 18px,#05070b;border-radius:20px;align-items:center;width:100%;min-height:320px;padding:40px 0;transition:border-color .35s,box-shadow .35s;display:flex;position:relative;overflow:clip visible}.components-example.is-active .components-stage{border-color:#67e8f942;box-shadow:0 24px 60px -34px #67e8f966}.components-stage:hover,.components-stage:focus-within{z-index:3}.components-frame{width:100%;transition:max-width .35s var(--cs-ease);margin:0 auto;transform:translateZ(0)}.components-frame.is-device{border-inline:1px dashed #67e8f940;padding:16px 0}.components-stage-note{color:var(--cs-dim);font:500 12px/1 var(--font-geist-mono), monospace;text-align:center;margin:0}.components-fullscreen{z-index:100;color:#fff;font-family:var(--font-poppins), sans-serif;background:radial-gradient(#ffffff0f 1px,#0000 1px) 0 0/18px 18px,#05070b;flex-direction:column;animation:.2s cs-fade-in;display:flex;position:fixed;inset:0}.components-fullscreen-bar{border-bottom:1px solid var(--cs-line);background:#05070be6;flex:none;justify-content:space-between;align-items:center;height:56px;padding:0 16px 0 20px;display:flex}.components-fullscreen-bar span{font:600 14px/1 var(--font-poppins), sans-serif;align-items:center;gap:10px;display:flex}.components-fullscreen-bar i{background:var(--cs-lime);width:7px;height:7px;box-shadow:0 0 8px var(--cs-lime);border-radius:50%}.components-fullscreen-body{flex:1;align-items:center;min-height:0;padding:32px 0;display:flex;overflow:auto}.components-fullscreen-body>*{margin:auto 0}.components-stage-skeleton{background:linear-gradient(100deg,#ffffff08 30%,#ffffff12 50%,#ffffff08 70%) 0 0/300% 100%;border-radius:16px;width:min(320px,70%);height:140px;margin:0 auto;animation:1.6s linear infinite cs-shimmer}.components-installed-preview{width:100%;min-height:220px;color:var(--cs-text);place-items:center;display:grid;overflow:clip visible}.components-installed-preview>*{grid-template-columns:minmax(0,1fr);min-width:0;max-width:100%}.components-registry-preview{background:radial-gradient(circle at 15% 15%,#67e8f924,#0000 40%),linear-gradient(145deg,#ffffff0f,#ffffff04);border:1px solid #67e8f938;border-radius:20px;align-items:center;gap:16px;width:min(100%,440px);min-height:150px;padding:28px;display:flex;position:relative;overflow:hidden}.components-registry-icon{width:48px;height:48px;color:var(--cs-cyan);background:var(--cs-cyan-soft);border:1px solid #67e8f959;border-radius:14px;flex:none;place-items:center;display:grid}.components-registry-preview strong,.components-registry-preview span{z-index:1;display:block;position:relative}.components-registry-preview strong{color:var(--cs-text);font:700 16px/1.2 var(--font-poppins), sans-serif}.components-registry-preview div>span{color:var(--cs-muted);font:500 11px/1.2 var(--font-poppins), sans-serif;margin-top:5px}.components-registry-installed{border:1px solid var(--cs-line-strong);color:var(--cs-muted);font:600 10px/1 var(--font-poppins), sans-serif;white-space:nowrap;border-radius:999px;align-self:flex-start;margin-left:auto;padding:5px 8px}.components-command{border:1px solid var(--cs-line-strong);color:#cbd5e1;width:fit-content;max-width:min(100%,560px);font:12.5px/1 var(--font-geist-mono), monospace;text-align:left;cursor:pointer;background:#05070b;border-radius:14px;justify-content:space-between;align-items:center;gap:12px;margin:14px auto 4px;padding:6px 6px 6px 16px;transition:border-color .2s,background .2s;display:flex}.components-command:hover{background:#070a10;border-color:#67e8f973}.components-command span{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.components-command b{color:var(--cs-lime);margin-right:10px}.components-command em{color:var(--cs-cyan);font-style:normal}.components-command strong{color:#e2e8f0;font:600 11px/1 var(--font-poppins), sans-serif;background:#ffffff0f;border-radius:10px;flex:none;align-items:center;gap:6px;padding:8px 12px;transition:background .2s,color .2s;display:inline-flex}.components-command:hover strong{background:#ffffff1a}.components-command.is-copied{border-color:#2bbf9480}.components-command.is-copied strong{color:#fff;background:var(--cs-brand);box-shadow:inset 0 0 0 1px #2bbf948c,0 0 14px #2bbf942e}.components-next{border:1px solid var(--cs-line-strong);color:#fff;transition:border-color .25s ease, transform .3s var(--cs-ease);background:linear-gradient(120deg,#67e8f914,#ffffff05 45%,#2bbf9414);border-radius:20px;justify-content:space-between;align-items:center;gap:16px;margin-top:40px;padding:22px 24px;text-decoration:none;display:flex}.components-next:hover{border-color:#2bbf9473;transform:translateY(-3px)}.components-next span{font:700 20px/1.1 var(--font-poppins), sans-serif;letter-spacing:-.02em;flex-direction:column;gap:6px;display:flex}.components-next small{color:var(--cs-dim);font:600 10px/1 var(--font-geist-mono), monospace;letter-spacing:.12em;text-transform:uppercase}.components-next em{color:var(--cs-muted);font:500 12px/1 var(--font-geist-mono), monospace;white-space:nowrap;align-items:center;gap:10px;font-style:normal;display:inline-flex}.components-next em svg{color:var(--cs-lime);transition:transform .3s var(--cs-ease)}.components-next:hover em svg{transform:translate(4px)}@keyframes cs-fade-up{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@keyframes cs-fade-in{0%{opacity:0}to{opacity:1}}@keyframes cs-fade-down{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}@keyframes cs-shimmer{to{background-position:-300% 0}}@media (prefers-reduced-motion:reduce){.components-page *,.components-page :before{transition:none!important;animation:none!important}}@media (max-width:760px){.components-window{grid-template-rows:auto minmax(0,1fr);grid-template-columns:1fr}.components-mobile-bar{border-bottom:1px solid var(--cs-line);background:#05070beb;align-items:center;gap:12px;height:58px;padding:0 14px;display:flex}.components-mobile-bar small{color:var(--cs-muted);font:600 10px/1 var(--font-geist-mono), monospace;letter-spacing:.08em;text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap;margin-left:auto;overflow:hidden}.components-mobile-bar .components-brand-mark{width:30px;height:30px}.components-mobile-bar .components-brand-name{font-size:15px}.components-icon-button.components-menu-close{margin-left:auto;display:grid}.components-backdrop{z-index:40;background:#0009;animation:.2s cs-fade-up;display:block;position:fixed;inset:0}.components-sidebar{z-index:50;visibility:hidden;background:var(--cs-panel);width:min(300px,86vw);transition:transform .28s var(--cs-ease), visibility 0s linear .28s;position:fixed;inset:0 auto 0 0;transform:translate(-100%);box-shadow:20px 0 60px #0009}.components-sidebar.is-open{visibility:visible;transition:transform .28s var(--cs-ease);transform:none}.components-brand{height:64px}.components-topbar{display:none}.components-example{scroll-margin-top:16px}.components-example-heading code,.components-viewport{display:none}.components-stage{border-radius:16px;min-height:250px;padding:24px 0}.components-list{gap:48px}.components-command{font-size:11.5px}.components-next span{font-size:17px}}
