:root{--color-primary: #16a34a;--color-primary-dark: #15803d;--color-primary-light: #dcfce7;--color-secondary: #eab308;--color-secondary-dark: #ca8a04;--color-accent: #f59e0b;--color-bg: #f7fdf9;--color-surface: #ffffff;--color-border: #d1fae5;--color-text: #14532d;--color-text-muted: #6b7280;--color-error: #dc2626;--color-error-bg: #fef2f2;--color-success: #16a34a;--font-family: "Segoe UI", system-ui, -apple-system, sans-serif;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-md: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 1.875rem;--line-height-tight: 1.25;--line-height-normal: 1.6;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--space-16: 4rem;--radius-sm: .375rem;--radius-md: .75rem;--radius-lg: 1rem;--radius-xl: 1.5rem;--radius-full: 9999px;--border-width: 1px;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--transition-fast: .15s ease;--transition-normal: .25s ease;--content-max-width: 480px;--header-height: 56px}@media(prefers-color-scheme:dark){:root{--color-bg: #071a0c;--color-surface: #0f2415;--color-border: #1a3d22;--color-text: #f0fdf4;--color-text-muted: #9ca3af;--color-primary-light: #14532d;--color-error-bg: #3b0a0a}}[hidden]{display:none!important}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;scroll-behavior:smooth;-webkit-text-size-adjust:100%}body{font-family:var(--font-family);font-size:var(--font-size-md);line-height:var(--line-height-normal);color:var(--color-text);background:var(--color-bg);min-height:100dvh;display:flex;flex-direction:column}img{display:block;max-width:100%;height:auto}button{font-family:inherit;cursor:pointer}a{color:var(--color-primary);text-decoration:none}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.app-header{background:var(--color-surface);border-bottom:var(--border-width) solid var(--color-border);position:sticky;top:0;z-index:100;height:var(--header-height);box-shadow:var(--shadow-sm)}.app-header__inner{max-width:var(--content-max-width);margin:0 auto;padding:0 var(--space-4);height:100%;display:flex;align-items:center;justify-content:space-between}.app-header__brand{display:flex;align-items:center;gap:var(--space-2)}.app-header__logo{font-size:var(--font-size-xl)}.app-header__name{font-size:var(--font-size-lg);font-weight:700;color:var(--color-primary);letter-spacing:-.02em}.credit-badge{display:flex;align-items:center;gap:var(--space-1);background:var(--color-primary-light);color:var(--color-primary-dark);border-radius:var(--radius-full);padding:var(--space-1) var(--space-3);font-size:var(--font-size-sm);font-weight:600;transition:opacity var(--transition-normal)}.credit-badge--hidden{opacity:0;pointer-events:none}.credit-badge__count{font-size:var(--font-size-md)}.app-main{flex:1;display:flex;flex-direction:column;align-items:center;padding:var(--space-6) var(--space-4) var(--space-12);width:100%}.app-footer{text-align:center;padding:var(--space-4);font-size:var(--font-size-sm);color:var(--color-text-muted);border-top:var(--border-width) solid var(--color-border);display:flex;flex-direction:column;align-items:center;gap:var(--space-2)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-3) var(--space-6);border-radius:var(--radius-md);font-size:var(--font-size-md);font-weight:600;border:2px solid transparent;text-decoration:none;transition:background var(--transition-fast),color var(--transition-fast),border-color var(--transition-fast),opacity var(--transition-fast),transform var(--transition-fast);white-space:nowrap}.btn:active{transform:scale(.97)}.btn:disabled{opacity:.45;cursor:not-allowed;transform:none}.btn--primary{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}.btn--primary:not(:disabled):hover{background:var(--color-primary-dark);border-color:var(--color-primary-dark)}.btn--secondary{background:var(--color-secondary);color:#fff;border-color:var(--color-secondary)}.btn--secondary:not(:disabled):hover{background:var(--color-secondary-dark);border-color:var(--color-secondary-dark)}.btn--ghost{background:transparent;color:var(--color-text-muted);border-color:var(--color-border)}.btn--ghost:not(:disabled):hover{background:var(--color-border);color:var(--color-text)}.btn--full{width:100%}.btn--sm{padding:var(--space-1) var(--space-3);font-size:var(--font-size-sm)}.btn--face{display:inline-flex;align-items:center;gap:var(--space-2);background:var(--color-surface);color:var(--color-text);border:2px solid var(--face-colour, var(--color-border));border-radius:var(--radius-md);padding:var(--space-3) var(--space-5);font-size:var(--font-size-md);font-weight:600;flex:1 1 auto;min-width:100px}.btn--face:not(:disabled):hover{background:color-mix(in srgb,var(--face-colour, var(--color-primary)) 15%,transparent)}.btn--face__badge{display:inline-block;width:14px;height:14px;border-radius:3px;flex-shrink:0}.auth-section{width:100%;max-width:var(--content-max-width);display:flex;justify-content:center}.auth-card{background:var(--color-surface);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);padding:var(--space-8) var(--space-6);width:100%;text-align:center}.auth-card__brand{font-size:3rem;margin-bottom:var(--space-3)}.auth-card__title{font-size:var(--font-size-3xl);font-weight:800;color:var(--color-primary);letter-spacing:-.03em;margin-bottom:var(--space-2)}.auth-card__subtitle{color:var(--color-text-muted);margin-bottom:var(--space-6);font-size:var(--font-size-md)}.auth-card__privacy{margin-top:var(--space-6);font-size:var(--font-size-xs);color:var(--color-text-muted)}.auth-form{display:flex;flex-direction:column;gap:var(--space-4);text-align:left}.form-field{display:flex;flex-direction:column;gap:var(--space-1)}.form-field__label{font-size:var(--font-size-sm);font-weight:600;color:var(--color-text)}.form-field__input{padding:var(--space-3) var(--space-4);border:2px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--font-size-md);font-family:inherit;color:var(--color-text);background:var(--color-bg);transition:border-color var(--transition-fast);width:100%}.form-field__input:focus{outline:none;border-color:var(--color-primary)}.auth-form__error{color:var(--color-error);font-size:var(--font-size-sm);background:var(--color-error-bg);border-radius:var(--radius-sm);padding:var(--space-2) var(--space-3)}.auth-form__divider{text-align:center;color:var(--color-text-muted);font-size:var(--font-size-sm);margin:0}.btn--google{background:var(--color-surface);color:var(--color-text);border:2px solid var(--color-border)}.btn--google:not(:disabled):hover{background:var(--color-border);border-color:var(--color-text-muted)}.wizard-section{width:100%;max-width:var(--content-max-width)}.wizard{width:100%}.wizard__loading{display:flex;justify-content:center;padding:var(--space-16)}.wizard__step{background:var(--color-surface);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);padding:var(--space-6);display:flex;flex-direction:column;gap:var(--space-5)}.wizard__step-header{display:flex;flex-direction:column;gap:var(--space-2)}.wizard__progress{height:6px;background:var(--color-border);border-radius:var(--radius-full);overflow:hidden}.wizard__progress-bar{height:100%;width:var(--progress, 0%);background:linear-gradient(90deg,var(--color-primary),var(--color-secondary));border-radius:var(--radius-full);transition:width var(--transition-normal)}.wizard__title{font-size:var(--font-size-2xl);font-weight:800;color:var(--color-text);letter-spacing:-.02em}.wizard__subtitle{color:var(--color-text-muted);font-size:var(--font-size-sm)}.wizard__nav{display:flex;align-items:center;justify-content:space-between;padding-top:var(--space-2)}.wizard__credit-note{text-align:center;font-size:var(--font-size-sm);color:var(--color-text-muted)}.wizard__cost-notice{font-size:var(--font-size-sm);color:var(--color-text-muted);text-align:center;background:var(--color-primary-light);border-radius:var(--radius-sm);padding:var(--space-2) var(--space-3)}.upload-form{display:flex;flex-direction:column;gap:var(--space-4)}.upload-form__file-input{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden;clip:rect(0,0,0,0)}.upload-dropzone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-2);border:2px dashed var(--color-border);border-radius:var(--radius-lg);padding:var(--space-8) var(--space-4);cursor:pointer;transition:border-color var(--transition-fast),background var(--transition-fast);min-height:180px;text-align:center}.upload-dropzone:hover,.upload-dropzone:focus-within{border-color:var(--color-primary);background:var(--color-primary-light)}.upload-dropzone__icon{font-size:2.5rem}.upload-dropzone__primary{font-weight:600;color:var(--color-text)}.upload-dropzone__secondary{font-size:var(--font-size-sm);color:var(--color-text-muted)}.upload-dropzone__preview{width:100%;margin-top:var(--space-3)}.upload-dropzone__preview img{max-height:200px;width:auto;margin:0 auto;border-radius:var(--radius-md);box-shadow:var(--shadow-md)}.upload-form__error{color:var(--color-error);font-size:var(--font-size-sm);background:var(--color-error-bg);border-radius:var(--radius-sm);padding:var(--space-2) var(--space-3)}.face-select{display:flex;flex-direction:column;gap:var(--space-4)}.face-select__image-wrap{border-radius:var(--radius-lg);overflow:hidden;background:var(--color-bg);box-shadow:var(--shadow-md)}.face-select__image{width:100%;height:auto;max-height:380px;object-fit:contain}.face-select__form{display:flex;flex-direction:column;gap:var(--space-3)}.face-buttons{border:none;display:flex;flex-wrap:wrap;gap:var(--space-3)}.face-buttons__legend{font-size:var(--font-size-sm);font-weight:600;color:var(--color-text-muted);margin-bottom:var(--space-2);width:100%}.accessory-picker{display:flex;flex-direction:column;gap:var(--space-5)}.accessory-grid{border:none;display:flex;flex-direction:column;gap:var(--space-5)}.accessory-grid__group{display:flex;flex-direction:column;gap:var(--space-3)}.accessory-grid__group-title{font-size:var(--font-size-sm);font-weight:700;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em}.accessory-grid__items{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-3)}.accessory-card{cursor:pointer}.accessory-card__input{position:absolute;opacity:0;width:0;height:0}.accessory-card__inner{display:flex;flex-direction:column;align-items:center;gap:var(--space-2);padding:var(--space-3);border:2px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-surface);transition:border-color var(--transition-fast),background var(--transition-fast),box-shadow var(--transition-fast)}.accessory-card:hover .accessory-card__inner{border-color:var(--color-primary);background:var(--color-primary-light)}.accessory-card__input:checked+.accessory-card__inner{border-color:var(--color-primary);background:var(--color-primary-light);box-shadow:0 0 0 3px var(--color-primary) / .2}.accessory-card__input:focus-visible+.accessory-card__inner{outline:3px solid var(--color-primary);outline-offset:2px}.accessory-card__img{width:80px;height:80px;object-fit:contain}.accessory-card__label{font-size:var(--font-size-xs);font-weight:600;color:var(--color-text);text-align:center}.result{display:flex;flex-direction:column;gap:var(--space-5)}.result__image-wrap{border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-lg)}.result__image{width:100%;height:auto}.result__actions{display:flex;flex-direction:column;gap:var(--space-3)}.result__privacy-note{font-size:var(--font-size-xs);color:var(--color-text-muted);text-align:center}.empty-state{display:flex;flex-direction:column;align-items:center;gap:var(--space-4);padding:var(--space-10) var(--space-4);text-align:center}.empty-state__icon{font-size:3rem}.empty-state__title{font-size:var(--font-size-xl);font-weight:700}.empty-state__body{color:var(--color-text-muted);max-width:300px}.empty-state--error .empty-state__title{color:var(--color-error)}.spinner{display:inline-block;width:20px;height:20px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .75s linear infinite}.spinner--lg{width:40px;height:40px;border-width:3px}.spinner-overlay{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#0006;z-index:999;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.result-download-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:var(--space-4)}.result-download-modal[hidden]{display:none!important}.result-download-modal__backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:#00000080;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);cursor:pointer}.result-download-modal__content{position:relative;background:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);padding:var(--space-6);max-width:360px;width:100%;display:flex;flex-direction:column;gap:var(--space-4)}.result-download-modal__title{font-size:var(--font-size-lg);font-weight:700;color:var(--color-text);margin:0}.result-download-modal__desc{font-size:var(--font-size-md);color:var(--color-text-muted);margin:0;line-height:var(--line-height-normal)}.result-download-modal__actions{display:flex;flex-direction:column;gap:var(--space-2)}.htmx-indicator{display:none}.htmx-request .htmx-indicator,.htmx-indicator.htmx-request{display:flex}@keyframes spin{to{transform:rotate(360deg)}}@media(min-width:480px){.auth-card{padding:var(--space-10) var(--space-8)}.wizard__step{padding:var(--space-8)}.accessory-grid__items{grid-template-columns:repeat(4,1fr)}.accessory-card__img{width:72px;height:72px}}@media(min-width:768px){:root{--content-max-width: 560px}.face-buttons{flex-wrap:nowrap}}@media(min-width:1024px){:root{--content-max-width: 600px}.app-main{padding-top:var(--space-10)}}