:root{--bg: #0f172a;--panel: #1e293b;--panel-soft: #273449;--border: #334155;--text: #ffffff;--text-soft: #e0e0e0;--muted: #cbd5e1;--accent: #6366f1;--accent-strong: #4f46e5;--danger: #ef4444;--ok: #22c55e;--analysis-image-frame-width: 520px;--analysis-image-aspect: 4 / 5;--analysis-image-fit: contain}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 15% 15%,rgba(99,102,241,.25),transparent 36%),radial-gradient(circle at 85% 0%,rgba(59,130,246,.2),transparent 34%),var(--bg);color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;min-height:100vh}.app-shell{width:min(1220px,calc(100% - 32px));margin:18px auto 28px}.hero{border:1px solid var(--border);border-radius:16px;background:linear-gradient(135deg,#1e293bf5,#273449eb);padding:28px;margin-bottom:18px}.hero-kicker{margin:0;color:#a5b4fc;font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:12px}.hero-title{margin:10px 0;font-size:clamp(1.7rem,3.2vw,2.6rem);line-height:1.1}.hero-copy{margin:0 0 18px;color:var(--text-soft);max-width:740px}.content-wrap{display:grid;gap:16px}.panel{border:1px solid var(--border);border-radius:14px;background:linear-gradient(160deg,#1e293bf5,#273449eb);padding:18px}.panel-title{margin:0 0 12px;font-size:1.2rem}.overall-panel{padding:20px}.overall-head{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:14px}.overall-head h2{margin:0}.muted{color:var(--muted);margin:6px 0 0}.overall-body{display:grid;gap:18px;grid-template-columns:230px 1fr;align-items:center}.overall-meta{display:grid;gap:8px}.meta-row{display:flex;justify-content:space-between;background:#0f172a8f;border:1px solid var(--border);border-radius:10px;padding:10px 12px;color:var(--text-soft)}.meta-row strong{color:#fff}.results-columns{display:grid;gap:16px;grid-template-columns:repeat(2,minmax(0,1fr))}.error-banner{background:#ef444426;border:1px solid rgba(239,68,68,.45);color:#fecaca;border-radius:10px;padding:10px 12px;margin-top:10px}.btn{border:1px solid transparent;border-radius:10px;padding:10px 14px;color:#fff;font-weight:600;cursor:pointer;transition:transform .2s ease,background .2s ease,border-color .2s ease}.btn:hover:not(:disabled){transform:translateY(-1px)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-primary{background:linear-gradient(135deg,var(--accent),var(--accent-strong));border-color:#6366f199}.btn-secondary{background:#0f172ab3;border-color:var(--border)}.new-analysis-btn{font-weight:700;letter-spacing:.01em;min-width:150px}.analysis-loading-screen{position:fixed;top:0;right:0;bottom:0;left:0;z-index:3000;display:grid;place-items:center;background:radial-gradient(circle at 15% 15%,rgba(99,102,241,.3),transparent 36%),radial-gradient(circle at 85% 0%,rgba(59,130,246,.24),transparent 34%),#0f172ae0;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.analysis-loading-card{width:min(460px,calc(100% - 32px));border:1px solid var(--border);border-radius:14px;background:linear-gradient(160deg,#1e293bfa,#273449f2);box-shadow:0 16px 40px #00000059;padding:22px 20px;text-align:center}.analysis-loading-card h3{margin:8px 0;font-size:1.3rem}.analysis-loading-card p{margin:0;color:var(--text-soft);font-size:.96rem}.analysis-spinner{width:54px;height:54px;margin:0 auto 8px;border-radius:50%;border:4px solid rgba(148,163,184,.25);border-top-color:#6366f1;border-right-color:#22d3ee;animation:spin .9s linear infinite}.photo-capture-card{display:grid;gap:12px}.step-indicator{display:grid;gap:6px}.step-label{color:var(--text-soft);font-size:13px;font-weight:600}.step-track{height:9px;border-radius:999px;background:#0f172abf;border:1px solid var(--border);overflow:hidden}.step-fill{height:100%;border-radius:inherit;background:linear-gradient(90deg,#6366f1,#22d3ee);transition:width .25s ease}.capture-title{margin:2px 0 0;font-size:1.35rem}.capture-subtitle{margin:0;color:var(--muted)}.camera-preview-shell{position:relative;width:min(100%,var(--analysis-image-frame-width));aspect-ratio:var(--analysis-image-aspect);margin:0 auto;border-radius:14px;border:1px solid var(--border);overflow:hidden;background:#0b1220}.camera-preview{width:100%;height:100%;display:block}.camera-placeholder{width:100%;height:100%;display:grid;place-items:center;color:var(--text-soft)}.camera-preview.live,.camera-preview.still{background:#0b1220}.camera-preview.mirrored{transform:scaleX(-1)}.guide-overlay{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.guide-stroke{fill:#ffffff0a;stroke:#6366f1f2;stroke-width:1.4}.guide-stroke-soft{stroke:#e0e0e0cc;stroke-width:1;fill:none}.capture-controls,.preview-actions{display:flex;flex-wrap:wrap;gap:8px}.hidden-input{display:none}.upload-button{display:inline-flex;align-items:center}.capture-summary{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.capture-chip{border:1px solid var(--border);border-radius:999px;padding:6px 10px;color:var(--text-soft);background:#0f172aa6;font-size:13px}.capture-chip.ready{border-color:#22c55eb3;color:#bbf7d0}.result-card{display:grid;gap:10px}.result-card-header{display:flex;justify-content:space-between;align-items:baseline;gap:12px}.result-card-header h3{margin:0;font-size:1.1rem}.result-card-main-score{font-size:clamp(1.3rem,2.6vw,2.2rem);font-weight:800}.result-card-interpretation{margin:0;font-weight:700;letter-spacing:.02em}.component-score-grid{display:grid;gap:8px}.component-score-item{background:#0f172a94;border:1px solid var(--border);border-left:4px solid #3b82f6;border-radius:10px;padding:10px 12px}.component-score-line{color:#fff;font-size:14px}.component-score-line strong{font-size:15px}.score-gauge{width:210px;height:210px;position:relative}.score-gauge-track{fill:none;stroke:#ffffff1f;stroke-width:12}.score-gauge-progress{fill:none;stroke-width:12;stroke-linecap:round;transform:rotate(-90deg);transform-origin:105px 105px;transition:stroke-dashoffset .35s ease}.score-gauge-center{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;align-content:center;text-align:center}.score-gauge-value{font-size:2.2rem;font-weight:800;line-height:1}.score-gauge-scale{color:var(--text-soft);margin-top:4px}.overlay-viewer-card{margin-top:12px;border:1px solid var(--border);border-radius:12px;background:#0f172a8c;padding:10px}.overlay-viewer-header{display:flex;justify-content:space-between;gap:8px;align-items:center;margin-bottom:8px}.overlay-viewer-header h4{margin:0;font-size:1rem}.overlay-toggle-group{display:inline-flex;border:1px solid var(--border);border-radius:10px;overflow:hidden}.overlay-toggle-btn{border:0;background:#0f172ad9;color:var(--text-soft);padding:8px 10px;font-size:12px;cursor:pointer}.overlay-toggle-btn.active{background:#6366f159;color:#fff}.overlay-image-frame{border:1px solid var(--border);border-radius:10px;overflow:hidden;width:min(100%,var(--analysis-image-frame-width));aspect-ratio:var(--analysis-image-aspect);margin:0 auto;display:grid;place-items:center;background:#0b1220}.overlay-image{width:100%;height:100%;object-fit:var(--analysis-image-fit);display:block}.overlay-stage{position:relative;width:100%;height:100%}.unified-analysis-image{width:100%;height:100%;object-fit:var(--analysis-image-fit);object-position:center;display:block}.contour-overlay{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none}.contour-line{fill:none;stroke-linecap:round;stroke-linejoin:round}.contour-silhouette{stroke:#50faaaf2;stroke-width:2.3}.contour-jaw-ramus{stroke:#ffa544fa;stroke-width:2.8}.metrics-display h4{margin:0 0 10px;font-size:1.05rem}.measurement-table{overflow-x:auto}.measurement-table table{width:100%;border-collapse:collapse}.measurement-table th,.measurement-table td{border-bottom:1px solid rgba(255,255,255,.09);padding:9px;text-align:left;color:#fff;font-size:13px}.measurement-table th{color:var(--text-soft)}.footer-disclaimer{margin-top:18px;padding:14px;border:1px solid var(--border);border-radius:12px;color:var(--text-soft);background:#0f172ab8;font-size:13px;text-align:center}.fade-up{animation:fadeUp .35s ease}@keyframes fadeUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media(max-width:980px){.overall-body,.results-columns{grid-template-columns:1fr}.score-gauge{margin:0 auto}.overlay-viewer-header{flex-direction:column;align-items:flex-start}}@media(max-width:700px){:root{--analysis-image-frame-width: 100%}.app-shell{width:calc(100% - 20px);margin:10px auto 18px}.hero,.panel{padding:14px}.hero-title{font-size:1.8rem}.overlay-image{width:100%;min-width:0}}