@import "https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,500;9..144,600;9..144,700&family=Inter:wght@300;400;500;600;700&display=swap";:root{--bg-primary:#faf6f0;--bg-secondary:#f3ece2;--bg-card:#fffdfa;--bg-card-hover:#fffaf3;--bg-glass:#7855320a;--bg-glass-hover:#78553212;--accent-primary:#ea580c;--accent-primary-hover:#c2410c;--accent-secondary:#b45309;--accent-gradient:linear-gradient(135deg, #f97316, #d97706);--accent-gradient-warm:linear-gradient(135deg, #ea580c, #b45309);--accent-success:#4d7c0f;--accent-warning:#d97706;--accent-danger:#b91c1c;--text-primary:#2b2018;--text-secondary:#6b5d4f;--text-muted:#9a8b7a;--border-color:#78553229;--border-glow:#ea580c59;--shadow-sm:0 1px 3px #5032140f;--shadow-md:0 6px 20px #50321414;--shadow-lg:0 12px 36px #5032141f;--shadow-glow:0 8px 28px #ea580c24;--radius-sm:8px;--radius-md:12px;--radius-lg:18px;--radius-xl:26px;--transition-fast:.16s ease;--transition-base:.28s cubic-bezier(.4, 0, .2, 1);--transition-slow:.5s cubic-bezier(.4, 0, .2, 1);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,system-ui,-apple-system,sans-serif}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{background:var(--bg-primary);color:var(--text-primary);min-height:100vh;overflow-x:hidden}body:before{content:"";pointer-events:none;z-index:0;background:radial-gradient(at 15% 0,#f9a85c2e 0%,#0000 45%),radial-gradient(at 90% 10%,#d977061a 0%,#0000 40%),radial-gradient(at 50% 100%,#b453090f 0%,#0000 55%);position:fixed;inset:0}#root{z-index:1;position:relative}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg-secondary)}::-webkit-scrollbar-thumb{background:#b4784666;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#b4784699}::selection{background:#ea580c2e}.app{max-width:1100px;min-height:100vh;margin:0 auto;padding:0 24px 72px}.header{text-align:center;padding:56px 0 36px}.header h1{color:var(--text-primary);letter-spacing:-.01em;font-family:Fraunces,Georgia,serif;font-size:2.6rem;font-weight:600;line-height:1.1}.header p{color:var(--text-secondary);max-width:540px;margin-top:12px;margin-left:auto;margin-right:auto;font-size:1.05rem;font-weight:400}.steps{flex-direction:column;gap:28px;display:flex}.step-section{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);transition:border-color var(--transition-base), box-shadow var(--transition-base), transform var(--transition-base);padding:32px;animation:.55s cubic-bezier(.4,0,.2,1) both fadeInUp}.step-section:hover{border-color:var(--border-glow);box-shadow:var(--shadow-lg)}@keyframes fadeInUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.step-header{align-items:center;gap:16px;margin-bottom:24px;display:flex}.step-number{background:var(--accent-gradient);color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:38px;height:38px;font-family:Fraunces,serif;font-size:1.05rem;font-weight:600;display:flex;box-shadow:0 4px 12px #ea580c40}.step-title{color:var(--text-primary);font-family:Fraunces,serif;font-size:1.3rem;font-weight:600}.step-subtitle{color:var(--text-muted);margin-top:3px;font-size:.9rem}.input-grid{grid-template-columns:1fr 1fr;gap:20px;display:grid}@media (width<=720px){.input-grid{grid-template-columns:1fr}}.input-col{flex-direction:column;gap:12px;display:flex}.input-col__title{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.07em;font-size:.8rem;font-weight:600}.preview-frame{flex-direction:column;gap:10px;display:flex}.upload-zone{border:2px dashed var(--border-color);border-radius:var(--radius-md);text-align:center;cursor:pointer;transition:border-color var(--transition-base), background var(--transition-base), transform var(--transition-base);background:var(--bg-glass);flex-direction:column;justify-content:center;align-items:center;min-height:180px;padding:44px 24px;display:flex}.upload-zone:hover{border-color:var(--accent-primary);background:var(--bg-glass-hover);transform:translateY(-2px)}.upload-zone.active{border-color:var(--accent-primary);background:#ea580c0f}.upload-zone input[type=file]{display:none}.upload-zone__text{color:var(--text-secondary);font-size:.98rem}.upload-zone__text strong{color:var(--accent-primary)}.upload-zone__hint{color:var(--text-muted);margin-top:8px;font-size:.82rem}.image-grid{grid-template-columns:1fr 1fr;gap:20px;margin-top:16px;display:grid}.image-preview{border-radius:var(--radius-md);border:1px solid var(--border-color);background:var(--bg-secondary);overflow:hidden}.image-preview__label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--border-color);padding:10px 16px;font-size:.76rem;font-weight:600}.image-preview img{object-fit:contain;background:repeating-conic-gradient(#f3ece2 0% 25%,#e9dfd0 0% 50%) 50%/18px 18px;width:100%;height:260px;display:block}.viewer-container{border-radius:var(--radius-md);border:1px solid var(--border-color);background:#f3ece2;height:312px;position:relative;overflow:hidden}.viewer-container model-viewer{--poster-color:transparent;width:100%;height:100%}.btn{border-radius:var(--radius-md);cursor:pointer;transition:transform var(--transition-fast), box-shadow var(--transition-base), background var(--transition-base), border-color var(--transition-base), opacity var(--transition-base);border:none;justify-content:center;align-items:center;gap:8px;padding:12px 28px;font-family:Inter,sans-serif;font-size:.95rem;font-weight:600;display:inline-flex}.btn-primary{background:var(--accent-gradient);color:#fff;box-shadow:0 6px 18px #ea580c47}.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 10px 26px #ea580c61}.btn-primary:active:not(:disabled){transform:translateY(0)}.btn-primary:disabled{opacity:.55;cursor:not-allowed;background:var(--bg-secondary);color:var(--text-muted);box-shadow:none}.btn-ghost{color:var(--text-secondary);border:1px solid var(--border-color);background:0 0}.btn-ghost:hover:not(:disabled){border-color:var(--accent-primary);color:var(--accent-primary);background:var(--bg-glass-hover)}.btn-ghost:disabled{opacity:.5;cursor:not-allowed}.btn-sm{align-self:flex-start;padding:8px 18px;font-size:.85rem}.btn-run{letter-spacing:.01em;width:100%;margin-top:24px;padding:16px;font-size:1.05rem}.phase-track{border-top:1px solid var(--border-color);flex-wrap:wrap;gap:18px;margin-top:20px;padding-top:20px;display:flex}.phase-step{color:var(--text-muted);transition:color var(--transition-base);align-items:center;gap:8px;font-size:.82rem;display:flex}.phase-step .phase-dot{background:var(--border-color);width:9px;height:9px;transition:background var(--transition-base), box-shadow var(--transition-base), transform var(--transition-base);border-radius:50%}.phase-step.done{color:var(--accent-success)}.phase-step.done .phase-dot{background:var(--accent-success)}.phase-step.active{color:var(--accent-primary);font-weight:600}.phase-step.active .phase-dot{background:var(--accent-primary);animation:1.4s ease-in-out infinite pulse;transform:scale(1.25);box-shadow:0 0 0 4px #ea580c29}@keyframes pulse{0%,to{box-shadow:0 0 0 4px #ea580c29}50%{box-shadow:0 0 0 7px #ea580c0d}}.spinner{border:3px solid var(--border-color);border-top-color:var(--accent-primary);border-radius:50%;width:24px;height:24px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.scores-grid{grid-template-columns:repeat(3,1fr);gap:20px;margin-top:8px;display:grid}@media (width<=768px){.scores-grid{grid-template-columns:1fr}}.score-card{background:var(--bg-glass);border:1px solid var(--border-color);border-radius:var(--radius-md);text-align:center;transition:transform var(--transition-base), box-shadow var(--transition-base), border-color var(--transition-base);padding:24px;animation:.45s cubic-bezier(.4,0,.2,1) both scaleIn}.score-card:first-child{animation-delay:50ms}.score-card:nth-child(2){animation-delay:.13s}.score-card:nth-child(3){animation-delay:.21s}@keyframes scaleIn{0%{opacity:0;transform:scale(.94)}to{opacity:1;transform:scale(1)}}.score-card:hover{background:var(--bg-glass-hover);border-color:var(--border-glow);box-shadow:var(--shadow-glow);transform:translateY(-3px)}.score-card__label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.07em;margin-bottom:16px;font-size:.78rem;font-weight:600}.score-ring{width:104px;height:104px;margin:0 auto;position:relative}.score-ring svg{width:100%;height:100%;transform:rotate(-90deg)}.score-ring__bg{fill:none;stroke:#7855321f;stroke-width:6px}.score-ring__fill{fill:none;stroke-width:6px;stroke-linecap:round;transition:stroke-dashoffset 1.3s cubic-bezier(.4,0,.2,1)}.score-ring__text{justify-content:center;align-items:center;font-family:Fraunces,serif;font-size:1.7rem;font-weight:600;display:flex;position:absolute;inset:0}.score-ring__text.score-high{color:var(--accent-success)}.score-ring__text.score-mid{color:var(--accent-warning)}.score-ring__text.score-low{color:var(--accent-danger)}.reasons-section{flex-direction:column;gap:14px;margin-top:24px;display:flex}.reason-card{background:var(--bg-glass);border:1px solid var(--border-color);border-radius:var(--radius-md);transition:border-color var(--transition-base), background var(--transition-base);padding:22px 24px}.reason-card:hover{border-color:var(--border-glow);background:var(--bg-glass-hover)}.reason-card__header{align-items:center;gap:10px;margin-bottom:10px;display:flex}.reason-card__title{color:var(--text-primary);font-family:Fraunces,serif;font-size:1.02rem;font-weight:600}.reason-card__text{color:var(--text-secondary);font-size:.92rem;line-height:1.65}.status-message{border-radius:var(--radius-md);align-items:center;gap:10px;padding:14px 20px;font-size:.9rem;font-weight:500;animation:.35s both fadeInUp;display:flex}.status-message.success{color:var(--accent-success);background:#4d7c0f1a;border:1px solid #4d7c0f40}.status-message.error{color:var(--accent-danger);background:#b91c1c14;border:1px solid #b91c1c38}.status-message.info{color:var(--accent-primary-hover);background:#ea580c14;border:1px solid #ea580c33}@media (width<=480px){.app{padding:0 16px 48px}.header h1{font-size:1.9rem}.step-section{padding:22px}.scores-grid{gap:12px}}.evidence-panel{border-radius:var(--radius-md);background:var(--bg-glass);border:1px solid var(--border-color);margin-bottom:28px;padding:22px}.evidence-panel__header{flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:16px;display:flex}.alignment-badge{color:var(--accent-secondary);border:1px solid var(--border-color);background:#ea580c1a;border-radius:20px;margin-left:auto;padding:5px 12px;font-size:.74rem;font-weight:600}.evidence-grid{grid-template-columns:repeat(3,1fr);gap:16px;display:grid}@media (width<=768px){.evidence-grid{grid-template-columns:1fr}}.evidence-empty{height:200px;color:var(--text-muted);justify-content:center;align-items:center;font-size:.85rem;display:flex}.chip-row{flex-wrap:wrap;gap:6px;margin-top:14px;display:flex}.metric-chip{background:var(--bg-secondary);border:1px solid var(--border-color);color:var(--text-secondary);border-radius:14px;padding:4px 11px;font-size:.74rem}.metric-chip strong{color:var(--text-primary)}.metric-chip.chip-ok{color:var(--accent-success);background:#4d7c0f12;border-color:#4d7c0f66}.metric-chip.chip-ok strong{color:var(--accent-success)}.metric-chip.chip-bad{color:var(--accent-danger);background:#b91c1c0f;border-color:#b91c1c59}.metric-chip.chip-bad strong{color:var(--accent-danger)}.metric-chip.chip-gate{color:var(--accent-warning);background:#d977061a;border-color:#d9770666}.palette-block{margin-top:16px}.palette-row{align-items:center;gap:10px;margin-bottom:6px;display:flex}.palette-label{width:56px;color:var(--text-muted);font-size:.74rem}.swatch-row{border:1px solid var(--border-color);border-radius:6px;flex:1;height:22px;display:flex;overflow:hidden}.swatch{height:100%}.palette-distance{color:var(--text-muted);margin-top:8px;font-size:.8rem}.perf-panel{border-radius:var(--radius-md);background:var(--bg-glass);border:1px solid var(--border-color);margin-top:24px;padding:22px}.perf-bars{flex-direction:column;gap:8px;margin-top:14px;display:flex}.perf-row{align-items:center;gap:12px;display:flex}.perf-label{width:90px;color:var(--text-muted);text-transform:capitalize;font-size:.78rem}.perf-track{background:var(--bg-secondary);border-radius:4px;flex:1;height:8px;overflow:hidden}.perf-fill{background:var(--accent-gradient);border-radius:4px;height:100%;transition:width .9s cubic-bezier(.4,0,.2,1)}.perf-value{text-align:right;width:56px;color:var(--text-muted);font-variant-numeric:tabular-nums;font-size:.78rem}
