.error-boundary{display:flex;align-items:center;justify-content:center;min-height:100vh;background-color:#f8f9fa;padding:20px}.error-boundary-content{max-width:600px;text-align:center;background:#fff;border-radius:12px;padding:40px;box-shadow:0 4px 6px #0000001a}.error-icon{margin-bottom:20px}.error-boundary-content h1{color:#dc3545;margin-bottom:16px;font-size:24px}.error-message{color:#666;margin-bottom:24px;font-size:16px;line-height:1.5}.suggested-actions{background-color:#f8f9fa;border-radius:8px;padding:20px;margin-bottom:24px;text-align:left}.suggested-actions h3{color:#495057;font-size:16px;margin-bottom:12px;margin-top:0}.suggested-actions ul{margin:0;padding-left:20px;color:#666}.suggested-actions li{margin-bottom:8px;line-height:1.4}.error-actions{display:flex;gap:12px;justify-content:center;margin-bottom:24px;flex-wrap:wrap}.btn-primary{background-color:#007bff;color:#fff;border:none;padding:12px 24px;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:background-color .2s ease;min-width:120px}.btn-primary:hover{background-color:#0056b3}.btn-primary:disabled{background-color:#6c757d;cursor:not-allowed}.btn-secondary{background-color:#6c757d;color:#fff;border:none;padding:12px 24px;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:background-color .2s ease;min-width:100px}.btn-secondary:hover{background-color:#545b62}.btn-link{background:none;border:none;color:#007bff;text-decoration:underline;cursor:pointer;font-size:14px;padding:0;margin-right:16px}.btn-link:hover{color:#0056b3}.error-support{display:flex;align-items:center;justify-content:center;margin-bottom:24px;padding-top:16px;border-top:1px solid #dee2e6}.error-id{font-size:12px;color:#6c757d;font-family:Monaco,Menlo,Ubuntu Mono,monospace}.error-details{text-align:left;margin-top:24px;border:1px solid #dee2e6;border-radius:8px;overflow:hidden}.error-details summary{background-color:#f8f9fa;padding:12px;cursor:pointer;font-weight:500;border-bottom:1px solid #dee2e6}.error-details summary:hover{background-color:#e9ecef}.error-info{padding:16px}.error-section{margin-bottom:20px}.error-section:last-child{margin-bottom:0}.error-section h4{color:#495057;font-size:14px;margin-bottom:8px;margin-top:0}.error-section pre{background-color:#f8f9fa;padding:12px;margin:0;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:12px;line-height:1.4;color:#495057;white-space:pre-wrap;word-break:break-word;border-radius:4px;border:1px solid #dee2e6}.error-stack{max-height:200px;overflow-y:auto}@media (max-width: 768px){.error-boundary{padding:16px}.error-boundary-content{padding:24px;max-width:100%}.error-actions{flex-direction:column;align-items:center}.error-actions button{width:100%;max-width:200px}.error-support{flex-direction:column;gap:8px}}.functionality-error{display:flex;align-items:center;justify-content:center;min-height:400px;background-color:#f8f9fa;border-radius:12px;margin:20px}.functionality-error-content{max-width:400px;text-align:center;background:#fff;border-radius:8px;padding:32px;box-shadow:0 2px 4px #0000001a;border:1px solid #dee2e6}.functionality-error-content .error-icon{margin-bottom:16px}.functionality-error-content h3{color:#dc3545;margin-bottom:12px;font-size:18px}.functionality-error-content p{color:#666;margin-bottom:20px;font-size:14px;line-height:1.5}.error-hint{background-color:#fff3cd;border:1px solid #ffeaa7;border-radius:6px;padding:16px;margin-bottom:20px;text-align:left}.error-hint p{margin-bottom:8px;color:#856404;font-size:13px;font-weight:500}.error-hint ul{margin:0;padding-left:16px;color:#856404}.error-hint li{margin-bottom:4px;font-size:12px;line-height:1.4}.functionality-error-actions{display:flex;gap:8px;justify-content:center;margin-bottom:16px;flex-wrap:wrap}.functionality-error-actions button{font-size:13px;padding:10px 20px;min-width:100px}.functionality-error .error-support{border-top:1px solid #dee2e6;padding-top:12px;margin-bottom:0}.functionality-error .error-id{font-size:11px}@media (max-width: 768px){.functionality-error{margin:16px;min-height:300px}.functionality-error-content{padding:24px}.functionality-error-actions{flex-direction:column;align-items:center}.functionality-error-actions button{width:100%;max-width:180px}}.api-key-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#0f172ae6;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;justify-content:center;align-items:center;z-index:9999;animation:fadeIn .3s ease-out}.api-key-modal{background:#1e293bf2;padding:2.5rem;border-radius:20px;width:90%;max-width:450px;box-shadow:0 20px 25px -5px #0000004d,0 0 0 1px #ffffff1a,0 0 40px #3b82f626;border:1px solid rgba(255,255,255,.1);text-align:center;animation:slideUp .4s cubic-bezier(.16,1,.3,1)}.modal-header{margin-bottom:2.5rem}.modal-logo-link{display:inline-block;margin-bottom:1rem}.modal-logo{width:auto;height:120px;max-width:100%;object-fit:contain;image-rendering:-webkit-optimize-contrast;image-rendering:crisp-edges;margin-bottom:0;border-radius:16px;box-shadow:0 0 20px #60a5fa33;transition:transform .3s ease}.modal-logo:hover{transform:scale(1.05) rotate(2deg)}.modal-header h2{color:#fff;font-size:1.75rem;margin-bottom:.75rem;background:linear-gradient(135deg,#60a5fa,#a78bfa);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;font-weight:700}.modal-header p{color:#94a3b8;font-size:.95rem;margin-bottom:0}.api-key-form{margin-bottom:2rem}.form-group{margin-bottom:1.5rem;text-align:left}.api-key-input{width:100%;padding:.875rem 1rem;background:#0f172a99;border:2px solid rgba(255,255,255,.1);border-radius:12px;color:#fff;font-size:1rem;transition:all .2s ease;outline:none}.api-key-input:focus{border-color:#60a5fa;box-shadow:0 0 0 4px #60a5fa1a;background:#0f172acc}.api-key-input.input-error{border-color:#ef4444}.error-message{color:#ef4444;font-size:.875rem;margin-top:.5rem;display:flex;align-items:center;gap:.5rem}.submit-button{width:100%;padding:1rem;background:linear-gradient(135deg,#3b82f6,#8b5cf6);color:#fff;border:none;border-radius:12px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 6px -1px #3b82f64d}.submit-button:hover{transform:translateY(-2px);box-shadow:0 10px 15px -3px #3b82f666;filter:brightness(1.1)}.submit-button:active{transform:translateY(0)}.modal-footer{border-top:1px solid rgba(255,255,255,.1);padding-top:1.5rem}.modal-footer p{color:#94a3b8;font-size:.9rem;margin-bottom:.5rem}.get-key-link{color:#60a5fa;text-decoration:none;font-weight:500;transition:color .2s;display:inline-block;margin-bottom:1rem}.get-key-link:hover{color:#93c5fd;text-decoration:underline}.security-note{font-size:.85rem!important;color:#cbd5e1!important;background:#0f172a80;padding:.875rem 1rem;border-radius:12px;border:1px solid rgba(148,163,184,.1);margin-top:1.5rem!important;display:flex;align-items:center;justify-content:center;gap:10px;font-weight:600;line-height:1.4;transition:all .3s ease}.security-note:hover{border-color:#60a5fa4d;background:#0f172ab3}.security-icon{font-size:1.1rem}.branding-footer{margin-top:1.5rem;padding-top:1rem;border-top:1px dashed rgba(255,255,255,.1);font-size:.85rem;color:#64748b;font-family:Inter,sans-serif;letter-spacing:.02em}.branding-footer a{color:#94a3b8;text-decoration:none;font-weight:600;transition:all .2s ease;position:relative;margin-left:4px}.branding-footer a:hover{color:#60a5fa;text-shadow:0 0 10px rgba(96,165,250,.3)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.sidebar{background-color:var(--text-primary);color:#fff;transition:width .3s ease;display:flex;flex-direction:column;min-height:100vh;position:relative;box-shadow:2px 0 4px #0000001a}.sidebar--open{width:280px}.sidebar--closed{width:60px}.sidebar-header{padding:60px 20px 24px;border-bottom:2px solid var(--primary-color);display:flex;flex-direction:column;gap:0;background:linear-gradient(135deg,var(--text-primary) 0%,#1a1a1a 100%);box-shadow:0 2px 8px #00000026}.sidebar-header-content{display:flex;flex-direction:column;align-items:center;gap:12px;width:100%;transition:all .3s ease}.sidebar-logo{width:auto;height:auto;max-width:220px;max-height:140px;object-fit:contain;flex-shrink:0;border-radius:12px;padding:4px;transition:all .3s ease}.sidebar-logo:hover{transform:scale(1.05)}.sidebar-header h2{color:#fff;font-size:18px;margin:0;text-align:center;line-height:1.3;transition:all .3s ease;font-weight:700;letter-spacing:.5px;text-shadow:0 2px 4px rgba(0,0,0,.2)}.sidebar--closed .sidebar-header{padding:16px 8px}.sidebar--closed .sidebar-header-content{align-items:center}.sidebar--closed .sidebar-header h2{opacity:0;font-size:0;height:0;margin:0}.sidebar--closed .sidebar-logo{width:40px;height:40px;padding:6px;box-shadow:none}.sidebar-toggle{background:none;border:none;color:var(--primary-color);font-size:18px;cursor:pointer;padding:8px;border-radius:4px;transition:all .2s ease;min-width:32px;display:flex;align-items:center;justify-content:center}.sidebar-toggle-top{position:absolute;top:12px;right:12px;z-index:10;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#fff}.sidebar-toggle:hover{background-color:var(--primary-color);color:#fff}.sidebar-toggle-top:hover{background-color:var(--primary-color);border-color:var(--primary-color)}.sidebar-nav{flex:1;padding:8px 0;overflow-y:auto}.nav-list{list-style:none;padding:0;margin:0 10px}.nav-item{margin:0;border-bottom:1px solid transparent}.nav-button{width:100%;background:none;border:none;color:#bdc3c7;padding:8px 16px;text-align:left;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:10px;font-size:13px;position:relative;min-height:40px;margin:1px 0}.nav-button:hover{background-color:#ffffff1a;color:var(--primary-color)}.nav-button--active{background:var(--primary-color)!important;color:var(--text-primary)!important;font-weight:700;border-radius:0 24px 24px 0;border-right:none;box-shadow:0 4px 15px #04b9004d;margin-right:8px;width:calc(100% - 8px)}.nav-button--active .nav-text,.nav-button--active .nav-icon{color:#04b900!important;opacity:1!important;font-weight:700;visibility:visible!important;width:auto!important;display:block!important;text-shadow:none}.nav-button--active .nav-icon{transform:scale(1.1);filter:none}.nav-icon{font-size:16px;min-width:18px;width:18px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.nav-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:opacity .3s ease;flex:1;font-weight:400;font-size:13px;line-height:1.2;margin-left:10px}@media (min-width: 769px){.sidebar--open .nav-text{opacity:1;width:auto;overflow:visible}.sidebar--open .nav-button{padding:8px 16px;justify-content:flex-start;gap:10px;min-height:40px;margin:1px 0}.sidebar--closed .nav-text{opacity:0;width:0;overflow:hidden}.sidebar--closed .nav-button{padding:8px;justify-content:center;gap:0;min-height:40px;margin:1px 0}.sidebar--closed .nav-button .nav-icon{margin:0}}.sidebar--closed .nav-button{position:relative}.sidebar--closed .nav-button:hover:after{content:attr(title);position:absolute;left:100%;top:50%;transform:translateY(-50%);background-color:#1a1a1a;color:#fff;padding:8px 12px;border-radius:4px;font-size:12px;white-space:nowrap;z-index:1000;margin-left:8px;box-shadow:0 2px 8px #0003;border:1px solid #333}.sidebar--closed .nav-button:hover:before{content:"";position:absolute;left:100%;top:50%;transform:translateY(-50%);border:6px solid transparent;border-right-color:#1a1a1a;margin-left:2px;z-index:1000}@media (max-width: 768px){.sidebar{position:fixed;top:0;left:0;z-index:1000;transform:translate(-100%);transition:transform .3s cubic-bezier(.4,0,.2,1);width:280px;box-shadow:4px 0 8px #00000026}.sidebar--open{transform:translate(0);width:280px}.sidebar--closed{transform:translate(-100%);width:280px}.sidebar .nav-text{opacity:1!important;width:auto!important;overflow:visible!important;font-size:14px!important}.sidebar .nav-button{padding:10px 16px!important;justify-content:flex-start!important;gap:10px!important;min-height:44px!important;margin:2px 0!important}.sidebar .sidebar-header h2{opacity:1!important;font-size:16px!important}.sidebar .sidebar-logo{opacity:1!important;width:auto!important;height:auto!important;max-width:160px!important;max-height:100px!important}.sidebar .sidebar-header{padding:20px 16px!important}.sidebar .nav-icon{min-width:20px!important;width:20px!important;font-size:18px!important}.sidebar--open:after{content:"";position:fixed;top:0;left:280px;right:0;bottom:0;background-color:#00000080;z-index:-1;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.nav-button{min-height:44px;padding:10px 16px;font-size:14px}.sidebar-toggle{min-height:44px;min-width:44px;padding:12px}.sidebar-header{padding:16px 20px;min-height:70px}.sidebar-header h2{font-size:16px}}@media (max-width: 480px){.sidebar{width:260px}.sidebar--open:after{left:260px}.nav-button{padding:14px 16px;font-size:15px}.sidebar-header{padding:12px 16px}.sidebar-footer{padding:16px}}@media (max-width: 1024px) and (min-width: 769px){.sidebar--open{width:240px}.sidebar--closed{width:50px}.nav-button{padding:10px 16px}.sidebar-header{padding:16px}}.sidebar--mobile{will-change:transform}.sidebar--touch .nav-button,.sidebar--touch .sidebar-toggle{-webkit-tap-highlight-color:transparent;touch-action:manipulation}@media (max-height: 500px) and (orientation: landscape){.sidebar--mobile{width:240px}.sidebar--mobile.sidebar--open:after{left:240px}.sidebar-header{padding:12px 16px;min-height:56px}.nav-button{padding:10px 16px;min-height:40px}}.image-preview-container{position:relative;width:100%;margin:1.5rem 0}.image-preview-wrapper{position:relative;width:100%;background:linear-gradient(145deg,#f8fafc,#f1f5f9);border-radius:16px;overflow:hidden;border:1px solid rgba(226,232,240,.8);box-shadow:0 4px 16px #0000000f,0 2px 8px #0000000a;transition:all .3s cubic-bezier(.4,0,.2,1)}.image-preview-wrapper:hover{box-shadow:0 8px 24px #0000001a,0 4px 12px #0000000f;transform:translateY(-2px)}.preview-image{width:100%;height:auto;display:block;cursor:pointer;transition:opacity .4s ease,transform .3s ease;opacity:0;max-height:80vh;object-fit:contain}.preview-image.loaded{opacity:1;animation:fadeInScale .4s cubic-bezier(.4,0,.2,1)}@keyframes fadeInScale{0%{opacity:0;transform:scale(.98)}to{opacity:1;transform:scale(1)}}.preview-image:hover{transform:scale(1.01)}.image-preview-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:5rem 2rem;min-height:450px;background:linear-gradient(145deg,#fff,#f8fafc);position:relative;overflow:hidden}.image-preview-loading:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(59,130,246,.1),transparent);animation:shimmer 2.5s infinite}@keyframes shimmer{0%{left:-100%}to{left:100%}}.loading-spinner-large{width:64px;height:64px;border:5px solid rgba(226,232,240,.4);border-top:5px solid #3b82f6;border-right:5px solid #8b5cf6;border-bottom:5px solid #ec4899;border-radius:50%;animation:spin 1s cubic-bezier(.5,0,.5,1) infinite;margin-bottom:2rem;position:relative;z-index:1;box-shadow:0 0 30px #3b82f626,0 4px 16px #8b5cf61a}.loading-spinner-large:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:36px;height:36px;border:3px solid transparent;border-top:3px solid #10b981;border-radius:50%;animation:spin 1.5s linear infinite reverse}.image-preview-loading p{margin:0;color:#64748b;font-size:.9375rem;font-weight:600;position:relative;z-index:1;animation:pulse-text 2s ease-in-out infinite}@keyframes pulse-text{0%,to{opacity:.5}50%{opacity:1}}.image-preview-error{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 2rem;min-height:350px;background:linear-gradient(145deg,#fef2f2,#fee2e2);color:#991b1b;border-radius:12px}.image-preview-error .error-icon{font-size:2.5rem;margin-bottom:1rem;animation:shake .5s ease}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-10px)}75%{transform:translate(10px)}}.image-preview-error p{margin:0;font-size:.9375rem;font-weight:600}.image-preview-overlay{position:absolute;top:20px;right:20px;display:flex;flex-direction:column;gap:10px;opacity:0;transition:all .3s cubic-bezier(.4,0,.2,1);z-index:10}.image-preview-wrapper:hover .image-preview-overlay{opacity:1;transform:translateY(0)}.preview-action-btn{padding:.75rem 1.25rem;border:none;border-radius:10px;font-size:.9375rem;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#fffffff2;box-shadow:0 4px 16px #0000001f,0 2px 8px #0000000f;display:flex;align-items:center;gap:.625rem;white-space:nowrap;border:1px solid rgba(226,232,240,.6)}.btn-icon{font-size:1.125rem;display:inline-block;transition:transform .3s ease}.preview-action-btn:hover .btn-icon{transform:scale(1.15)}.preview-action-btn:hover{transform:translateY(-3px);box-shadow:0 8px 24px #00000029,0 4px 12px #00000014}.preview-action-btn:active{transform:translateY(-1px)}.preview-btn{color:#2563eb;background:#2563eb1f;border-color:#2563eb40}.preview-btn:hover{background:#2563eb2e;color:#1d4ed8;border-color:#2563eb59}.download-btn{color:#059669;background:#0596691f;border-color:#05966940}.download-btn:hover{background:#0596692e;color:#047857;border-color:#05966959}.remove-btn{color:#dc2626;background:#dc26261f;border-color:#dc262640}.remove-btn:hover{background:#dc26262e;color:#b91c1c;border-color:#dc262659;transform:translateY(-3px) scale(1.02)}.fullscreen-preview{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000f5;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:9999;display:flex;align-items:center;justify-content:center;padding:2.5rem;cursor:pointer;animation:fadeInBackdrop .3s cubic-bezier(.4,0,.2,1)}@keyframes fadeInBackdrop{0%{opacity:0;-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0)}to{opacity:1;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}}.fullscreen-content{position:relative;max-width:96vw;max-height:96vh;display:flex;flex-direction:column;align-items:center;cursor:default;animation:scaleIn .3s cubic-bezier(.4,0,.2,1)}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.fullscreen-close{position:absolute;top:-52px;right:0;background:#ffffff26;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1.5px solid rgba(255,255,255,.2);color:#fff;font-size:1.5rem;font-weight:700;width:44px;height:44px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.4,0,.2,1);z-index:10000;box-shadow:0 4px 16px #0000004d,0 2px 8px #0003}.fullscreen-close:hover{background:#dc2626e6;border-color:#dc262666;transform:scale(1.1) rotate(90deg);box-shadow:0 6px 24px #dc262666,0 4px 12px #0000004d}.fullscreen-close:active{transform:scale(1.05) rotate(90deg)}.fullscreen-image{max-width:100%;max-height:86vh;object-fit:contain;border-radius:12px;box-shadow:0 20px 60px #00000080,0 8px 24px #0000004d;animation:imageZoomIn .4s cubic-bezier(.4,0,.2,1)}@keyframes imageZoomIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.fullscreen-actions{display:flex;gap:1.25rem;margin-top:2rem;animation:slideUp .4s cubic-bezier(.4,0,.2,1) .1s both}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.fullscreen-action-btn{padding:1rem 2rem;background:#ffffff26;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1.5px solid rgba(255,255,255,.25);border-radius:12px;color:#fff;font-size:.9375rem;font-weight:700;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 16px #0003,0 2px 8px #0000001a;letter-spacing:.02em}.fullscreen-action-btn:hover{background:#ffffff40;border-color:#fff6;transform:translateY(-3px);box-shadow:0 8px 24px #0000004d,0 4px 12px #00000026}.fullscreen-action-btn:active{transform:translateY(-1px)}@media (max-width: 768px){.image-preview-overlay{opacity:1;top:14px;right:14px;gap:8px;flex-direction:row;flex-wrap:wrap;max-width:calc(100% - 28px)}.preview-action-btn{padding:0;width:48px;height:48px;justify-content:center;border-radius:12px;min-width:unset}.preview-action-btn span:not(.btn-icon){display:none}.btn-icon{font-size:1.25rem}.fullscreen-preview{padding:1.25rem}.fullscreen-image{max-height:82vh;border-radius:10px}.fullscreen-actions{flex-direction:row;gap:1rem;width:100%;justify-content:center;margin-top:1.5rem}.fullscreen-action-btn{flex:1;max-width:200px;padding:.875rem 1.5rem;font-size:.875rem}.fullscreen-close{top:-48px;width:48px;height:48px;font-size:1.375rem}.image-preview-loading{padding:3.5rem 1.5rem;min-height:350px}.loading-spinner-large{width:56px;height:56px;border-width:4px}}@media (max-width: 480px){.preview-action-btn{width:44px;height:44px}.fullscreen-preview{padding:1rem}.fullscreen-close{top:-44px;width:44px;height:44px;font-size:1.25rem}.fullscreen-image{max-height:78vh;border-radius:8px}.fullscreen-actions{gap:.75rem;margin-top:1.25rem}.fullscreen-action-btn{padding:.75rem 1.25rem;font-size:.8125rem;font-weight:600}}.preview-image[data-orientation=portrait]{max-height:75vh}.preview-image[data-orientation=landscape]{max-width:100%;max-height:65vh}.hairstyle-changer{display:flex;flex-direction:column;gap:2rem;padding:1.5rem;max-width:1200px;margin:0 auto}.hairstyle-grid{margin-top:2rem}.metadata-section-improved{margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid var(--border-color)}.metadata-section-improved h4{margin:0 0 1rem;font-size:var(--font-size-sm);text-transform:uppercase;letter-spacing:.05em;color:var(--text-secondary)}.metadata-grid-improved{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.5rem}@media (max-width: 480px){.hairstyle-changer{padding:1rem}}:root{--font-size-h1: 2rem;--font-size-h2: 1.75rem;--font-size-h3: 1.5rem;--font-size-h4: 1.25rem;--font-size-h5: 1.125rem;--font-size-body: 1rem;--font-size-sm: .9375rem;--font-size-xs: .875rem;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700}.upload-section{background:var(--background-card);border-radius:20px;padding:2rem;border:1px solid var(--border-color);box-shadow:0 4px 16px #0000000a,0 2px 8px #00000005;margin-bottom:2rem;position:relative;overflow:hidden}.upload-section:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--primary-color) 0%,var(--secondary-color) 100%);opacity:.8}.upload-section h3{margin:0 0 .5rem;font-size:var(--font-size-h3);font-weight:700;color:var(--text-primary);letter-spacing:-.02em}.upload-instructions{margin:0 0 1.5rem;color:var(--text-secondary);font-size:var(--font-size-sm);line-height:1.6;font-weight:500}.generate-button{position:relative;width:100%;padding:1.125rem 2rem;font-size:1.0625rem;font-weight:700;color:#fff;background-color:var(--primary-color);background:var(--primary-color);border:none;border-radius:14px;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 16px #04b9004d,0 2px 8px #04b90033;overflow:hidden;letter-spacing:.02em;display:flex;align-items:center;justify-content:center;gap:.75rem}.generate-button:hover{transform:translateY(-2px);background-color:var(--success-hover);background:var(--success-hover);box-shadow:0 8px 24px #04b90066,0 4px 12px #04b9004d}.generate-button:active{transform:translateY(0)}.generate-button:disabled{background:#ccc;cursor:not-allowed;box-shadow:none;transform:none}.tips-section{background:#d24b090d;border-radius:16px;padding:1.75rem;margin-top:2rem;border:1px solid rgba(210,75,9,.2);box-shadow:0 4px 12px #d24b0914,0 2px 6px #0000000a;position:relative}.tips-section:before{content:"";position:absolute;top:0;left:0;width:4px;height:100%;background:var(--secondary-color);border-radius:16px 0 0 16px}.tips-section h4{margin:0 0 1rem;font-size:var(--font-size-h5);font-weight:700;color:var(--secondary-color);display:flex;align-items:center;gap:.5rem}.tips-section ul{margin:0;padding-left:1.5rem;list-style:none}.tips-section li{position:relative;margin-bottom:.75rem;color:var(--text-secondary);font-size:var(--font-size-sm);line-height:1.6;font-weight:500;padding-left:.5rem}.tips-section li:before{content:"✓";position:absolute;left:-1.25rem;color:var(--secondary-color);font-weight:700;font-size:1rem}.metadata-value{color:var(--text-primary);font-weight:600}.metadata-label{color:var(--text-secondary)}.results-section h3{color:var(--text-primary);background:none;-webkit-text-fill-color:initial}@media (max-width: 768px){.upload-section,.results-section{padding:1.5rem;border-radius:16px}.upload-section h3,.results-section h3{font-size:var(--font-size-h4)}.generate-button{padding:1rem 1.5rem;font-size:var(--font-size-body)}.tips-section{padding:1.25rem;margin-top:1.5rem}.metadata-grid-improved{grid-template-columns:1fr;gap:1rem}.results-header{flex-direction:row;align-items:flex-start}.reset-button{padding:.625rem 1.25rem;font-size:var(--font-size-xs)}}@media (max-width: 480px){.upload-section,.results-section{padding:1.25rem}.tips-section li{font-size:var(--font-size-xs)}.generate-button{font-size:var(--font-size-sm)}}.generation-section{background:var(--background-card);border-radius:16px;padding:2rem;border:1px solid var(--border-color);margin-bottom:2rem}.generation-controls{display:flex;gap:1rem;flex-direction:column}.process-preview{display:flex;align-items:center;justify-content:center;gap:1.5rem;margin-bottom:2rem;padding:2rem;background:var(--background-secondary);border-radius:1rem;border:1px solid var(--border-color);position:relative;overflow:hidden;flex-wrap:wrap}.process-preview:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--primary-color),var(--secondary-color));opacity:.5}.preview-item{display:flex;flex-direction:column;align-items:center;gap:.75rem;position:relative;transition:transform .3s ease}.preview-item:hover{transform:translateY(-4px)}.preview-item img{width:220px;height:280px;object-fit:contain;background-color:var(--background-card);border-radius:.75rem;border:1px solid var(--border-color);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;padding:.5rem}.preview-item p{margin:0;font-size:.875rem;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em}.combination-arrow{display:flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;background:#fff;color:var(--primary-color);border:2px solid var(--accent-color);border-radius:50%;font-size:1.25rem;font-weight:700;box-shadow:0 2px 4px #0000001a;z-index:2;flex-shrink:0}.preview-result{display:flex;align-items:center;justify-content:center;width:220px;height:280px;padding:1rem;background:linear-gradient(135deg,var(--secondary-color) 0%,#b33600 100%);color:#fff;border-radius:.75rem;font-size:1rem;font-weight:600;text-align:center;box-shadow:0 10px 15px -3px #d24b094d;position:relative}.preview-result:after{content:"✨";position:absolute;top:10px;right:10px;font-size:1.25rem;opacity:.5}.error-message{display:flex;align-items:flex-start;gap:.75rem;padding:1rem 1.25rem;background:var(--error-background);border:1px solid var(--error-border);border-radius:12px;margin-top:1rem;box-shadow:0 2px 8px #dc262614}.error-icon{font-size:1.25rem;flex-shrink:0;color:var(--error-text)}.error-message p{margin:0;color:var(--error-text);font-size:var(--font-size-sm);line-height:1.5;font-weight:500}.ootd-generator{display:flex;flex-direction:column;gap:2rem;padding:1.5rem;max-width:1200px;margin:0 auto}.upload-progress{margin-bottom:1.5rem;text-align:center}.step{display:flex;flex-direction:column;align-items:center;gap:.5rem;position:relative;z-index:1}.step-number{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;border-radius:50%;font-size:var(--font-size-xs);font-weight:600;background:var(--background-secondary);color:var(--text-secondary);border:2px solid var(--border-color);transition:all .3s ease}.step-label{font-size:var(--font-size-xs);font-weight:500;color:var(--text-secondary)}.step.active .step-number{background:#fff;border-color:var(--primary-color);color:var(--primary-color);box-shadow:0 0 0 4px rgba(var(--primary-rgb),.1)}.step.active .step-label{color:var(--primary-color);font-weight:600}.step.completed .step-number{background:var(--primary-color);border-color:var(--primary-color);color:#fff}.progress-line{height:2px;width:60px;background:var(--border-color);margin-top:-1.5rem}.ootd-output{margin-top:2rem}@media (max-width: 480px){.ootd-generator{padding:1rem}.progress-line{width:30px}}.clothing-changer{display:flex;flex-direction:column;gap:2rem;padding:1.5rem;max-width:1200px;margin:0 auto}.functionality-header{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;padding-bottom:1rem;border-bottom:2px solid #e5e7eb}.header-content h2{display:flex;align-items:center;gap:.75rem;margin:0 0 .5rem;font-size:var(--font-size-h2);font-weight:700;color:#1f2937}.functionality-icon{font-size:2rem}.functionality-description{margin:0;color:#6b7280;font-size:var(--font-size-body);line-height:1.5}.reset-button{display:flex;align-items:center;gap:.5rem;padding:.75rem 1rem;background:#f3f4f6;border:1px solid #d1d5db;border-radius:.5rem;color:#374151;font-size:var(--font-size-xs);font-weight:500;cursor:pointer;transition:all .2s ease}.reset-button:hover{background:#e5e7eb;border-color:#9ca3af}.functionality-content{display:flex;flex-direction:column;gap:2rem}.upload-section{background:#f9fafb;border:1px solid #e5e7eb;border-radius:.75rem;padding:1.5rem}.upload-section h3{margin:0 0 .5rem;font-size:var(--font-size-h4);font-weight:600;color:#1f2937}.upload-instructions{margin:0 0 1.5rem;color:#6b7280;font-size:var(--font-size-xs);line-height:1.5}.upload-progress{margin-bottom:1.5rem}.progress-indicator{display:flex;align-items:center;justify-content:center;gap:1rem;margin-bottom:.75rem}.step{display:flex;flex-direction:column;align-items:center;gap:.5rem}.step-number{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;border-radius:50%;font-size:var(--font-size-xs);font-weight:600;transition:all .3s ease}.step.active .step-number,.step.completed .step-number{background:var(--primary-color);color:#fff}.preservation-notice{display:flex;gap:1rem;padding:1rem;background:#04b9000d;border:1px solid var(--primary-color);border-radius:.5rem;margin-bottom:1.5rem}.notice-icon{font-size:1.5rem;flex-shrink:0}.notice-content h4{margin:0 0 .5rem;font-size:var(--font-size-xs);font-weight:600;color:var(--primary-color)}.notice-content ul{margin:0;padding-left:1rem;color:var(--text-secondary)}.notice-content li{font-size:.75rem;line-height:1.4;margin-bottom:.25rem}.functionality-error{display:flex;align-items:center;justify-content:center;padding:3rem;text-align:center;color:#dc2626;font-size:var(--font-size-body)}@media (max-width: 768px){.clothing-changer{padding:1rem;gap:1.5rem}.functionality-header{flex-direction:column;align-items:flex-start;gap:1rem}.header-content h2{font-size:var(--font-size-h3)}.upload-section,.generation-section,.results-section,.tips-section{padding:1rem}.image-preview{flex-direction:column;gap:.75rem}.combination-arrow{transform:rotate(90deg)}.preservation-notice{flex-direction:column;gap:.75rem;text-align:center}.generate-button{padding:.875rem 1.5rem;font-size:var(--font-size-xs)}}@media (max-width: 480px){.functionality-header{text-align:center}.header-content h2{font-size:var(--font-size-h4);justify-content:center}.progress-indicator{flex-direction:column;gap:.5rem}.progress-line{width:2px;height:1.5rem}.generate-button{width:100%;justify-content:center}}.explosive-food-generator{display:flex;flex-direction:column;gap:2rem;padding:1.5rem;max-width:1200px;margin:0 auto}.brand-colors-section{background:var(--background-card);border-radius:20px;padding:2rem;border:1px solid var(--border-color);box-shadow:0 4px 16px #0000000a,0 2px 8px #00000005;margin-bottom:2rem}.brand-colors-section h3{margin:0 0 .5rem;font-size:var(--font-size-h3);font-weight:700;color:var(--text-primary)}.colors-description{margin:0 0 1.5rem;color:var(--text-secondary);font-size:var(--font-size-sm);line-height:1.6}.color-palettes h4,.custom-color h4,.selected-colors h4{margin:0 0 1rem;font-size:var(--font-size-h5);font-weight:600;color:var(--text-primary)}.palette-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:1rem;margin-bottom:2rem}.palette-option{display:flex;flex-direction:column;align-items:center;gap:.75rem;padding:1rem;background:var(--background-secondary);border:2px solid transparent;border-radius:12px;cursor:pointer;transition:all .2s ease}.palette-option:hover{transform:translateY(-2px);background:var(--background-hover);box-shadow:0 4px 12px #0000000d}.palette-option.selected{border-color:var(--primary-color);background:#ff6b350d}.palette-colors{display:flex;gap:.5rem}.color-swatch{width:2.5rem;height:2.5rem;border-radius:50%;border:2px solid white;box-shadow:0 2px 4px #0000001a}.palette-name{font-size:var(--font-size-sm);font-weight:500;color:var(--text-primary)}.custom-color{margin-bottom:2rem}.custom-color-input{display:flex;align-items:center;gap:1rem}.color-picker{width:60px;height:40px;padding:0;border:none;border-radius:8px;cursor:pointer;background:none}.color-value{font-size:var(--font-size-body);font-weight:500;color:var(--text-secondary);font-family:monospace}.selected-palette{display:flex;gap:1rem}.selected-color{width:4rem;height:4rem;border-radius:12px;border:3px solid white;box-shadow:0 4px 12px #0000001a;transition:transform .2s ease}.selected-color:hover{transform:scale(1.05)}@media (max-width: 768px){.explosive-food-generator{padding:1rem;gap:1.5rem}.brand-colors-section{padding:1.5rem}.palette-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}.palette-name{font-size:var(--font-size-xs)}}.fashion-moodboard{display:flex;flex-direction:column;gap:2rem;padding:1.5rem;max-width:1200px;margin:0 auto}.preview-result{background:linear-gradient(135deg,#ec4899,#8b5cf6);position:relative;overflow:hidden}.moodboard-elements{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin-bottom:.5rem;z-index:1}.element{width:2.5rem;height:2.5rem;background:#fff3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:1.25rem;border:1px solid rgba(255,255,255,.3);transition:transform .3s ease}.preview-result:hover .element{transform:scale(1.1)}.element.sketch{transform:rotate(-5deg)}.element.cutout{transform:rotate(5deg)}.element.notes{transform:rotate(-3deg)}.element.colors{transform:rotate(3deg)}.moodboard-features{background:#fff;border-radius:16px;padding:2rem;border:1px solid var(--border-color);box-shadow:0 4px 6px #00000005;margin-bottom:2rem}.moodboard-features h4{margin:0 0 1.5rem;font-size:var(--font-size-h4);font-weight:700;color:var(--text-primary);text-align:center}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.5rem}.feature-item{display:flex;flex-direction:column;align-items:center;text-align:center;padding:1.5rem;background:var(--background-secondary);border-radius:12px;transition:all .3s ease;border:1px solid transparent}.feature-item:hover{transform:translateY(-4px);background:#fff;border-color:var(--primary-color);box-shadow:0 8px 16px #0000000f}.feature-icon{font-size:2rem;margin-bottom:1rem;display:flex;align-items:center;justify-content:center;width:3.5rem;height:3.5rem;background:#fff;border-radius:50%;box-shadow:0 4px 8px #0000000d}.feature-content h5{margin:0 0 .5rem;font-size:var(--font-size-body);font-weight:600;color:var(--text-primary)}.feature-content p{margin:0;font-size:var(--font-size-xs);color:var(--text-secondary);line-height:1.5}.inspiration-section{background:linear-gradient(to right bottom,#fdf4ff,#fae8ff);border-radius:20px;padding:2.5rem;margin-top:2rem;border:1px solid rgba(236,72,153,.1)}.inspiration-section h4{margin:0 0 2rem;font-size:var(--font-size-h3);font-weight:700;color:#831843;display:flex;align-items:center;gap:.75rem}.inspiration-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.5rem}.inspiration-item{background:#fffc;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:1.5rem;border-radius:16px;border:1px solid rgba(255,255,255,.5);box-shadow:0 4px 6px #ec48990d;transition:all .3s ease}.inspiration-item:hover{transform:translateY(-4px) scale(1.02);background:#fff;box-shadow:0 12px 24px #ec48991a;border-color:#ec489933}.inspiration-item h5{margin:0 0 .75rem;font-size:var(--font-size-h5);font-weight:700;color:#9d174d;position:relative;display:inline-block}.inspiration-item h5:after{content:"";position:absolute;bottom:-4px;left:0;width:24px;height:2px;background:#f472b6;border-radius:2px;transition:width .3s ease}.inspiration-item:hover h5:after{width:100%}.inspiration-item p{margin:0;font-size:var(--font-size-sm);color:#701a75;line-height:1.6}@media (max-width: 768px){.fashion-moodboard{padding:1rem;gap:1.5rem}.moodboard-features,.inspiration-section{padding:1.5rem}.inspiration-section h4{font-size:1.25rem;margin-bottom:1.5rem}.features-grid,.inspiration-grid{grid-template-columns:1fr;gap:1rem}}.product-packaging{display:flex;flex-direction:column;gap:2rem;padding:1.5rem;max-width:1200px;margin:0 auto}.dual-upload-container{display:grid;grid-template-columns:1fr auto 1fr;gap:2rem;align-items:flex-start;position:relative}.upload-item{display:flex;flex-direction:column;gap:1rem}.upload-item h3{font-size:var(--font-size-h5);font-weight:600;color:var(--text-primary);margin:0;text-align:center}.upload-item .upload-instructions{text-align:center;font-size:var(--font-size-xs);margin-bottom:.5rem}.upload-separator{display:flex;align-items:center;justify-content:center;height:100%;padding-top:4rem}.separator-text{display:flex;align-items:center;justify-content:center;width:3rem;height:3rem;background:#fff;border:2px solid var(--border-color);border-radius:50%;font-size:1.5rem;font-weight:700;color:var(--primary-color);box-shadow:0 4px 6px #0000000d;z-index:2}.uploaded-preview{margin-top:1rem;background:#fff;padding:.75rem;border-radius:12px;border:1px solid var(--border-color);box-shadow:0 2px 4px #0000000a;text-align:center}.uploaded-preview img{width:100%;height:200px;object-fit:contain;border-radius:8px;margin-bottom:.5rem;background-color:var(--background-secondary)}.image-label{font-size:var(--font-size-xs);font-weight:600;color:var(--text-secondary);margin:0}.packaging-output{max-width:800px;margin:0 auto}@media (max-width: 900px){.dual-upload-container{grid-template-columns:1fr;gap:1.5rem}.upload-separator{height:auto;padding:0;margin:-.5rem 0}.separator-text{transform:rotate(90deg)}.uploaded-preview img{height:180px}}@media (max-width: 480px){.product-packaging{padding:1rem}.upload-item h3{font-size:1rem}}.calorie-annotator{display:flex;flex-direction:column;gap:2rem;padding:1.5rem;max-width:1200px;margin:0 auto}.accuracy-indicator{margin-top:2rem;padding:1.5rem;background:var(--background-secondary);border-radius:12px;border:1px solid var(--border-color)}.accuracy-header{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem}.accuracy-icon{font-size:1.5rem}.accuracy-header h4{margin:0;font-size:var(--font-size-h5);font-weight:600;color:var(--text-primary)}.accuracy-indicator p{margin:0 0 1.5rem;font-size:var(--font-size-sm);color:var(--text-secondary);line-height:1.6}.accuracy-level{display:flex;align-items:center;gap:1rem}.accuracy-label{font-size:var(--font-size-xs);font-weight:600;color:var(--text-primary);white-space:nowrap}.accuracy-bar{flex-grow:1;height:8px;background:#e5e7eb;border-radius:4px;overflow:hidden}.accuracy-fill{height:100%;background:linear-gradient(90deg,#fbbf24,#10b981);border-radius:4px}.accuracy-percentage{font-size:var(--font-size-sm);font-weight:700;color:var(--text-primary);min-width:3rem;text-align:right}@media (max-width: 480px){.calorie-annotator{padding:1rem}.accuracy-level{flex-direction:column;align-items:flex-start;gap:.5rem}.accuracy-bar{width:100%}.accuracy-percentage{align-self:flex-end}}.id-photo-creator{display:flex;flex-direction:column;gap:2rem;padding:1.5rem;max-width:1200px;margin:0 auto}.crop-preview-section{background:#fff;border-radius:16px;padding:2rem;border:1px solid var(--border-color);box-shadow:0 4px 6px #00000005;margin-bottom:2rem;text-align:center}.preview-description{color:var(--text-secondary);font-size:var(--font-size-sm);margin-bottom:2rem;max-width:600px;margin-left:auto;margin-right:auto}.crop-preview-container{display:flex;align-items:flex-start;justify-content:center;gap:3rem;flex-wrap:wrap}.crop-preview-frame{position:relative;width:300px;height:300px;border-radius:8px;overflow:hidden;box-shadow:0 10px 20px #0000001a;border:4px solid white}.crop-preview-frame img{width:100%;height:100%;object-fit:cover}.crop-overlay{position:absolute;top:0;left:0;right:0;bottom:0;pointer-events:none}.crop-guidelines{position:relative;width:100%;height:100%}.guideline{position:absolute;background:#ffffff80}.guideline.horizontal{top:40%;left:0;right:0;height:1px;border-top:1px dashed rgba(255,255,255,.8)}.guideline.vertical{left:50%;top:0;bottom:0;width:1px;border-left:1px dashed rgba(255,255,255,.8)}.crop-info{text-align:left;max-width:300px;padding:1.5rem;background:var(--background-secondary);border-radius:12px}.crop-info h4{margin:0 0 1rem;font-size:var(--font-size-h5);font-weight:600;color:var(--text-primary)}.crop-info ul{margin:0;padding:0;list-style:none}.crop-info li{margin-bottom:.75rem;color:var(--text-secondary);font-size:var(--font-size-sm);padding-left:.5rem}.id-photo-result{display:flex;flex-direction:column;gap:2rem;align-items:center}.photo-specifications{width:100%;max-width:800px;margin-top:2rem;background:#fff;padding:2rem;border-radius:16px;border:1px solid var(--border-color)}.photo-specifications h4{text-align:center;margin-bottom:2rem;color:var(--text-primary)}.spec-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1.5rem}.spec-item{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.5rem;padding:1rem;background:var(--background-secondary);border-radius:12px}.spec-icon{font-size:1.5rem;margin-bottom:.25rem}.spec-label{font-size:var(--font-size-xs);text-transform:uppercase;letter-spacing:.05em;color:var(--text-secondary);font-weight:600}.spec-value{font-size:var(--font-size-body);font-weight:600;color:var(--primary-color)}@media (max-width: 768px){.crop-preview-container{flex-direction:column;align-items:center}.crop-info{max-width:100%;width:100%}}.comic-book-creator{display:flex;flex-direction:column;gap:2rem;padding:1.5rem;max-width:1200px;margin:0 auto}.comic-preview{background:#fff;border-radius:16px;padding:2rem;border:1px solid var(--border-color);box-shadow:0 4px 6px #00000005;margin-bottom:2rem}.comic-preview h3{text-align:center;font-size:var(--font-size-h3);margin-bottom:2rem;background:linear-gradient(135deg,gold,#ff8c00);-webkit-background-clip:text;-webkit-text-fill-color:transparent;font-weight:800;text-transform:uppercase;letter-spacing:.05em}.story-elements{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.5rem}.element-item{display:flex;align-items:flex-start;gap:1rem;padding:1.25rem;background:#fff9e6;border:2px solid #ffeba8;border-radius:12px;transform:rotate(-1deg);transition:transform .3s ease}.element-item:nth-child(2n){transform:rotate(1deg);background:#e6f7ff;border-color:#b3e0ff}.element-item:hover{transform:scale(1.02) rotate(0);z-index:2;box-shadow:0 8px 16px #0000001a}.element-icon{font-size:2rem;background:#fff;width:3.5rem;height:3.5rem;display:flex;align-items:center;justify-content:center;border-radius:50%;border:2px solid currentColor;flex-shrink:0}.element-content h4{margin:0 0 .5rem;font-size:var(--font-size-h5);font-weight:700;color:var(--text-primary)}.element-content p{margin:0;font-size:var(--font-size-xs);color:var(--text-secondary);line-height:1.5}.comic-features{margin-top:3rem}.comic-features h4{text-align:center;margin-bottom:2rem;font-size:var(--font-size-h4);font-weight:700}.features-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:1.5rem}.feature-item{display:flex;flex-direction:column;align-items:center;padding:1.5rem;background:#fff;border-radius:12px;border:1px solid var(--border-color);transition:all .3s ease;text-align:center}.feature-item:hover{transform:translateY(-4px);border-color:var(--primary-color);box-shadow:0 4px 12px #00000014}.feature-icon{font-size:2rem;margin-bottom:.75rem}.feature-text{font-weight:600;color:var(--text-primary);font-size:var(--font-size-sm)}@media (max-width: 768px){.story-elements{grid-template-columns:1fr}.element-item{transform:none!important}}.movie-storyboard{display:flex;flex-direction:column;gap:2rem;padding:1.5rem;max-width:1200px;margin:0 auto}.storyboard-preview{background:#1a1a1a;border-radius:16px;padding:2.5rem;color:#e5e5e5;margin-bottom:2rem;border:1px solid #333;box-shadow:0 10px 30px #0000004d}.storyboard-preview h3{font-family:Courier New,Courier,monospace;text-align:center;font-size:var(--font-size-h2);margin-bottom:2rem;color:#fff;text-transform:uppercase;letter-spacing:.1em;border-bottom:1px solid #333;padding-bottom:1rem}.story-concept{max-width:800px;margin:0 auto}.concept-header{display:flex;align-items:center;justify-content:center;gap:1rem;margin-bottom:1.5rem}.concept-icon{font-size:2rem}.concept-header h4{margin:0;font-size:var(--font-size-h3);font-weight:700;color:#fff}.concept-description{text-align:center;color:#a0a0a0;line-height:1.7;margin-bottom:3rem;font-size:1.0625rem}.story-elements{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem}.story-act{background:#ffffff0d;padding:1.5rem;border-radius:8px;border-left:3px solid #666}.story-act:nth-child(2){border-left-color:#888}.story-act:nth-child(3){border-left-color:#aaa}.story-act h5{margin:0 0 1rem;font-size:var(--font-size-h5);color:#fff;font-family:Courier New,monospace}.story-act ul{margin:0;padding-left:1.25rem}.story-act li{color:#bbb;margin-bottom:.5rem;font-size:var(--font-size-sm)}.storyboard-features{margin-top:3rem}.storyboard-features h4{text-align:center;margin-bottom:2rem;color:var(--text-primary)}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.5rem}.feature-item{display:flex;align-items:flex-start;gap:1rem;padding:1.5rem;background:#fff;border-radius:12px;border:1px solid var(--border-color);transition:all .3s ease}.feature-item:hover{background:#111;border-color:#333}.feature-item:hover .feature-title,.feature-item:hover .feature-desc{color:#fff}.feature-icon{font-size:1.75rem;background:var(--background-secondary);width:3rem;height:3rem;display:flex;align-items:center;justify-content:center;border-radius:8px;flex-shrink:0}.feature-item:hover .feature-icon{background:#333}.feature-content{display:flex;flex-direction:column}.feature-title{font-weight:700;font-size:var(--font-size-body);color:var(--text-primary);margin-bottom:.25rem}.feature-desc{font-size:var(--font-size-xs);color:var(--text-secondary)}@media (max-width: 768px){.story-elements{grid-template-columns:1fr}}.main-footer{margin-top:auto;padding:2rem 0 0;width:100%}.footer-content{display:flex;flex-direction:column;align-items:center;gap:1.5rem}.footer-branding{text-align:center}.footer-credits{color:var(--text-secondary);font-size:.875rem;margin:0;line-height:1.5;font-weight:500}.footer-credits a{color:var(--primary-color);text-decoration:none;transition:color .2s ease;font-weight:600}.footer-credits a:hover{color:var(--success-hover);text-decoration:underline}.footer-social{display:flex;justify-content:center;align-items:center;gap:1rem}.social-link{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background-color:var(--background-secondary);border:1px solid var(--border-color);border-radius:10px;text-decoration:none;transition:all .2s cubic-bezier(.4,0,.2,1);cursor:pointer;color:var(--text-secondary)}.social-link:hover{transform:translateY(-2px);background-color:#fff;color:var(--primary-color);box-shadow:0 4px 12px #04b90026;border-color:var(--primary-color)}.social-icon{width:20px;height:20px;fill:currentColor}.social-link.instagram:hover{background:radial-gradient(circle at 30% 107%,#fdf497,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285aeb 90%);box-shadow:0 4px 12px #d6249f4d;border-color:#d6249f;color:#fff}.social-link.github:hover{background-color:#333;border-color:#333;box-shadow:0 4px 12px #0006;color:#fff}.social-link.email:hover{background-color:#ea4335;border-color:#ea4335;box-shadow:0 4px 12px #ea43354d;color:#fff}.social-link.youtube:hover{background-color:red;border-color:red;box-shadow:0 4px 12px #ff00004d;color:#fff}@media (max-width: 768px){.main-footer{margin-top:2rem;padding:1.5rem 0}}.main-content{display:flex;flex-direction:column;height:100vh;background-color:#f8f9fa;overflow:hidden}.main-header{background-color:#fff;border-bottom:1px solid #e9ecef;padding:20px 30px;display:flex;align-items:center;gap:16px;box-shadow:0 2px 4px #0000001a;min-height:80px}.mobile-menu-toggle{display:none;background:none;border:none;font-size:20px;cursor:pointer;padding:8px;border-radius:4px;color:#495057}.mobile-menu-toggle:hover{background-color:#f8f9fa}.header-content{display:flex;align-items:center;gap:16px;flex:1}.functionality-icon{font-size:32px;min-width:32px}.functionality-info{flex:1}.functionality-info h1{font-size:24px;color:#2c3e50;margin:0 0 4px}.functionality-description{color:#666;font-size:14px;margin:0;line-height:1.4}.main-header h1{font-size:24px;color:#2c3e50;margin:0}.main-body{flex:1;padding:24px;overflow-y:auto;background-color:#f8f9fa;display:flex;flex-direction:column}.error-message{background-color:#f8d7da;color:#721c24;border:1px solid #f5c6cb;border-radius:8px;padding:12px 16px;margin-bottom:24px;display:flex;align-items:center;gap:8px}.error-icon{font-size:16px}.welcome-message{display:flex;align-items:center;justify-content:center;flex:1;min-height:400px}.welcome-content{text-align:center;max-width:800px;padding:40px;background:#fff;border-radius:16px;box-shadow:0 4px 12px #0000001a}.welcome-content h2{color:#2c3e50;margin-bottom:16px;font-size:32px}.welcome-content>p{color:#6c757d;font-size:18px;line-height:1.6;margin-bottom:40px}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:24px;margin-top:32px}.feature-highlight{padding:24px;border:1px solid #e9ecef;border-radius:12px;transition:transform .2s ease,box-shadow .2s ease}.feature-highlight:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.feature-icon{font-size:32px;margin-bottom:12px;display:block}.feature-highlight h3{color:#2c3e50;margin:0 0 8px;font-size:16px}.feature-highlight p{color:#666;font-size:14px;line-height:1.4;margin:0}@media (max-width: 768px){.mobile-menu-toggle{display:flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;font-size:18px;touch-action:manipulation}.main-header{padding:12px 16px;min-height:60px;gap:12px}.functionality-icon{font-size:20px;min-width:20px}.functionality-info h1{font-size:18px;line-height:1.3}.functionality-description{font-size:12px;line-height:1.4}.main-body{padding:12px;-webkit-overflow-scrolling:touch}.welcome-content{padding:24px 16px;margin:0 4px}.welcome-content h2{font-size:24px;line-height:1.2}.welcome-content>p{font-size:14px;line-height:1.5}.features-grid{grid-template-columns:1fr;gap:12px;margin-top:20px}.feature-highlight{padding:16px;touch-action:manipulation}.feature-highlight:active{transform:scale(.98)}}@media (max-width: 480px){.main-header{padding:10px 12px;min-height:56px}.functionality-info h1{font-size:16px}.functionality-description{font-size:11px}.main-body{padding:8px}.welcome-content{padding:20px 12px;margin:0 2px}.welcome-content h2{font-size:20px}.welcome-content>p{font-size:13px}.feature-highlight{padding:12px}.feature-icon{font-size:28px}}@media (max-width: 1024px) and (min-width: 769px){.main-header{padding:18px 24px}.main-body{padding:20px}.features-grid{grid-template-columns:repeat(2,1fr)}}@media (min-width: 1400px){.main-header{padding:24px 40px}.main-body{padding:32px}.welcome-content{padding:48px}.features-grid{grid-template-columns:repeat(3,1fr);gap:32px}}.main-content--mobile{height:calc(var(--vh, 1vh) * 100)}.main-content--mobile .main-body{-webkit-overflow-scrolling:touch;overscroll-behavior:contain}.main-content--touch .mobile-menu-toggle,.main-content--touch .feature-highlight{-webkit-tap-highlight-color:transparent;touch-action:manipulation}.main-content--mobile .welcome-content,.main-content--mobile .features-grid{will-change:transform}.image-uploader{width:100%;max-width:600px;margin:0 auto}.upload-area{border:2px dashed #cbd5e1;border-radius:16px;padding:1.5rem;text-align:center;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);background:linear-gradient(145deg,#fff,#f8fafc);min-height:140px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.upload-area:hover:not(.disabled){border-color:#3b82f6;background:linear-gradient(145deg,#f0f9ff,#e0f2fe);box-shadow:0 4px 12px #3b82f61a;transform:translateY(-2px)}.upload-area.drag-over{border-color:#3b82f6;background-color:#dbeafe;transform:scale(1.02);box-shadow:0 8px 24px #3b82f626}.upload-area.disabled{opacity:.6;cursor:not-allowed;background-color:#f3f4f6;transform:none;box-shadow:none}.upload-area.has-images{min-height:100px;padding:1rem;border-style:solid;border-color:#e2e8f0}.upload-area.has-images:hover{border-color:#3b82f6;border-style:dashed}.upload-content{display:flex;flex-direction:column;align-items:center;gap:.75rem;z-index:10}.upload-icon{color:#64748b;opacity:.9;transition:all .3s ease;display:flex;align-items:center;justify-content:center;background:#f1f5f9;width:48px;height:48px;border-radius:50%;margin-bottom:.25rem}.upload-area:hover .upload-icon{color:#3b82f6;background:#fff;transform:scale(1.1);box-shadow:0 2px 8px #3b82f626}.upload-area.drag-over .upload-icon{color:#3b82f6;transform:scale(1.2) rotate(10deg)}.upload-content h3{margin:0;font-size:1rem;font-weight:600;color:#334155;letter-spacing:-.01em}.upload-content p{margin:0;color:#64748b;font-size:.8125rem}.upload-info{margin-top:.25rem;padding-top:0;border-top:none;opacity:.8;transition:opacity .3s ease}.upload-area:hover .upload-info{opacity:1}.upload-info p{margin:.125rem 0;font-size:.7rem;color:#94a3b8}.upload-processing{display:flex;flex-direction:column;align-items:center;gap:1rem}.spinner{width:28px;height:28px;border:3px solid #e2e8f0;border-top:3px solid #3b82f6;border-radius:50%;animation:spin .8s cubic-bezier(.4,0,.2,1) infinite}.validation-errors{margin-top:.75rem;padding:.75rem 1rem;background:linear-gradient(145deg,#fef2f2,#fee2e2);border:1px solid #fecaca;border-radius:10px;box-shadow:0 2px 4px #ef44440d;animation:slideDown .3s cubic-bezier(.16,1,.3,1)}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.validation-errors h4{margin:0 0 .25rem;color:#b91c1c;font-size:.8125rem;font-weight:600;display:flex;align-items:center;gap:.5rem}.error-item{margin:.25rem 0;padding:.25rem 0;background-color:transparent;font-size:.75rem;color:#7f1d1d;display:flex;align-items:center}.error-item:before{content:"•";margin-right:.5rem;color:#ef4444;font-weight:700}.uploaded-images{margin-top:1.5rem}.images-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem;padding-bottom:.5rem;border-bottom:1px solid #f1f5f9}.images-header h4{margin:0;font-size:.9375rem;font-weight:600;color:#334155}.clear-all-btn{background:#fff;border:1px solid #e2e8f0;border-radius:8px;padding:.375rem .875rem;font-size:.75rem;font-weight:500;color:#64748b;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);box-shadow:0 1px 2px #0000000d}.clear-all-btn:hover{border-color:#fca5a5;color:#ef4444;background-color:#fef2f2;transform:translateY(-1px);box-shadow:0 2px 4px #ef44441a}.images-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:1rem}.image-item{position:relative;border-radius:12px;overflow:hidden;background:#fff;box-shadow:0 4px 6px -1px #0000000d,0 2px 4px -1px #00000008;transition:all .3s cubic-bezier(.4,0,.2,1);border:1px solid #e2e8f0}.image-item:hover{transform:translateY(-4px);border-color:#3b82f666;box-shadow:0 10px 15px -3px #00000014,0 4px 6px -2px #0000000a}.image-preview{position:relative;width:100%;height:180px;overflow:hidden;display:flex;align-items:center;justify-content:center;background-image:linear-gradient(45deg,#f8fafc 25%,transparent 25%),linear-gradient(-45deg,#f8fafc 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#f8fafc 75%),linear-gradient(-45deg,transparent 75%,#f8fafc 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0px;background-color:#fff}.image-preview:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.02) 100%);pointer-events:none;z-index:2}.image-preview img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;transition:transform .4s cubic-bezier(.4,0,.2,1);position:relative;z-index:3}.image-item:hover .image-preview img{transform:scale(1.05)}.remove-btn{position:absolute;top:.5rem;right:.5rem;background:#ffffffe6;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border:1px solid #fee2e2;border-radius:50%;width:28px;height:28px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#ef4444;opacity:0;transform:scale(.8);transition:all .2s cubic-bezier(.4,0,.2,1);z-index:10;font-size:16px;box-shadow:0 2px 4px #0000000d}.image-item:hover .remove-btn{opacity:1;transform:scale(1)}.remove-btn:hover{background:#ef4444;border-color:#ef4444;color:#fff;transform:scale(1.1) rotate(90deg)!important;box-shadow:0 4px 6px #ef444440}.remove-btn:active{transform:scale(.95) rotate(90deg)!important}.image-info{padding:.75rem;background:#fff;border-top:1px solid #f1f5f9}.image-name{margin:0 0 .25rem;font-size:.8125rem;font-weight:600;color:#334155;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.image-size{margin:0 0 .5rem;font-size:.6875rem;color:#94a3b8;font-weight:500}.image-type{display:inline-flex;align-items:center;padding:.25rem .625rem;border-radius:6px;font-size:.625rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;box-shadow:0 1px 2px #0000000d}.image-type.primary{background:linear-gradient(135deg,#eff6ff,#dbeafe);color:#2563eb;border:1px solid rgba(59,130,246,.15)}.image-type.primary:before{content:"⭐";margin-right:.25rem;font-size:.625rem}.image-type.reference{background:linear-gradient(135deg,#ecfdf5,#d1fae5);color:#059669;border:1px solid rgba(16,185,129,.15)}.image-type.reference:before{content:"📎";margin-right:.25rem;font-size:.625rem}@media (max-width: 768px){.image-uploader{max-width:100%}.upload-area{padding:1rem;min-height:120px}.upload-icon{width:40px;height:40px}.upload-icon svg{width:20px;height:20px}.upload-content h3{font-size:.9375rem}.upload-content p{font-size:.75rem}.images-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.75rem}.image-preview{height:140px}.remove-btn{opacity:1;top:.25rem;right:.25rem}}@media (max-width: 480px){.upload-area{min-height:110px}.images-grid{grid-template-columns:1fr}}.processing-indicator{display:flex;flex-direction:column;padding:1.25rem 1.5rem;background:#fff;border-radius:16px;box-shadow:0 10px 30px -10px #0000001a,0 4px 6px -2px #0000000d;border:1px solid var(--border-color, #e2e8f0);max-width:420px;margin:1rem auto;position:relative;overflow:hidden;animation:slideUpFade .4s cubic-bezier(.16,1,.3,1)}@keyframes slideUpFade{0%{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.processing-indicator:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#3b82f6,#8b5cf6,#ec4899,#8b5cf6,#3b82f6);background-size:200% 100%;animation:rainbow-flow 3s linear infinite}@keyframes rainbow-flow{0%{background-position:0% 0%}to{background-position:200% 0%}}.processing-content{display:flex;flex-direction:column;gap:1rem;width:100%}.processing-header{display:flex;align-items:center;gap:1rem}.processing-animation-compact{flex-shrink:0}.processing-info{flex:1;display:flex;flex-direction:column;justify-content:center}.processing-title{margin:0;font-size:1rem;font-weight:600;color:var(--text-primary, #1e293b);line-height:1.3}.processing-step{margin:.25rem 0 0;font-size:.875rem;color:var(--text-secondary, #64748b);line-height:1.4;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(2px)}to{opacity:1;transform:translateY(0)}}.progress-container-compact{width:100%;display:flex;flex-direction:column;gap:.5rem}.progress-bar{height:6px;background:#f1f5f9;border-radius:6px;overflow:hidden;width:100%}.progress-fill{height:100%;background:linear-gradient(90deg,#3b82f6,#8b5cf6);border-radius:6px;transition:width .3s ease}.progress-meta{display:flex;justify-content:space-between;align-items:center;font-size:.75rem;color:var(--text-secondary, #94a3b8);font-weight:500}.progress-percentage{color:var(--primary-color, #3b82f6);font-weight:600}.time-indicator-compact{display:flex;align-items:center}.spinner{width:36px;height:36px;display:flex;align-items:center;justify-content:center}.spinner-ring{width:100%;height:100%;border:2.5px solid rgba(59,130,246,.1);border-top-color:#3b82f6;border-radius:50%;animation:spin .8s linear infinite}.dots{display:flex;gap:4px}.dot{width:8px;height:8px;background:#3b82f6;border-radius:50%;animation:bounce 1.4s infinite ease-in-out both}.dot:nth-child(1){animation-delay:-.32s}.dot:nth-child(2){animation-delay:-.16s}.pulse{position:relative;width:36px;height:36px}.pulse-ring{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;border:2px solid #3b82f6;opacity:0;animation:pulse-ring 1.5s cubic-bezier(.215,.61,.355,1) infinite}.pulse-ring:nth-child(2){animation-delay:.5s}.pulse-ring:nth-child(3){animation-delay:1s}@keyframes spin{to{transform:rotate(360deg)}}@keyframes bounce{0%,80%,to{transform:scale(0)}40%{transform:scale(1)}}@keyframes pulse-ring{0%{transform:scale(.3);opacity:.8}to{transform:scale(1);opacity:0}}.bars{display:flex;gap:3px;height:24px;align-items:flex-end}.bar{width:4px;background:#3b82f6;animation:bar-dance 1s infinite ease-in-out}.bar:nth-child(1){height:40%;animation-delay:-.4s}.bar:nth-child(2){height:70%;animation-delay:-.2s}.bar:nth-child(3){height:100%}.bar:nth-child(4){height:70%;animation-delay:-.2s}.bar:nth-child(5){height:40%;animation-delay:-.4s}@keyframes bar-dance{0%,to{transform:scaleY(1)}50%{transform:scaleY(1.5)}}.timeout-message-compact{font-size:.75rem;color:#d97706;background:#fffbeb;padding:.5rem;border-radius:6px;text-align:center;margin:0;border:1px solid #fcd34d}@media (prefers-color-scheme: dark){.processing-indicator{background:#1e293b;border-color:#334155}.processing-title{color:#f1f5f9}.processing-step{color:#94a3b8}.progress-bar{background:#334155}}.output-display{display:flex;flex-direction:column;gap:1rem;padding:1rem;border:1px solid #e0e0e0;border-radius:8px;background:#fff;box-shadow:0 2px 4px #0000001a}.output-display.error{border-color:#ff6b6b;background:#fff5f5}.image-container{position:relative;display:flex;justify-content:center;align-items:center;min-height:200px}.generated-image{max-width:100%;max-height:80vh;object-fit:contain;height:auto;border-radius:4px;cursor:pointer;transition:opacity .3s ease,transform .2s ease;opacity:0}.generated-image.loaded{opacity:1}.generated-image:hover{transform:scale(1.02)}.image-overlay{position:absolute;top:8px;right:8px;display:flex;gap:4px;opacity:0;transition:opacity .2s ease}.zoom-button,.fullscreen-button{background:#000000b3;color:#fff;border:none;border-radius:4px;padding:4px 8px;cursor:pointer;font-size:14px;transition:background .2s ease}.metadata-section-improved{margin-top:1.5rem;padding:1.25rem;background:#f8f9fa;border-radius:8px;border:1px solid #e5e7eb}.metadata-section-improved h4{margin:0 0 1rem;font-size:1rem;font-weight:600;color:#1f2937}.metadata-grid-improved{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem}.metadata-item-improved{display:flex;flex-direction:column;gap:.25rem}.metadata-label{font-size:.75rem;font-weight:500;color:#6b7280;text-transform:uppercase;letter-spacing:.5px}.metadata-value{font-size:.875rem;color:#1f2937;font-weight:500}.fullscreen-image{max-width:100%;max-height:calc(95vh - 60px);object-fit:contain;cursor:pointer;transition:transform .3s ease}@media (max-width: 768px){.output-display{padding:.75rem;margin:0}.generated-image{max-height:280px;cursor:pointer;touch-action:manipulation}.metadata-grid{grid-template-columns:1fr;gap:.375rem}.metadata-item{flex-direction:column;gap:.25rem;padding:.375rem 0}.metadata-item .value{text-align:left;font-weight:500}.action-buttons{flex-direction:column;gap:.75rem}.download-button,.save-button{min-height:44px;padding:.75rem 1rem;font-size:.875rem;touch-action:manipulation}.fullscreen-controls{flex-direction:column;width:100%;gap:.75rem}.zoom-control,.download-control{min-height:44px;padding:.75rem 1rem;font-size:.875rem}.image-loading,.error-message{padding:1.5rem}.error-message h3{font-size:1rem}}@media (max-width: 480px){.output-display{padding:.5rem}.generated-image{max-height:240px}.image-overlay{position:static;opacity:1;justify-content:center;margin-top:.5rem;gap:.5rem}.zoom-button,.fullscreen-button{min-height:36px;min-width:36px;padding:8px;font-size:12px;border-radius:6px}.close-fullscreen{top:10px;right:10px;width:36px;height:36px;font-size:16px}.fullscreen-image{max-height:calc(100vh - 120px)}.metadata-section h4{font-size:.9rem}.metadata-item .label,.metadata-item .value{font-size:.8rem}}@media (hover: none) and (pointer: coarse){.generated-image:hover{transform:none}.generated-image:active{transform:scale(.98)}.download-button:hover,.save-button:hover{background:#007bff;border-color:#007bff}.download-button:active,.save-button:active{transform:scale(.98)}.save-button:hover{background:#28a745;border-color:#28a745}.save-button:active{background:#1e7e34;border-color:#1e7e34}.zoom-button:hover,.fullscreen-button:hover{background:#000000b3}.zoom-button:active,.fullscreen-button:active{background:#000000e6;transform:scale(.95)}}@media (max-width: 768px) and (orientation: landscape){.generated-image{max-height:200px}.fullscreen-image{max-height:calc(100vh - 80px)}.action-buttons{flex-direction:row;justify-content:center}}.grid-display{display:flex;flex-direction:column;gap:1rem;padding:1rem;border:1px solid #e0e0e0;border-radius:8px;background:#fff;box-shadow:0 2px 4px #0000001a}.grid-display.error{border-color:#ff6b6b;background:#fff5f5}.grid-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.grid-header h3{margin:0;color:#333;font-size:1.1rem}.grid-actions{display:flex;gap:.5rem}.image-grid{display:grid;gap:1rem;width:100%}.grid-3x3{grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr)}.grid-2x2{grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr)}.grid-4x2{grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(2,1fr)}.grid-item{display:flex;flex-direction:column;border:2px solid transparent;border-radius:8px;overflow:hidden;transition:all .2s ease;background:#f8f9fa}.grid-item:hover{border-color:#007bff;transform:translateY(-2px);box-shadow:0 4px 8px #00000026}.grid-item.selected{border-color:#007bff;box-shadow:0 0 0 2px #007bff40}.grid-image-wrapper{position:relative;aspect-ratio:1;overflow:hidden;background:#f0f0f0;display:flex;align-items:center;justify-content:center}.grid-image{width:100%;height:100%;object-fit:cover;cursor:pointer;transition:opacity .3s ease,transform .2s ease;opacity:0}.grid-image.loaded{opacity:1}.grid-image:hover{transform:scale(1.05)}.grid-image-loading{display:flex;align-items:center;justify-content:center;width:100%;height:100%}.grid-image-error{display:flex;align-items:center;justify-content:center;width:100%;height:100%;color:#ff6b6b;background:#fff5f5;font-size:.8rem;text-align:center}.grid-image-overlay{position:absolute;top:4px;right:4px;display:flex;gap:2px;opacity:0;transition:opacity .2s ease}.grid-item:hover .grid-image-overlay{opacity:1}.preview-button,.download-single-button{background:#000000b3;color:#fff;border:none;border-radius:3px;padding:2px 4px;cursor:pointer;font-size:12px;transition:background .2s ease}.preview-button:hover,.download-single-button:hover{background:#000000e6}.grid-item-label{padding:.5rem;text-align:center;font-size:.85rem;color:#666;background:#fff;border-top:1px solid #e0e0e0}.preview-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000f2;display:flex;align-items:center;justify-content:center;z-index:1000;cursor:pointer}.preview-content{position:relative;max-width:95vw;max-height:95vh;display:flex;flex-direction:column;align-items:center;cursor:default}.close-preview{position:absolute;top:-40px;right:0;background:#fff3;color:#fff;border:none;border-radius:50%;width:32px;height:32px;cursor:pointer;font-size:18px;display:flex;align-items:center;justify-content:center;transition:background .2s ease;z-index:1001}.close-preview:hover{background:#ffffff4d}.preview-navigation{display:flex;align-items:center;gap:1rem;max-width:100%;max-height:calc(95vh - 80px)}.nav-button:disabled{opacity:.5;cursor:not-allowed}.preview-image-container{position:relative;display:flex;flex-direction:column;align-items:center;max-width:calc(95vw - 120px);max-height:100%}.preview-image{max-width:100%;max-height:100%;object-fit:contain;border-radius:4px}.preview-counter{margin-top:.5rem;color:#fffc;font-size:.9rem}.preview-controls{display:flex;gap:1rem;margin-top:1rem;padding:.5rem;background:#00000080;border-radius:4px}.download-preview,.save-preview{background:#fff3;color:#fff;border:1px solid rgba(255,255,255,.3);border-radius:4px;padding:.5rem 1rem;cursor:pointer;transition:all .2s ease}.download-preview:hover,.save-preview:hover{background:#ffffff4d;border-color:#ffffff80}@media (max-width: 768px){.grid-3x3,.grid-4x2{grid-template-columns:repeat(2,1fr);grid-template-rows:auto}.grid-header{flex-direction:column;gap:.5rem;align-items:stretch}.metadata-grid{grid-template-columns:1fr}.metadata-item{flex-direction:column;gap:.25rem}.metadata-item .value{text-align:left}.preview-navigation{flex-direction:column;gap:.5rem}.nav-button{width:40px;height:40px;font-size:20px}.preview-controls{flex-direction:column;width:100%}}@media (max-width: 480px){.grid-3x3,.grid-2x2,.grid-4x2{grid-template-columns:1fr}.grid-image-overlay{position:static;opacity:1;justify-content:center;padding:.25rem;background:#0000000d}.close-preview{top:10px;right:10px}.preview-navigation{padding:0 1rem}}.annotated-image-display{display:flex;flex-direction:column;gap:1rem;padding:1rem;border:1px solid #e0e0e0;border-radius:8px;background:#fff;box-shadow:0 2px 4px #0000001a}.annotated-image-display.error{border-color:#ff6b6b;background:#fff5f5}.annotation-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.annotation-header h3{margin:0;color:#333;font-size:1.2rem}.annotation-controls{display:flex;align-items:center;gap:1rem}.toggle-annotations{padding:.5rem 1rem;background:#f8f9fa;border:1px solid #dee2e6;border-radius:4px;cursor:pointer;font-size:.9rem;transition:all .2s ease;display:flex;align-items:center;gap:.25rem}.toggle-annotations:hover{background:#e9ecef}.toggle-annotations.active{background:#007bff;color:#fff;border-color:#007bff}.total-calories{padding:.5rem 1rem;background:#28a745;color:#fff;border-radius:4px;font-size:.9rem;font-weight:500}.image-container{position:relative;display:flex;justify-content:center;align-items:center;min-height:300px;max-height:600px;overflow:hidden;border:1px solid #e0e0e0;border-radius:4px;background:#f8f9fa}.image-wrapper{position:relative;display:inline-block;max-width:100%;max-height:100%}.annotated-image{max-width:100%;max-height:100%;height:auto;border-radius:4px;transition:opacity .3s ease;opacity:0}.annotated-image.loaded{opacity:1}.annotations-overlay{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.annotation-marker{position:absolute;border:2px solid #007bff;background:#007bff1a;cursor:pointer;pointer-events:all;transition:all .2s ease}.annotation-marker:hover{border-color:#0056b3;background:#007bff33}.annotation-marker.selected{border-color:#28a745;background:#28a74533;z-index:10}.annotation-label{position:absolute;top:-8px;left:-8px;width:24px;height:24px;background:#007bff;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;border:2px solid white;box-shadow:0 2px 4px #0003}.annotation-marker.selected .annotation-label{background:#28a745}.annotation-number{font-size:11px}.annotation-tooltip{position:absolute;bottom:100%;left:50%;transform:translate(-50%);margin-bottom:8px;z-index:20}.tooltip-content{background:#000000e6;color:#fff;padding:.75rem;border-radius:6px;min-width:150px;text-align:center;box-shadow:0 4px 8px #0000004d}.tooltip-content:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border:6px solid transparent;border-top-color:#000000e6}.tooltip-content h4{margin:0 0 .5rem;font-size:.9rem;color:#fff}.calorie-info{margin-bottom:.5rem}.calorie-main{font-size:1.1rem;color:#28a745}.calorie-density{font-size:.8rem;color:#ccc}.confidence-score{font-size:.8rem;color:#ffc107}.annotations-list{border-top:1px solid #e0e0e0;padding-top:1rem}.annotations-list h4{margin:0 0 1rem;color:#333;font-size:1rem}.annotations-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:.75rem;margin-bottom:1rem}.annotation-item{display:flex;align-items:center;gap:.75rem;padding:.75rem;border:1px solid #e0e0e0;border-radius:6px;cursor:pointer;transition:all .2s ease;background:#f8f9fa}.annotation-item:hover{border-color:#007bff;background:#e3f2fd}.annotation-item.selected{border-color:#28a745;background:#e8f5e8}.annotation-item-number{width:24px;height:24px;background:#007bff;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;flex-shrink:0}.annotation-item.selected .annotation-item-number{background:#28a745}.annotation-item-content{flex:1;min-width:0}.food-name{font-weight:500;color:#333;margin-bottom:.25rem}.calorie-value{font-size:1.1rem;font-weight:700;color:#28a745;margin-bottom:.25rem}.calorie-density-small{font-size:.8rem;color:#666;margin-bottom:.25rem}.confidence-bar{width:100%;height:4px;background:#e0e0e0;border-radius:2px;overflow:hidden}.confidence-fill{height:100%;background:linear-gradient(90deg,#ff6b6b,#ffc107,#28a745);transition:width .3s ease}.nutrition-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem;padding:1rem;background:#f8f9fa;border-radius:6px;border:1px solid #e0e0e0}.summary-item{display:flex;flex-direction:column;text-align:center}.summary-label{font-size:.8rem;color:#666;margin-bottom:.25rem}.summary-value{font-size:1.1rem;font-weight:700;color:#333}@media (max-width: 768px){.annotation-header{flex-direction:column;gap:.5rem;align-items:stretch}.annotation-controls{justify-content:space-between}.annotations-grid,.nutrition-summary,.metadata-grid{grid-template-columns:1fr}.metadata-item{flex-direction:column;gap:.25rem}.metadata-item .value{text-align:left}.action-buttons{flex-direction:column}}@media (max-width: 480px){.annotated-image-display{padding:.75rem}.tooltip-content{min-width:120px;padding:.5rem}.annotation-item{padding:.5rem}}.comic-strip-display{display:flex;flex-direction:column;gap:1rem;padding:1rem;border:1px solid #e0e0e0;border-radius:8px;background:#fff;box-shadow:0 2px 4px #0000001a}.comic-strip-display.error{border-color:#ff6b6b;background:#fff5f5}.comic-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.comic-header h3{margin:0;color:#333;font-size:1.2rem;font-family:Comic Sans MS,cursive,sans-serif}.comic-actions{display:flex;align-items:center;gap:1rem}.panel-count{padding:.25rem .5rem;background:#f8f9fa;border:1px solid #dee2e6;border-radius:4px;font-size:.8rem;color:#666}.comic-strip-container{background:#f8f9fa;border:2px solid #333;border-radius:8px;padding:1rem;position:relative}.comic-strip-container:before{content:"";position:absolute;top:-4px;left:-4px;right:-4px;bottom:-4px;background:linear-gradient(45deg,#ff6b6b,#4ecdc4,#45b7d1,#96ceb4);border-radius:10px;z-index:-1}.comic-panels{display:grid;gap:1rem}.comic-panels.single-row{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.comic-panels.multi-row{grid-template-columns:repeat(auto-fit,minmax(250px,1fr));grid-auto-rows:minmax(200px,auto)}.comic-panel{position:relative;transition:transform .2s ease}.comic-panel:hover{transform:scale(1.02)}.comic-panel.selected{transform:scale(1.05)}.panel-wrapper{display:flex;flex-direction:column;height:100%}.panel-border{position:relative;flex:1;border:3px solid #333;border-radius:8px;overflow:hidden;background:#fff;box-shadow:0 4px 8px #0003;min-height:200px;display:flex;align-items:center;justify-content:center}.panel-loading{display:flex;align-items:center;justify-content:center;width:100%;height:100%}.loading-spinner{width:32px;height:32px;border:3px solid #f3f3f3;border-top:3px solid #007bff;border-radius:50%;animation:spin 1s linear infinite}.panel-error{display:flex;align-items:center;justify-content:center;width:100%;height:100%;color:#ff6b6b;background:#fff5f5;font-size:.9rem;text-align:center;padding:1rem}.panel-image{width:100%;height:100%;object-fit:cover;cursor:pointer;transition:opacity .3s ease;opacity:0}.panel-image.loaded{opacity:1}.panel-overlay{position:absolute;top:8px;right:8px;display:flex;gap:4px;opacity:0;transition:opacity .2s ease}.comic-panel:hover .panel-overlay{opacity:1}.fullscreen-button,.download-panel-button{background:#000c;color:#fff;border:none;border-radius:4px;padding:4px 8px;cursor:pointer;font-size:14px;transition:background .2s ease}.fullscreen-button:hover,.download-panel-button:hover{background:#000000e6}.panel-number{position:absolute;top:-12px;left:8px;width:24px;height:24px;background:#333;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;border:2px solid white;box-shadow:0 2px 4px #0000004d}.panel-text{margin-top:.5rem;padding:.5rem;background:#fff;border:2px solid #333;border-radius:6px;font-family:Comic Sans MS,cursive,sans-serif;font-size:.9rem;text-align:center;position:relative}.panel-text:before{content:"";position:absolute;top:-8px;left:20px;width:0;height:0;border-left:8px solid transparent;border-right:8px solid transparent;border-bottom:8px solid #333}.panel-text:after{content:"";position:absolute;top:-6px;left:21px;width:0;height:0;border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid #fff}.comic-description{padding:1rem;background:#f8f9fa;border-left:4px solid #007bff;border-radius:4px;font-style:italic}.comic-description p{margin:0;color:#666;line-height:1.5}.fullscreen-navigation{display:flex;align-items:center;gap:1rem;max-width:100%;max-height:calc(95vh - 80px)}.fullscreen-panel-container{position:relative;display:flex;flex-direction:column;align-items:center;max-width:calc(95vw - 120px);max-height:100%}.fullscreen-panel-image{max-width:100%;max-height:100%;object-fit:contain;border:3px solid #333;border-radius:8px;box-shadow:0 8px 16px #00000080}.fullscreen-panel-counter{margin-top:.5rem;color:#fffc;font-size:.9rem;font-family:Comic Sans MS,cursive,sans-serif}@media (max-width: 768px){.comic-header{flex-direction:column;gap:.5rem;align-items:stretch}.comic-actions{justify-content:space-between}.comic-panels.single-row,.comic-panels.multi-row{grid-template-columns:repeat(2,1fr)}.metadata-grid{grid-template-columns:1fr}.metadata-item{flex-direction:column;gap:.25rem}.metadata-item .value{text-align:left}.action-buttons{flex-direction:column}.fullscreen-navigation{flex-direction:column;gap:.5rem}.nav-button{width:40px;height:40px;font-size:20px}.fullscreen-controls{width:100%}}@media (max-width: 480px){.comic-panels.single-row,.comic-panels.multi-row{grid-template-columns:1fr}.panel-overlay{position:static;opacity:1;justify-content:center;padding:.25rem;background:#0000000d}.close-fullscreen{top:10px;right:10px}.fullscreen-navigation{padding:0 1rem}}.storyboard-display{display:flex;flex-direction:column;gap:1rem;padding:1rem;border:1px solid #e0e0e0;border-radius:8px;background:#fff;box-shadow:0 2px 4px #0000001a}.storyboard-display.error{border-color:#ff6b6b;background:#fff5f5}.storyboard-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.storyboard-header h3{margin:0;color:#333;font-size:1.2rem;font-family:Times New Roman,serif;font-style:italic}.storyboard-actions{display:flex;align-items:center;gap:1rem}.frame-count{padding:.25rem .5rem;background:#f8f9fa;border:1px solid #dee2e6;border-radius:4px;font-size:.8rem;color:#666}.play-button{padding:.5rem 1rem;background:#28a745;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:.9rem;transition:background .2s ease;display:flex;align-items:center;gap:.25rem}.play-button:hover{background:#1e7e34}.play-button.playing{background:#dc3545}.play-button.playing:hover{background:#c82333}.download-all-button{padding:.5rem 1rem;background:#007bff;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:.9rem;transition:background .2s ease;display:flex;align-items:center;gap:.25rem}.download-all-button:hover{background:#0056b3}.slideshow-container{background:#000;border-radius:8px;overflow:hidden;position:relative}.slideshow-frame{position:relative;aspect-ratio:16/9;display:flex;align-items:center;justify-content:center}.slideshow-image{max-width:100%;max-height:100%;object-fit:contain;filter:grayscale(100%) contrast(1.2)}.slideshow-info{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent,#000c);color:#fff;padding:2rem 1rem 1rem}.frame-indicator{font-size:.9rem;opacity:.8;margin-bottom:.5rem}.frame-description{font-size:1.1rem;font-weight:500;font-family:Times New Roman,serif;font-style:italic}.slideshow-progress{height:4px;background:#fff3;position:relative}.progress-bar{height:100%;background:#007bff;transition:width .3s ease}.storyboard-grid-container{background:#f8f9fa;border:1px solid #dee2e6;border-radius:8px;padding:1rem}.storyboard-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem}.storyboard-frame{position:relative;transition:transform .2s ease}.storyboard-frame:hover{transform:translateY(-2px)}.storyboard-frame.selected{transform:translateY(-4px)}.frame-wrapper{display:flex;flex-direction:column;height:100%;background:#fff;border-radius:6px;overflow:hidden;box-shadow:0 2px 8px #00000026;transition:box-shadow .2s ease}.storyboard-frame:hover .frame-wrapper{box-shadow:0 4px 12px #00000040}.frame-border{position:relative;aspect-ratio:16/9;overflow:hidden;background:#f0f0f0;display:flex;align-items:center;justify-content:center}.frame-loading{display:flex;align-items:center;justify-content:center;width:100%;height:100%}.loading-spinner{width:24px;height:24px;border:2px solid #f3f3f3;border-top:2px solid #007bff;border-radius:50%;animation:spin 1s linear infinite}.frame-error{display:flex;align-items:center;justify-content:center;width:100%;height:100%;color:#ff6b6b;background:#fff5f5;font-size:.8rem;text-align:center;padding:1rem}.frame-image{width:100%;height:100%;object-fit:cover;cursor:pointer;transition:opacity .3s ease,filter .2s ease;opacity:0;filter:grayscale(100%) contrast(1.1)}.frame-image.loaded{opacity:1}.frame-image:hover{filter:grayscale(80%) contrast(1.2)}.frame-overlay{position:absolute;top:8px;right:8px;display:flex;gap:4px;opacity:0;transition:opacity .2s ease}.storyboard-frame:hover .frame-overlay{opacity:1}.fullscreen-button,.download-frame-button{background:#000c;color:#fff;border:none;border-radius:4px;padding:4px 8px;cursor:pointer;font-size:12px;transition:background .2s ease}.fullscreen-button:hover,.download-frame-button:hover{background:#000000e6}.frame-info{padding:.75rem;background:#fff;border-top:1px solid #e0e0e0}.frame-number{font-size:.8rem;font-weight:700;color:#007bff;margin-bottom:.25rem}.frame-description{font-size:.85rem;color:#666;line-height:1.3;font-family:Times New Roman,serif;font-style:italic}.story-description{padding:1rem;background:#f8f9fa;border-left:4px solid #6c757d;border-radius:4px;font-style:italic}.story-description p{margin:0;color:#666;line-height:1.5}.save-button{background:#28a745;border-color:#28a745}.save-button:hover{background:#1e7e34;border-color:#1e7e34}.close-fullscreen{position:absolute;top:-40px;right:0;background:#fff3;color:#fff;border:none;border-radius:50%;width:32px;height:32px;cursor:pointer;font-size:18px;display:flex;align-items:center;justify-content:center;transition:background .2s ease;z-index:1001}.fullscreen-navigation{display:flex;align-items:center;gap:1rem;max-width:100%;max-height:calc(95vh - 120px)}.nav-button{background:#fff3;color:#fff;border:none;border-radius:50%;width:48px;height:48px;cursor:pointer;font-size:24px;display:flex;align-items:center;justify-content:center;transition:all .2s ease;flex-shrink:0}.nav-button:hover{background:#ffffff4d;transform:scale(1.1)}.fullscreen-frame-container{position:relative;display:flex;flex-direction:column;align-items:center;max-width:calc(95vw - 120px);max-height:100%}.fullscreen-frame-image{max-width:100%;max-height:100%;object-fit:contain;border-radius:4px;filter:grayscale(100%) contrast(1.2);box-shadow:0 8px 16px #00000080}.fullscreen-frame-info{margin-top:1rem;text-align:center;color:#fff}.fullscreen-frame-counter{font-size:.9rem;opacity:.8;margin-bottom:.5rem}.fullscreen-frame-description{font-size:1.1rem;font-family:Times New Roman,serif;font-style:italic;max-width:400px}.download-fullscreen{background:#fff3;color:#fff;border:1px solid rgba(255,255,255,.3);border-radius:4px;padding:.5rem 1rem;cursor:pointer;transition:all .2s ease}.download-fullscreen:hover{background:#ffffff4d;border-color:#ffffff80}@media (max-width: 768px){.storyboard-header{flex-direction:column;gap:.5rem;align-items:stretch}.storyboard-actions{justify-content:space-between}.storyboard-grid{grid-template-columns:repeat(2,1fr)}.slideshow-info{padding:1rem .75rem .75rem}.frame-description{font-size:1rem}.metadata-grid{grid-template-columns:1fr}.metadata-item{flex-direction:column;gap:.25rem}.metadata-item .value{text-align:left}.action-buttons{flex-direction:column}.fullscreen-navigation{flex-direction:column;gap:.5rem}.nav-button{width:40px;height:40px;font-size:20px}.fullscreen-controls{width:100%}}@media (max-width: 480px){.storyboard-grid{grid-template-columns:1fr}.frame-overlay{position:static;opacity:1;justify-content:center;padding:.25rem;background:#0000000d}.close-fullscreen{top:10px;right:10px}.fullscreen-navigation{padding:0 1rem}.fullscreen-frame-description{font-size:1rem;max-width:300px}}.moodboard-display{display:flex;flex-direction:column;gap:1rem;padding:1rem;border:1px solid #e0e0e0;border-radius:8px;background:#fff;box-shadow:0 2px 4px #0000001a}.moodboard-display.error{border-color:#ff6b6b;background:#fff5f5}.error-message{text-align:center;padding:2rem}.error-message h3{color:#ff6b6b;margin:0 0 .5rem;font-size:1.2rem}.error-message p{color:#666;margin:0}.moodboard-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.moodboard-header h3{margin:0;color:#333;font-size:1.2rem;font-family:Georgia,serif;font-style:italic}.moodboard-controls{display:flex;gap:.5rem}.details-toggle{padding:.5rem 1rem;background:#f8f9fa;border:1px solid #dee2e6;border-radius:4px;cursor:pointer;font-size:.9rem;transition:all .2s ease;display:flex;align-items:center;gap:.25rem}.details-toggle:hover{background:#e9ecef}.details-toggle.active{background:#007bff;color:#fff;border-color:#007bff}.moodboard-container{display:grid;grid-template-columns:1fr;gap:1.5rem}.moodboard-image-section{position:relative;display:flex;justify-content:center;align-items:center;min-height:400px;background:#f8f9fa;border-radius:8px;overflow:hidden}.image-loading{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:2rem}.loading-spinner{width:40px;height:40px;border:4px solid #f3f3f3;border-top:4px solid #007bff;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.image-error{display:flex;align-items:center;justify-content:center;padding:2rem;color:#ff6b6b;background:#fff5f5;border:1px dashed #ff6b6b;border-radius:4px}.image-wrapper{position:relative;display:inline-block;max-width:100%}.moodboard-image{max-width:100%;max-height:600px;height:auto;border-radius:8px;cursor:pointer;transition:opacity .3s ease,transform .2s ease;opacity:0;box-shadow:0 4px 12px #00000026}.moodboard-image.loaded{opacity:1}.moodboard-image:hover{transform:scale(1.02)}.image-overlay{position:absolute;top:12px;right:12px;display:flex;gap:6px;opacity:0;transition:opacity .2s ease}.image-wrapper:hover .image-overlay{opacity:1}.zoom-button,.fullscreen-button{background:#000000b3;color:#fff;border:none;border-radius:6px;padding:6px 10px;cursor:pointer;font-size:14px;transition:background .2s ease}.zoom-button:hover,.fullscreen-button:hover{background:#000000e6}.moodboard-details{display:grid;grid-template-columns:1fr;gap:1.5rem;padding:1.5rem;background:#f8f9fa;border-radius:8px;border:1px solid #e9ecef}.fashion-items-section h4,.styling-notes-section h4,.color-palette-section h4{margin:0 0 1rem;color:#333;font-size:1rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.fashion-items-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1rem}.fashion-item{background:#fff;padding:1rem;border-radius:6px;border:1px solid #e0e0e0;transition:all .2s ease}.fashion-item:hover{border-color:#007bff;transform:translateY(-2px);box-shadow:0 4px 8px #0000001a}.item-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:.5rem}.item-name{font-weight:600;color:#333;font-size:.95rem}.item-price{font-weight:700;color:#28a745;font-size:.9rem}.item-details{display:flex;justify-content:space-between;align-items:center}.item-brand{color:#666;font-size:.85rem;font-style:italic}.item-category{background:#e9ecef;color:#495057;padding:.2rem .5rem;border-radius:12px;font-size:.75rem;font-weight:500}.styling-notes{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:.75rem}.note-item{display:flex;align-items:center;gap:.75rem;padding:.75rem;background:#fff;border-radius:6px;border-left:4px solid #007bff}.note-icon{font-size:1.2rem;flex-shrink:0}.note-text{color:#555;font-size:.9rem;line-height:1.4}.color-palette{display:flex;gap:.75rem;flex-wrap:wrap}.color-swatch{width:48px;height:48px;border-radius:50%;border:3px solid white;box-shadow:0 2px 8px #00000026;cursor:pointer;transition:transform .2s ease}.color-swatch:hover{transform:scale(1.1)}.moodboard-description{padding:1rem;background:#f8f9fa;border-left:4px solid #6f42c1;border-radius:4px;font-style:italic}.moodboard-description p{margin:0;color:#666;line-height:1.5}.action-buttons{display:flex;gap:.5rem;justify-content:center;flex-wrap:wrap}.download-button,.save-button{padding:.5rem 1rem;border:1px solid #007bff;background:#007bff;color:#fff;border-radius:4px;cursor:pointer;font-size:.9rem;transition:all .2s ease;display:flex;align-items:center;gap:.25rem}.download-button:hover,.save-button:hover{background:#0056b3;border-color:#0056b3}.download-button:disabled,.save-button:disabled{background:#ccc;border-color:#ccc;cursor:not-allowed}.save-button{background:#6f42c1;border-color:#6f42c1}.save-button:hover{background:#5a32a3;border-color:#5a32a3}.metadata-section{border-top:1px solid #e0e0e0;padding-top:1rem}.metadata-section h4{margin:0 0 .75rem;color:#333;font-size:1rem}.metadata-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:.5rem}.metadata-item{display:flex;justify-content:space-between;padding:.25rem 0;border-bottom:1px solid #f0f0f0}.metadata-item .label{font-weight:500;color:#666}.metadata-item .value{color:#333;text-align:right}.fullscreen-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000f2;display:flex;align-items:center;justify-content:center;z-index:1000;cursor:pointer}.fullscreen-content{position:relative;max-width:95vw;max-height:95vh;display:flex;flex-direction:column;align-items:center;cursor:default}.close-fullscreen{position:absolute;top:-40px;right:0;background:#fff3;color:#fff;border:none;border-radius:50%;width:32px;height:32px;cursor:pointer;font-size:18px;display:flex;align-items:center;justify-content:center;transition:background .2s ease}.close-fullscreen:hover{background:#ffffff4d}.fullscreen-image{max-width:80%;max-height:calc(95vh - 60px);object-fit:contain;cursor:pointer;transition:transform .3s ease;border-radius:8px}.fullscreen-image.zoomed{transform:scale(1.5);cursor:zoom-out}.fullscreen-controls{display:flex;gap:1rem;margin-top:1rem;padding:.5rem;background:#00000080;border-radius:4px}.zoom-control,.download-control{background:#fff3;color:#fff;border:1px solid rgba(255,255,255,.3);border-radius:4px;padding:.5rem 1rem;cursor:pointer;transition:all .2s ease}.zoom-control:hover,.download-control:hover{background:#ffffff4d;border-color:#ffffff80}@media (max-width: 768px){.moodboard-header{flex-direction:column;gap:.5rem;align-items:stretch}.moodboard-details{padding:1rem}.fashion-items-grid,.styling-notes{grid-template-columns:1fr}.color-palette{justify-content:center}.metadata-grid{grid-template-columns:1fr}.metadata-item{flex-direction:column;gap:.25rem}.metadata-item .value{text-align:left}.action-buttons{flex-direction:column}.fullscreen-controls{flex-direction:column;width:100%}}@media (max-width: 480px){.moodboard-display{padding:.75rem}.image-overlay{position:static;opacity:1;justify-content:center;margin-top:.5rem}.close-fullscreen{top:10px;right:10px}.color-swatch{width:36px;height:36px}}.toast{position:relative;background:#fff;border-radius:8px;box-shadow:0 4px 12px #00000026;margin-bottom:12px;overflow:hidden;transform:translate(100%);transition:transform .3s ease-in-out,opacity .3s ease-in-out;opacity:0;max-width:400px;min-width:300px}.toast-visible{transform:translate(0);opacity:1}.toast-exiting{transform:translate(100%);opacity:0}.toast-content{display:flex;align-items:flex-start;padding:16px;gap:12px}.toast-icon{flex-shrink:0;margin-top:2px}.toast-text{flex:1;min-width:0}.toast-title{font-weight:600;font-size:14px;line-height:1.4;color:#1f2937;margin-bottom:2px}.toast-message{font-size:13px;line-height:1.4;color:#6b7280;word-wrap:break-word}.toast-action{background:none;border:none;color:#3b82f6;font-size:13px;font-weight:500;cursor:pointer;padding:4px 8px;border-radius:4px;transition:background-color .2s ease;flex-shrink:0}.toast-action:hover{background-color:#f3f4f6}.toast-close{background:none;border:none;color:#9ca3af;cursor:pointer;padding:4px;border-radius:4px;transition:color .2s ease,background-color .2s ease;flex-shrink:0;margin-left:8px}.toast-close:hover{color:#6b7280;background-color:#f3f4f6}.toast-progress{position:absolute;bottom:0;left:0;right:0;height:3px;background-color:#0000001a}.toast-progress-bar{height:100%;background-color:currentColor;animation:toast-progress linear forwards;transform-origin:left}@keyframes toast-progress{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.toast-success{border-left:4px solid #10b981}.toast-success .toast-progress-bar{background-color:#10b981}.toast-error{border-left:4px solid #ef4444}.toast-error .toast-progress-bar{background-color:#ef4444}.toast-warning{border-left:4px solid #f59e0b}.toast-warning .toast-progress-bar{background-color:#f59e0b}.toast-info{border-left:4px solid #3b82f6}.toast-info .toast-progress-bar{background-color:#3b82f6}@media (max-width: 768px){.toast{max-width:calc(100vw - 32px);min-width:calc(100vw - 32px);margin-left:16px;margin-right:16px}.toast-content{padding:14px}.toast-title{font-size:13px}.toast-message{font-size:12px}}.toast-container{position:fixed;z-index:9999;pointer-events:none}.toast-container>*{pointer-events:auto}.toast-container-top-right{top:20px;right:20px}.toast-container-top-left{top:20px;left:20px}.toast-container-bottom-right{bottom:20px;right:20px}.toast-container-bottom-left{bottom:20px;left:20px}.toast-container-top-center{top:20px;left:50%;transform:translate(-50%)}.toast-container-bottom-center{bottom:20px;left:50%;transform:translate(-50%)}@media (max-width: 768px){.toast-container-top-right,.toast-container-top-left,.toast-container-bottom-right,.toast-container-bottom-left{left:0;right:0;top:auto}.toast-container-top-right,.toast-container-top-left{top:20px}.toast-container-bottom-right,.toast-container-bottom-left{bottom:20px}.toast-container-top-center,.toast-container-bottom-center{left:0;right:0;transform:none}}.progress-linear{width:100%}.progress-label{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;font-size:14px;font-weight:500;color:#374151}.progress-track-linear{width:100%;background-color:#e5e7eb;border-radius:9999px;overflow:hidden;position:relative}.progress-bar-linear{height:100%;border-radius:9999px;transition:width .3s ease;position:relative}.progress-circular{position:relative;display:inline-flex;align-items:center;justify-content:center}.progress-svg{transform:rotate(-90deg)}.progress-track{stroke:#e5e7eb}.progress-bar{stroke-linecap:round;transition:stroke-dashoffset .3s ease}.progress-label-circular{position:absolute;font-size:12px;font-weight:600;color:#374151}.progress-small .progress-track-linear{height:4px}.progress-small .progress-label{font-size:12px;margin-bottom:4px}.progress-small .progress-label-circular{font-size:10px}.progress-medium .progress-track-linear{height:6px}.progress-medium .progress-label{font-size:14px;margin-bottom:6px}.progress-medium .progress-label-circular{font-size:12px}.progress-large .progress-track-linear{height:8px}.progress-large .progress-label{font-size:16px;margin-bottom:8px}.progress-large .progress-label-circular{font-size:14px}.progress-primary .progress-bar-linear{background-color:#3b82f6}.progress-primary .progress-bar{stroke:#3b82f6}.progress-success .progress-bar-linear{background-color:#10b981}.progress-success .progress-bar{stroke:#10b981}.progress-warning .progress-bar-linear{background-color:#f59e0b}.progress-warning .progress-bar{stroke:#f59e0b}.progress-error .progress-bar-linear{background-color:#ef4444}.progress-error .progress-bar{stroke:#ef4444}.progress-animated.progress-bar-linear:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent);animation:progress-shimmer 2s infinite}.progress-animated.progress-bar{animation:progress-rotate 2s linear infinite}@keyframes progress-shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}@keyframes progress-rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.progress-indeterminate.progress-bar-linear{background:linear-gradient(90deg,transparent,currentColor,transparent);background-size:50% 100%;animation:progress-indeterminate-linear 1.5s infinite}.progress-indeterminate.progress-bar{stroke-dasharray:80,200;stroke-dashoffset:0;animation:progress-indeterminate-circular 1.4s ease-in-out infinite}@keyframes progress-indeterminate-linear{0%{background-position:-50% 0}to{background-position:150% 0}}@keyframes progress-indeterminate-circular{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:100,200;stroke-dashoffset:-15}to{stroke-dasharray:100,200;stroke-dashoffset:-125}}.tooltip-wrapper{position:relative;display:inline-block}.tooltip-trigger{display:inline-block}.tooltip{position:absolute;z-index:1000;max-width:300px;padding:0;font-size:13px;line-height:1.4;background:#1f2937;color:#fff;border-radius:6px;box-shadow:0 4px 6px #0000001a;opacity:0;animation:tooltip-fade-in .2s ease-out forwards}.tooltip-content{padding:8px 12px;word-wrap:break-word}.tooltip-arrow{position:absolute;width:0;height:0;border:5px solid transparent}.tooltip-top{bottom:100%;left:50%;transform:translate(-50%);margin-bottom:5px}.tooltip-top .tooltip-arrow{top:100%;left:50%;transform:translate(-50%);border-top-color:#1f2937}.tooltip-bottom{top:100%;left:50%;transform:translate(-50%);margin-top:5px}.tooltip-bottom .tooltip-arrow{bottom:100%;left:50%;transform:translate(-50%);border-bottom-color:#1f2937}.tooltip-left{right:100%;top:50%;transform:translateY(-50%);margin-right:5px}.tooltip-left .tooltip-arrow{left:100%;top:50%;transform:translateY(-50%);border-left-color:#1f2937}.tooltip-right{left:100%;top:50%;transform:translateY(-50%);margin-left:5px}.tooltip-right .tooltip-arrow{right:100%;top:50%;transform:translateY(-50%);border-right-color:#1f2937}@keyframes tooltip-fade-in{0%{opacity:0;transform:translate(-50%) translateY(-4px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.tooltip-bottom{animation:tooltip-fade-in-bottom .2s ease-out forwards}@keyframes tooltip-fade-in-bottom{0%{opacity:0;transform:translate(-50%) translateY(4px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.tooltip-left{animation:tooltip-fade-in-left .2s ease-out forwards}@keyframes tooltip-fade-in-left{0%{opacity:0;transform:translateY(-50%) translate(-4px)}to{opacity:1;transform:translateY(-50%) translate(0)}}.tooltip-right{animation:tooltip-fade-in-right .2s ease-out forwards}@keyframes tooltip-fade-in-right{0%{opacity:0;transform:translateY(-50%) translate(4px)}to{opacity:1;transform:translateY(-50%) translate(0)}}@media (max-width: 768px){.tooltip{max-width:250px;font-size:12px}.tooltip-content{padding:6px 10px}}.feedback-collector{position:relative}.feedback-trigger{display:flex;align-items:center;gap:6px;background:none;border:1px solid #d1d5db;color:#6b7280;padding:8px 12px;border-radius:6px;font-size:13px;cursor:pointer;transition:all .2s ease}.feedback-trigger:hover{border-color:#9ca3af;color:#374151}.feedback-collector-compact{position:relative}.feedback-trigger-compact{background:none;border:none;color:#6b7280;padding:4px;border-radius:4px;cursor:pointer;transition:color .2s ease}.feedback-trigger-compact:hover{color:#374151}.feedback-popup{position:absolute;top:100%;right:0;margin-top:8px;background:#fff;border:1px solid #d1d5db;border-radius:8px;box-shadow:0 4px 6px #0000001a;z-index:1000;min-width:200px}.feedback-popup-content{padding:16px}.stars-row{display:flex;gap:4px;margin-bottom:12px}.submit-button-compact{width:100%;background-color:#3b82f6;color:#fff;border:none;padding:8px 16px;border-radius:6px;font-size:13px;cursor:pointer;transition:background-color .2s ease}.submit-button-compact:hover:not(:disabled){background-color:#2563eb}.submit-button-compact:disabled{background-color:#9ca3af;cursor:not-allowed}.feedback-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.feedback-modal-content{background:#fff;border-radius:12px;max-width:500px;width:100%;max-height:90vh;overflow-y:auto}.feedback-header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px 16px;border-bottom:1px solid #e5e7eb}.feedback-header h3{margin:0;font-size:18px;font-weight:600;color:#111827}.close-button{background:none;border:none;color:#6b7280;cursor:pointer;padding:4px;border-radius:4px;transition:color .2s ease}.close-button:hover{color:#374151}.feedback-form{padding:24px}.rating-section{margin-bottom:24px}.rating-section label{display:block;font-weight:500;color:#374151;margin-bottom:8px;font-size:14px}.stars-container{display:flex;gap:4px;margin-bottom:8px}.star-button{background:none;border:none;cursor:pointer;padding:2px;border-radius:4px;transition:transform .1s ease}.star-button:hover{transform:scale(1.1)}.star-filled svg{filter:drop-shadow(0 1px 2px rgba(251,191,36,.3))}.rating-labels{display:flex;justify-content:space-between;font-size:12px;color:#6b7280}.category-section{margin-bottom:24px}.category-section label{display:block;font-weight:500;color:#374151;margin-bottom:8px;font-size:14px}.category-section select{width:100%;padding:8px 12px;border:1px solid #d1d5db;border-radius:6px;font-size:14px;background:#fff;color:#374151}.category-section select:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.comment-section{margin-bottom:24px}.comment-section label{display:block;font-weight:500;color:#374151;margin-bottom:8px;font-size:14px}.comment-section textarea{width:100%;padding:8px 12px;border:1px solid #d1d5db;border-radius:6px;font-size:14px;font-family:inherit;resize:vertical;min-height:80px}.comment-section textarea:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.character-count{text-align:right;font-size:12px;color:#6b7280;margin-top:4px}.form-actions{display:flex;gap:12px;justify-content:flex-end}.cancel-button{background:none;border:1px solid #d1d5db;color:#374151;padding:10px 20px;border-radius:6px;font-size:14px;cursor:pointer;transition:all .2s ease}.cancel-button:hover{border-color:#9ca3af;background-color:#f9fafb}.submit-button{background-color:#3b82f6;color:#fff;border:none;padding:10px 20px;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:background-color .2s ease}.submit-button:hover:not(:disabled){background-color:#2563eb}.submit-button:disabled{background-color:#9ca3af;cursor:not-allowed}.feedback-success{display:flex;align-items:center;gap:8px;color:#10b981;font-size:14px;font-weight:500}.feedback-success-full{text-align:center;padding:32px 24px}.feedback-success-full svg{margin-bottom:16px}.feedback-success-full h4{margin:0 0 8px;font-size:18px;font-weight:600;color:#111827}.feedback-success-full p{margin:0;color:#6b7280;font-size:14px}@media (max-width: 768px){.feedback-modal{padding:16px}.feedback-modal-content{max-height:95vh}.feedback-header{padding:16px 20px 12px}.feedback-form{padding:20px}.form-actions{flex-direction:column-reverse}.form-actions button{width:100%}.feedback-popup{right:auto;left:0;min-width:180px}}:root{--primary-color: #04B900;--secondary-color: #D24B09;--accent-color: #A0CCE5;--text-primary: #000000;--text-secondary: #666;--background-card: #ffffff;--background-secondary: #f8f9fa;--background-hover: #e9ecef;--border-color: #e1e5e9;--success-color: #04B900;--success-hover: #039600;--error-background: #fef2f2;--error-border: #fecaca;--error-text: #dc2626;--info-background: #e3f2fd;--info-border: #A0CCE5;--info-text: #0288d1}.app{height:100vh;width:100vw;overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.app-layout{display:grid;grid-template-columns:auto 1fr;height:100vh;width:100vw;background-color:#f5f5f5}@media (max-width: 768px){.app-layout{grid-template-columns:1fr;position:relative}}@media (max-width: 1024px) and (min-width: 769px){.app-layout{grid-template-columns:240px 1fr}}@media (min-width: 1400px){.app-layout{grid-template-columns:320px 1fr}}.app--mobile{height:calc(var(--vh, 1vh) * 100);overflow:hidden}.app-layout--mobile{height:calc(var(--vh, 1vh) * 100)}.app--touch{-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.app--touch *{-webkit-tap-highlight-color:transparent}.app--touch button,.app--touch input,.app--touch textarea{touch-action:manipulation}h1,h2,h3,h4,h5,h6{margin:0;font-weight:600;color:#1a1a1a}p{margin:0;color:#666;line-height:1.5}button{border:none;border-radius:8px;padding:8px 16px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease;background-color:var(--primary-color);color:#fff}button:hover{background-color:var(--success-hover);transform:translateY(-1px)}button:active{transform:translateY(0)}button:disabled{background-color:#ccc;cursor:not-allowed;transform:none}.loading{opacity:.6;pointer-events:none}.error{color:#dc3545;background-color:#f8d7da;border:1px solid #f5c6cb;border-radius:4px;padding:12px;margin:8px 0}.success{color:#155724;background-color:#d4edda;border:1px solid #c3e6cb;border-radius:4px;padding:12px;margin:8px 0}.touch-target{min-height:44px;min-width:44px}.scrollable{-webkit-overflow-scrolling:touch}.text-responsive{font-size:clamp(.875rem,2.5vw,1rem)}.heading-responsive{font-size:clamp(1.25rem,4vw,2rem)}.container-fluid{width:100%;padding-left:1rem;padding-right:1rem}.container{width:100%;max-width:1200px;margin:0 auto;padding-left:1rem;padding-right:1rem}.spacing-responsive{padding:clamp(1rem,3vw,2rem)}.gap-responsive{gap:clamp(.5rem,2vw,1.5rem)}@media (max-width: 480px){.container-fluid,.container{padding-left:.75rem;padding-right:.75rem}button{min-height:44px;padding:12px 16px;font-size:16px}input,textarea,select{font-size:16px}}@media (max-width: 320px){.container-fluid,.container{padding-left:.5rem;padding-right:.5rem}}.grid{display:grid;gap:1rem}.grid-cols-1{grid-template-columns:repeat(1,1fr)}.grid-cols-2{grid-template-columns:repeat(2,1fr)}.grid-cols-3{grid-template-columns:repeat(3,1fr)}.grid-cols-4{grid-template-columns:repeat(4,1fr)}@media (min-width: 640px){.sm\:grid-cols-1{grid-template-columns:repeat(1,1fr)}.sm\:grid-cols-2{grid-template-columns:repeat(2,1fr)}.sm\:grid-cols-3{grid-template-columns:repeat(3,1fr)}.sm\:grid-cols-4{grid-template-columns:repeat(4,1fr)}}@media (min-width: 768px){.md\:grid-cols-1{grid-template-columns:repeat(1,1fr)}.md\:grid-cols-2{grid-template-columns:repeat(2,1fr)}.md\:grid-cols-3{grid-template-columns:repeat(3,1fr)}.md\:grid-cols-4{grid-template-columns:repeat(4,1fr)}}@media (min-width: 1024px){.lg\:grid-cols-1{grid-template-columns:repeat(1,1fr)}.lg\:grid-cols-2{grid-template-columns:repeat(2,1fr)}.lg\:grid-cols-3{grid-template-columns:repeat(3,1fr)}.lg\:grid-cols-4{grid-template-columns:repeat(4,1fr)}}.flex{display:flex}.flex-col{flex-direction:column}.flex-row{flex-direction:row}.flex-wrap{flex-wrap:wrap}.flex-nowrap{flex-wrap:nowrap}.justify-start{justify-content:flex-start}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.justify-between{justify-content:space-between}.justify-around{justify-content:space-around}.items-start{align-items:flex-start}.items-center{align-items:center}.items-end{align-items:flex-end}.items-stretch{align-items:stretch}.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.p-1{padding:.25rem}.p-2{padding:.5rem}.p-3{padding:.75rem}.p-4{padding:1rem}.p-6{padding:1.5rem}.p-8{padding:2rem}.px-1{padding-left:.25rem;padding-right:.25rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.m-1{margin:.25rem}.m-2{margin:.5rem}.m-3{margin:.75rem}.m-4{margin:1rem}.m-6{margin:1.5rem}.m-8{margin:2rem}.m-auto{margin:auto}.mx-1{margin-left:.25rem;margin-right:.25rem}.mx-2{margin-left:.5rem;margin-right:.5rem}.mx-3{margin-left:.75rem;margin-right:.75rem}.mx-4{margin-left:1rem;margin-right:1rem}.mx-auto{margin-left:auto;margin-right:auto}.my-1{margin-top:.25rem;margin-bottom:.25rem}.my-2{margin-top:.5rem;margin-bottom:.5rem}.my-3{margin-top:.75rem;margin-bottom:.75rem}.my-4{margin-top:1rem;margin-bottom:1rem}.my-6{margin-top:1.5rem;margin-bottom:1.5rem}.w-full{width:100%}.w-auto{width:auto}.w-fit{width:fit-content}.h-full{height:100%}.h-auto{height:auto}.h-fit{height:fit-content}.min-h-screen{min-height:100vh}.min-h-full{min-height:100%}.block{display:block}.inline{display:inline}.inline-block{display:inline-block}.hidden{display:none}@media (max-width: 640px){.sm\:hidden{display:none}.sm\:block{display:block}.sm\:flex{display:flex}}@media (max-width: 768px){.md\:hidden{display:none}.md\:block{display:block}.md\:flex{display:flex}}@media (max-width: 1024px){.lg\:hidden{display:none}.lg\:block{display:block}.lg\:flex{display:flex}}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.text-xs{font-size:.75rem;line-height:1rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-base{font-size:1rem;line-height:1.5rem}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-2xl{font-size:1.5rem;line-height:2rem}.text-3xl{font-size:1.875rem;line-height:2.25rem}.font-normal{font-weight:400}.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}.text-gray-500{color:#6b7280}.text-gray-600{color:#4b5563}.text-gray-700{color:#374151}.text-gray-900{color:#111827}.bg-white{background-color:#fff}.bg-gray-50{background-color:#f9fafb}.bg-gray-100{background-color:#f3f4f6}.bg-gray-200{background-color:#e5e7eb}.border{border-width:1px}.border-0{border-width:0}.border-2{border-width:2px}.border-gray-200{border-color:#e5e7eb}.border-gray-300{border-color:#d1d5db}.rounded{border-radius:.25rem}.rounded-md{border-radius:.375rem}.rounded-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}.rounded-full{border-radius:9999px}.shadow-sm{box-shadow:0 1px 2px #0000000d}.shadow{box-shadow:0 1px 3px #0000001a,0 1px 2px #0000000f}.shadow-md{box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.shadow-lg{box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d}.relative{position:relative}.absolute{position:absolute}.fixed{position:fixed}.sticky{position:sticky}.z-10{z-index:10}.z-20{z-index:20}.z-30{z-index:30}.z-40{z-index:40}.z-50{z-index:50}.overflow-hidden{overflow:hidden}.overflow-auto{overflow:auto}.overflow-scroll{overflow:scroll}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.touch-manipulation{touch-action:manipulation}.touch-pan-x{touch-action:pan-x}.touch-pan-y{touch-action:pan-y}.touch-none{touch-action:none}@media (max-width: 480px){.xs\:text-xs{font-size:.75rem;line-height:1rem}.xs\:text-sm{font-size:.875rem;line-height:1.25rem}.xs\:p-2{padding:.5rem}.xs\:p-3{padding:.75rem}.xs\:gap-2{gap:.5rem}.xs\:gap-3{gap:.75rem}}@media (-webkit-min-device-pixel-ratio: 2),(min-resolution: 192dpi){.retina\:border{border-width:.5px}}@media (prefers-reduced-motion: reduce){.motion-reduce\:transition-none{transition:none}.motion-reduce\:animate-none{animation:none}}@media (prefers-color-scheme: dark){.dark\:bg-gray-800{background-color:#1f2937}.dark\:bg-gray-900{background-color:#111827}.dark\:text-white{color:#fff}.dark\:text-gray-300{color:#d1d5db}}@supports (-webkit-touch-callout: none){.ios-vh-fix{height:-webkit-fill-available}input[type=text],input[type=email],input[type=password],input[type=number],input[type=tel],input[type=url],input[type=search],textarea,select{font-size:16px!important}.no-bounce{-webkit-overflow-scrolling:auto}}@media screen and (-webkit-min-device-pixel-ratio: 0){.android-vh-fix{height:calc(100vh - env(keyboard-inset-height,0px))}}.btn-touch{min-height:44px;min-width:44px;padding:12px 16px;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.touch-target{position:relative}.touch-target:before{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);min-width:44px;min-height:44px;z-index:-1}.swipeable{touch-action:pan-y;-webkit-user-select:none;user-select:none}.swipe-left{transform:translate(-100%);transition:transform .3s ease}.swipe-right{transform:translate(100%);transition:transform .3s ease}.mobile-scroll{-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:rgba(0,0,0,.2) transparent}.mobile-scroll::-webkit-scrollbar{width:4px;height:4px}.mobile-scroll::-webkit-scrollbar-track{background:transparent}.mobile-scroll::-webkit-scrollbar-thumb{background-color:#0003;border-radius:2px}@keyframes slideInFromRight{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes slideInFromLeft{0%{transform:translate(-100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes slideInFromBottom{0%{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}.slide-in-right{animation:slideInFromRight .3s ease-out}.slide-in-left{animation:slideInFromLeft .3s ease-out}.slide-in-bottom{animation:slideInFromBottom .3s ease-out}.mobile-modal{position:fixed;top:0;left:0;right:0;bottom:0;z-index:1000;background:#00000080;display:flex;align-items:flex-end;justify-content:center;padding:0}.mobile-modal-content{background:#fff;border-radius:16px 16px 0 0;width:100%;max-height:90vh;overflow-y:auto;-webkit-overflow-scrolling:touch;animation:slideInFromBottom .3s ease-out}.mobile-modal-header{position:sticky;top:0;background:#fff;padding:16px 20px;border-bottom:1px solid #e5e7eb;display:flex;justify-content:space-between;align-items:center;z-index:10}.mobile-modal-close{background:none;border:none;font-size:24px;color:#6b7280;cursor:pointer;padding:8px;border-radius:50%;min-width:40px;min-height:40px;display:flex;align-items:center;justify-content:center}.mobile-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;text-align:center}.mobile-spinner{width:32px;height:32px;border:3px solid #f3f4f6;border-top:3px solid var(--primary-color);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:16px}.mobile-input{width:100%;padding:16px;font-size:16px;border:2px solid #e5e7eb;border-radius:8px;background:#fff;transition:border-color .2s ease;-webkit-appearance:none;-moz-appearance:none;appearance:none}.mobile-input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #04b9001a}.mobile-textarea{min-height:120px;resize:vertical}.mobile-select{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");background-position:right 12px center;background-repeat:no-repeat;background-size:16px;padding-right:40px}.mobile-error{background:#fef2f2;border:2px solid #fecaca;border-radius:8px;padding:16px;margin:16px 0;display:flex;align-items:flex-start;gap:12px}.mobile-error-icon{color:#dc2626;font-size:20px;flex-shrink:0;margin-top:2px}.mobile-error-content{flex:1}.mobile-error-title{font-weight:600;color:#dc2626;margin:0 0 4px;font-size:14px}.mobile-error-message{color:#7f1d1d;margin:0;font-size:13px;line-height:1.4}.mobile-success{background:#f0fdf4;border:2px solid #bbf7d0;border-radius:8px;padding:16px;margin:16px 0;display:flex;align-items:flex-start;gap:12px}.mobile-success-icon{color:#16a34a;font-size:20px;flex-shrink:0;margin-top:2px}.mobile-image{max-width:100%;height:auto;border-radius:8px;touch-action:manipulation}.mobile-image-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;padding:12px 0}.mobile-image-item{position:relative;aspect-ratio:1;overflow:hidden;border-radius:8px;background:#f3f4f6}.mobile-image-item img{width:100%;height:100%;object-fit:cover;transition:transform .2s ease}.mobile-image-item:active img{transform:scale(.95)}.mobile-nav{position:fixed;bottom:0;left:0;right:0;background:#fff;border-top:1px solid #e5e7eb;padding:8px 0 calc(8px + env(safe-area-inset-bottom));z-index:100}.mobile-nav-list{display:flex;justify-content:space-around;align-items:center;margin:0;padding:0;list-style:none}.mobile-nav-item{flex:1;text-align:center}.mobile-nav-button{display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px;background:none;border:none;color:#6b7280;font-size:12px;cursor:pointer;transition:color .2s ease;min-height:44px;width:100%}.mobile-nav-button.active{color:var(--primary-color)}.mobile-nav-icon{font-size:20px}.safe-area-top{padding-top:env(safe-area-inset-top)}.safe-area-bottom{padding-bottom:env(safe-area-inset-bottom)}.safe-area-left{padding-left:env(safe-area-inset-left)}.safe-area-right{padding-right:env(safe-area-inset-right)}@media (max-height: 500px) and (orientation: landscape){.landscape-compact{padding:8px 16px}.landscape-compact .mobile-modal-content{max-height:80vh}.landscape-compact .mobile-nav{display:none}}@media (prefers-contrast: high){.mobile-input,.mobile-error,.mobile-success{border-width:3px}}@media (prefers-reduced-motion: reduce){.slide-in-right,.slide-in-left,.slide-in-bottom,.mobile-modal-content,.mobile-spinner{animation:none}.mobile-image-item img{transition:none}}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light;color:var(--text-primary, #000000);background-color:#f5f5f5;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}#root{width:100%;height:100vh;margin:0;padding:0}