:root{--sidebar-width: 260px;--top-bar-height: 64px;--border-radius-large: 28px;--border-radius-medium: 16px;font-family:Roboto,sans-serif}body{background-color:var(--md-sys-color-background);color:var(--md-sys-color-on-background);margin:0;transition:background-color .3s ease,color .3s ease}.app-layout{display:grid;grid-template-columns:var(--sidebar-width) 1fr;grid-template-rows:var(--top-bar-height) 1fr;grid-template-areas:"header header" "sidebar main";height:100vh;width:100vw}.top-bar{grid-area:header;display:flex;align-items:center;padding:0 16px 0 24px;border-bottom:1px solid var(--md-sys-color-outline-variant)}.sidebar{grid-area:sidebar;border-right:1px solid var(--md-sys-color-outline-variant);padding:24px}.main-content{grid-area:main;overflow-y:auto;padding:32px}.logo{display:flex;align-items:center;gap:12px;color:var(--md-sys-color-primary)}.logo h1{font-size:1.3rem;margin:0}.search-bar{flex-grow:1;margin:0 40px;position:relative}.search-bar .material-symbols-outlined{position:absolute;top:50%;left:12px;transform:translateY(-50%);opacity:.7}.search-bar input{width:100%;max-width:400px;height:40px;border-radius:20px;border:none;background-color:var(--md-sys-color-surface-container);padding-left:40px;color:var(--md-sys-color-on-surface)}.actions{margin-left:auto}.component-nav h3{padding-bottom:8px;border-bottom:1px solid var(--md-sys-color-outline-variant)}.component-nav ul{list-style:none;padding:0;margin:0}.component-nav a{display:block;padding:10px;text-decoration:none;color:var(--md-sys-color-on-background);border-radius:20px}.component-nav a:hover{background-color:var(--md-sys-color-surface-container)}.component-nav a.active{background-color:var(--md-sys-color-primary);color:var(--md-sys-color-on-primary);font-weight:700}.component-card{background-color:var(--md-sys-color-surface-container);border-radius:var(--border-radius-large);margin-bottom:32px;border:1px solid var(--md-sys-color-outline-variant);overflow:hidden}.display-area{min-height:250px;display:flex;align-items:center;justify-content:center;transition:background-color .3s ease;background-color:var(--md-sys-color-surface-bright);padding:32px;margin:24px;border-radius:var(--border-radius-medium)}.display-area.is-interactive-theme{background-color:var(--interactive-bg)}.display-area.is-interactive-theme[data-theme=light]{--interactive-bg: #FEF7FF;--switch-track-bg: #E6E0E9;--switch-dot-bg: #6750A4;--switch-dot-checked-bg: #EADDFF;--switch-icon-color: #FFFFFF;--switch-icon-checked-color: #1C1B1F}.display-area.is-interactive-theme[data-theme=dark]{--interactive-bg: #36343B;--switch-track-bg: #3D3B42;--switch-dot-bg: #D0BCFF;--switch-dot-checked-bg: #4F378B;--switch-icon-color: #381E72;--switch-icon-checked-color: #E6E1E5}.info-area{padding:0 24px 24px}.info-area h2{margin-top:0;margin-bottom:16px}.tab-panel{display:none;padding-top:1rem}.tab-panel.active{display:block}.code-wrapper{position:relative}pre[class*=language-]{border-radius:8px;margin:0}.copy-button{position:absolute;top:8px;right:8px}.back-to-top{position:fixed;bottom:30px;right:30px;width:50px;height:50px;border-radius:50%;background-color:var(--md-sys-color-primary);color:var(--md-sys-color-on-primary);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 8px #0003;opacity:0;pointer-events:none;transform:translateY(20px);transition:opacity .3s,transform .3s}.back-to-top.visible{opacity:1;pointer-events:auto;transform:translateY(0)}.menu-toggle{display:none;background:none;border:none;color:var(--md-sys-color-primary);cursor:pointer;padding:8px;margin-right:8px;border-radius:50%}.menu-toggle:hover{background:#0000000d}.sidebar-overlay{position:fixed;inset:0;background-color:#00000080;z-index:998;opacity:0;pointer-events:none;transition:opacity .3s ease}@media (max-width: 768px){.app-layout{grid-template-columns:1fr;grid-template-rows:var(--top-bar-height) 1fr;grid-template-areas:"header" "main"}.menu-toggle{display:flex;align-items:center;justify-content:center}.sidebar{position:fixed;top:0;left:0;width:var(--sidebar-width);height:100%;z-index:999;background-color:var(--md-sys-color-background);border-right:1px solid var(--md-sys-color-outline-variant);transform:translate(-100%);transition:transform .3s ease-in-out;overflow-y:auto}.sidebar.is-open{transform:translate(0)}.sidebar-overlay.is-open{opacity:1;pointer-events:auto}.search-bar,.logo h1{display:none}.main-content{padding:16px}}body.sidebar-open{overflow:hidden}.is-hidden{display:none!important}.no-results-message{text-align:center;padding:64px 32px;color:var(--md-sys-color-on-surface-variant)}.no-results-message .material-symbols-outlined{font-size:48px;margin-bottom:16px}.no-results-message h2{margin:0 0 8px}.no-results-message p{margin:0}