*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--themed-font-family-sans);background-color:var(--themed-color-background);color:var(--themed-color-text-primary);min-height:100vh;transition:background-color .3s,color .3s}.container{max-width:800px;margin:0 auto;padding:2rem}h1{font-size:var(--themed-font-size-3xl);font-weight:var(--themed-font-weight-bold);margin-bottom:1rem;color:var(--themed-color-primary)}p{font-size:var(--themed-font-size-base);line-height:var(--themed-line-height-relaxed);color:var(--themed-color-text-secondary);margin-bottom:2rem}.theme-selector{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:2rem}.theme-btn{padding:.5rem 1rem;border:2px solid var(--themed-color-border);border-radius:.5rem;background-color:var(--themed-color-surface);color:var(--themed-color-text-primary);font-family:inherit;font-size:var(--themed-font-size-sm);cursor:pointer;transition:all .2s}.theme-btn:hover{border-color:var(--themed-color-primary)}.theme-btn.active{background-color:var(--themed-color-primary);border-color:var(--themed-color-primary);color:var(--themed-color-text-inverse)}.ai-config-section{background-color:var(--themed-color-surface);border:1px solid var(--themed-color-border);border-radius:.75rem;margin-bottom:1.5rem;overflow:hidden}.ai-config-toggle{width:100%;padding:.75rem 1rem;text-align:left;border:none;background-color:transparent;color:var(--themed-color-text-primary);font-family:inherit;font-size:var(--themed-font-size-sm);cursor:pointer;transition:background-color .2s}.ai-config-toggle:hover{background-color:var(--themed-color-background)}.ai-config-form{padding:0 1rem 1rem;border-top:1px solid var(--themed-color-border)}.ai-config-hint{font-size:var(--themed-font-size-sm);color:var(--themed-color-text-secondary);margin:.75rem 0 .5rem}.ai-config-security{font-size:var(--themed-font-size-xs);color:var(--themed-color-text-secondary);margin:0 0 .75rem;padding:.5rem .75rem;background:var(--themed-color-background);border-radius:.375rem;border:1px solid var(--themed-color-border)}.ai-config-row{display:flex;gap:.5rem;margin-bottom:.75rem}.ai-config-select{padding:.5rem .75rem;border:1px solid var(--themed-color-border);border-radius:.5rem;background-color:var(--themed-color-background);color:var(--themed-color-text-primary);font-family:inherit;font-size:var(--themed-font-size-sm);min-width:120px}.ai-config-input{flex:1;padding:.5rem .75rem;border:1px solid var(--themed-color-border);border-radius:.5rem;background-color:var(--themed-color-background);color:var(--themed-color-text-primary);font-family:inherit;font-size:var(--themed-font-size-sm)}.ai-config-input:focus{outline:none;border-color:var(--themed-color-primary)}.ai-config-key-input{-webkit-text-security:disc}.ai-config-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.5rem}.ai-config-remember{font-size:var(--themed-font-size-xs);color:var(--themed-color-text-secondary);cursor:pointer;display:flex;align-items:center;gap:.25rem}.ai-config-buttons{display:flex;gap:.5rem}.ai-config-btn{padding:.375rem .75rem;font-size:var(--themed-font-size-sm);border:1px solid var(--themed-color-primary);border-radius:.375rem;background-color:var(--themed-color-primary);color:var(--themed-color-text-inverse);cursor:pointer;transition:opacity .2s}.ai-config-btn:hover:not(:disabled){opacity:.9}.ai-config-btn:disabled{opacity:.5;cursor:not-allowed}.ai-config-btn.secondary{background-color:transparent;color:var(--themed-color-text-primary);border-color:var(--themed-color-border)}.ai-config-btn.secondary:hover{border-color:var(--themed-color-primary)}.ai-extension-status{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;font-size:var(--themed-font-size-sm);border-bottom:1px solid var(--themed-color-border)}.ai-extension-status-dot{width:7px;height:7px;border-radius:50%;background-color:var(--themed-color-success);flex-shrink:0}.ai-extension-status-label{color:var(--themed-color-success);font-weight:var(--themed-font-weight-medium)}.ai-extension-status-detail{color:var(--themed-color-text-secondary)}.ai-section{background-color:var(--themed-color-surface);border:1px solid var(--themed-color-border);border-radius:.75rem;padding:1.5rem;margin-bottom:2rem}.ai-section-header{display:flex;flex-wrap:wrap;align-items:baseline;gap:.75rem;margin-bottom:1rem}.ai-section h2{font-size:var(--themed-font-size-xl);margin:0;color:var(--themed-color-primary)}.model-badge{font-size:var(--themed-font-size-sm);color:var(--themed-color-text-secondary);background-color:var(--themed-color-surface);padding:.25rem .5rem;border-radius:.375rem;border:1px solid var(--themed-color-border)}.model-badge .model-name{color:var(--themed-color-text-primary);font-weight:var(--themed-font-weight-medium)}.ai-input-group{display:flex;gap:.5rem}.ai-input{flex:1;padding:.75rem 1rem;border:1px solid var(--themed-color-border);border-radius:.5rem;background-color:var(--themed-color-background);color:var(--themed-color-text-primary);font-family:inherit;font-size:var(--themed-font-size-base)}.ai-input:focus{outline:none;border-color:var(--themed-color-primary)}.ai-btn{padding:.75rem 1.5rem;border:none;border-radius:.5rem;background-color:var(--themed-color-primary);color:var(--themed-color-text-inverse);font-family:inherit;font-size:var(--themed-font-size-base);font-weight:var(--themed-font-weight-medium);cursor:pointer;transition:opacity .2s}.ai-btn:hover:not(:disabled){opacity:.9}.ai-btn:disabled{opacity:.5;cursor:not-allowed}.ai-custom-schema-toggle{margin-top:.5rem}.ai-custom-schema-toggle-btn{background:none;border:none;padding:0;font-size:var(--themed-font-size-sm);color:var(--themed-color-text-secondary);cursor:pointer;display:flex;align-items:center;gap:.25rem}.ai-custom-schema-toggle-btn:hover{color:var(--themed-color-text-primary)}.ai-custom-schema-optional{font-weight:400;opacity:.7}.ai-custom-schema-panel{margin-top:.5rem}.ai-custom-schema-hint{font-size:var(--themed-font-size-xs);color:var(--themed-color-text-secondary);margin-bottom:.375rem}.ai-custom-schema-textarea{width:100%;padding:.5rem;font-size:var(--themed-font-size-sm);font-family:monospace;border:1px solid var(--themed-color-border);border-radius:.375rem;background:var(--themed-color-background);color:var(--themed-color-text-primary);resize:vertical;line-height:1.5}.ai-custom-schema-textarea:focus{outline:none;border-color:var(--themed-color-primary)}.status{margin-top:.5rem;font-size:var(--themed-font-size-sm);color:var(--themed-color-text-secondary)}.status.error{color:var(--themed-color-error)}.card{background-color:var(--themed-color-surface);border:1px solid var(--themed-color-border);border-radius:.75rem;padding:1.5rem}.card-header{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:1rem}.card-actions{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}.card h3{font-size:var(--themed-font-size-lg);margin:0}.download-btn{padding:.375rem .75rem;font-size:var(--themed-font-size-sm);border:1px solid var(--themed-color-border);border-radius:.375rem;background-color:var(--themed-color-surface);color:var(--themed-color-text-primary);cursor:pointer;transition:border-color .2s}.download-btn:hover{border-color:var(--themed-color-primary)}.json-modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:1rem}.json-modal{background:var(--themed-color-surface);border:1px solid var(--themed-color-border);border-radius:.75rem;max-width:90vw;max-height:85vh;display:flex;flex-direction:column;overflow:hidden}.json-modal-header{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1rem;border-bottom:1px solid var(--themed-color-border)}.json-modal-header h4{margin:0;font-size:var(--themed-font-size-base)}.json-modal-close{padding:.25rem .5rem;font-size:var(--themed-font-size-sm);border:1px solid var(--themed-color-border);border-radius:.25rem;background:var(--themed-color-background);color:var(--themed-color-text-primary);cursor:pointer}.json-modal-close:hover{border-color:var(--themed-color-primary)}.json-modal .json-modal-body{padding:1rem;overflow:auto;font-size:var(--themed-font-size-xs);font-family:monospace;white-space:pre-wrap;word-break:break-all;margin:0}.json-modal-import .json-modal-body{display:flex;flex-direction:column;gap:.75rem;min-width:320px}.json-import-file-label{display:inline-block;padding:.375rem .75rem;font-size:var(--themed-font-size-sm);border:1px solid var(--themed-color-border);border-radius:.375rem;background:var(--themed-color-background);color:var(--themed-color-text-primary);cursor:pointer}.json-import-file-label:hover{border-color:var(--themed-color-primary)}.json-import-file{display:none}.json-import-textarea{width:100%;min-height:120px;padding:.5rem;font-size:var(--themed-font-size-sm);font-family:monospace;border:1px solid var(--themed-color-border);border-radius:.375rem;background:var(--themed-color-background);color:var(--themed-color-text-primary);resize:vertical}.json-import-error{margin:0;font-size:var(--themed-font-size-sm);color:var(--themed-color-error)}.json-import-submit{padding:.5rem 1rem;font-size:var(--themed-font-size-sm);border:1px solid var(--themed-color-primary);border-radius:.375rem;background:var(--themed-color-primary);color:var(--themed-color-text-inverse);cursor:pointer;align-self:flex-start}.json-import-submit:hover:not(:disabled){opacity:.9}.json-import-submit:disabled{opacity:.5;cursor:not-allowed}.color-preview{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:.5rem}.color-swatch{display:flex;flex-direction:column;align-items:center;gap:.25rem}.color-swatch .swatch{width:50px;height:50px;border-radius:.5rem;border:1px solid var(--themed-color-border)}.color-swatch .label{font-size:var(--themed-font-size-xs);color:var(--themed-color-text-secondary);text-transform:capitalize}.color-swatch .hex{font-size:.65rem;font-family:monospace;color:var(--themed-color-text-secondary);margin-top:.125rem}.theme-current-card .theme-tokens-block{margin-bottom:1rem}.theme-current-card .theme-tokens-section{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--themed-color-border)}.theme-tokens-section-title{font-size:var(--themed-font-size-sm);font-weight:var(--themed-font-weight-semibold);color:var(--themed-color-text-secondary);margin-bottom:.5rem}.theme-tokens-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1rem;padding-top:1rem;border-top:1px solid var(--themed-color-border)}@media(max-width:520px){.theme-tokens-row{grid-template-columns:1fr}}.theme-token-pills{display:flex;flex-wrap:wrap;gap:.375rem}.theme-token-pill{display:inline-flex;align-items:center;gap:.25rem;padding:.2rem .5rem;font-size:.7rem;background:var(--themed-color-background);border:1px solid var(--themed-color-border);border-radius:var(--themed-radius-sm, .25rem)}.theme-token-pill-key{color:var(--themed-color-text-secondary);font-weight:var(--themed-font-weight-medium)}.theme-token-pill-value{font-family:monospace;color:var(--themed-color-text-primary);max-width:6rem;overflow:hidden;text-overflow:ellipsis}.theme-typography-preview{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.75rem}.theme-font-sample{display:flex;flex-direction:column;gap:.125rem;padding:.5rem;background:var(--themed-color-background);border:1px solid var(--themed-color-border);border-radius:var(--themed-radius-sm, .25rem)}.theme-font-label{font-size:.65rem;font-weight:var(--themed-font-weight-semibold);color:var(--themed-color-text-secondary);text-transform:uppercase;display:block}.theme-font-first{font-size:.6rem;color:var(--themed-color-primary);font-weight:var(--themed-font-weight-medium);display:block}.theme-font-value{font-size:var(--themed-font-size-sm);font-weight:400;font-style:normal;color:var(--themed-color-text-primary);display:block;margin-top:.25rem}.theme-shadow-preview{display:flex;flex-wrap:wrap;gap:.5rem}.theme-shadow-swatch{width:48px;height:48px;border-radius:var(--themed-radius-md, .5rem);background:var(--themed-color-surface);border:1px solid var(--themed-color-border);display:flex;align-items:flex-end;justify-content:center;padding-bottom:.25rem}.theme-shadow-label{font-size:.6rem;color:var(--themed-color-text-secondary)}.custom-data-section .custom-data-pre{margin:0;padding:.75rem;font-size:var(--themed-font-size-xs);font-family:monospace;background:var(--themed-color-background);border:1px solid var(--themed-color-border);border-radius:var(--themed-radius-sm, .25rem);overflow:auto;max-height:200px;white-space:pre-wrap;word-break:break-all}.custom-structure-hint{font-size:var(--themed-font-size-xs);color:var(--themed-color-text-secondary);margin-bottom:.5rem}.custom-structure-textarea{width:100%;min-height:80px;padding:.5rem;font-size:var(--themed-font-size-sm);font-family:monospace;border:1px solid var(--themed-color-border);border-radius:.375rem;background:var(--themed-color-background);color:var(--themed-color-text-primary);resize:vertical;margin-bottom:.5rem}.custom-structure-error{margin:0 0 .5rem;font-size:var(--themed-font-size-sm);color:var(--themed-color-error)}.custom-structure-attach{margin-top:.25rem}.style-demo{margin-top:2rem;padding:var(--themed-spacing-xl, 1.5rem)!important;border-radius:var(--themed-radius-lg, .75rem)}.style-demo-title{margin-bottom:var(--themed-spacing-sm, .5rem);color:var(--themed-color-primary)}.style-demo-desc{font-size:var(--themed-font-size-sm);color:var(--themed-color-text-secondary);margin-bottom:var(--themed-spacing-xl, 1.5rem)!important}.style-demo-section{margin-bottom:var(--themed-spacing-xl, 1.5rem)}.style-demo-section:last-child{margin-bottom:0}.style-demo-section-title{font-size:var(--themed-font-size-sm);font-weight:var(--themed-font-weight-semibold);color:var(--themed-color-text-secondary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--themed-spacing-sm, .5rem)}.style-demo-btn{padding:var(--themed-spacing-sm, .5rem) var(--themed-spacing-lg, 1rem);font-size:var(--themed-font-size-base);font-weight:var(--themed-font-weight-medium);font-family:inherit;border:none;border-radius:var(--themed-radius-md, .5rem);cursor:default}.style-demo-btn-primary{background-color:var(--themed-color-primary);color:var(--themed-color-text-inverse)}.style-demo-actions{display:flex;flex-wrap:wrap;gap:var(--themed-spacing-sm, .5rem)}.style-demo-btn-secondary{background-color:var(--themed-color-secondary);color:var(--themed-color-text-inverse)}.style-demo-btn-outline{background-color:transparent;color:var(--themed-color-text-primary);border:2px solid var(--themed-color-border)}.style-demo-accent-badge{display:inline-flex;align-items:center;padding:var(--themed-spacing-xs, .25rem) var(--themed-spacing-md, .75rem);background-color:var(--themed-color-accent);color:var(--themed-color-text-inverse);font-size:var(--themed-font-size-sm);font-weight:var(--themed-font-weight-medium);border-radius:var(--themed-radius-full, 9999px)}.style-demo-alerts{display:flex;flex-direction:column;gap:var(--themed-spacing-sm, .5rem)}.style-demo-alert{display:flex;flex-direction:column;gap:var(--themed-spacing-xs, .25rem);padding:var(--themed-spacing-md, .75rem);border-radius:var(--themed-radius-md, .5rem);font-size:var(--themed-font-size-sm);color:var(--themed-color-text-inverse)}.style-demo-alert strong{font-weight:var(--themed-font-weight-semibold)}.style-demo-alert span{opacity:.95}.style-demo-error{background-color:var(--themed-color-error)}.style-demo-warning{background-color:var(--themed-color-warning)}.style-demo-success{background-color:var(--themed-color-success)}.style-demo-info{background-color:var(--themed-color-info)}.style-demo-text-block{display:flex;flex-direction:column;gap:var(--themed-spacing-sm, .5rem)}.style-demo-heading{font-size:var(--themed-font-size-lg);font-weight:var(--themed-font-weight-bold);color:var(--themed-color-primary)}.style-demo-body{font-size:var(--themed-font-size-base);color:var(--themed-color-text-primary);margin:0}.style-demo-caption{font-size:var(--themed-font-size-sm);color:var(--themed-color-text-secondary);margin:0}.style-demo-disabled{font-size:var(--themed-font-size-sm);color:var(--themed-color-text-disabled);margin:0}.style-demo-tokens{display:flex;flex-direction:column;gap:var(--themed-spacing-lg, 1rem)}.style-demo-spacing-dots{display:flex;align-items:center;gap:var(--themed-spacing-md, .75rem)}.style-demo-spacing-dots .dot{width:8px;height:8px;border-radius:50%;background-color:var(--themed-color-primary)}.style-demo-radius-samples{display:flex;flex-wrap:wrap;gap:var(--themed-spacing-sm, .5rem)}.radius-box{display:inline-flex;align-items:center;justify-content:center;min-width:3rem;padding:var(--themed-spacing-sm, .5rem);font-size:var(--themed-font-size-xs);color:var(--themed-color-text-secondary);background-color:var(--themed-color-surface);border:1px solid var(--themed-color-border)}.radius-box.radius-sm{border-radius:var(--themed-radius-sm, .25rem)}.radius-box.radius-md{border-radius:var(--themed-radius-md, .5rem)}.radius-box.radius-lg{border-radius:var(--themed-radius-lg, .75rem)}.style-demo-shadow-samples{display:flex;flex-wrap:wrap;gap:var(--themed-spacing-sm, .5rem)}.shadow-box{display:inline-flex;align-items:center;justify-content:center;min-width:3rem;padding:var(--themed-spacing-sm, .5rem);font-size:var(--themed-font-size-xs);color:var(--themed-color-text-secondary);background-color:var(--themed-color-surface);border:1px solid var(--themed-color-border);border-radius:var(--themed-radius-md, .5rem)}.shadow-box.shadow-none{box-shadow:var(--themed-shadow-none, none)}.shadow-box.shadow-sm{box-shadow:var(--themed-shadow-sm)}.shadow-box.shadow-md{box-shadow:var(--themed-shadow-md)}.shadow-box.shadow-lg{box-shadow:var(--themed-shadow-lg)}.style-demo-transition-samples{display:flex;flex-wrap:wrap;align-items:center;gap:var(--themed-spacing-sm, .5rem)}.transition-dot{display:inline-flex;align-items:center;justify-content:center;min-width:3.5rem;padding:var(--themed-spacing-xs, .25rem) var(--themed-spacing-sm, .5rem);font-size:var(--themed-font-size-xs);color:var(--themed-color-text-primary);background-color:var(--themed-color-surface);border:1px solid var(--themed-color-border);border-radius:var(--themed-radius-full, 9999px);cursor:default}.transition-dot:hover{background-color:var(--themed-color-primary);color:var(--themed-color-text-inverse);border-color:var(--themed-color-primary)}.transition-dot.transition-fast{transition:background-color var(--themed-transition-fast, .15s),color var(--themed-transition-fast, .15s),border-color var(--themed-transition-fast, .15s)}.transition-dot.transition-normal{transition:background-color var(--themed-transition-normal, .25s),color var(--themed-transition-normal, .25s),border-color var(--themed-transition-normal, .25s)}.transition-dot.transition-slow{transition:background-color var(--themed-transition-slow, .4s),color var(--themed-transition-slow, .4s),border-color var(--themed-transition-slow, .4s)}.style-demo-typo{display:flex;flex-direction:column;gap:var(--themed-spacing-sm, .5rem)}.style-demo-font-sans{font-family:var(--themed-font-family-sans);font-size:var(--themed-font-size-sm)}.style-demo-font-serif{font-family:var(--themed-font-family-serif);font-size:var(--themed-font-size-sm)}.style-demo-font-mono{font-family:var(--themed-font-family-mono);font-size:var(--themed-font-size-sm)}.style-demo-sizes{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--themed-spacing-md, .75rem);margin-top:var(--themed-spacing-xs, .25rem)}.style-demo-size-xs{font-size:var(--themed-font-size-xs);color:var(--themed-color-text-secondary)}.style-demo-size-sm{font-size:var(--themed-font-size-sm);color:var(--themed-color-text-secondary)}.style-demo-size-base{font-size:var(--themed-font-size-base);color:var(--themed-color-text-secondary)}.style-demo-size-lg{font-size:var(--themed-font-size-lg);color:var(--themed-color-text-secondary)}.style-demo-size-xl{font-size:var(--themed-font-size-xl);color:var(--themed-color-text-secondary)}@media(max-width:600px){.container{padding:1rem}h1{font-size:var(--themed-font-size-2xl, 1.5rem)}.ai-input-group{flex-direction:column}.ai-btn{width:100%}.ai-config-row{flex-direction:column}.ai-config-select,.ai-config-key-input{width:100%}.json-modal-import .json-modal-body{min-width:0}.card-actions{width:100%;justify-content:flex-start}}