:root{--doc-bg: #263238;--doc-surface: #2c393f;--doc-surface-2: #31424a;--doc-border: #37474f;--doc-text: #c4dae3;--doc-muted: #93acb8;--doc-title: #cfd8dc;--doc-accent: #80cbc4;--doc-accent-2: #80cbc4;--doc-code-bg: #263238;--doc-scrollbar: #546e7a;--doc-max: 1180px;--doc-sidebar: 240px}*{box-sizing:border-box}*{scrollbar-width:thin;scrollbar-color:var(--doc-scrollbar) transparent}*::-webkit-scrollbar{width:10px;height:10px}*::-webkit-scrollbar-track{background:transparent}*::-webkit-scrollbar-thumb{background:var(--doc-scrollbar);border-radius:999px;border:2px solid transparent;background-clip:padding-box}*::-webkit-scrollbar-thumb:hover{background:var(--doc-accent);background-clip:padding-box}html{scroll-behavior:smooth;scroll-padding-top:80px}body{margin:0;background:var(--doc-bg);color:var(--doc-text);font:16px/1.65 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;overflow-x:hidden}a{color:var(--doc-accent-2)}.skip-link{position:absolute;left:-999px;top:0;background:var(--doc-accent);color:#fff;padding:10px 16px;z-index:100;border-radius:0 0 8px}.skip-link:focus{left:0}.topbar{position:sticky;top:0;z-index:50;background:#263238d9;backdrop-filter:blur(8px);border-bottom:1px solid var(--doc-border)}.topbar-inner{max-width:var(--doc-max);margin:0 auto;display:flex;align-items:center;gap:16px;padding:12px 20px}.brand{font-weight:700;font-size:1.1rem;color:var(--doc-text);text-decoration:none}.brand span{color:var(--doc-muted);font-weight:400}.topbar-links{margin-left:auto;display:flex;gap:16px}.nav-toggle{display:none}.layout{max-width:var(--doc-max);margin:0 auto;display:grid;grid-template-columns:var(--doc-sidebar) 1fr;gap:32px;padding:0 20px}.sidebar{position:sticky;top:64px;align-self:start;height:calc(100vh - 80px);overflow-y:auto;padding:24px 0}.sidebar ul{list-style:none;margin:0;padding:0}.sidebar a{display:block;padding:6px 12px;color:var(--doc-muted);text-decoration:none;border-left:2px solid transparent;font-size:.92rem}.sidebar a:hover{color:var(--doc-text)}.sidebar a.is-active{color:var(--doc-text);border-left-color:var(--doc-accent);background:var(--doc-surface)}.sidebar .nav-group{margin-top:10px}.sidebar .nav-group a{color:var(--doc-text);font-size:.74rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;opacity:.85}.content{padding:24px 0 80px;min-width:0}.content:focus{outline:none}.hero{padding:32px 0 8px}.hero h1{font-size:clamp(2.2rem,5vw,3.2rem);margin:0 0 8px;color:var(--doc-title);font-weight:700;letter-spacing:-.01em}.hero p{max-width:60ch;color:var(--doc-text);font-size:1.05rem}h2{margin-top:56px;padding-top:12px;border-top:1px solid var(--doc-border);font-size:1.6rem;color:var(--doc-title)}h3{margin-top:32px;font-size:1.2rem;color:var(--doc-title)}.anchor{opacity:0;text-decoration:none;color:var(--doc-accent);margin-left:6px}h2:hover .anchor,h3:hover .anchor{opacity:1}code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.88em;background:var(--doc-surface-2);padding:2px 6px;border-radius:5px}pre{background:var(--doc-code-bg);border:1px solid var(--doc-border);border-radius:10px;padding:16px;overflow-x:auto}pre code{background:none;padding:0;font-size:.85rem;line-height:1.6}.code-block{position:relative;margin:16px 0}.code-block pre{margin:0}.code-block pre code.hljs{background:transparent;padding:0}.copy-btn{position:absolute;top:10px;right:10px;display:inline-flex;align-items:center;gap:6px;padding:5px 10px;font-size:.74rem;font-family:inherit;color:var(--doc-muted);background:#141821d9;border:1px solid var(--doc-border);border-radius:7px;cursor:pointer;opacity:0;transition:opacity .15s ease,color .15s ease,border-color .15s ease}.code-block:hover .copy-btn,.copy-btn:focus-visible{opacity:1}.copy-btn:hover{color:var(--doc-text);border-color:var(--doc-accent)}.copy-btn.is-copied{color:#34d399;border-color:#34d399;opacity:1}.copy-btn svg{display:block}@media(hover:none){.copy-btn{opacity:1}}.btn-run{display:inline-flex;align-items:center;gap:6px}.btn-run svg{display:block}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;font-size:.92rem}th,td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--doc-border);vertical-align:top}th{color:var(--doc-title);background:var(--doc-surface)}td{color:var(--doc-text)}td:first-child{color:var(--doc-title)}tbody tr{transition:background .15s ease}tbody tr:hover{background:#80cbc40f}.opt-group th{color:var(--doc-accent);background:var(--doc-bg);font-size:.74rem;font-weight:700;text-transform:uppercase;letter-spacing:.09em;border-bottom:1px solid var(--doc-border)}.opt-group:hover{background:none}.opt-tablist{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px;border-bottom:1px solid var(--doc-border)}.opt-tab{appearance:none;border:0;background:none;cursor:pointer;padding:8px 14px;margin-bottom:-1px;font:inherit;font-size:.82rem;font-weight:600;color:var(--doc-text);border-bottom:2px solid transparent;border-radius:6px 6px 0 0;transition:color .15s ease,background .15s ease,border-color .15s ease}.opt-tab:hover{color:var(--doc-accent);border-bottom-color:var(--doc-accent)}.opt-tab.is-active{color:var(--doc-title);background:#80cbc40f;border-bottom-color:var(--doc-accent)}.opt-tab:focus-visible{outline:2px solid var(--doc-accent);outline-offset:2px}.opt-panel[hidden]{display:none}.example{margin-top:40px;padding:20px;background:var(--doc-surface);border:1px solid var(--doc-border);border-radius:14px;margin-right:calc(-1*max((100vw - var(--doc-max)) / 2,0px))}.example-category{margin-top:52px;padding-bottom:4px;border-bottom:1px solid var(--doc-border)}.example-category-title{margin:0;font-size:.82rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--doc-accent)}.example-category-blurb{margin:6px 0 0;color:var(--doc-muted);font-size:.92rem}.example-category+.example{margin-top:20px}.example-grid{display:grid;grid-template-columns:minmax(0,.68fr) minmax(0,1.32fr);gap:20px;align-items:start}.example-editor{display:flex;flex-direction:column;min-width:0}.example-editor label,.output-label{display:block;font-size:.82rem;color:var(--doc-muted);margin-bottom:6px}.output-label em{color:var(--doc-muted);opacity:.8;font-style:normal}textarea{width:100%;flex:1 1 auto;min-height:340px;background:var(--doc-code-bg);color:var(--doc-text);border:1px solid var(--doc-border);border-radius:10px;padding:14px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.82rem;line-height:1.55;resize:vertical}textarea:focus,input:focus,button:focus-visible{outline:2px solid var(--doc-accent);outline-offset:1px}.code-editor{position:relative;background:var(--doc-code-bg);border:1px solid var(--doc-border);border-radius:10px;overflow:hidden}.code-editor-highlight,.code-editor textarea{margin:0;border:0;padding:14px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.82rem;line-height:1.55;tab-size:4;white-space:pre;box-sizing:border-box}.code-editor-highlight{position:relative;background:transparent;overflow:hidden;min-height:3em}.code-editor-highlight code.hljs{display:block;background:transparent;padding:0;font:inherit}.code-editor textarea{position:absolute;inset:0;width:100%;height:100%;min-height:0;background:transparent;color:transparent;caret-color:var(--doc-text);-webkit-text-fill-color:transparent;resize:none;overflow-x:auto;overflow-y:hidden;border-radius:10px}.code-editor:focus-within{outline:2px solid var(--doc-accent);outline-offset:1px}.code-editor textarea:focus{outline:none}.example-editor.is-collapsible:not(.is-expanded) .code-editor{max-height:var(--code-clamp, 440px)}.example-editor.is-collapsible:not(.is-expanded) .code-editor:after{content:"";position:absolute;left:0;right:0;bottom:0;height:52px;pointer-events:none;background:linear-gradient(to bottom,transparent,var(--doc-code-bg))}.code-toggle{align-self:flex-start;margin-top:10px;font-size:.82rem;padding:6px 12px}.theme-output{min-height:0}.html-example-editors{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}.html-example .example-editor label em{color:var(--doc-muted);opacity:.8;font-style:normal}.html-example-preview{margin-top:4px}.example-toolbar{display:flex;align-items:center;gap:10px;margin:4px 0 16px}button{background:var(--doc-surface-2);color:var(--doc-text);border:1px solid var(--doc-border);border-radius:8px;padding:8px 14px;font-size:.88rem;cursor:pointer}button:hover{border-color:var(--doc-accent)}[data-run]{background:var(--doc-accent);border-color:var(--doc-accent);color:#fff}.status{font-size:.82rem}.status--ok{color:#4ade80}.status--error{color:#f87171}.example-preview{min-width:0;display:flex;flex-direction:column}.preview-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.preview-presets{display:inline-flex;gap:4px;padding:4px;background:var(--doc-surface-2);border:1px solid var(--doc-border);border-radius:10px}.preview-presets button{background:none;border:0;color:var(--doc-muted);font-size:.8rem;padding:6px 14px;border-radius:7px}.preview-presets button:hover{border-color:transparent;color:var(--doc-text)}.preview-presets button.is-active{background:var(--doc-accent);color:#fff}.preview-size{font-size:.78rem;color:var(--doc-muted);font-variant-numeric:tabular-nums;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.preview-shell{display:flex;justify-content:flex-start}.preview-frame{position:relative;width:100%;max-width:100%;height:440px;background:#f6f7fb;border-radius:12px;border:1px solid var(--doc-border);overflow:hidden;box-shadow:0 24px 60px -34px #000000d9;transition:width .18s ease}.preview-frame.is-dragging{transition:none;user-select:none}.preview-frame.is-tall{height:600px}.preview-frame iframe{width:100%;height:100%;border:0;display:block;background:#f6f7fb}.preview-surface{background:#fff;border-radius:12px;border:1px solid var(--doc-border);min-height:340px;padding-bottom:40px;overflow:visible;position:relative;box-shadow:0 24px 60px -34px #000000d9;contain:layout}.preview-handle{position:absolute;top:0;right:0;height:100%;width:22px;display:flex;align-items:center;justify-content:center;background:none;border:0;cursor:ew-resize;touch-action:none;z-index:3}.preview-handle span{width:7px;height:52px;border-radius:999px;background:var(--doc-scrollbar);box-shadow:0 0 0 4px #2632388c;transition:background .15s ease,height .15s ease}.preview-handle:hover span,.preview-frame.is-dragging .preview-handle span{background:var(--doc-accent);height:64px}.preview-menu{color:#222}.example-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.note{font-size:.82rem;color:var(--doc-muted);margin-top:10px}.playground-controls{display:flex;flex-direction:column;gap:14px}.control{display:grid;gap:4px}.control label{font-size:.85rem;display:flex;justify-content:space-between;gap:8px}.control label code{font-size:.72rem;color:var(--doc-muted)}.control-input{display:flex;align-items:center;gap:10px}.control-input input[type=range]{flex:1}.control-input input[type=color]{width:48px;height:32px;padding:0;border:1px solid var(--doc-border);border-radius:6px;background:none}.control-input output{min-width:52px;font-size:.8rem;color:var(--doc-muted);text-align:right}.docs-footer{margin-top:64px;padding-top:20px;border-top:1px solid var(--doc-border);color:var(--doc-muted);font-size:.88rem}@media(max-width:900px){.layout{grid-template-columns:1fr}.nav-toggle{display:inline-block;margin-left:auto}.topbar-links{margin-left:0}.sidebar{position:fixed;inset:56px 0 auto;height:auto;max-height:70vh;background:var(--doc-surface);border-bottom:1px solid var(--doc-border);padding:12px 20px;transform:translateY(-120%);transition:transform .2s ease;z-index:40}.sidebar.is-open{transform:translateY(0)}.example-grid,.html-example-editors{grid-template-columns:1fr}textarea{min-height:200px}.preview-frame{width:100%!important}.preview-handle{display:none}}