@import "https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css";:root{--font-family:"Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--bg-main:#0c0f17;--bg-card:#171d2cbf;--bg-card-hover:#1e263ad9;--bg-glass:#ffffff0a;--border-subtle:#ffffff14;--border-active:#8b5cf6;--border-glow:#8b5cf640;--text-primary:#f8fafc;--text-secondary:#94a3b8;--text-muted:#64748b;--accent-purple:#8b5cf6;--accent-violet:#6366f1;--accent-rose:#ec4899;--accent-amber:#f59e0b;--accent-emerald:#10b981;--accent-danger:#f43f5e;--gradient-accent:linear-gradient(135deg, #a855f7 0%, #6366f1 50%, #3b82f6 100%);--gradient-gold:linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);--gradient-surface:linear-gradient(180deg, #1e293b80 0%, #0f172acc 100%);--radius-sm:8px;--radius-md:14px;--radius-lg:20px;--radius-xl:28px;--shadow-card:0 10px 30px -5px #00000073;--shadow-glow:0 0 25px #8b5cf64d}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-family);background-color:var(--bg-main);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-image:radial-gradient(circle at 20% 15%,#8b5cf61f 0%,#0000 40%),radial-gradient(circle at 80% 80%,#6366f11a 0%,#0000 45%);background-attachment:fixed;min-height:100vh;line-height:1.6}a{color:inherit;text-decoration:none}button{cursor:pointer;background:0 0;border:none;outline:none;font-family:inherit}input{font-family:inherit}.app-layout{flex-direction:column;min-height:100vh;display:flex}.main-content{flex:1;width:100%;max-width:1160px;margin:0 auto;padding:1.5rem 1.25rem 5rem}.cursor-pointer{cursor:pointer}.app-header{border-bottom:1px solid var(--border-subtle);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);z-index:50;background:#0c0f17d9;position:sticky;top:0}.header-container{justify-content:space-between;align-items:center;max-width:1160px;margin:0 auto;padding:.9rem 1.25rem;display:flex}.logo-group{cursor:pointer;align-items:center;gap:.85rem;transition:opacity .2s;display:flex}.logo-group:hover{opacity:.9}.logo-icon-wrapper{border-radius:var(--radius-md);background:var(--gradient-accent);color:#fff;justify-content:center;align-items:center;width:42px;height:42px;display:flex;box-shadow:0 4px 12px #8b5cf666}.brand-title{letter-spacing:-.02em;color:#fff;font-size:1.25rem;font-weight:800}.brand-highlight{background:var(--gradient-accent);-webkit-text-fill-color:transparent;-webkit-background-clip:text}.brand-subtitle{color:var(--text-secondary);font-size:.76rem}.header-actions{align-items:center;gap:.75rem;display:flex}.badge-ai{color:#c4b5fd;background:#8b5cf61f;border:1px solid #8b5cf64d;border-radius:999px;align-items:center;gap:.4rem;padding:.4rem .85rem;font-size:.8rem;font-weight:600;display:flex}.badge-privacy{background:var(--bg-glass);border:1px solid var(--border-subtle);color:var(--text-secondary);border-radius:999px;align-items:center;gap:.4rem;padding:.4rem .85rem;font-size:.8rem;display:flex}.quick-test-bar-container{border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:linear-gradient(135deg,#8b5cf61f 0%,#3b82f614 100%);border:1px solid #8b5cf659;margin-bottom:1.75rem;padding:1rem 1.25rem;box-shadow:0 4px 20px #00000040}.quick-test-bar-header{flex-wrap:wrap;align-items:center;gap:.85rem;margin-bottom:.85rem;display:flex}.quick-test-badge{color:#fbbf24;letter-spacing:-.01em;background:#f59e0b33;border:1px solid #f59e0b66;border-radius:999px;align-items:center;gap:.35rem;padding:.25rem .65rem;font-size:.76rem;font-weight:800;display:inline-flex}.text-warning{color:#fbbf24}.quick-test-caption{color:var(--text-secondary);font-size:.82rem}.quick-presets-grid{grid-template-columns:repeat(4,1fr);gap:.75rem;display:grid}@media (width<=960px){.quick-presets-grid{grid-template-columns:repeat(2,1fr)}}@media (width<=540px){.quick-presets-grid{grid-template-columns:1fr}}.quick-preset-chip{border:1px solid var(--border-subtle);border-radius:var(--radius-md);text-align:left;cursor:pointer;background:#ffffff0a;align-items:center;gap:.65rem;padding:.65rem .75rem;transition:all .2s cubic-bezier(.16,1,.3,1);display:flex}.quick-preset-chip:hover{background:#8b5cf62e;border-color:#a78bfa;transform:translateY(-2px);box-shadow:0 4px 15px #8b5cf64d}.quick-preset-chip.active{background:#8b5cf640;border-color:#c4b5fd;box-shadow:0 0 16px #8b5cf666}.quick-preset-avatar{object-fit:cover;border:1px solid #ffffff26;border-radius:6px;flex-shrink:0;width:38px;height:50px}.quick-preset-text{flex:1;min-width:0}.quick-preset-title-row{align-items:center;gap:.35rem;margin-bottom:.15rem;display:flex}.quick-preset-badge{color:#ddd6fe;background:#8b5cf64d;border-radius:3px;padding:.1rem .35rem;font-size:.65rem;font-weight:700}.quick-preset-name{color:#fff;white-space:nowrap;text-overflow:ellipsis;font-size:.8rem;font-weight:700;overflow:hidden}.quick-preset-meta{color:var(--text-muted);white-space:nowrap;text-overflow:ellipsis;font-size:.72rem;overflow:hidden}.quick-preset-arrow{color:#a78bfa;opacity:.6;transition:transform .2s,opacity .2s}.quick-preset-chip:hover .quick-preset-arrow{opacity:1;transform:translate(3px)}.hero-banner{text-align:center;max-width:820px;margin:0 auto;padding:1.5rem 1rem 2.5rem}.hero-badge{border:1px solid var(--border-subtle);color:#a78bfa;background:#ffffff0f;border-radius:999px;align-items:center;gap:.45rem;margin-bottom:1rem;padding:.4rem 1rem;font-size:.82rem;font-weight:600;display:inline-flex}.hero-title{letter-spacing:-.03em;margin-bottom:.85rem;font-size:2.35rem;font-weight:800;line-height:1.3}.hero-description{color:var(--text-secondary);font-size:1.02rem;line-height:1.6}.text-gradient{background:var(--gradient-accent);-webkit-text-fill-color:transparent;-webkit-background-clip:text}.text-accent{color:#a78bfa}.text-success{color:#34d399}.text-danger{color:#fb7185}.text-muted{color:var(--text-muted)}.form-sections-wrapper{grid-template-columns:1fr 1fr;gap:1.75rem;margin-bottom:2rem;display:grid}@media (width<=860px){.form-sections-wrapper{grid-template-columns:1fr}}.card-section{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:var(--shadow-card);flex-direction:column;padding:1.75rem;display:flex}.card-header{margin-bottom:1.5rem}.step-indicator{letter-spacing:.08em;color:#a78bfa;background:#8b5cf626;border-radius:4px;margin-bottom:.5rem;padding:.2rem .55rem;font-size:.72rem;font-weight:800;display:inline-block}.section-title{align-items:center;gap:.5rem;margin-bottom:.35rem;font-size:1.25rem;font-weight:700;display:flex}.section-title-icon{color:#a78bfa}.section-desc{color:var(--text-secondary);font-size:.85rem}.dropzone{border-radius:var(--radius-md);text-align:center;cursor:pointer;background:#8b5cf608;border:2px dashed #8b5cf666;flex-direction:column;align-items:center;gap:.85rem;padding:2rem 1.5rem;transition:all .25s;display:flex}.dropzone:hover,.dropzone-active{border-color:var(--accent-purple);background:#8b5cf614;transform:translateY(-2px)}.dropzone-icon-circle{color:#a78bfa;background:#8b5cf61f;border-radius:50%;justify-content:center;align-items:center;width:60px;height:60px;display:flex}.dropzone-main-text{color:var(--text-primary);margin-bottom:.2rem;font-size:.98rem;font-weight:600}.dropzone-sub-text{color:var(--text-muted);font-size:.78rem}.btn-upload-cta{border-radius:var(--radius-sm);border:1px solid var(--border-subtle);color:#fff;background:#ffffff14;align-items:center;gap:.5rem;padding:.55rem 1.15rem;font-size:.85rem;font-weight:600;transition:all .2s;display:inline-flex}.btn-upload-cta:hover{background:#ffffff24}.preview-container{border:1px solid var(--border-subtle);border-radius:var(--radius-md);background:#00000040;align-items:center;gap:1.25rem;padding:1.25rem;display:flex}.preview-image-wrapper{border-radius:var(--radius-sm);border:2px solid #8b5cf680;flex-shrink:0;width:130px;height:180px;position:relative;overflow:hidden}.preview-image{object-fit:cover;width:100%;height:100%}.scan-line-overlay{background:linear-gradient(90deg,#0000,#a78bfa,#0000);height:2px;animation:2.5s linear infinite scan-vertical;position:absolute;top:0;left:0;right:0;box-shadow:0 0 8px #a78bfa}@keyframes scan-vertical{0%{top:0}50%{top:98%}to{top:0}}.preview-badge{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:#34d399;background:#0c0f17d9;border-radius:4px;justify-content:center;align-items:center;gap:.3rem;padding:.25rem;font-size:.68rem;font-weight:600;display:flex;position:absolute;bottom:6px;left:6px;right:6px}.btn-remove-photo{color:#fff;background:#000000a6;border-radius:50%;justify-content:center;align-items:center;width:26px;height:26px;transition:background .2s;display:flex;position:absolute;top:6px;right:6px}.btn-remove-photo:hover{background:#f43f5e}.preview-info-panel{flex-direction:column;flex:1;justify-content:space-between;gap:.85rem;display:flex}.status-box{border-radius:var(--radius-sm);background:#8b5cf614;border:1px solid #8b5cf633;padding:.75rem}.status-heading{color:#fff;align-items:center;gap:.4rem;margin-bottom:.25rem;font-size:.88rem;font-weight:700;display:flex}.status-text{color:var(--text-secondary);font-size:.78rem}.preview-actions{gap:.5rem;display:flex}.btn-outline-sm{border-radius:var(--radius-sm);border:1px solid var(--border-subtle);color:var(--text-primary);cursor:pointer;background:#ffffff0a;align-items:center;gap:.4rem;padding:.45rem .85rem;font-size:.8rem;font-weight:600;transition:all .2s;display:inline-flex}.btn-outline-sm:hover{background:#ffffff1a;border-color:#fff3}.btn-text-danger-sm{color:#fb7185;padding:.45rem .75rem;font-size:.8rem;font-weight:600;transition:opacity .2s}.btn-text-danger-sm:hover{opacity:.8}.photo-tips-box{border-radius:var(--radius-sm);border:1px solid var(--border-subtle);background:#ffffff08;margin-top:1.25rem;padding:.85rem 1rem}.tip-header{color:#c4b5fd;align-items:center;gap:.45rem;margin-bottom:.4rem;font-size:.82rem;font-weight:700;display:flex}.tip-icon{color:#a78bfa}.tip-list{color:var(--text-secondary);flex-direction:column;gap:.25rem;padding-left:1.2rem;font-size:.78rem;display:flex}.preset-selector{border-top:1px solid var(--border-subtle);margin-top:1.25rem;padding-top:1.25rem}.preset-label{color:#a78bfa;align-items:center;gap:.4rem;margin-bottom:.75rem;font-size:.8rem;font-weight:700;display:flex}.preset-buttons{grid-template-columns:1fr 1fr;gap:.75rem;display:grid}.preset-card{border:1px solid var(--border-subtle);border-radius:var(--radius-sm);text-align:left;cursor:pointer;background:#ffffff08;align-items:center;gap:.65rem;padding:.5rem .65rem;transition:all .2s;display:flex}.preset-card:hover{background:#8b5cf61a;border-color:#8b5cf666;transform:translateY(-1px)}.preset-thumb{object-fit:cover;border-radius:4px;width:36px;height:48px}.preset-info{flex-direction:column;display:flex}.preset-title{color:#fff;font-size:.78rem;font-weight:700}.preset-meta{color:var(--text-muted);font-size:.72rem}.form-group{margin-bottom:1.35rem}.mt-6{margin-top:1.35rem}.form-label{color:var(--text-primary);align-items:center;gap:.45rem;margin-bottom:.65rem;font-size:.85rem;font-weight:700;display:flex}.gender-btn-group{grid-template-columns:1fr 1fr 1fr;gap:.5rem;display:grid}.gender-chip{border-radius:var(--radius-sm);border:1px solid var(--border-subtle);color:var(--text-secondary);text-align:center;cursor:pointer;background:#ffffff0a;padding:.65rem .5rem;font-size:.82rem;font-weight:600;transition:all .2s}.gender-chip:hover{background:#ffffff14}.gender-chip.active{border-color:var(--accent-purple);color:#fff;background:#8b5cf62e;box-shadow:0 0 12px #8b5cf64d}.grid-2-cols{grid-template-columns:1fr 1fr;gap:.85rem;margin-bottom:1.25rem;display:grid}@media (width<=520px){.grid-2-cols{grid-template-columns:1fr}}.input-card{border:1px solid var(--border-subtle);border-radius:var(--radius-md);background:#00000040;padding:1rem}.input-card-header{justify-content:space-between;align-items:center;margin-bottom:.85rem;display:flex}.input-title-row{align-items:center;gap:.45rem;display:flex}.input-field-name{font-size:.88rem;font-weight:700}.value-display{border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:#ffffff0f;align-items:baseline;padding:.25rem .5rem;display:flex}.number-input{color:#fff;text-align:right;background:0 0;border:none;outline:none;width:52px;font-size:1.15rem;font-weight:800}.number-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.number-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.unit{color:var(--text-muted);margin-left:.25rem;font-size:.8rem;font-weight:600}.custom-slider{-webkit-appearance:none;background:#ffffff1a;border-radius:3px;outline:none;width:100%;height:6px;margin:.75rem 0 .35rem}.custom-slider::-webkit-slider-thumb{-webkit-appearance:none;cursor:pointer;background:#a78bfa;border-radius:50%;width:18px;height:18px;transition:transform .15s;box-shadow:0 0 10px #a78bfa}.custom-slider::-webkit-slider-thumb:hover{transform:scale(1.2)}.slider-ticks{color:var(--text-muted);justify-content:space-between;font-size:.7rem;display:flex}.bmi-summary-box{border-radius:var(--radius-sm);background:#8b5cf612;border:1px solid #8b5cf633;align-items:center;gap:.85rem;padding:.75rem 1rem;display:flex}.bmi-badge{background:var(--gradient-accent);color:#fff;border-radius:var(--radius-sm);white-space:nowrap;padding:.35rem .65rem;font-size:.8rem}.bmi-text{color:var(--text-primary);font-size:.82rem}.bmi-sub{color:var(--text-secondary);margin-top:.15rem;font-size:.74rem}.tag-cloud{flex-wrap:wrap;gap:.45rem;display:flex}.style-tag,.concern-tag{border:1px solid var(--border-subtle);color:var(--text-secondary);cursor:pointer;background:#ffffff0a;border-radius:999px;padding:.45rem .85rem;font-size:.78rem;font-weight:500;transition:all .2s}.style-tag:hover,.concern-tag:hover{color:#fff;background:#ffffff14}.style-tag.tag-selected{color:#fff;background:#8b5cf633;border-color:#a78bfa;font-weight:700}.concern-tag.concern-selected{color:#fff;background:#ec489933;border-color:#ec4899;font-weight:700}.analyze-action-bar{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);justify-content:space-between;align-items:center;gap:1.5rem;padding:1.25rem 2rem;display:flex;box-shadow:0 12px 35px -5px #0009}@media (width<=720px){.analyze-action-bar{flex-direction:column;gap:1rem;padding:1.25rem}}.input-summary-preview{align-items:center;gap:1.25rem;display:flex}.summary-item{align-items:center;gap:.4rem;font-size:.85rem;display:flex}.summary-label{color:var(--text-muted)}.summary-value{align-items:center;gap:.25rem;font-weight:700;display:flex}.summary-divider{background:var(--border-subtle);width:1px;height:20px}.btn-analyze-submit{background:var(--gradient-accent);color:#fff;cursor:pointer;border-radius:999px;align-items:center;gap:.75rem;padding:1rem 2.25rem;font-size:1.05rem;font-weight:800;transition:all .25s cubic-bezier(.16,1,.3,1);display:inline-flex;box-shadow:0 4px 25px #8b5cf680}.btn-analyze-submit:hover{transform:translateY(-2px)scale(1.02);box-shadow:0 8px 30px #8b5cf6b3}.validation-alert{color:#fda4af;border-radius:var(--radius-md);background:#f43f5e26;border:1px solid #f43f5e59;align-items:center;gap:.5rem;margin-bottom:1.25rem;padding:.85rem 1.25rem;font-size:.88rem;font-weight:600;display:flex}.analysis-loading-container{justify-content:center;align-items:center;min-height:550px;padding:2rem 0;display:flex}.loading-card{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);text-align:center;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);width:100%;max-width:580px;box-shadow:var(--shadow-card);flex-direction:column;align-items:center;padding:2.5rem;display:flex}.loading-scan-wrapper{border-radius:var(--radius-md);border:2px solid #a78bfa;width:140px;height:190px;margin-bottom:1.75rem;position:relative;overflow:hidden}.loading-scan-img{object-fit:cover;filter:grayscale(40%)contrast(110%);width:100%;height:100%}.laser-scanner{background:#38bdf8;height:3px;animation:2s ease-in-out infinite laser-anim;position:absolute;left:0;right:0;box-shadow:0 0 12px #38bdf8,0 0 24px #6366f1}@keyframes laser-anim{0%{opacity:.8;top:0%}50%{opacity:1;top:97%}to{opacity:.8;top:0%}}.scan-grid-overlay{background-image:linear-gradient(#8b5cf626 1px,#0000 1px),linear-gradient(90deg,#8b5cf626 1px,#0000 1px);background-size:14px 14px;position:absolute;inset:0}.loading-sparkle-pill{color:#c4b5fd;background:#8b5cf61f;border:1px solid #8b5cf64d;border-radius:999px;align-items:center;gap:.4rem;margin-bottom:1rem;padding:.35rem .85rem;font-size:.78rem;font-weight:700;display:inline-flex}.animate-spin-slow{animation:6s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loading-headline{margin-bottom:.5rem;font-size:1.4rem;font-weight:800}.loading-sub{color:var(--text-secondary);margin-bottom:1.75rem;font-size:.88rem}.progress-bar-track{background:#ffffff14;border-radius:4px;width:100%;height:8px;margin-bottom:.5rem;overflow:hidden}.progress-bar-fill{background:var(--gradient-accent);height:100%;transition:width .4s}.progress-percent{color:#a78bfa;margin-bottom:1.75rem;font-size:.8rem;font-weight:700}.loading-steps-list{text-align:left;flex-direction:column;gap:.85rem;width:100%;display:flex}.step-item{border-radius:var(--radius-sm);background:#ffffff05;border:1px solid #0000;align-items:flex-start;gap:.75rem;padding:.75rem 1rem;transition:all .3s;display:flex}.step-item.step-active{background:#8b5cf61a;border-color:#8b5cf64d}.step-item.step-done{background:#10b9810d;border-color:#10b98133}.step-icon-wrap{margin-top:2px}.step-text-wrap{flex-direction:column;display:flex}.step-title{color:#fff;font-size:.85rem;font-weight:700}.step-desc{color:var(--text-muted);font-size:.76rem}.result-container{flex-direction:column;gap:2rem;animation:.4s ease-in fadeIn;display:flex}@keyframes fadeIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.result-header-card{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:var(--shadow-card);justify-content:space-between;align-items:center;gap:2rem;padding:2.25rem;display:flex}@media (width<=860px){.result-header-card{flex-direction:column-reverse;align-items:flex-start}}.badge-result{color:#34d399;background:#10b9811f;border:1px solid #10b9814d;border-radius:999px;align-items:center;gap:.4rem;margin-bottom:.75rem;padding:.3rem .75rem;font-size:.78rem;font-weight:700;display:inline-flex}.result-main-title{letter-spacing:-.02em;margin-bottom:.5rem;font-size:2.1rem;font-weight:800}.result-subtitle{color:var(--text-secondary);max-width:580px;margin-bottom:1.25rem;font-size:.95rem;line-height:1.55}.result-stat-tags{flex-wrap:wrap;gap:.5rem;display:flex}.stat-tag{border:1px solid var(--border-subtle);color:#cbd5e1;background:#ffffff0d;border-radius:6px;padding:.35rem .75rem;font-size:.8rem;font-weight:600}.result-header-right{flex-direction:column;align-items:center;gap:1.25rem;display:flex}.result-header-preview-pair{align-items:center;gap:.75rem;display:flex}.result-avatar-wrapper{border-radius:var(--radius-md);border:2px solid #8b5cf666;width:96px;height:132px;transition:transform .2s,border-color .2s;position:relative;overflow:hidden;box-shadow:0 4px 15px #0000004d}.result-avatar-wrapper:hover{border-color:#a78bfa;transform:scale(1.05)}.result-avatar-wrapper.highlight-border{border-color:#a78bfa;box-shadow:0 0 16px #8b5cf666}.result-avatar{object-fit:cover;width:100%;height:100%}.avatar-tag-bottom{text-align:center;color:#cbd5e1;background:#0c0f17e0;padding:.25rem .2rem;font-size:.65rem;font-weight:700;position:absolute;bottom:0;left:0;right:0}.avatar-tag-bottom.ai-tag{color:#fff;background:linear-gradient(135deg,#8b5cf6e6,#6366f1e6)}.avatar-connector{justify-content:center;align-items:center;display:flex}.result-cta-group{gap:.5rem;display:flex}.btn-secondary-sm{border-radius:var(--radius-sm);border:1px solid var(--border-subtle);color:#fff;cursor:pointer;background:#ffffff0f;align-items:center;gap:.4rem;padding:.5rem .95rem;font-size:.8rem;font-weight:600;transition:background .2s;display:inline-flex}.btn-secondary-sm:hover{background:#ffffff1f}.lookbook-section{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:var(--shadow-card);padding:2.25rem}.lookbook-header{margin-bottom:1.5rem}.lookbook-title-row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;display:flex}.lookbook-title{align-items:center;gap:.5rem;margin-bottom:.3rem;font-size:1.45rem;font-weight:800;display:flex}.lookbook-desc{color:var(--text-secondary);font-size:.9rem}.lookbook-badge-score{color:#fff;background:#10b9811f;border:1px solid #10b9814d;border-radius:999px;padding:.4rem .85rem;font-size:.82rem}.lookbook-tabs{grid-template-columns:repeat(3,1fr);gap:1rem;margin-bottom:1.75rem;display:grid}@media (width<=768px){.lookbook-tabs{grid-template-columns:1fr}}.look-tab-btn{border:1px solid var(--border-subtle);border-radius:var(--radius-md);text-align:left;cursor:pointer;background:#ffffff08;align-items:center;gap:.85rem;padding:.75rem .85rem;transition:all .2s cubic-bezier(.16,1,.3,1);display:flex}.look-tab-btn:hover{background:#ffffff14;border-color:#8b5cf666}.look-tab-btn.look-tab-active{background:#8b5cf62e;border-color:#a78bfa;box-shadow:0 0 18px #8b5cf64d}.look-tab-thumb-wrapper{border:1px solid #ffffff26;border-radius:6px;flex-shrink:0;width:48px;height:64px;position:relative;overflow:hidden}.look-tab-thumb{object-fit:cover;width:100%;height:100%}.look-tab-active-dot{background:#34d399;border-radius:50%;width:8px;height:8px;position:absolute;top:4px;right:4px;box-shadow:0 0 6px #34d399}.look-tab-info{flex-direction:column;gap:.2rem;min-width:0;display:flex}.look-theme-badge{color:#a78bfa;text-transform:uppercase;font-size:.7rem;font-weight:700}.look-tab-title{color:#fff;white-space:nowrap;text-overflow:ellipsis;font-size:.95rem;font-weight:700;overflow:hidden}.look-match-score{color:#34d399;font-size:.75rem;font-weight:600}.look-showcase-container{border:1px solid var(--border-subtle);border-radius:var(--radius-lg);background:#00000047;padding:1.75rem}.look-detail-header{border-bottom:1px solid var(--border-subtle);justify-content:space-between;align-items:flex-start;gap:1.5rem;margin-bottom:1.75rem;padding-bottom:1.25rem;display:flex}@media (width<=768px){.look-detail-header{flex-direction:column}}.look-tags-row{flex-wrap:wrap;align-items:center;gap:.5rem;margin-bottom:.45rem;display:flex}.look-theme-tag{color:#a78bfa;background:#8b5cf626;border-radius:4px;padding:.2rem .6rem;font-size:.75rem;font-weight:800}.look-silhouette-tag{color:#34d399;background:#10b9811f;border-radius:4px;padding:.2rem .6rem;font-size:.75rem;font-weight:700}.look-name{color:#fff;margin-bottom:.4rem;font-size:1.45rem;font-weight:800}.look-description{color:var(--text-secondary);max-width:620px;margin-bottom:.65rem;font-size:.9rem}.vibe-pills-row{flex-wrap:wrap;gap:.4rem;display:flex}.vibe-pill{color:#c4b5fd;background:#8b5cf61a;border-radius:999px;padding:.15rem .5rem;font-size:.75rem}.palette-box{border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:#ffffff08;flex-shrink:0;padding:.75rem 1rem}.palette-label{color:var(--text-muted);margin-bottom:.5rem;font-size:.75rem;font-weight:700;display:block}.palette-swatches{gap:.75rem;display:flex}.color-swatch-item{align-items:center;gap:.35rem;display:flex}.color-dot{border:1px solid #ffffff4d;border-radius:50%;width:18px;height:18px;box-shadow:0 2px 5px #0000004d}.color-name{color:#cbd5e1;font-size:.74rem}.look-visual-matrix{grid-template-columns:320px 1fr;align-items:start;gap:1.5rem;display:grid}@media (width<=920px){.look-visual-matrix{grid-template-columns:1fr}}.full-outfit-visual-card{border:1px solid var(--border-subtle);border-radius:var(--radius-md);background:#ffffff05;flex-direction:column;padding:.85rem;display:flex}.full-outfit-img-container{border-radius:var(--radius-sm);background:#111;width:100%;height:420px;position:relative;overflow:hidden;box-shadow:0 6px 20px #0006}.full-outfit-img{object-fit:cover;width:100%;height:100%;transition:transform .4s cubic-bezier(.16,1,.3,1)}.full-outfit-img-container:hover .full-outfit-img{transform:scale(1.04)}.full-outfit-overlay{pointer-events:none;background:linear-gradient(#0000001a 0%,#0000 60%,#000000b3 100%);justify-content:space-between;align-items:flex-end;padding:.85rem;display:flex;position:absolute;inset:0}.zoom-indicator{color:#fff;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#000000a6;border-radius:4px;align-items:center;gap:.3rem;padding:.25rem .55rem;font-size:.72rem;display:inline-flex}.full-outfit-badge{background:var(--gradient-accent);color:#fff;border-radius:4px;padding:.25rem .55rem;font-size:.72rem;font-weight:700}.full-outfit-caption{color:var(--text-secondary);background:#8b5cf614;border:1px solid #8b5cf633;border-radius:6px;margin-top:.85rem;padding:.65rem .85rem;font-size:.82rem;line-height:1.45}.outfit-items-visual-grid{grid-template-columns:repeat(2,1fr);gap:1rem;display:grid}@media (width<=580px){.outfit-items-visual-grid{grid-template-columns:1fr}}.visual-item-card{border:1px solid var(--border-subtle);border-radius:var(--radius-md);background:#ffffff08;flex-direction:column;padding:.9rem;transition:all .2s;display:flex}.visual-item-card:hover{background:#ffffff0f;border-color:#8b5cf64d;transform:translateY(-2px)}.item-img-wrapper{border-radius:var(--radius-sm);background:#181c27;width:100%;height:170px;margin-bottom:.75rem;position:relative;overflow:hidden}.item-product-img{object-fit:cover;width:100%;height:100%;transition:transform .35s}.item-img-wrapper:hover .item-product-img{transform:scale(1.06)}.item-img-hover-badge{color:#fff;opacity:0;background:#0009;border-radius:50%;justify-content:center;align-items:center;width:26px;height:26px;transition:opacity .2s;display:flex;position:absolute;top:8px;right:8px}.item-img-wrapper:hover .item-img-hover-badge{opacity:1}.item-category-floating-badge{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:#c4b5fd;background:#0c0f17d9;border:1px solid #ffffff1a;border-radius:4px;padding:.2rem .5rem;font-size:.68rem;font-weight:700;position:absolute;bottom:8px;left:8px}.item-info-area{flex-direction:column;flex:1;display:flex}.item-title-row{justify-content:space-between;align-items:flex-start;gap:.5rem;margin-bottom:.25rem;display:flex}.item-title{color:#fff;font-size:.95rem;font-weight:700;line-height:1.35}.item-color-indicator{border:1px solid #ffffff4d;border-radius:50%;flex-shrink:0;width:12px;height:12px;margin-top:3px}.item-color-text{color:var(--text-muted);margin-bottom:.65rem;font-size:.76rem}.item-tip-box{color:#cbd5e1;background:#00000040;border-radius:6px;align-items:flex-start;gap:.35rem;margin-top:auto;margin-bottom:.75rem;padding:.5rem .65rem;font-size:.76rem;line-height:1.45;display:flex}.btn-swap-item{border-radius:var(--radius-sm);color:#c4b5fd;cursor:pointer;background:#8b5cf61a;border:1px dashed #8b5cf666;justify-content:center;align-items:center;gap:.4rem;width:100%;padding:.45rem;font-size:.75rem;font-weight:600;transition:all .2s;display:inline-flex}.btn-swap-item:hover{background:#8b5cf633;border-color:#a78bfa}.btn-swap-item.swapped-active{color:#34d399;background:#34d39926;border-color:#34d399}.visual-dodont-section{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:var(--shadow-card);padding:2.25rem}.section-title-wrap{margin-bottom:1.75rem}.box-desc{color:var(--text-secondary);font-size:.88rem}.visual-comparison-grid{grid-template-columns:repeat(4,1fr);gap:1.25rem;display:grid}@media (width<=960px){.visual-comparison-grid{grid-template-columns:repeat(2,1fr)}}@media (width<=540px){.visual-comparison-grid{grid-template-columns:1fr}}.comparison-card{border-radius:var(--radius-md);border:1px solid var(--border-subtle);background:#ffffff05;flex-direction:column;padding:.85rem;transition:all .2s;display:flex}.comparison-card.card-recommend{background:linear-gradient(#34d3990a 0%,#0003 100%);border-color:#34d39959}.comparison-card.card-avoid{background:linear-gradient(#fb71850a 0%,#0003 100%);border-color:#fb718559}.comparison-header{margin-bottom:.65rem}.comp-type-badge{border-radius:4px;align-items:center;gap:.35rem;width:100%;padding:.3rem .6rem;font-size:.74rem;font-weight:800;display:inline-flex}.comp-type-badge.badge-good{color:#34d399;background:#34d39926}.comp-type-badge.badge-bad{color:#fb7185;background:#fb718526}.comparison-image-container{border-radius:var(--radius-sm);background:#111;width:100%;height:220px;margin-bottom:.75rem;position:relative;overflow:hidden}.comparison-image{object-fit:cover;width:100%;height:100%;transition:transform .3s}.comparison-image-container:hover .comparison-image{transform:scale(1.05)}.comparison-img-overlay{opacity:0;transition:opacity .2s;position:absolute;bottom:6px;right:6px}.comparison-image-container:hover .comparison-img-overlay{opacity:1}.zoom-text{color:#fff;background:#000000bf;border-radius:4px;align-items:center;gap:.25rem;padding:.2rem .45rem;font-size:.7rem;display:inline-flex}.comparison-body{flex-direction:column;flex:1;gap:.4rem;display:flex}.comp-point-title{color:#fff;align-items:flex-start;gap:.35rem;font-size:.82rem;font-weight:700;line-height:1.4;display:flex}.comp-reason{color:var(--text-secondary);font-size:.76rem;line-height:1.45}.result-grid-2{grid-template-columns:1fr 1fr;gap:1.75rem;display:grid}@media (width<=860px){.result-grid-2{grid-template-columns:1fr}}.result-box{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);padding:1.75rem}.box-title{align-items:center;gap:.5rem;margin-bottom:1.25rem;font-size:1.2rem;font-weight:700;display:flex}.silhouette-cards-list{flex-direction:column;gap:.85rem;display:flex}.silhouette-card{border:1px solid var(--border-subtle);border-radius:var(--radius-md);background:#ffffff08;align-items:center;gap:.85rem;padding:.75rem;transition:all .2s;display:flex}.silhouette-card:hover{background:#ffffff0f;border-color:#8b5cf64d}.sil-thumb-wrap{border:1px solid #ffffff26;border-radius:6px;flex-shrink:0;width:64px;height:80px;position:relative;overflow:hidden}.sil-thumb-img{object-fit:cover;width:100%;height:100%}.sil-thumb-badge{background:var(--gradient-accent);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:18px;height:18px;font-size:.65rem;font-weight:800;display:flex;position:absolute;top:4px;left:4px}.sil-info-wrap{flex:1;min-width:0}.sil-name-row{flex-wrap:wrap;align-items:center;gap:.45rem;margin-bottom:.25rem;display:flex}.sil-title{color:#fff;font-size:.9rem;font-weight:700}.sil-best-tag{color:#c4b5fd;background:#8b5cf62e;border-radius:4px;padding:.1rem .4rem;font-size:.68rem;font-weight:600}.sil-desc{color:var(--text-secondary);font-size:.76rem;line-height:1.4}.ratio-items-list{flex-direction:column;gap:.85rem;margin-bottom:1.25rem;display:flex}.ratio-item{border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:#ffffff08;padding:.85rem 1rem}.ratio-header{justify-content:space-between;align-items:center;margin-bottom:.4rem;display:flex}.ratio-label{color:var(--text-primary);font-size:.85rem;font-weight:600}.ratio-val{color:#a78bfa;font-size:.85rem;font-weight:800}.ratio-progress-bar{background:#ffffff14;border-radius:3px;width:100%;height:6px;margin-bottom:.4rem;overflow:hidden}.ratio-progress-fill{background:var(--gradient-accent);border-radius:3px;height:100%}.ratio-eval{color:var(--text-muted);font-size:.76rem}.proportion-tip{border-radius:var(--radius-sm);color:#ddd6fe;background:#8b5cf614;border:1px solid #8b5cf640;align-items:flex-start;gap:.6rem;padding:.85rem 1rem;font-size:.82rem;line-height:1.5;display:flex}.bottom-cta-banner{border-radius:var(--radius-xl);background:linear-gradient(135deg,#8b5cf626 0%,#6366f126 100%);border:1px solid #8b5cf64d;justify-content:space-between;align-items:center;gap:1.5rem;padding:1.75rem 2.25rem;display:flex}@media (width<=680px){.bottom-cta-banner{text-align:center;flex-direction:column}}.bottom-cta-banner h4{margin-bottom:.25rem;font-size:1.15rem;font-weight:700}.bottom-cta-banner p{color:var(--text-secondary);font-size:.85rem}.btn-primary{background:var(--gradient-accent);color:#fff;white-space:nowrap;cursor:pointer;border-radius:999px;align-items:center;gap:.5rem;padding:.85rem 1.65rem;font-size:.92rem;font-weight:700;transition:all .2s;display:inline-flex;box-shadow:0 4px 18px #8b5cf666}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 22px #8b5cf699}.modal-backdrop{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:100;background:#000000d9;justify-content:center;align-items:center;padding:1.5rem;animation:.2s ease-out fadeIn;display:flex;position:fixed;inset:0}.modal-content{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);flex-direction:column;width:100%;max-width:680px;max-height:90vh;display:flex;overflow:hidden;box-shadow:0 20px 50px #000c}.modal-header{border-bottom:1px solid var(--border-subtle);justify-content:space-between;align-items:center;padding:1.25rem 1.5rem;display:flex}.modal-title{color:#fff;font-size:1.15rem;font-weight:700}.modal-subtitle{color:var(--text-secondary);margin-top:.15rem;font-size:.8rem}.modal-close-btn{border:1px solid var(--border-subtle);color:#cbd5e1;cursor:pointer;background:#ffffff0f;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;transition:all .2s;display:flex}.modal-close-btn:hover{color:#fff;background:#ffffff26}.modal-image-wrapper{background:#090c13;flex:1;justify-content:center;align-items:center;width:100%;max-height:65vh;display:flex;position:relative;overflow:hidden}.modal-image{object-fit:contain;max-width:100%;max-height:65vh}.modal-image-watermark{color:#ffffffb3;background:#0009;border-radius:4px;align-items:center;gap:.35rem;padding:.25rem .5rem;font-size:.72rem;display:flex;position:absolute;bottom:10px;right:12px}.app-footer{border-top:1px solid var(--border-subtle);text-align:center;background:#0c0f17e6;padding:2rem 1.25rem}.footer-inner{max-width:1160px;color:var(--text-muted);margin:0 auto;font-size:.82rem}.footer-sub{color:#475569;margin-top:.35rem;font-size:.75rem}
