@import "https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;1,400&family=Jost:wght@300;400;500&display=swap";:root{--bg:#f5f0eb;--surface:#fdfaf7;--surface2:#f0ebe4;--ink:#1c1714;--ink2:#6b5f57;--ink3:#a8998f;--accent:#c4673a;--accent-pale:#f5e8e0;--border:#e2d9d0;--excellent:#4a7c59;--excellent-bg:#eaf3ed;--excellent-border:#b8d9c4;--good:#a07830;--good-bg:#fdf4e3;--good-border:#e0c87a;--less-compatible:#9c3a2e;--less-compatible-bg:#faecea;--less-compatible-border:#e8b4ae;--shadow-sm:0 1px 4px #1c17140f;--shadow:0 4px 24px #1c171417;--shadow-lg:0 12px 48px #1c171421;--radius:14px;--radius-sm:8px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;min-height:100vh;font-family:Jost,sans-serif;font-size:15px;line-height:1.65}@keyframes fadeUp{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}.app{animation:.6s both fadeUp}.header{background:var(--ink);color:var(--bg);text-align:center;padding:3.5rem 2rem 3rem;position:relative;overflow:hidden}.header:before{content:"";pointer-events:none;background:radial-gradient(60% 80% at 20%,#c4673a2e 0%,#0000 60%),radial-gradient(60% 80% at 80%,#4a7c591f 0%,#0000 60%);position:absolute;inset:0}.header-inner{max-width:560px;margin:0 auto;position:relative}.header-ornament{opacity:.6;justify-content:center;align-items:center;gap:.75rem;margin-bottom:1.25rem;display:flex}.header-ornament span{background:var(--border);width:40px;height:1px;display:block}.header-ornament i{letter-spacing:.3em;color:#c8a882;font-size:.8rem;font-style:normal}.header h1{letter-spacing:.02em;margin-bottom:.75rem;font-family:Playfair Display,serif;font-size:clamp(2rem,7vw,3.2rem);font-weight:400;line-height:1.15}.header h1 em{color:#c8a882;font-style:italic}.tagline{color:#9a8878;letter-spacing:.08em;text-transform:uppercase;font-size:.85rem;font-weight:300}.season-bar{background:var(--ink);scrollbar-width:none;border-top:1px solid #ffffff0f;padding:2rem;overflow-x:auto}.season-bar::-webkit-scrollbar{display:none}.season-pills{flex-wrap:wrap;justify-content:center;gap:.5rem;max-width:800px;margin:0 auto;display:flex}.season-pill{letter-spacing:.06em;text-transform:uppercase;color:#ffffff80;cursor:pointer;white-space:nowrap;background:0 0;border:1px solid #ffffff26;border-radius:100px;padding:.3rem .8rem;font-family:Jost,sans-serif;font-size:.72rem;transition:all .2s}.season-pill:hover{color:#fffc;border-color:#ffffff59}.season-pill.active{background:var(--accent);border-color:var(--accent);color:#fff}.main{flex-direction:column;gap:1.5rem;max-width:680px;margin:0 auto;padding:2rem 1.25rem 5rem;display:flex}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:1.75rem 2rem;animation:.5s both fadeUp}.card:first-child{animation-delay:50ms}.card:nth-child(2){animation-delay:.1s}.card:nth-child(3){animation-delay:.15s}.step-eyebrow{letter-spacing:.18em;text-transform:uppercase;color:var(--accent);margin-bottom:.4rem;font-size:.68rem;font-weight:500}.card h2{margin-bottom:.35rem;font-family:Playfair Display,serif;font-size:1.4rem;font-weight:400;line-height:1.25}.card-hint{color:var(--ink3);margin-bottom:1.25rem;font-size:.82rem;line-height:1.5}.palette-info{background:var(--accent-pale);border-radius:var(--radius-sm);border-left:3px solid var(--accent);margin-top:1.1rem;padding:1.1rem 1.25rem;animation:.3s both fadeUp}.palette-info-desc{color:var(--ink2);margin-bottom:.85rem;font-size:.85rem;font-style:italic;line-height:1.6}.palette-info-row{flex-direction:column;gap:.5rem;display:flex}.palette-info-label{letter-spacing:.12em;text-transform:uppercase;color:var(--ink3);margin-bottom:.35rem;font-size:.7rem;font-weight:500;display:block}.colour-chips{flex-wrap:wrap;gap:.35rem;display:flex}.colour-chip{border:1px solid var(--border);color:var(--ink2);background:#fff;border-radius:100px;padding:.2rem .6rem;font-size:.73rem}.colour-chip.avoid{color:var(--less-compatible);background:0 0;border-color:#d4b8b4}.upload-zone{border:2px dashed var(--border);border-radius:var(--radius-sm);background:var(--surface2);cursor:pointer;justify-content:center;align-items:center;min-height:160px;transition:all .22s;display:flex;overflow:hidden}.upload-zone:hover{border-color:var(--accent);background:var(--accent-pale)}.upload-zone.drag-over{border-color:var(--accent);background:var(--accent-pale);transform:scale(1.01)}.upload-zone.has-image{border-style:solid;border-color:var(--border);min-height:unset}.upload-empty{text-align:center;flex-direction:column;align-items:center;gap:.5rem;padding:2.5rem 1rem;display:flex}.upload-icon-wrap{border:1.5px solid var(--border);width:52px;height:52px;box-shadow:var(--shadow-sm);background:#fff;border-radius:50%;justify-content:center;align-items:center;margin-bottom:.25rem;font-size:1.3rem;display:flex}.upload-empty strong{color:var(--ink);font-size:.9rem;font-weight:500}.upload-empty span{color:var(--ink3);font-size:.78rem}.upload-preview{width:100%;position:relative}.upload-preview img{object-fit:contain;border-radius:calc(var(--radius-sm) - 2px);width:100%;max-height:320px;display:block}.upload-preview-bar{border-top:1px solid var(--border);background:#fff;justify-content:space-between;align-items:center;padding:.6rem .85rem;display:flex}.upload-filename{color:var(--ink3);text-overflow:ellipsis;white-space:nowrap;max-width:200px;font-size:.78rem;overflow:hidden}.btn-remove{color:var(--less-compatible);border:1px solid var(--less-compatible-border);cursor:pointer;background:0 0;border-radius:4px;padding:.2rem .6rem;font-family:Jost,sans-serif;font-size:.75rem;transition:all .15s}.btn-remove:hover{background:var(--less-compatible-bg)}.analyse-section{flex-direction:column;align-items:center;gap:.75rem;display:flex}.btn-analyse{letter-spacing:.08em;text-transform:uppercase;background:var(--ink);color:var(--bg);border:2px solid var(--ink);cursor:pointer;border-radius:100px;padding:1rem 3rem;font-family:Jost,sans-serif;font-size:.95rem;font-weight:500;transition:all .22s;position:relative;overflow:hidden}.btn-analyse:before{content:"";background:var(--accent);transition:transform .3s;position:absolute;inset:0;transform:translate(-100%)}.btn-analyse:hover:not(:disabled):before{transform:translate(0)}.btn-analyse span{position:relative}.btn-analyse:hover:not(:disabled){border-color:var(--accent)}.btn-analyse:disabled{opacity:.4;cursor:not-allowed}.prereq-note{color:var(--ink3);font-size:.78rem;font-style:italic}.progress-wrap{margin-top:.5rem}.progress-steps{flex-direction:column;gap:.5rem;display:flex}.progress-step{color:var(--ink3);align-items:center;gap:.75rem;font-size:.83rem;transition:color .3s;display:flex}.progress-step.active{color:var(--ink)}.progress-step.done{color:var(--excellent)}.progress-dot{border:1.5px solid var(--border);background:0 0;border-radius:50%;flex-shrink:0;width:8px;height:8px;transition:all .3s}.progress-step.active .progress-dot{border-color:var(--accent);background:var(--accent);box-shadow:0 0 0 3px var(--accent-pale);animation:1s infinite pulse}.progress-step.done .progress-dot{border-color:var(--excellent);background:var(--excellent)}@keyframes pulse{0%,to{box-shadow:0 0 0 3px var(--accent-pale)}50%{box-shadow:0 0 0 6px var(--accent-pale)}}.extracted-colours{flex-wrap:wrap;gap:.5rem;margin-top:.5rem;display:flex}.swatch{color:var(--ink2);border:1px solid var(--border);background:#fff;border-radius:100px;align-items:center;gap:.4rem;padding:.2rem .7rem .2rem .35rem;font-size:.75rem;display:flex}.swatch-dot{border:1px solid #0000001a;border-radius:50%;flex-shrink:0;width:14px;height:14px}.result-card{box-shadow:var(--shadow);border-width:1.5px;animation:.4s both fadeUp}.result-card.excellent{border-color:var(--excellent-border);background:var(--excellent-bg)}.result-card.good{border-color:var(--good-border);background:var(--good-bg)}.result-card.less-compatible{border-color:var(--less-compatible-border);background:var(--less-compatible-bg)}.result-header{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1.5rem;display:flex}.match-verdict{letter-spacing:.12em;text-transform:uppercase;border-radius:100px;align-items:center;gap:.5rem;padding:.35rem 1rem;font-size:.75rem;font-weight:500;display:inline-flex}.excellent .match-verdict{background:var(--excellent);color:#fff}.good .match-verdict{background:var(--good);color:#fff}.less-compatible .match-verdict{background:var(--less-compatible);color:#fff}.match-score{font-family:Playfair Display,serif;font-size:2.5rem;font-weight:400;line-height:1}.excellent .match-score{color:var(--excellent)}.good .match-score{color:var(--good)}.less-compatible .match-score{color:var(--less-compatible)}.match-summary{border:1px solid var(--border);border-radius:var(--radius-sm);background:#fff;margin:1.25rem 0;padding:1rem}.match-summary-row{border-bottom:1px solid var(--border);grid-template-columns:1fr 1.2fr auto;align-items:center;gap:.75rem;padding:.65rem 0;display:grid}.match-summary-row:last-child{border-bottom:none}.match-summary-row span{text-transform:uppercase;letter-spacing:.12em;color:var(--ink3);font-size:.7rem}.season-rank-name{color:var(--ink);font-size:.95rem;font-weight:500}.season-rank-score{color:var(--accent);font-size:.85rem;font-weight:500}.score-label{color:var(--ink3);letter-spacing:.08em;text-transform:uppercase;font-size:.72rem}.axis-section{margin:1.25rem 0}.axis-section-title{letter-spacing:.14em;text-transform:uppercase;color:var(--ink3);margin-bottom:.85rem;font-size:.7rem;font-weight:500}.axis-row{grid-template-columns:70px 1fr 70px;align-items:center;gap:.6rem;margin-bottom:.6rem;font-size:.75rem;display:grid}.axis-label-left{text-align:right;color:var(--ink2)}.axis-label-right{text-align:left;color:var(--ink2)}.axis-track{background:#00000012;border-radius:100px;height:6px;position:relative;overflow:visible}.axis-fill{border-radius:100px;transition:width .8s cubic-bezier(.4,0,.2,1);position:absolute;top:0;bottom:0;left:0}.axis-thumb{border:2px solid #fff;border-radius:50%;width:12px;height:12px;transition:left .8s cubic-bezier(.4,0,.2,1);position:absolute;top:50%;transform:translate(-50%,-50%);box-shadow:0 1px 4px #0003}.colour-breakdown{margin:1.25rem 0}.breakdown-row{border-bottom:1px solid #0000000f;align-items:center;gap:.75rem;padding:.6rem 0;font-size:.82rem;display:flex}.breakdown-row:last-child{border-bottom:none}.breakdown-swatch{border:1px solid #0000001a;border-radius:6px;flex-shrink:0;width:28px;height:28px}.breakdown-info{flex:1}.breakdown-name{color:var(--ink);margin-bottom:.1rem;font-weight:500}.breakdown-detail{color:var(--ink3);font-size:.73rem}.breakdown-match{border-radius:100px;padding:.15rem .55rem;font-size:.72rem;font-weight:500}.breakdown-match.excellent{background:var(--excellent-bg);color:var(--excellent);border:1px solid var(--excellent-border)}.breakdown-match.good{background:var(--good-bg);color:var(--good);border:1px solid var(--good-border)}.breakdown-match.less-compatible{background:var(--less-compatible-bg);color:var(--less-compatible);border:1px solid var(--less-compatible-border)}.verdict-text{border-radius:var(--radius-sm);border:1px solid var(--border);background:#fff;margin:1.25rem 0;padding:1.1rem 1.25rem}.verdict-text p{color:var(--ink);margin-bottom:.7rem;font-size:.88rem;line-height:1.75}.verdict-text p:last-child{margin-bottom:0}.result-actions{flex-wrap:wrap;gap:.75rem;margin-top:1rem;display:flex}.btn-outline{letter-spacing:.06em;border:1.5px solid var(--border);cursor:pointer;color:var(--ink2);background:0 0;border-radius:100px;padding:.55rem 1.25rem;font-family:Jost,sans-serif;font-size:.8rem;font-weight:500;transition:all .18s}.btn-outline:hover{color:var(--ink);border-color:var(--ink2);background:#fff}.error-card{background:var(--less-compatible-bg);border:1.5px solid var(--less-compatible-border);border-radius:var(--radius);color:var(--less-compatible);padding:1.5rem 2rem;font-size:.88rem}.footer{text-align:center;color:var(--ink3);letter-spacing:.06em;padding:2rem;font-size:.75rem}@media (width<=500px){.card{padding:1.4rem 1.25rem}.header{padding:2.5rem 1.25rem 2rem}.axis-row{grid-template-columns:55px 1fr 55px;font-size:.7rem}}