*,*:before,*:after{box-sizing:border-box}*{margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-size-adjust:100%}body{min-height:100vh;line-height:1.5}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}a{color:inherit;text-decoration:none}button{background:none;border:none;cursor:pointer}ul,ol{list-style:none}#root{isolation:isolate;min-height:100vh}:root{--color-bg: #ffffff;--color-bg-secondary: #f5f5f5;--color-text: #1a1a1a;--color-text-secondary: #666666;--color-border: #e0e0e0;--color-accent: #0066cc;--color-accent-hover: #0052a3;--space-xs: .25rem;--space-sm: .5rem;--space-md: 1rem;--space-lg: 1.5rem;--space-xl: 2rem;--font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.25rem;--font-size-xl: 1.5rem;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--transition-fast: .15s ease;--transition-normal: .25s ease}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}:root.reduce-motion *,:root.reduce-motion *:before,:root.reduce-motion *:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}body{font-family:var(--font-family);font-size:var(--font-size-base);color:var(--color-text);background-color:var(--color-bg);position:relative;min-height:100vh}body:after{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background-image:var(--background-image-url, none);background-size:cover;background-position:center;background-repeat:no-repeat;opacity:var(--background-image-opacity, 0);pointer-events:none;z-index:0}:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}main{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:var(--space-lg)}main.main--with-extensions{justify-content:flex-start;padding-top:0}.delete-confirm{display:flex;flex-direction:column;gap:var(--space-md)}.delete-confirm p{margin:0;color:var(--color-text)}.delete-confirm-actions{display:flex;justify-content:flex-end;gap:var(--space-sm)}.delete-confirm-btn-cancel,.delete-confirm-btn-delete{padding:var(--space-sm) var(--space-lg);font-size:var(--font-size-base);border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--transition-fast),transform var(--transition-fast)}.delete-confirm-btn-cancel{color:var(--color-text);background-color:var(--color-bg-secondary);border:1px solid var(--color-border)}.delete-confirm-btn-cancel:hover{background-color:var(--color-border)}.delete-confirm-btn-delete{color:#fff;background-color:#c00;border:none}.delete-confirm-btn-delete:hover{background-color:#a00}.delete-confirm-btn-cancel:focus-visible,.delete-confirm-btn-delete:focus-visible{outline:none;box-shadow:0 0 0 3px #0066cc4d}.delete-confirm-btn-cancel:active,.delete-confirm-btn-delete:active{transform:scale(.98)}.icon-controls{position:fixed;bottom:var(--space-lg);right:var(--space-lg);display:flex;gap:var(--space-sm);z-index:100}.icon-button{display:flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;color:var(--color-text-secondary);background-color:transparent;border:none;border-radius:var(--radius-md);cursor:pointer;transition:color var(--transition-fast),background-color var(--transition-fast),transform var(--transition-fast)}.icon-button:hover{color:var(--color-text);background-color:#0000000d}.icon-button:active{transform:scale(.95)}.icon-button:focus-visible{outline:none;box-shadow:0 0 0 3px #0066cc4d}.icon-button--active{color:var(--color-accent)}.icon-button--active:hover{color:var(--color-accent-hover)}.tutorial-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0006;z-index:999;display:flex;align-items:center;justify-content:center;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.tutorial-content{position:fixed;bottom:calc(var(--space-lg) + 50px);right:var(--space-lg);background-color:var(--color-bg);border:2px solid var(--color-accent);border-radius:var(--radius-lg);padding:var(--space-lg);max-width:300px;box-shadow:0 4px 12px #00000026;animation:slideUp .3s ease}@keyframes slideUp{0%{transform:translateY(10px);opacity:0}to{transform:translateY(0);opacity:1}}.tutorial-content--settings .tutorial-arrow{position:absolute;bottom:-10px;right:20px;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-top:10px solid var(--color-accent)}.tutorial-content--edit .tutorial-arrow{position:absolute;bottom:-10px;right:70px;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-top:10px solid var(--color-accent)}.tutorial-arrow:before{content:"";position:absolute;bottom:2px;left:-8px;width:0;height:0;border-left:8px solid transparent;border-right:8px solid transparent;border-top:8px solid var(--color-bg)}.tutorial-text{display:flex;flex-direction:column;gap:var(--space-sm)}.tutorial-text p{margin:0;color:var(--color-text);font-size:var(--font-size-sm);line-height:1.5}.tutorial-text strong{color:var(--color-accent);font-weight:600}.tutorial-actions{display:flex;justify-content:flex-end;gap:var(--space-sm);margin-top:var(--space-sm)}.tutorial-skip{padding:var(--space-sm) var(--space-md);font-size:var(--font-size-sm);color:var(--color-text-secondary);background-color:transparent;border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--transition-fast),color var(--transition-fast),transform var(--transition-fast)}.tutorial-skip:hover{color:var(--color-text);background-color:var(--color-bg-secondary)}.tutorial-skip:active{transform:scale(.95)}.tutorial-skip:focus-visible{outline:none;box-shadow:0 0 0 3px #0066cc4d}.tutorial-close{padding:var(--space-sm) var(--space-md);font-size:var(--font-size-sm);color:#fff;background-color:var(--color-accent);border:none;border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--transition-fast),transform var(--transition-fast)}.tutorial-close:hover{background-color:var(--color-accent-hover)}.tutorial-close:active{transform:scale(.95)}.tutorial-close:focus-visible{outline:none;box-shadow:0 0 0 3px #ffffff80}.search-bar{width:100%;max-width:600px}.search-input{width:100%;padding:var(--space-md) var(--space-lg);font-size:var(--font-size-lg);color:var(--color-text);background-color:var(--color-bg-secondary);border:2px solid var(--color-border);border-radius:var(--radius-lg);transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.search-input::placeholder{color:var(--color-text-secondary)}.search-input:hover{border-color:var(--color-accent)}.search-input:focus{outline:none;border-color:var(--color-accent);box-shadow:0 0 0 3px #06c3}@media(prefers-color-scheme:dark){.search-input:focus{box-shadow:0 0 0 3px #4da6ff4d}}.tile-card{display:flex;flex-direction:column;align-items:center;gap:var(--space-sm);padding:var(--space-md);min-width:100px;min-height:100px;background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;transition:transform var(--transition-fast),box-shadow var(--transition-fast),border-color var(--transition-fast);position:relative}.tile-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001a;border-color:var(--color-accent)}.tile-card:focus-visible{outline:none;border-color:var(--color-accent);box-shadow:0 0 0 3px #06c3}@media(prefers-color-scheme:dark){.tile-card:hover{box-shadow:0 4px 12px #0000004d}.tile-card:focus-visible{box-shadow:0 0 0 3px #4da6ff4d}}.tile-icon{display:flex;align-items:center;justify-content:center;width:48px;height:48px;background-color:var(--color-bg);border-radius:var(--radius-sm);overflow:hidden}.tile-favicon{width:32px;height:32px;object-fit:contain}.tile-initial{font-size:1.5rem;font-weight:600;color:var(--color-accent)}.tile-name{font-size:var(--font-size-sm);color:var(--color-text);text-align:center;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tile-actions{position:absolute;top:var(--space-xs);right:var(--space-xs);display:flex;gap:var(--space-xs);opacity:0;transition:opacity var(--transition-fast)}.tile-card:hover .tile-actions,.tile-card:focus-within .tile-actions{opacity:1}.tile-action-btn{padding:var(--space-xs) var(--space-sm);font-size:.75rem;color:var(--color-text-secondary);background-color:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);cursor:pointer;transition:background-color var(--transition-fast),color var(--transition-fast)}.tile-action-btn:hover{background-color:var(--color-bg-secondary);color:var(--color-text)}.tile-action-delete:hover{background-color:#fee;color:#c00;border-color:#c00}@media(prefers-color-scheme:dark){.tile-action-delete:hover{background-color:#400;color:#f88;border-color:#f88}}.tile-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-md);width:100%;max-width:800px;margin:0 auto}.tile-grid-empty{display:flex;flex-direction:column;align-items:center;gap:var(--space-md);padding:var(--space-xl);text-align:center}.tile-grid-empty-text{color:var(--color-text-secondary);font-size:var(--font-size-lg)}.tile-grid-add-btn{padding:var(--space-md) var(--space-lg);font-size:var(--font-size-base);color:var(--color-bg);background-color:var(--color-accent);border:none;border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--transition-fast),transform var(--transition-fast)}.tile-grid-add-btn:hover{background-color:var(--color-accent-hover)}.tile-grid-add-btn:focus-visible{outline:none;box-shadow:0 0 0 3px #0066cc4d}.tile-grid-add-btn:active{transform:scale(.98)}.tile-add-card{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-sm);padding:var(--space-md);min-width:100px;min-height:100px;background-color:transparent;border:2px dashed var(--color-border);border-radius:var(--radius-md);cursor:pointer;transition:border-color var(--transition-fast),background-color var(--transition-fast)}.tile-add-card:hover{border-color:var(--color-accent);background-color:var(--color-bg-secondary)}.tile-add-card:focus-visible{outline:none;border-color:var(--color-accent);box-shadow:0 0 0 3px #06c3}.tile-add-icon{font-size:2rem;color:var(--color-text-secondary);line-height:1}.tile-add-text{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.tile-add-card:hover .tile-add-icon,.tile-add-card:hover .tile-add-text{color:var(--color-accent)}@keyframes wiggle{0%{transform:rotate(-1deg)}25%{transform:rotate(1deg)}50%{transform:rotate(-1deg)}75%{transform:rotate(1deg)}to{transform:rotate(-1deg)}}.tile-wiggle{animation:wiggle .5s ease-in-out infinite}.tile-wiggle[style*="opacity: 0.5"]{animation:none}.modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);margin:0;padding:0;border:none;border-radius:var(--radius-lg);box-shadow:0 8px 32px #0003;max-width:90vw;width:400px;background:var(--color-bg)}.modal:has(.settings-layout){width:800px;max-height:90vh}.modal::backdrop{background:#00000080;backdrop-filter:blur(2px)}.modal-content{display:flex;flex-direction:column}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-md) var(--space-lg);border-bottom:1px solid var(--color-border)}.modal-title{margin:0;font-size:var(--font-size-lg);font-weight:600;color:var(--color-text)}.modal-close{display:flex;align-items:center;justify-content:center;width:32px;height:32px;font-size:1.5rem;color:var(--color-text-secondary);background:none;border:none;border-radius:var(--radius-sm);cursor:pointer;transition:background-color var(--transition-fast),color var(--transition-fast)}.modal-close:hover{background-color:var(--color-bg-secondary);color:var(--color-text)}.modal-close:focus-visible{outline:none;box-shadow:0 0 0 2px var(--color-accent)}.modal-body{padding:var(--space-lg)}@media(prefers-color-scheme:dark){.modal{box-shadow:0 8px 32px #00000080}.modal::backdrop{background:#000000b3}}.tile-form{display:flex;flex-direction:column;gap:var(--space-md)}.tile-form-field{display:flex;flex-direction:column;gap:var(--space-xs)}.tile-form-label{font-size:var(--font-size-sm);font-weight:500;color:var(--color-text)}.tile-form-required{color:#c00}.tile-form-optional{font-weight:400;color:var(--color-text-secondary)}.tile-form-input{padding:var(--space-sm) var(--space-md);font-size:var(--font-size-base);color:var(--color-text);background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-md);transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.tile-form-input::placeholder{color:var(--color-text-secondary)}.tile-form-input:hover{border-color:var(--color-accent)}.tile-form-input:focus{outline:none;border-color:var(--color-accent);box-shadow:0 0 0 3px #06c3}@media(prefers-color-scheme:dark){.tile-form-input:focus{box-shadow:0 0 0 3px #4da6ff4d}}.tile-form-error{margin:0;padding:var(--space-sm) var(--space-md);font-size:var(--font-size-sm);color:#c00;background-color:#fee;border-radius:var(--radius-sm)}@media(prefers-color-scheme:dark){.tile-form-error{color:#f88;background-color:#400}}.tile-form-actions{display:flex;justify-content:flex-end;gap:var(--space-sm);margin-top:var(--space-sm)}.tile-form-btn-cancel,.tile-form-btn-submit{padding:var(--space-sm) var(--space-lg);font-size:var(--font-size-base);border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--transition-fast),transform var(--transition-fast)}.tile-form-btn-cancel{color:var(--color-text);background-color:var(--color-bg-secondary);border:1px solid var(--color-border)}.tile-form-btn-cancel:hover{background-color:var(--color-border)}.tile-form-btn-submit{color:var(--color-bg);background-color:var(--color-accent);border:none}.tile-form-btn-submit:hover{background-color:var(--color-accent-hover)}.tile-form-btn-cancel:focus-visible,.tile-form-btn-submit:focus-visible{outline:none;box-shadow:0 0 0 3px #0066cc4d}.tile-form-btn-cancel:active,.tile-form-btn-submit:active{transform:scale(.98)}.tile-form-radio-group{display:flex;flex-direction:column;gap:var(--space-sm)}.tile-form-radio-label{display:flex;align-items:center;gap:var(--space-sm);font-size:var(--font-size-base);color:var(--color-text);cursor:pointer}.tile-form-radio-label input[type=radio]{width:16px;height:16px;margin:0;cursor:pointer;accent-color:var(--color-accent)}.settings-tabs{display:flex;flex-direction:column;gap:var(--space-xs);min-width:140px;padding:var(--space-sm) 0}.settings-tab{display:flex;align-items:center;gap:var(--space-sm);width:100%;padding:var(--space-sm) var(--space-md);font-size:var(--font-size-sm);font-weight:500;color:var(--color-text-secondary);text-align:left;background:none;border:none;border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--transition-fast),color var(--transition-fast)}.settings-tab:hover,.settings-tab--active{color:var(--color-text);background-color:var(--color-bg-secondary)}.settings-tab--active:before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:3px;height:60%;background-color:var(--color-accent);border-radius:0 2px 2px 0}.settings-tab{position:relative}.settings-tab:focus-visible{outline:none;box-shadow:0 0 0 2px var(--color-accent)}.settings-tab-icon{font-size:var(--font-size-base);line-height:1}.settings-tab-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.settings-tabs-separator{height:1px;margin:var(--space-sm) var(--space-md);background-color:var(--color-border)}.cs2-settings{display:flex;flex-direction:column;gap:var(--space-lg)}.cs2-settings-loading{padding:var(--space-lg);text-align:center;color:var(--color-text-secondary)}.cs2-settings-description{margin:0;font-size:var(--font-size-sm);color:var(--color-text-secondary)}.cs2-settings-field{display:flex;flex-direction:column;gap:var(--space-xs)}.cs2-settings-field-checkbox{flex-direction:row;align-items:center;gap:var(--space-sm)}.cs2-settings-field-checkbox input{width:18px;height:18px;margin:0;cursor:pointer;accent-color:var(--color-accent)}.cs2-settings-field-checkbox label{font-size:var(--font-size-base);color:var(--color-text);cursor:pointer}.cs2-settings-label{font-size:var(--font-size-sm);font-weight:500;color:var(--color-text)}.cs2-settings-select{padding:var(--space-sm) var(--space-md);font-size:var(--font-size-base);color:var(--color-text);background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer}.cs2-settings-select:focus{outline:none;border-color:var(--color-accent);box-shadow:0 0 0 3px #06c3}.cs2-settings-hint{margin:var(--space-xs) 0 0 0;font-size:var(--font-size-sm);color:var(--color-text-secondary)}.cs2-settings-chips{display:flex;flex-wrap:wrap;gap:var(--space-xs)}.cs2-settings-chips--scrollable{max-height:120px;overflow-y:auto;padding:var(--space-xs);background-color:var(--color-bg-secondary);border-radius:var(--radius-md)}.cs2-settings-chip{padding:var(--space-xs) var(--space-sm);font-size:var(--font-size-sm);color:var(--color-text-secondary);background-color:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);cursor:pointer;transition:background-color var(--transition-fast),border-color var(--transition-fast),color var(--transition-fast)}.cs2-settings-chip:hover{color:var(--color-text);border-color:var(--color-accent)}.cs2-settings-chip--active{color:#fff;background-color:var(--color-accent);border-color:var(--color-accent)}.cs2-settings-chip--active:hover{color:#fff;background-color:var(--color-accent-hover);border-color:var(--color-accent-hover)}.export-import-container{display:flex;flex-direction:column;gap:var(--space-lg)}.export-import-message{padding:var(--space-md);border-radius:var(--radius-md);font-size:var(--font-size-sm);font-weight:500;animation:slideDown var(--transition-normal)}.export-import-message--success{background-color:#d4edda;color:#155724;border:1px solid #c3e6cb}.export-import-message--error{background-color:#f8d7da;color:#721c24;border:1px solid #f5c6cb}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.export-import-section{display:flex;flex-direction:column;gap:var(--space-md)}.export-import-heading{margin:0;font-size:var(--font-size-lg);font-weight:600;color:var(--color-text)}.export-import-description{margin:0;font-size:var(--font-size-sm);color:var(--color-text-secondary);line-height:1.5}.export-import-buttons{display:flex;gap:var(--space-md);flex-wrap:wrap}.export-import-button{padding:var(--space-sm) var(--space-lg);font-size:var(--font-size-base);font-weight:500;border:none;border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--transition-fast),transform var(--transition-fast),box-shadow var(--transition-fast)}.export-import-button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 2px 8px #00000026}.export-import-button:active:not(:disabled){transform:translateY(0)}.export-import-button:disabled{opacity:.5;cursor:not-allowed}.export-import-button--primary{background-color:var(--color-accent);color:#fff}.export-import-button--primary:hover:not(:disabled){background-color:var(--color-accent-hover)}.export-import-button--primary:focus-visible{outline:none;box-shadow:0 0 0 3px #0066cc4d}.export-import-button--secondary{background-color:var(--color-bg-secondary);color:var(--color-text);border:1px solid var(--color-border)}.export-import-button--secondary:hover:not(:disabled){background-color:var(--color-border)}.export-import-divider{height:1px;background-color:var(--color-border);margin:var(--space-md) 0}.export-import-upload{display:flex;flex-direction:column;gap:var(--space-sm)}.export-import-upload-label{font-size:var(--font-size-sm);font-weight:500;color:var(--color-text)}.export-import-file-input{padding:var(--space-sm);font-size:var(--font-size-base);color:var(--color-text);background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;transition:border-color var(--transition-fast),background-color var(--transition-fast)}.export-import-file-input:hover{border-color:var(--color-accent);background-color:var(--color-bg)}.export-import-file-input:focus-visible{outline:none;border-color:var(--color-accent);box-shadow:0 0 0 3px #06c3}.export-import-file-input::file-selector-button{padding:var(--space-xs) var(--space-md);margin-right:var(--space-md);background-color:var(--color-accent);color:#fff;border:none;border-radius:var(--radius-sm);font-weight:500;cursor:pointer;transition:background-color var(--transition-fast)}.export-import-file-input::file-selector-button:hover{background-color:var(--color-accent-hover)}.export-import-paste{display:flex;flex-direction:column;gap:var(--space-sm)}.export-import-paste-label{font-size:var(--font-size-sm);font-weight:500;color:var(--color-text)}.export-import-textarea{padding:var(--space-md);font-size:var(--font-size-sm);font-family:monospace;color:var(--color-text);background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-md);resize:vertical;transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.export-import-textarea:hover{border-color:var(--color-accent)}.export-import-textarea:focus{outline:none;border-color:var(--color-accent);box-shadow:0 0 0 3px #06c3}.export-import-textarea::placeholder{color:var(--color-text-secondary)}.export-import-warning{padding:var(--space-md);background-color:#fff3cd;color:#856404;border:1px solid #ffeeba;border-radius:var(--radius-md);font-size:var(--font-size-sm);line-height:1.5}@media(prefers-color-scheme:dark){.export-import-message--success{background-color:#1e4620;color:#9cffaa;border-color:#2d5a2e}.export-import-message--error{background-color:#4a1a1a;color:#ffb3b3;border-color:#6b2929}.export-import-warning{background-color:#3d3316;color:#ffe69c;border-color:#564a1f}.export-import-button--primary:focus-visible{box-shadow:0 0 0 3px #4da6ff4d}.export-import-textarea:focus{box-shadow:0 0 0 3px #4da6ff4d}.export-import-file-input:focus-visible{box-shadow:0 0 0 3px #4da6ff4d}}:root.theme-dark .export-import-message--success{background-color:#1e4620;color:#9cffaa;border-color:#2d5a2e}:root.theme-dark .export-import-message--error{background-color:#4a1a1a;color:#ffb3b3;border-color:#6b2929}:root.theme-dark .export-import-warning{background-color:#3d3316;color:#ffe69c;border-color:#564a1f}:root.theme-dark .export-import-button--primary:focus-visible{box-shadow:0 0 0 3px #4da6ff4d}:root.theme-dark .export-import-textarea:focus{box-shadow:0 0 0 3px #4da6ff4d}:root.theme-dark .export-import-file-input:focus-visible{box-shadow:0 0 0 3px #4da6ff4d}.theme-creator{display:flex;flex-direction:column;height:100%;max-height:80vh}.theme-creator-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:var(--space-md);border-bottom:1px solid var(--color-border);margin-bottom:var(--space-md)}.theme-creator-title{margin:0;font-size:var(--font-size-lg);font-weight:600;color:var(--color-text)}.theme-creator-close{width:32px;height:32px;display:flex;align-items:center;justify-content:center;font-size:1.25rem;color:var(--color-text-secondary);background:none;border:none;border-radius:var(--radius-sm);cursor:pointer;transition:background-color var(--transition-fast)}.theme-creator-close:hover{background-color:var(--color-bg-secondary)}.theme-creator-content{flex:1;overflow-y:auto;padding-right:var(--space-sm)}.theme-creator-field{margin-bottom:var(--space-lg)}.theme-creator-label{display:block;margin-bottom:var(--space-xs);font-size:var(--font-size-base);font-weight:500;color:var(--color-text)}.theme-creator-input{width:100%;padding:var(--space-sm) var(--space-md);font-size:var(--font-size-base);color:var(--color-text);background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-md);transition:border-color var(--transition-fast)}.theme-creator-input:focus{outline:none;border-color:var(--color-accent)}.theme-creator-section{margin-bottom:var(--space-lg);padding-bottom:var(--space-lg);border-bottom:1px solid var(--color-border)}.theme-creator-section:last-child{border-bottom:none}.theme-creator-section-title{margin:0 0 var(--space-md) 0;font-size:var(--font-size-base);font-weight:600;color:var(--color-text)}.theme-creator-colors{display:flex;flex-direction:column;gap:var(--space-md)}.theme-creator-color-field{display:flex;justify-content:space-between;align-items:center;gap:var(--space-md)}.theme-creator-color-info{flex:1}.theme-creator-color-label{display:block;font-size:var(--font-size-base);font-weight:500;color:var(--color-text)}.theme-creator-color-description{display:block;font-size:var(--font-size-sm);color:var(--color-text-secondary)}.theme-creator-color-input-group{display:flex;gap:var(--space-sm);align-items:center}.theme-creator-color-picker{width:48px;height:48px;padding:0;border:2px solid var(--color-border);border-radius:var(--radius-sm);cursor:pointer}.theme-creator-color-text{width:100px;padding:var(--space-sm);font-size:var(--font-size-sm);font-family:monospace;color:var(--color-text);background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-sm);transition:border-color var(--transition-fast)}.theme-creator-color-text:focus{outline:none;border-color:var(--color-accent)}.theme-creator-advanced-toggle{width:100%;padding:var(--space-sm) var(--space-md);font-size:var(--font-size-base);font-weight:500;text-align:left;color:var(--color-text);background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--transition-fast)}.theme-creator-advanced-toggle:hover{background-color:var(--color-border)}.theme-creator-advanced{margin-top:var(--space-md)}.theme-creator-advanced-description{margin:0 0 var(--space-md) 0;font-size:var(--font-size-sm);color:var(--color-text-secondary)}.theme-creator-textarea{width:100%;padding:var(--space-md);font-size:var(--font-size-sm);font-family:Monaco,Menlo,Ubuntu Mono,Consolas,monospace;color:var(--color-text);background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-md);resize:vertical;transition:border-color var(--transition-fast)}.theme-creator-textarea:focus{outline:none;border-color:var(--color-accent)}.theme-creator-preview{padding:var(--space-lg);border-radius:var(--radius-md);border:2px solid var(--color-border)}.theme-creator-preview-card{padding:var(--space-lg);border-radius:var(--radius-md);border:1px solid}.theme-creator-preview-card h3{margin:0 0 var(--space-sm) 0;font-size:var(--font-size-lg)}.theme-creator-preview-card p{margin:0 0 var(--space-md) 0;font-size:var(--font-size-base)}.theme-creator-preview-button{padding:var(--space-sm) var(--space-lg);font-size:var(--font-size-base);font-weight:500;border:none;border-radius:var(--radius-md);cursor:pointer}.theme-creator-actions{display:flex;justify-content:flex-end;gap:var(--space-sm);padding-top:var(--space-md);border-top:1px solid var(--color-border);margin-top:var(--space-md)}.theme-creator-button{padding:var(--space-sm) var(--space-lg);font-size:var(--font-size-base);font-weight:500;border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--transition-fast),transform var(--transition-fast)}.theme-creator-button:active{transform:scale(.98)}.theme-creator-button--secondary{color:var(--color-text);background-color:var(--color-bg-secondary);border:1px solid var(--color-border)}.theme-creator-button--secondary:hover{background-color:var(--color-border)}.theme-creator-button--primary{color:#fff;background-color:var(--color-accent);border:none}.theme-creator-button--primary:hover{background-color:var(--color-accent-hover)}.theme-creator-button:focus-visible{outline:none;box-shadow:0 0 0 3px #0066cc4d}.theme-create-button{width:100%;padding:var(--space-md);font-size:var(--font-size-base);font-weight:500;color:var(--color-accent);background-color:var(--color-bg-secondary);border:2px dashed var(--color-border);border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--transition-fast),border-color var(--transition-fast);margin-bottom:var(--space-lg)}.theme-create-button:hover{background-color:var(--color-border);border-color:var(--color-accent)}.theme-create-button:focus-visible{outline:none;box-shadow:0 0 0 3px #0066cc4d}.theme-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:var(--space-md)}.theme-card{position:relative;border:2px solid var(--color-border);border-radius:var(--radius-md);overflow:hidden;cursor:pointer;transition:border-color var(--transition-fast),transform var(--transition-fast),box-shadow var(--transition-fast)}.theme-card:hover{border-color:var(--color-accent);transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.theme-card:focus-visible{outline:none;border-color:var(--color-accent);box-shadow:0 0 0 3px #0066cc4d}.theme-card--selected{border-color:var(--color-accent);border-width:3px}.theme-preview{width:100%;aspect-ratio:16 / 10;overflow:hidden}.theme-preview-bg{width:100%;height:100%;display:flex;align-items:center;justify-content:center;padding:var(--space-sm)}.theme-preview-card{width:80%;height:70%;border-radius:6px;border:1px solid;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}.theme-preview-text{font-size:1.5rem;font-weight:600}.theme-preview-accent{width:40px;height:4px;border-radius:2px}.theme-preview--system{background:linear-gradient(135deg,#f5f5f5 50%,#2a2a2a 50%)}.theme-preview-system-split{width:100%;height:100%;display:flex}.theme-preview-system-light{flex:1;background:linear-gradient(135deg,#fff,#e0e0e0)}.theme-preview-system-dark{flex:1;background:linear-gradient(135deg,#1a1a1a,#404040)}.theme-card-info{padding:var(--space-sm) var(--space-md);background-color:var(--color-bg)}.theme-card-name{font-size:var(--font-size-base);font-weight:500;color:var(--color-text);margin-bottom:var(--space-xs)}.theme-card-actions{display:flex;gap:var(--space-xs);margin-top:var(--space-xs)}.theme-card-action-button{flex:1;padding:var(--space-xs) var(--space-sm);font-size:var(--font-size-sm);color:var(--color-text-secondary);background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-sm);cursor:pointer;transition:background-color var(--transition-fast),color var(--transition-fast)}.theme-card-action-button:hover{color:var(--color-text);background-color:var(--color-border)}.theme-card-action-button--danger:hover{color:#fff;background-color:#c00;border-color:#c00}.theme-card-selected-badge{position:absolute;top:var(--space-sm);right:var(--space-sm);padding:var(--space-xs) var(--space-sm);font-size:var(--font-size-sm);font-weight:500;color:#fff;background-color:var(--color-accent);border-radius:var(--radius-sm);box-shadow:0 2px 4px #0003}.background-label{display:block;margin-bottom:var(--space-xs);font-size:var(--font-size-base);font-weight:500;color:var(--color-text)}.background-field{margin-bottom:var(--space-lg)}.background-preview-section{margin-bottom:var(--space-lg);padding-bottom:var(--space-lg);border-bottom:1px solid var(--color-border)}.background-preview{position:relative;width:100%;height:200px;border-radius:var(--radius-md);overflow:hidden;background-color:var(--color-bg-secondary);border:2px solid var(--color-border)}.background-preview-image{width:100%;height:100%;background-size:cover;background-position:center;background-repeat:no-repeat}.background-preview-info{position:absolute;bottom:var(--space-sm);right:var(--space-sm);padding:var(--space-xs) var(--space-sm);background-color:#000000b3;color:#fff;border-radius:var(--radius-sm);font-size:var(--font-size-sm)}.background-preview-opacity{font-weight:500}.background-opacity-control{display:flex;align-items:center;gap:var(--space-md)}.background-slider{flex:1;height:6px;border-radius:3px;background:var(--color-border);outline:none;-webkit-appearance:none}.background-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:var(--color-accent);cursor:pointer;transition:transform var(--transition-fast)}.background-slider::-webkit-slider-thumb:hover{transform:scale(1.2)}.background-slider::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--color-accent);cursor:pointer;border:none;transition:transform var(--transition-fast)}.background-slider::-moz-range-thumb:hover{transform:scale(1.2)}.background-opacity-value{min-width:45px;font-size:var(--font-size-base);font-weight:500;color:var(--color-text);text-align:right}.background-upload-area{display:flex;align-items:center;gap:var(--space-md)}.background-file-input{display:none}.background-upload-button{padding:var(--space-sm) var(--space-lg);font-size:var(--font-size-base);font-weight:500;color:var(--color-text);background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--transition-fast),border-color var(--transition-fast)}.background-upload-button:hover{background-color:var(--color-border);border-color:var(--color-accent)}.background-upload-button:focus-visible{outline:none;box-shadow:0 0 0 3px #0066cc4d}.background-upload-hint{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.background-url-input-group{display:flex;gap:var(--space-sm)}.background-url-input{flex:1;padding:var(--space-sm) var(--space-md);font-size:var(--font-size-base);color:var(--color-text);background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-md);transition:border-color var(--transition-fast)}.background-url-input:focus{outline:none;border-color:var(--color-accent)}.background-url-input:disabled{opacity:.5;cursor:not-allowed}.background-url-button{padding:var(--space-sm) var(--space-lg);font-size:var(--font-size-base);font-weight:500;color:#fff;background-color:var(--color-accent);border:none;border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--transition-fast),transform var(--transition-fast);white-space:nowrap}.background-url-button:hover:not(:disabled){background-color:var(--color-accent-hover)}.background-url-button:active:not(:disabled){transform:scale(.98)}.background-url-button:disabled{opacity:.5;cursor:not-allowed}.background-url-button:focus-visible{outline:none;box-shadow:0 0 0 3px #0066cc4d}.background-url-error{margin:var(--space-xs) 0 0 0;font-size:var(--font-size-sm);color:#c00}.background-remove-button{width:100%;padding:var(--space-sm) var(--space-md);font-size:var(--font-size-base);font-weight:500;color:#fff;background-color:#c00;border:none;border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--transition-fast),transform var(--transition-fast)}.background-remove-button:hover{background-color:#a00}.background-remove-button:active{transform:scale(.98)}.background-remove-button:focus-visible{outline:none;box-shadow:0 0 0 3px #cc00004d}.settings-layout{display:flex;gap:var(--space-lg);min-height:300px}.settings-content{flex:1;min-width:0}.settings-form{display:flex;flex-direction:column;gap:var(--space-lg)}.settings-description{margin:0 0 var(--space-md) 0;font-size:var(--font-size-sm);color:var(--color-text-secondary)}.settings-field{display:flex;flex-direction:column;gap:var(--space-xs)}.settings-field-checkbox{flex-direction:row;align-items:center;gap:var(--space-sm)}.settings-label{font-size:var(--font-size-sm);font-weight:500;color:var(--color-text)}.settings-label-checkbox{font-size:var(--font-size-base);font-weight:400;color:var(--color-text);cursor:pointer}.settings-select{padding:var(--space-sm) var(--space-md);font-size:var(--font-size-base);color:var(--color-text);background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.settings-select:hover{border-color:var(--color-accent)}.settings-select:focus{outline:none;border-color:var(--color-accent);box-shadow:0 0 0 3px #06c3}.settings-checkbox{width:18px;height:18px;margin:0;cursor:pointer;accent-color:var(--color-accent)}.extension-toggle{display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);padding:var(--space-md);background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-md)}.extension-toggle-info{display:flex;align-items:center;gap:var(--space-sm)}.extension-toggle-icon{font-size:var(--font-size-lg)}.extension-toggle-text{display:flex;flex-direction:column;gap:2px}.extension-toggle-name{font-size:var(--font-size-base);font-weight:500;color:var(--color-text)}.extension-toggle-description{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.extension-toggle-switch{position:relative;display:inline-block;width:44px;height:24px;flex-shrink:0}.extension-toggle-switch input{opacity:0;width:0;height:0}.extension-toggle-slider{position:absolute;cursor:pointer;inset:0;background-color:var(--color-border);border-radius:24px;transition:background-color var(--transition-fast)}.extension-toggle-slider:before{content:"";position:absolute;height:18px;width:18px;left:3px;bottom:3px;background-color:#fff;border-radius:50%;transition:transform var(--transition-fast)}.extension-toggle-switch input:checked+.extension-toggle-slider{background-color:var(--color-accent)}.extension-toggle-switch input:checked+.extension-toggle-slider:before{transform:translate(20px)}.extension-toggle-switch input:focus-visible+.extension-toggle-slider{box-shadow:0 0 0 3px #0066cc4d}.settings-section-header{display:flex;align-items:center;gap:var(--space-sm);margin-bottom:var(--space-sm);font-size:var(--font-size-sm);font-weight:600;color:var(--color-text);text-transform:uppercase;letter-spacing:.05em}@media(prefers-color-scheme:dark){.settings-select:focus{box-shadow:0 0 0 3px #4da6ff4d}}.sticky-header{position:sticky;top:0;z-index:100;background-color:var(--color-bg);padding:var(--space-lg);transition:all var(--transition-normal);width:100%}.sticky-header-content{display:flex;flex-direction:column;align-items:center;gap:var(--space-lg);transition:all var(--transition-normal);width:100%}.sticky-header--collapsed{padding:var(--space-sm) var(--space-lg);box-shadow:0 2px 8px #0000001a}.sticky-header--collapsed .sticky-header-content{flex-direction:row;justify-content:space-between;align-items:center;gap:var(--space-md);width:100%}.sticky-header--collapsed .tile-grid{display:none}.sticky-header--collapsed .search-bar{flex:1;max-width:400px;margin:0}.sticky-header--collapsed .search-input{padding:var(--space-sm) var(--space-md);font-size:var(--font-size-sm);border-radius:var(--radius-md)}.sticky-header-mini-tiles{display:flex;align-items:center;gap:var(--space-xs);flex-shrink:0}.mini-tile{display:flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--transition-fast),border-color var(--transition-fast),transform var(--transition-fast)}.mini-tile:hover{background-color:var(--color-border);border-color:var(--color-text-secondary);transform:scale(1.05)}.mini-tile:focus-visible{outline:none;box-shadow:0 0 0 2px var(--color-accent)}.mini-tile-icon{width:18px;height:18px;object-fit:contain;border-radius:2px}.mini-tile-initial{font-size:var(--font-size-sm);font-weight:600;color:var(--color-text);line-height:1}.sticky-header-more-tiles{display:flex;align-items:center;justify-content:center;min-width:32px;height:32px;padding:0 var(--space-xs);font-size:var(--font-size-sm);color:var(--color-text-secondary);background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-md)}.sticky-header-expand,.sticky-header-collapse{display:flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;flex-shrink:0;color:var(--color-text-secondary);background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--transition-fast),color var(--transition-fast),border-color var(--transition-fast)}.sticky-header-expand:hover,.sticky-header-collapse:hover{color:var(--color-text);background-color:var(--color-border);border-color:var(--color-text-secondary)}.sticky-header-expand:focus-visible,.sticky-header-collapse:focus-visible{outline:none;box-shadow:0 0 0 3px #0066cc4d}@media(prefers-color-scheme:dark){.sticky-header--collapsed{box-shadow:0 2px 8px #0000004d}}:root.theme-dark .sticky-header--collapsed{box-shadow:0 2px 8px #0000004d}.extension-shelf-container{width:100%;max-width:1400px;margin:0 auto;padding:var(--space-lg)}.extension-shelf{background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden}.extension-shelf-header{display:flex;align-items:center;justify-content:space-between;width:100%;padding:var(--space-md) var(--space-lg);background-color:var(--color-bg-secondary);border:none;cursor:pointer;transition:background-color var(--transition-fast)}.extension-shelf-header:hover{background-color:var(--color-bg)}.extension-shelf-header:focus-visible{outline:none;box-shadow:inset 0 0 0 2px var(--color-accent)}.extension-shelf-header-info{display:flex;align-items:center;gap:var(--space-sm)}.extension-shelf-icon{font-size:var(--font-size-lg);line-height:1}.extension-shelf-title{font-size:var(--font-size-base);font-weight:600;color:var(--color-text)}.extension-shelf-drag-handle{color:var(--color-text-secondary);opacity:.6;flex-shrink:0;cursor:grab;transition:opacity var(--transition-fast)}.extension-shelf-drag-handle:hover{opacity:1}.extension-shelf-drag-handle:active{cursor:grabbing}.extension-shelf-chevron{color:var(--color-text-secondary);transition:transform var(--transition-normal);flex-shrink:0}.extension-shelf-chevron--open{transform:rotate(180deg)}.extension-shelf-content{display:grid;grid-template-rows:1fr;transition:grid-template-rows var(--transition-normal)}.extension-shelf--collapsed .extension-shelf-content{grid-template-rows:0fr}.extension-shelf-content-inner{overflow:hidden;min-height:0}:root.reduce-motion .extension-shelf-chevron,:root.reduce-motion .extension-shelf-content{transition:none}@media(prefers-reduced-motion:reduce){.extension-shelf-chevron,.extension-shelf-content{transition:none}}.extension-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-md);padding:var(--space-xl) var(--space-lg);color:var(--color-text-secondary)}.extension-loading-spinner{width:32px;height:32px;border:3px solid var(--color-border);border-top-color:var(--color-accent);border-radius:50%;animation:extension-spin .8s linear infinite}@keyframes extension-spin{to{transform:rotate(360deg)}}:root.reduce-motion .extension-loading-spinner{animation:none}@media(prefers-reduced-motion:reduce){.extension-loading-spinner{animation:none}}.extension-error{display:flex;align-items:flex-start;gap:var(--space-md);padding:var(--space-lg);background-color:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-lg);border-left:4px solid #e74c3c}.extension-error-icon{font-size:var(--font-size-xl);line-height:1}.extension-error-content{flex:1;display:flex;flex-direction:column;gap:var(--space-sm)}.extension-error-title{margin:0;font-size:var(--font-size-base);font-weight:600;color:var(--color-text)}.extension-error-message{margin:0;font-size:var(--font-size-sm);color:var(--color-text-secondary);font-family:monospace}.extension-error-retry{align-self:flex-start;margin-top:var(--space-sm);padding:var(--space-xs) var(--space-md);font-size:var(--font-size-sm);color:#fff;background-color:var(--color-accent);border:none;border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--transition-fast)}.extension-error-retry:hover{background-color:var(--color-accent-hover)}.extension-error-retry:focus-visible{outline:none;box-shadow:0 0 0 3px #0066cc4d}
