.test-page.svelte-yzhnh5{min-height:100vh;background:var(--color-bg, #f5f5f5);padding:1rem}.test-container.svelte-yzhnh5{max-width:1920px;margin:0 auto;display:grid;grid-template-columns:400px 1fr;gap:1rem;height:calc(100vh - 2rem)}.controls-panel.svelte-yzhnh5{background:var(--color-surface, #fff);border-radius:8px;padding:1.5rem;overflow-y:auto;border:1px solid var(--color-border, #ccc)}.panel-header.svelte-yzhnh5{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1.5rem}.panel-header.svelte-yzhnh5 h1:where(.svelte-yzhnh5){font-size:1.5rem;font-weight:600;margin:0;color:var(--color-text, #111)}.nav-link-back.svelte-yzhnh5{padding:.375rem .75rem;background:transparent;color:var(--color-primary, #3b82f6);text-decoration:none;border:1px solid var(--color-primary, #3b82f6);border-radius:4px;font-size:.875rem;font-weight:500;transition:all .2s;white-space:nowrap}.nav-link-back.svelte-yzhnh5:hover{background:var(--color-primary, #3b82f6);color:#fff}.panel-section.svelte-yzhnh5{margin-bottom:2rem;padding-bottom:1.5rem;border-bottom:1px solid var(--color-border, #ccc)}.panel-section.svelte-yzhnh5:last-child{border-bottom:none;margin-bottom:0}.panel-section.svelte-yzhnh5 h2:where(.svelte-yzhnh5){font-size:1rem;font-weight:600;margin:0 0 1rem;color:var(--color-text, #111);text-transform:uppercase;letter-spacing:.5px}.panel-section.svelte-yzhnh5 h3:where(.svelte-yzhnh5){font-size:.875rem;font-weight:600;margin:0 0 .75rem;color:var(--color-text-muted, #666)}.selected-mockup.svelte-yzhnh5{display:flex;flex-direction:column;gap:.75rem}.mockup-info.svelte-yzhnh5 h3:where(.svelte-yzhnh5){font-size:1rem;font-weight:600;margin:0 0 .25rem;color:var(--color-text, #111)}.mockup-details.svelte-yzhnh5{font-size:.875rem;color:var(--color-text-muted, #666);margin:0}.no-mockup.svelte-yzhnh5{text-align:center;padding:2rem 0}.no-mockup.svelte-yzhnh5 p:where(.svelte-yzhnh5){margin:0 0 1rem;color:var(--color-text-muted, #666)}.btn.svelte-yzhnh5{padding:.5rem 1rem;border:none;border-radius:6px;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;justify-content:center}.btn-primary.svelte-yzhnh5{background:var(--color-primary, #3b82f6);color:#fff}.btn-primary.svelte-yzhnh5:hover:not(:disabled){background:var(--color-primary-dark, #2563eb)}.btn-primary.svelte-yzhnh5:disabled{opacity:.5;cursor:not-allowed}.btn-secondary.svelte-yzhnh5{background:transparent;color:var(--color-primary, #3b82f6);border:1px solid var(--color-primary, #3b82f6)}.btn-secondary.svelte-yzhnh5:hover{background:var(--color-primary, #3b82f6);color:#fff}.btn-small.svelte-yzhnh5{padding:.25rem .5rem;font-size:.75rem}.btn-danger.svelte-yzhnh5{background:#ef4444;color:#fff}.btn-danger.svelte-yzhnh5:hover{background:#dc2626}.layer-keys-list.svelte-yzhnh5{display:flex;flex-direction:column;gap:.5rem}.layer-key-item.svelte-yzhnh5{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.5rem;background:var(--color-surface-alt, #f5f5f5);border-radius:4px}.layer-key-info.svelte-yzhnh5{display:flex;flex-direction:column;gap:.25rem;flex:1}.layer-key-actions.svelte-yzhnh5{display:flex;align-items:center;gap:.5rem}.layer-key-name.svelte-yzhnh5{font-size:.875rem;font-weight:500;color:var(--color-text, #111)}.layer-key-code.svelte-yzhnh5{font-size:.75rem;font-family:monospace;background:var(--color-surface, #fff);padding:.125rem .375rem;border-radius:3px;color:var(--color-text-muted, #666)}.override-badge.svelte-yzhnh5{font-size:.75rem;padding:.125rem .5rem;background:var(--color-primary, #3b82f6);color:#fff;border-radius:3px}.upload-section.svelte-yzhnh5{margin-bottom:1.5rem;padding-bottom:1.5rem;border-bottom:1px solid var(--color-border, #ccc)}.upload-section.svelte-yzhnh5 h3:where(.svelte-yzhnh5),.url-section.svelte-yzhnh5 h3:where(.svelte-yzhnh5){font-size:.875rem;font-weight:600;margin:0 0 .75rem;color:var(--color-text-muted, #666);text-transform:uppercase;letter-spacing:.5px}.upload-form.svelte-yzhnh5{display:flex;flex-direction:column;gap:.75rem}.upload-btn.svelte-yzhnh5{width:100%;justify-content:center;cursor:pointer}.url-section.svelte-yzhnh5{margin-top:1rem}.override-form.svelte-yzhnh5{display:flex;flex-direction:column;gap:.75rem}.form-group.svelte-yzhnh5{display:flex;flex-direction:column;gap:.25rem}.form-group.svelte-yzhnh5 label:where(.svelte-yzhnh5){font-size:.75rem;font-weight:500;color:var(--color-text-muted, #666);text-transform:uppercase;letter-spacing:.5px}.form-input.svelte-yzhnh5{padding:.5rem;border:1px solid var(--color-border, #ccc);border-radius:4px;font-size:.875rem;font-family:inherit}.form-input.svelte-yzhnh5:focus,.form-select.svelte-yzhnh5:focus{outline:none;border-color:var(--color-primary, #3b82f6)}.form-select.svelte-yzhnh5{padding:.5rem;border:1px solid var(--color-border, #ccc);border-radius:4px;font-size:.875rem;font-family:inherit;background:var(--color-surface, #fff);cursor:pointer}.form-select.svelte-yzhnh5:hover{border-color:var(--color-primary, #3b82f6)}.overrides-list.svelte-yzhnh5{margin-top:1rem}.override-item.svelte-yzhnh5{display:flex;flex-direction:column;gap:.5rem;padding:.75rem;background:var(--color-surface-alt, #f5f5f5);border-radius:4px;margin-bottom:.5rem}.override-item-info.svelte-yzhnh5{display:flex;flex-direction:column;gap:.5rem}.override-item-info.svelte-yzhnh5 strong:where(.svelte-yzhnh5){font-size:.875rem;color:var(--color-text, #111)}.override-preview.svelte-yzhnh5{display:flex;align-items:center;gap:.5rem}.override-preview.svelte-yzhnh5 img:where(.svelte-yzhnh5){max-width:60px;max-height:60px;border-radius:4px;object-fit:cover}.preview-text.svelte-yzhnh5{font-size:.75rem;color:var(--color-text-muted, #666);font-family:monospace;word-break:break-all}.override-item-actions.svelte-yzhnh5{display:flex;gap:.5rem}.options-list.svelte-yzhnh5{display:flex;flex-direction:column;gap:.75rem}.option-item.svelte-yzhnh5{padding:.75rem;background:var(--color-surface-alt, #f5f5f5);border-radius:4px}.option-item.svelte-yzhnh5 strong:where(.svelte-yzhnh5){display:block;margin-bottom:.5rem;font-size:.875rem;color:var(--color-text, #111)}.option-item.svelte-yzhnh5 pre:where(.svelte-yzhnh5){font-size:.75rem;margin:0;color:var(--color-text-muted, #666);overflow-x:auto}.render-panel.svelte-yzhnh5{background:var(--color-surface, #fff);border-radius:8px;padding:0;display:flex;flex-direction:column;border:1px solid var(--color-border, #ccc);overflow:hidden}.render-header.svelte-yzhnh5{padding:1.5rem 1.5rem 0;margin-bottom:0}.render-header.svelte-yzhnh5 h2:where(.svelte-yzhnh5){font-size:1rem;font-weight:600;margin:0 0 1rem;color:var(--color-text, #111);text-transform:uppercase;letter-spacing:.5px}.render-grid.svelte-yzhnh5{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem;padding:1rem;overflow-y:auto}.render-output.svelte-yzhnh5{display:flex;flex-direction:column;gap:.5rem}.render-output.svelte-yzhnh5 h3:where(.svelte-yzhnh5){font-size:.875rem;font-weight:600;margin:0;color:var(--color-text-muted, #666);text-transform:uppercase;letter-spacing:.5px}.render-container.svelte-yzhnh5{display:flex;align-items:center;justify-content:center;background:var(--color-bg, #f5f5f5);border-radius:4px;overflow:hidden;border:1px solid var(--color-border, #ccc);box-shadow:0 2px 8px #0000001a}.no-render.svelte-yzhnh5{text-align:center;color:var(--color-text-muted, #666);padding:2rem}@media(max-width:1024px){.test-container.svelte-yzhnh5{grid-template-columns:1fr;grid-template-rows:auto 1fr}.controls-panel.svelte-yzhnh5{max-height:50vh}}