:root{--bg: #fafafa;--bg-elevated: #ffffff;--bg-subtle: #f4f4f5;--fg: #18181b;--fg-muted: #71717a;--fg-subtle: #a1a1aa;--border: #e4e4e7;--border-strong: #d4d4d8;--accent: #6366f1;--accent-hover: #4f46e5;--accent-fg: #ffffff;--success: #16a34a;--danger: #dc2626;--warning: #f59e0b;--radius: 8px;--radius-lg: 12px;--shadow-sm: 0 1px 2px rgba(0,0,0,.05), 0 1px 1px rgba(0,0,0,.03);--shadow-md: 0 4px 16px rgba(0,0,0,.07), 0 1px 3px rgba(0,0,0,.04);--shadow-lg: 0 20px 40px -12px rgba(0,0,0,.16);--sidebar-width: 240px;--header-height: 58px}[data-theme=dark]{--bg: #0a0a0b;--bg-elevated: #111113;--bg-subtle: #1c1c1f;--fg: #f4f4f5;--fg-muted: #a1a1aa;--fg-subtle: #52525b;--border: #1f1f23;--border-strong: #2e2e33;--accent: #818cf8;--accent-hover: #a5b4fc;--shadow-md: 0 4px 16px rgba(0,0,0,.4);--shadow-lg: 0 20px 40px -12px rgba(0,0,0,.6)}*,*:before,*:after{box-sizing:border-box}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;overflow-x:hidden}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif;font-size:15px;line-height:1.65;background:var(--bg);color:var(--fg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;transition:background-color .2s ease,color .2s ease;overflow-x:hidden}a{color:var(--accent);text-decoration:none}a:hover{color:var(--accent-hover);text-decoration:underline}h1,h2,h3,h4{margin:0;font-weight:600;letter-spacing:-.02em;line-height:1.25}p{margin:0}pre,code{font-family:JetBrains Mono,ui-monospace,Cascadia Code,monospace;font-size:.85em}pre{background:var(--bg-subtle);border:1px solid var(--border);border-radius:var(--radius);padding:1rem 1.25rem;overflow-x:auto;line-height:1.65}code:not(pre code){background:var(--bg-subtle);border:1px solid var(--border);border-radius:4px;padding:.15em .4em;font-size:.82em;color:var(--fg)}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.badge{display:inline-flex;align-items:center;gap:.3rem;padding:.2rem .6rem;border-radius:999px;font-size:.72rem;font-weight:600;letter-spacing:.03em;text-transform:uppercase}.badge--react{background:#dbeafe;color:#1d4ed8}[data-theme=dark] .badge--react{background:#1e3a5f99;color:#93c5fd}.props-table{width:100%;border-collapse:collapse;font-size:.84rem;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;table-layout:auto;word-break:break-word}.props-table td,.props-table th{word-break:break-word;overflow-wrap:anywhere}.props-table th{text-align:left;padding:.55rem .85rem;background:var(--bg-subtle);border-bottom:1px solid var(--border);font-weight:600;color:var(--fg-subtle);font-size:.72rem;text-transform:uppercase;letter-spacing:.06em}.props-table td{padding:.6rem .85rem;border-bottom:1px solid var(--border);vertical-align:top;line-height:1.5}.props-table tr:last-child td{border-bottom:none}.props-table tr:hover td{background:var(--bg-subtle)}.props-table td:first-child{font-family:JetBrains Mono,monospace;font-size:.78rem;color:var(--accent);white-space:normal;word-break:keep-all}.props-table td:nth-child(2){font-family:JetBrains Mono,monospace;font-size:.75rem;color:var(--fg-muted);max-width:260px}.props-table td:nth-child(3){font-family:JetBrains Mono,monospace;font-size:.75rem;color:var(--fg-subtle);white-space:normal}.heading-anchor{opacity:0;margin-left:.4rem;color:var(--fg-subtle);text-decoration:none;font-weight:400;font-size:.85em;transition:opacity .14s ease}h2:hover .heading-anchor,h3:hover .heading-anchor{opacity:1}.heading-anchor:hover{color:var(--accent)}.demo-box{background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-lg);padding:2rem;display:flex;align-items:center;justify-content:center;min-height:120px;background-image:radial-gradient(circle at 20% 0%,rgba(99,102,241,.06),transparent 50%),radial-gradient(circle at 80% 100%,rgba(236,72,153,.06),transparent 50%)}@media(max-width:480px){.demo-box{padding:1.25rem}}@media(max-width:640px){.props-table{font-size:.8rem}.props-table td,.props-table th{padding:.5rem .6rem}.props-table td:nth-child(2),.props-table td:nth-child(3){font-size:.7rem}pre{padding:.85rem 1rem;font-size:.78em;border-radius:6px}}.main img,.main video,.main iframe{max-width:100%;height:auto}.pp{border:1px solid var(--border);border-radius:12px;overflow:clip;background:var(--bg-elevated)}.pp__top{display:grid;grid-template-columns:1fr 1fr;min-height:240px}@media(max-width:860px){.pp__top{grid-template-columns:1fr}}.pp__preview{display:flex;align-items:center;justify-content:center;padding:2rem 1.5rem;background:radial-gradient(circle at 30% 30%,color-mix(in srgb,var(--accent) 6%,transparent),transparent 70%),var(--bg-subtle);overflow-x:auto;min-width:0;position:sticky;top:calc(var(--header-height) + .5rem);align-self:start;min-height:240px}@media(max-width:860px){.pp__preview{position:static;border-bottom:1px solid var(--border)}.pp__controls{border-left:none}}.pp[data-layout=stacked] .pp__top{grid-template-columns:1fr;min-height:0}.pp[data-layout=stacked] .pp__preview{position:static;align-self:auto;border-right:none;border-bottom:1px solid var(--border);align-items:flex-start;justify-content:flex-start;min-height:280px;padding:1.5rem}.pp[data-layout=stacked] .pp__controls{border-top:none;border-left:none}.pp[data-layout=stacked] .pp__controls-body{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,220px));gap:.85rem 1.75rem;padding:1rem 1.25rem;align-items:start}.pp[data-layout=stacked] .pp__field:has(.rsw-root){flex-direction:row;align-items:center;justify-content:space-between;gap:.5rem}.pp__controls--hidden,.pp__stacked-bar{display:none}.pp[data-layout=stacked] .pp__stacked-bar{display:flex;align-items:center;gap:.5rem;padding:.45rem 1rem;border-bottom:1px solid var(--border);background:var(--bg-subtle)}.pp__stacked-toggle{display:inline-flex;align-items:center;gap:.4rem;font-size:.78rem;font-weight:500;color:var(--fg-muted);background:transparent;border:none;cursor:pointer;padding:.2rem .4rem;border-radius:4px;transition:color .14s ease,background .14s ease}.pp__stacked-toggle:hover{color:var(--fg);background:var(--bg-elevated)}.pp__stacked-chevron{transition:transform .2s cubic-bezier(.32,.72,0,1)}.pp__stacked-chevron[data-open=true]{transform:rotate(180deg)}.pp__reset--inline{margin-left:auto;font-size:.72rem;font-weight:500;color:var(--fg-subtle);background:transparent;border:1px solid var(--border);border-radius:4px;padding:2px 8px;cursor:pointer;transition:color .14s ease,border-color .14s ease}.pp__reset--inline:hover{color:var(--fg);border-color:var(--border-strong)}@media(max-width:480px){.pp__preview{padding:1.25rem .85rem}.pp__controls-body{padding:.65rem .85rem;gap:.7rem}.pp__code-header{padding:.4rem .85rem}.pp-code{padding:.85rem 1rem;font-size:.74rem}}.pp__controls{display:flex;flex-direction:column;background:var(--bg-elevated);min-width:0;border-left:1px solid var(--border)}.pp__controls-scroll{position:relative;flex:1;overflow-y:auto;max-height:480px;scrollbar-width:thin;scrollbar-color:transparent transparent;transition:scrollbar-color .2s ease}.pp__controls-scroll:hover{scrollbar-color:var(--border) transparent}.pp__controls-fade{position:sticky;bottom:0;left:0;right:0;display:block;height:48px;margin-top:-48px;background:linear-gradient(to bottom,transparent,var(--bg-elevated) 85%);pointer-events:none}.pp__controls-header{display:flex;align-items:center;justify-content:space-between;padding:.5rem 1rem;background:var(--bg-subtle);border-bottom:1px solid var(--border);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--fg-subtle)}.pp__reset{font:inherit;font-size:11px;font-weight:600;letter-spacing:.04em;padding:2px 8px;border-radius:4px;border:1px solid var(--border);background:var(--bg-elevated);color:var(--fg-muted);cursor:pointer;text-transform:uppercase;transition:color .14s,background .14s,border-color .14s}.pp__reset:disabled{opacity:.4;cursor:not-allowed}.pp__reset:not(:disabled):hover{color:var(--accent);border-color:var(--accent)}.pp__controls-body{padding:.85rem 1rem;display:flex;flex-direction:column;gap:.85rem}.pp__controls-tabs{--rtab-fg: var(--fg);--rtab-fg-muted: var(--fg-muted);--rtab-fg-active: var(--accent);--rtab-fg-inactive: var(--fg-muted);--rtab-bg-indicator: var(--accent);--rtab-border-list: var(--border);--rtab-tab-padding-x: .7rem;--rtab-tab-padding-y: .45rem;--rtab-font-size: .76rem;padding:.5rem .5rem 0}.pp__controls-tabs .rtab-panel{padding:0}.pp__field{display:flex;flex-direction:column;gap:5px}.pp__field-label{font-size:12px;font-family:JetBrains Mono,monospace;color:var(--fg-muted)}.pp__field-name{color:var(--fg)}.pp__group-header{grid-column:1 / -1;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--fg-subtle);padding:.5rem 0 .2rem;border-bottom:1px solid var(--border);margin-top:.15rem}.pp-segmented{display:flex;flex-wrap:wrap;gap:2px;padding:2px;background:var(--bg-subtle);border:1px solid var(--border);border-radius:7px;max-width:100%;overflow:hidden}.pp-segmented input[type=radio]{position:absolute;opacity:0;pointer-events:none;width:0;height:0}.pp-segmented__option{font:inherit;font-size:11.5px;font-weight:500;padding:4px 9px;border:none;border-radius:5px;background:transparent;color:var(--fg-muted);cursor:pointer;text-transform:capitalize;transition:background .14s,color .14s;user-select:none}.pp-segmented__option:hover{color:var(--fg)}.pp-segmented__option--active{background:var(--bg-elevated);color:var(--fg);box-shadow:var(--shadow-sm)}.pp-toggle{width:36px;height:20px;border-radius:999px;border:none;background:var(--border-strong);cursor:pointer;padding:0;position:relative;transition:background .16s ease;align-self:flex-start}.pp-toggle__thumb{position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0003;transition:left .18s cubic-bezier(.34,1.56,.64,1)}.pp-toggle[aria-checked=true],.pp-toggle[data-on=true]{background:var(--accent)}.pp-toggle[aria-checked=true] .pp-toggle__thumb,.pp-toggle[data-on=true] .pp-toggle__thumb{left:18px}.pp-text,.pp-select{font:inherit;font-size:12px;padding:5px 8px;border-radius:6px;border:1px solid var(--border);background:var(--bg-subtle);color:var(--fg);outline:none;transition:border-color .14s ease}.pp-text:focus,.pp-select:focus{border-color:var(--accent);background:var(--bg-elevated)}.pp-color{width:36px;height:28px;padding:2px;border:1px solid var(--border);border-radius:6px;cursor:pointer;background:var(--bg-subtle);align-self:flex-start}.pp-slider-row{display:flex;align-items:center;gap:8px}.pp-slider-row input[type=range]{flex:1;accent-color:var(--accent)}.pp-slider-value{font-size:11px;font-family:JetBrains Mono,monospace;color:var(--fg-muted);min-width:30px;text-align:right;padding:1px 6px;border-radius:4px;background:var(--bg-subtle)}.pp__code-wrap{border-top:1px solid var(--border);background:#0d0d0f}.pp__code-header{display:flex;align-items:center;justify-content:space-between;padding:.45rem 1rem;border-bottom:1px solid rgba(255,255,255,.07);background:#0d0d0f}.pp__code-header-left{display:flex;align-items:center;gap:.5rem}.pp__code-lang{font-size:10px;font-weight:600;font-family:JetBrains Mono,monospace;letter-spacing:.06em;text-transform:uppercase;color:#ffffff40}.pp__copy{font:inherit;font-size:11px;font-weight:500;padding:3px 10px;border-radius:5px;border:1px solid rgba(255,255,255,.1);background:#ffffff0f;color:#ffffff73;cursor:pointer;transition:background .14s ease,color .14s ease,border-color .14s ease;letter-spacing:.02em}.pp__copy:hover{background:#ffffff1a;color:#ffffffbf;border-color:#ffffff2e}.pp-code{margin:0;padding:1.1rem 1.25rem;font-size:.79rem;line-height:1.75;font-family:JetBrains Mono,ui-monospace,monospace;overflow-x:auto;background:#0d0d0f;border:none;border-radius:0;white-space:pre;--tok-keyword: #c084fc;--tok-comp: #93c5fd;--tok-tag-punct: #6b7280;--tok-attr: #fdba74;--tok-string: #86efac;--tok-number: #67e8f9;--tok-boolean: #67e8f9;--tok-comment: #4b5563;--tok-expr: #fcd34d;--tok-plain: #e2e8f0}.pp-code .tok-keyword{color:var(--tok-keyword)}.pp-code .tok-comp{color:var(--tok-comp)}.pp-code .tok-tag-punct{color:var(--tok-tag-punct)}.pp-code .tok-attr{color:var(--tok-attr)}.pp-code .tok-string{color:var(--tok-string)}.pp-code .tok-number{color:var(--tok-number)}.pp-code .tok-boolean{color:var(--tok-boolean)}.pp-code .tok-comment{color:var(--tok-comment);font-style:italic}.pp-code .tok-expr{color:var(--tok-expr)}.pp-code .tok-plain{color:var(--tok-plain)}.header[data-astro-cid-3ef6ksr2]{position:fixed;top:0;left:0;right:0;height:var(--header-height);background:color-mix(in srgb,var(--bg) 80%,transparent);backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%);border-bottom:1px solid var(--border);z-index:100;padding-top:env(safe-area-inset-top,0px);padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}.header__inner[data-astro-cid-3ef6ksr2]{max-width:1400px;margin:0 auto;height:100%;padding:0 1.5rem;display:flex;align-items:center;justify-content:space-between;gap:.75rem;min-width:0}@media(max-width:640px){.header__inner[data-astro-cid-3ef6ksr2]{padding:0 .85rem}}.header__left[data-astro-cid-3ef6ksr2]{display:flex;align-items:center;gap:.6rem;min-width:0;flex:1 1 auto;overflow:hidden}.header__logo[data-astro-cid-3ef6ksr2]{display:flex;align-items:center;gap:.5rem;text-decoration:none;min-width:0;overflow:hidden}.header__logo[data-astro-cid-3ef6ksr2]:hover{text-decoration:none}.header__logo-icon[data-astro-cid-3ef6ksr2]{display:flex;align-items:center;flex-shrink:0}.header__logo-text[data-astro-cid-3ef6ksr2]{font-weight:600;font-size:.9rem;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.header__logo-scope[data-astro-cid-3ef6ksr2]{color:var(--accent)}.header__logo-slash[data-astro-cid-3ef6ksr2]{color:var(--fg-subtle);margin:0 1px}.header__logo-name[data-astro-cid-3ef6ksr2]{color:var(--fg-muted)}@media(max-width:480px){.header__logo-scope[data-astro-cid-3ef6ksr2],.header__logo-slash[data-astro-cid-3ef6ksr2]{display:none}.header__logo-text[data-astro-cid-3ef6ksr2]{font-size:.85rem}}.header__nav[data-astro-cid-3ef6ksr2]{display:flex;align-items:center;gap:.25rem;flex-shrink:0}.header__divider[data-astro-cid-3ef6ksr2]{width:1px;height:18px;background:var(--border);margin:0 .25rem}.header__link[data-astro-cid-3ef6ksr2]{display:inline-flex;align-items:center;gap:.4rem;padding:.4rem .65rem;border-radius:var(--radius);color:var(--fg-muted);font-size:.84rem;font-weight:500;text-decoration:none;transition:color .14s ease,background .14s ease}.header__link[data-astro-cid-3ef6ksr2]:hover{color:var(--fg);background:var(--bg-subtle);text-decoration:none}.header__link-label[data-astro-cid-3ef6ksr2]{display:none}@media(min-width:480px){.header__link-label[data-astro-cid-3ef6ksr2]{display:inline}}.header__theme-toggle[data-astro-cid-3ef6ksr2]{width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius);border:1px solid var(--border);background:transparent;color:var(--fg-muted);cursor:pointer;transition:color .14s ease,background .14s ease,border-color .14s ease}.header__theme-toggle[data-astro-cid-3ef6ksr2]:hover{color:var(--fg);background:var(--bg-subtle);border-color:var(--border-strong)}:root[data-theme=dark] .icon-sun[data-astro-cid-3ef6ksr2]{display:block}:root[data-theme=dark] .icon-moon[data-astro-cid-3ef6ksr2]{display:none}:root:not([data-theme=dark]) .icon-sun[data-astro-cid-3ef6ksr2]{display:none}:root:not([data-theme=dark]) .icon-moon[data-astro-cid-3ef6ksr2]{display:block}