:root,[data-theme=light]{--md-sys-color-primary: #6750A4;--md-sys-color-on-primary: #FFFFFF;--md-sys-color-primary-container: #EADDFF;--md-sys-color-on-primary-container: #21005D;--md-sys-color-secondary: #625B71;--md-sys-color-on-secondary: #FFFFFF;--md-sys-color-secondary-container: #E8DEF8;--md-sys-color-on-secondary-container: #1D192B;--md-sys-color-tertiary: #7D5260;--md-sys-color-on-tertiary: #FFFFFF;--md-sys-color-tertiary-container: #FFD8E4;--md-sys-color-on-tertiary-container: #31111D;--md-sys-color-error: #B3261E;--md-sys-color-on-error: #FFFFFF;--md-sys-color-error-container: #F9DEDC;--md-sys-color-on-error-container: #410E0B;--md-sys-color-background: #FEF7FF;--md-sys-color-on-background: #1D1B20;--md-sys-color-surface: #FEF7FF;--md-sys-color-on-surface: #1D1B20;--md-sys-color-surface-variant: #E7E0EC;--md-sys-color-on-surface-variant: #49454F;--md-sys-color-outline: #79747E;--md-sys-color-outline-variant: #CAC4D0;--md-sys-color-surface-container-lowest: #FFFFFF;--md-sys-color-surface-container-low: #F7F2FA;--md-sys-color-surface-container: #F3EDF7;--md-sys-color-surface-container-high: #ECE6F0;--md-sys-color-surface-container-highest: #E6E0E9;--md-sys-color-inverse-surface: #313033;--md-sys-color-inverse-on-surface: #F4EFF4;--md-sys-color-inverse-primary: #D0BCFF;--md-sys-elevation-1: 0px 1px 3px 1px rgba(0, 0, 0, .15), 0px 1px 2px 0px rgba(0, 0, 0, .3);--md-sys-elevation-2: 0px 2px 6px 2px rgba(0, 0, 0, .15), 0px 1px 2px 0px rgba(0, 0, 0, .3);--md-sys-elevation-3: 0px 4px 8px 3px rgba(0, 0, 0, .15), 0px 1px 3px 0px rgba(0, 0, 0, .3);--md-sys-elevation-4: 0px 6px 10px 4px rgba(0, 0, 0, .15), 0px 2px 3px 0px rgba(0, 0, 0, .3);--md-sys-elevation-5: 0px 8px 12px 6px rgba(0, 0, 0, .15), 0px 4px 4px 0px rgba(0, 0, 0, .3);--md-shape-corner-xs: 4px;--md-shape-corner-sm: 8px;--md-shape-corner-md: 12px;--md-shape-corner-lg: 16px;--md-shape-corner-xl: 28px;--md-shape-corner-full: 9999px;--font-family-body: "Roboto Flex", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-family-code: "Fira Code", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;--topbar-height: 64px;--sidebar-width: 280px}[data-theme=dark]{--md-sys-color-primary: #D0BCFF;--md-sys-color-on-primary: #381E72;--md-sys-color-primary-container: #4F378B;--md-sys-color-on-primary-container: #EADDFF;--md-sys-color-secondary: #CCC2DC;--md-sys-color-on-secondary: #332D41;--md-sys-color-secondary-container: #4A4458;--md-sys-color-on-secondary-container: #E8DEF8;--md-sys-color-tertiary: #EFB8C8;--md-sys-color-on-tertiary: #492532;--md-sys-color-tertiary-container: #633B48;--md-sys-color-on-tertiary-container: #FFD8E4;--md-sys-color-error: #F2B8B5;--md-sys-color-on-error: #601410;--md-sys-color-error-container: #8C1D18;--md-sys-color-on-error-container: #F9DEDC;--md-sys-color-background: #141218;--md-sys-color-on-background: #E6E0E9;--md-sys-color-surface: #141218;--md-sys-color-on-surface: #E6E0E9;--md-sys-color-surface-variant: #49454F;--md-sys-color-on-surface-variant: #CAC4D0;--md-sys-color-outline: #938F99;--md-sys-color-outline-variant: #49454F;--md-sys-color-surface-container-lowest: #0F0D13;--md-sys-color-surface-container-low: #1D1B20;--md-sys-color-surface-container: #211F26;--md-sys-color-surface-container-high: #2B2930;--md-sys-color-surface-container-highest: #36343B;--md-sys-color-inverse-surface: #E6E0E9;--md-sys-color-inverse-on-surface: #313033;--md-sys-color-inverse-primary: #6750A4;--md-sys-elevation-1: 0px 1px 3px 1px rgba(0, 0, 0, .4), 0px 1px 2px 0px rgba(0, 0, 0, .6);--md-sys-elevation-2: 0px 2px 6px 2px rgba(0, 0, 0, .4), 0px 1px 2px 0px rgba(0, 0, 0, .6);--md-sys-elevation-3: 0px 4px 8px 3px rgba(0, 0, 0, .4), 0px 1px 3px 0px rgba(0, 0, 0, .6);--md-sys-elevation-4: 0px 6px 10px 4px rgba(0, 0, 0, .4), 0px 2px 3px 0px rgba(0, 0, 0, .6);--md-sys-elevation-5: 0px 8px 12px 6px rgba(0, 0, 0, .4), 0px 4px 4px 0px rgba(0, 0, 0, .6)}*{box-sizing:border-box;margin:0;padding:0}button,input,select,textarea{font-family:inherit;color:inherit}.material-symbols-outlined{font-family:Material Symbols Outlined;font-weight:400;font-style:normal;font-size:24px;line-height:1;display:inline-block;white-space:nowrap;vertical-align:middle;-webkit-font-smoothing:antialiased}body{font-family:var(--font-family-body);background-color:var(--md-sys-color-surface);color:var(--md-sys-color-on-surface);line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;transition:background-color .25s ease,color .25s ease}.app-container{display:flex;flex-direction:column;min-height:100vh}.top-app-bar{position:sticky;top:0;z-index:50;height:var(--topbar-height);background-color:var(--md-sys-color-surface-container);border-bottom:1px solid var(--md-sys-color-outline-variant);display:flex;align-items:center;justify-content:space-between;padding:0 24px;transition:background-color .2s ease}.top-bar-left{display:flex;align-items:center;gap:16px}.brand-link{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--md-sys-color-on-surface)}.brand-logo-icon{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,#6750a4,#d0bcff);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:18px;box-shadow:var(--md-sys-elevation-1)}.brand-title{font-size:20px;font-weight:600;letter-spacing:-.3px}.version-badge{font-size:12px;font-weight:500;padding:2px 8px;border-radius:var(--md-shape-corner-full);background-color:var(--md-sys-color-primary-container);color:var(--md-sys-color-on-primary-container)}.top-bar-search{flex:1;max-width:480px;margin:0 32px;position:relative}.search-input-wrapper{display:flex;align-items:center;background-color:var(--md-sys-color-surface-container-high);border:1px solid transparent;border-radius:var(--md-shape-corner-full);padding:8px 16px;transition:all .2s ease;cursor:pointer}.search-input-wrapper:focus-within,.search-input-wrapper:hover{background-color:var(--md-sys-color-surface-container-highest);border-color:var(--md-sys-color-outline-variant)}.search-input{border:none;background:transparent;outline:none;width:100%;margin-left:10px;font-size:14px;color:var(--md-sys-color-on-surface);font-family:inherit}.search-shortcut{font-size:11px;padding:3px 8px;border-radius:6px;background-color:var(--md-sys-color-surface-container-highest);color:var(--md-sys-color-outline);font-weight:600;white-space:nowrap;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--md-sys-color-outline-variant);line-height:1;letter-spacing:.3px;-webkit-user-select:none;user-select:none}.top-bar-actions{display:flex;align-items:center;gap:8px}.lang-toggle-btn{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 12px;border-radius:var(--md-shape-corner-full);border:1px solid var(--md-sys-color-outline-variant);background:var(--md-sys-color-surface-container-high);color:var(--md-sys-color-on-surface);font-size:13px;cursor:pointer;transition:all .2s cubic-bezier(.2,0,0,1);-webkit-user-select:none;user-select:none}.lang-toggle-btn:hover{background:var(--md-sys-color-surface-container-highest);border-color:var(--md-sys-color-primary);color:var(--md-sys-color-primary)}.icon-button{width:40px;height:40px;border-radius:var(--md-shape-corner-full);border:none;background:transparent;color:var(--md-sys-color-on-surface-variant);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color .15s ease,color .15s ease}.icon-button:hover{background-color:var(--md-sys-color-surface-container-highest);color:var(--md-sys-color-on-surface)}.main-layout{display:flex;flex:1}.sidebar{width:var(--sidebar-width);height:calc(100vh - var(--topbar-height));position:sticky;top:var(--topbar-height);background-color:var(--md-sys-color-surface-container-low);border-right:1px solid var(--md-sys-color-outline-variant);overflow-y:auto;padding:16px 12px;scrollbar-width:thin}.nav-section-title{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:var(--md-sys-color-on-surface-variant);padding:12px 16px 6px}.nav-item{display:flex;align-items:center;gap:12px;width:100%;padding:10px 16px;margin-bottom:2px;border-radius:var(--md-shape-corner-full);font-size:14px;font-weight:500;color:var(--md-sys-color-on-surface-variant);text-decoration:none;cursor:pointer;border:none;background:transparent;text-align:left;transition:all .15s ease}.nav-item:hover{background-color:var(--md-sys-color-surface-container-high);color:var(--md-sys-color-on-surface)}.nav-item.active{background-color:var(--md-sys-color-secondary-container);color:var(--md-sys-color-on-secondary-container);font-weight:600}.nav-item-badge{margin-left:auto;font-size:11px;padding:1px 6px;border-radius:var(--md-shape-corner-full);background-color:var(--md-sys-color-primary-container);color:var(--md-sys-color-on-primary-container)}.content-area{flex:1;max-width:1040px;margin:0 auto;padding:40px 48px 80px;min-width:0}.doc-header{margin-bottom:24px}.doc-tag{display:inline-block;font-size:13px;font-weight:600;padding:4px 12px;border-radius:var(--md-shape-corner-full);background-color:var(--md-sys-color-surface-container-high);color:var(--md-sys-color-primary);margin-bottom:12px}.doc-title{font-size:40px;font-weight:700;letter-spacing:-.8px;color:var(--md-sys-color-on-surface);margin-bottom:12px}.doc-description{font-size:17px;color:var(--md-sys-color-on-surface-variant);max-width:780px;line-height:1.6}.m3-tabs-container{display:flex;gap:8px;border-bottom:1px solid var(--md-sys-color-outline-variant);margin:28px 0 36px;position:relative}.m3-tab-button{padding:12px 20px;font-size:15px;font-weight:500;color:var(--md-sys-color-on-surface-variant);background:transparent;border:none;cursor:pointer;position:relative;transition:color .15s ease}.m3-tab-button:hover{color:var(--md-sys-color-on-surface)}.m3-tab-button.active{color:var(--md-sys-color-primary);font-weight:600}.m3-tab-button.active:after{content:"";position:absolute;bottom:-1px;left:0;right:0;height:3px;background-color:var(--md-sys-color-primary);border-radius:3px 3px 0 0}.playground-card{background-color:var(--md-sys-color-surface-container-low);border:1px solid var(--md-sys-color-outline-variant);border-radius:var(--md-shape-corner-xl);overflow:hidden;margin-bottom:36px;box-shadow:var(--md-sys-elevation-1)}.playground-preview-header{padding:14px 24px;background-color:var(--md-sys-color-surface-container);border-bottom:1px solid var(--md-sys-color-outline-variant);display:flex;align-items:center;justify-content:space-between}.playground-title{font-size:13px;font-weight:600;letter-spacing:.5px;text-transform:uppercase;color:var(--md-sys-color-on-surface-variant)}.playground-body{padding:40px 24px;display:flex;align-items:center;justify-content:center;min-height:220px;background:repeating-linear-gradient(45deg,rgba(103,80,164,.03),rgba(103,80,164,.03) 10px,transparent 10px,transparent 20px)}.playground-controls{padding:18px 24px;background-color:var(--md-sys-color-surface-container);border-top:1px solid var(--md-sys-color-outline-variant);display:flex;flex-wrap:wrap;gap:16px;align-items:center}.control-group{display:flex;align-items:center;gap:8px}.control-label{font-size:13px;font-weight:500;color:var(--md-sys-color-on-surface-variant)}.m3-select{padding:6px 12px;border-radius:var(--md-shape-corner-sm);background-color:var(--md-sys-color-surface-container-highest);border:1px solid var(--md-sys-color-outline-variant);color:var(--md-sys-color-on-surface);font-size:13px;outline:none}.code-box{background-color:var(--md-sys-color-surface-container-lowest);border:1px solid var(--md-sys-color-outline-variant);border-radius:var(--md-shape-corner-md);margin:16px 0 28px;overflow:hidden}.code-box-header{padding:10px 16px;background-color:var(--md-sys-color-surface-container);border-bottom:1px solid var(--md-sys-color-outline-variant);display:flex;align-items:center;justify-content:space-between}.code-box-lang{font-size:12px;font-weight:600;color:var(--md-sys-color-on-surface-variant)}.copy-btn{display:flex;align-items:center;gap:6px;background:transparent;border:1px solid var(--md-sys-color-outline-variant);border-radius:var(--md-shape-corner-full);padding:4px 12px;font-size:12px;color:var(--md-sys-color-on-surface);cursor:pointer;transition:all .15s ease}.copy-btn:hover{background-color:var(--md-sys-color-surface-container-highest)}.code-box-pre{padding:18px;margin:0;font-family:var(--font-family-code);font-size:13.5px;line-height:1.6;overflow-x:auto;color:var(--md-sys-color-on-surface)}.props-table-wrapper{overflow-x:auto;border:1px solid var(--md-sys-color-outline-variant);border-radius:var(--md-shape-corner-lg);margin:20px 0 40px;box-shadow:var(--md-sys-elevation-1)}.props-table{width:100%;border-collapse:collapse;text-align:left;font-size:14px}.props-table th{background-color:var(--md-sys-color-surface-container-high);color:var(--md-sys-color-on-surface);font-weight:600;padding:14px 18px;border-bottom:1px solid var(--md-sys-color-outline-variant)}.props-table td{padding:14px 18px;border-bottom:1px solid var(--md-sys-color-outline-variant);color:var(--md-sys-color-on-surface-variant);vertical-align:top}.props-table tr:last-child td{border-bottom:none}.props-table tr:hover td{background-color:var(--md-sys-color-surface-container-low)}.prop-name{font-family:var(--font-family-code);font-weight:600;color:var(--md-sys-color-primary);font-size:13px}.prop-type{font-family:var(--font-family-code);font-size:12.5px;color:var(--md-sys-color-tertiary);background-color:var(--md-sys-color-surface-container-highest);padding:2px 6px;border-radius:4px;display:inline-block}.prop-default{font-family:var(--font-family-code);font-size:12px;color:var(--md-sys-color-secondary)}.mobile-menu-btn,.sidebar-header-mobile{display:none}.m3-filter-chip{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 14px;border-radius:8px;font-size:13px;font-weight:500;font-family:inherit;cursor:pointer;background-color:var(--md-sys-color-surface-container-low);color:var(--md-sys-color-on-surface-variant);border:1px solid var(--md-sys-color-outline-variant);transition:all .15s cubic-bezier(.2,0,0,1);-webkit-user-select:none;user-select:none;white-space:nowrap}.m3-filter-chip:hover{background-color:var(--md-sys-color-surface-container-high);border-color:var(--md-sys-color-outline)}.m3-filter-chip.active{background-color:var(--md-sys-color-secondary-container);color:var(--md-sys-color-on-secondary-container);border-color:transparent;font-weight:600}.m3-filter-chip.active.error-chip{background-color:#f9dedc;color:#b3261e}[data-theme=dark] .m3-filter-chip.active.error-chip{background-color:#601410;color:#f2b8b5}.chip-check{font-size:12px;font-weight:700;line-height:1}.control-chips-group{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.m3-tonal-palette-card{background-color:var(--md-sys-color-surface-container-low);border:1px solid var(--md-sys-color-outline-variant);border-radius:24px;padding:32px;margin:16px 0 36px;box-shadow:var(--md-sys-elevation-1);overflow-x:auto;-webkit-overflow-scrolling:touch;transition:background-color .25s ease,border-color .25s ease}[data-theme=dark] .m3-tonal-palette-card{background-color:var(--md-sys-color-surface-container);border-color:var(--md-sys-color-outline-variant)}.m3-palette-row{display:flex;align-items:center;margin-bottom:22px;min-width:680px}.m3-palette-row:last-child{margin-bottom:0}.m3-palette-key-circle{width:44px;height:44px;border-radius:50%;flex-shrink:0;box-shadow:0 2px 6px #00000026}.m3-palette-label{width:120px;font-size:14px;font-weight:600;color:var(--md-sys-color-on-surface);margin-left:16px;flex-shrink:0;transition:color .2s ease}.m3-palette-arrow{display:flex;align-items:center;width:50px;margin-right:14px;flex-shrink:0;color:var(--md-sys-color-on-surface-variant);opacity:.8;transition:color .2s ease}.m3-palette-bar{display:flex;flex:1;height:44px;border-radius:4px;overflow:hidden;box-shadow:0 1px 3px #0000001a;border:1px solid rgba(255,255,255,.15)}[data-theme=light] .m3-palette-bar{border:1px solid rgba(0,0,0,.1)}.m3-tone-cell{flex:1;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:600;cursor:pointer;transition:transform .12s ease,filter .12s ease;-webkit-user-select:none;user-select:none;position:relative}.m3-tone-cell:hover{transform:scaleY(1.1);z-index:2;box-shadow:0 4px 8px #00000040}@media(max-width:900px){.mobile-menu-btn{display:inline-flex;align-items:center;justify-content:center;margin-right:4px;width:38px;height:38px;cursor:pointer}.top-app-bar{padding:0 14px;height:58px}.top-bar-search{margin:0 10px;max-width:320px}.sidebar{position:fixed;top:0;left:0;bottom:0;width:300px;max-width:84vw;height:100vh;z-index:1000;background-color:var(--md-sys-color-surface-container);box-shadow:var(--md-sys-elevation-4);transform:translate(-100%);transition:transform .25s cubic-bezier(.2,0,0,1);display:flex;flex-direction:column;padding:16px;overflow-y:auto}.sidebar.open{transform:translate(0)}.drawer-scrim{position:fixed;top:0;right:0;bottom:0;left:0;background-color:#0000008c;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:999;animation:fadeIn .2s ease}.sidebar-header-mobile{display:flex;align-items:center;justify-content:space-between;padding-bottom:12px;margin-bottom:12px;border-bottom:1px solid var(--md-sys-color-outline-variant)}.content-area{padding:20px 16px 60px}.m3-tonal-palette-card{padding:20px 14px;border-radius:18px}.m3-palette-row{min-width:580px}.props-table-wrapper{overflow-x:auto;-webkit-overflow-scrolling:touch}}@media(max-width:600px){.top-bar-search{margin:0 6px}.search-shortcut{display:none}.search-input-wrapper{padding:6px 10px}.search-input{font-size:13px}.brand-title{font-size:17px}.version-badge{display:none}.doc-title{font-size:24px}.m3-tabs-container{overflow-x:auto;-webkit-overflow-scrolling:touch;width:100%;scrollbar-width:none}.m3-tab-button{white-space:nowrap;padding:8px 14px;font-size:13px}.playground-controls{flex-direction:column;align-items:flex-start;gap:12px}.playground-body{padding:20px 12px}}