:root{font-family:'Golos Text',sans-serif;color:#28262a;background:#f7f7f8;font-synthesis:none;--accent:#842b42;--line:#e6e3e7;--muted:#77717a}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{opacity:.45;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #a96a80;outline-offset:4px}[hidden]{display:none!important}.topbar{height:88px;display:flex;align-items:center;gap:65px;padding:0 5%;border-bottom:1px solid var(--line);background:#fff}.brand{font-family:'Manrope',sans-serif;font-weight:800;font-size:36px;letter-spacing:-2px;text-decoration:none;color:#28262a}.brand span,h1 span{color:var(--accent)}nav{align-self:stretch;display:flex;gap:28px}.nav-button{border:0;background:none;color:var(--muted);font-size:14px;padding:0 2px;position:relative}.nav-button.active{color:var(--accent);font-weight:550}.nav-button.active:after{content:'';position:absolute;height:3px;background:var(--accent);bottom:0;left:0;right:0}.nav-button span{display:inline-flex;align-items:center;justify-content:center;background:#eeedf0;width:21px;height:21px;border-radius:50%;font-size:12px;margin-left:6px}.private-note{font-size:12px;color:#77717a;margin-left:auto;display:flex;align-items:center;gap:8px}.private-note>span{font-size:20px;color:var(--accent)}main{max-width:1450px;padding:38px 5% 20px;margin:0 auto}.page-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:30px}.eyebrow{font-size:11px;letter-spacing:2px;color:var(--accent);font-weight:600;margin:0 0 12px}h1{font-family:'Manrope',sans-serif;font-size:clamp(24px,2.3vw,34px);line-height:1.25;letter-spacing:-1px;margin:0;font-weight:700}.button{border:1px solid transparent;display:inline-flex;gap:9px;align-items:center;justify-content:center;padding:13px 19px;border-radius:9px;min-height:46px;font-size:14px;font-weight:500;transition:background .18s,transform .18s}.button:hover:not(:disabled){transform:translateY(-1px)}.dark{background:#2c292e;color:#fff;white-space:nowrap}.dark>span{font-size:21px;font-weight:400}.primary{background:var(--accent);color:white}.primary:hover:not(:disabled){background:#702238}.secondary{background:#fff;border-color:var(--line);color:#40363c}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 352px;gap:26px;align-items:start}.photo-panel{min-width:0;background:#edeef0;border:1px solid var(--line);border-radius:16px;overflow:hidden}.photo-toolbar{padding:14px 19px;display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fff;font-size:12px;color:#6c6570}.view-switch{display:flex;padding:3px;background:#f1eff2;border-radius:8px;flex-shrink:0}.view-switch button{border:0;background:none;color:#6c6570;padding:8px 12px;border-radius:6px;font-size:12px}.view-switch button[aria-pressed=true]{background:#fff;color:#302c32;box-shadow:0 1px 4px #0000000a}.photo-stage{position:relative;padding:24px 28px 42px;display:flex;align-items:center;justify-content:center;min-height:400px;background:radial-gradient(ellipse at 50% 40%,#f8f8f9,#e9e9ed)}.photo-stage.dragging{outline:3px dashed var(--accent);outline-offset:-9px}.portrait-wrap{position:relative;width:min(100%,405px);overflow:hidden;border-radius:9px;box-shadow:0 8px 35px #25222b12;line-height:0;background:#dfe0e3}.portrait-wrap>img{width:100%;height:auto;display:block;max-height:660px;object-fit:contain}.portrait-wrap canvas,.before-layer{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.before-layer{clip-path:inset(0 50% 0 0)}.before-layer img{width:100%;height:100%;object-fit:contain}.image-labels{position:absolute;top:16px;left:14px;right:14px;display:flex;justify-content:space-between;font-size:11px;line-height:1.4}.image-labels span{background:#ffffffde;border-radius:4px;padding:5px 9px}#comparison-line{position:absolute;left:50%;top:0;bottom:0;width:2px;background:white;pointer-events:none}#comparison-line span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#fff;color:#28262a;line-height:1;font-size:21px;box-shadow:0 1px 8px #0003}.status-pill{position:absolute;bottom:12px;max-width:90%;background:#ffffffed;border:1px solid #e0dde1;padding:6px 12px;color:#6c6069;font-size:11px;border-radius:20px;text-align:center;line-height:1.4}.status-pill.error{color:#932343;background:#fff1f3;border-color:#e8adb8}.retry{position:absolute;bottom:56px;background:#fff;color:var(--accent);border-color:var(--line)}.photo-footer{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:15px 20px;background:#fff;color:var(--muted);font-size:11px}.text-button{padding:3px 0;border:0;background:none;color:#77636e;font-size:12px;text-decoration:none}.text-button:hover{color:var(--accent);text-decoration:underline}.compare-control{padding:12px 25px;background:#fff;border-bottom:1px solid var(--line)}.compare-control label{font-size:12px}.settings-panel{background:#fff;border:1px solid var(--line);border-radius:16px;padding:0 24px 20px;overflow:hidden}.category-tabs{display:flex;gap:30px;border-bottom:1px solid var(--line);margin-bottom:25px}.category-tabs button{position:relative;border:0;background:none;padding:20px 0 17px;color:var(--muted);font-size:14px;flex:1}.category-tabs button[aria-selected=true]{color:var(--accent);font-weight:550}.category-tabs button[aria-selected=true]:after{position:absolute;content:'';bottom:-1px;left:0;right:0;height:2px;background:var(--accent)}h2{font-size:18px;font-weight:550;letter-spacing:-.4px;margin:0}h3{font-size:14px;font-weight:550;margin:0}.section-title{display:flex;align-items:center;justify-content:space-between;gap:8px}.small-label{font-size:10px;letter-spacing:.5px;color:var(--muted)}.muted{color:var(--muted);font-size:12px;line-height:1.6;margin:8px 0 20px}.palette{display:grid;grid-template-columns:repeat(4,1fr);gap:14px 7px}.swatch{border:0;background:none;padding:0;display:flex;flex-direction:column;align-items:center;gap:7px;min-width:0;color:#645c65;font-size:10px;line-height:1.25;text-align:center}.swatch-circle{width:46px;height:46px;border-radius:50%;position:relative;background:var(--swatch);box-shadow:inset 0 0 0 1px #00000009}.hair-swatch .swatch-circle{background:linear-gradient(110deg,#ffffff35,transparent 38%,#00000026 75%,#ffffff12),var(--swatch)}.swatch[aria-pressed=true] .swatch-circle:after{content:'';position:absolute;inset:-4px;border:1.5px solid var(--accent);border-radius:50%}.swatch[aria-pressed=true]{color:var(--accent);font-weight:550}.swatch:hover .swatch-circle{transform:scale(1.04)}.selected-shade{margin:24px 0 23px;display:flex;align-items:center;gap:11px;border-top:1px solid var(--line);padding-top:18px}.selected-shade>span{width:33px;height:33px;border-radius:50%;background:#675344;flex-shrink:0}.selected-shade>div{display:flex;flex-direction:column;gap:3px}.selected-shade strong{font-size:14px;font-weight:500}.selected-shade button{margin-left:auto;font-size:11px}.range-heading{display:flex;justify-content:space-between;align-items:center;font-size:12px;margin:4px 0 10px}.range-heading output{color:var(--muted);font-size:11px}input[type=range]{width:100%;height:18px;margin:0;accent-color:var(--accent);cursor:pointer}.recommendation{margin-top:22px;padding:17px;background:#f7f1f4;border:1px solid #f0e4e9;border-radius:10px}.rec-title{display:flex;align-items:center;gap:8px;margin-bottom:14px}.rec-title>span{color:var(--accent);font-size:22px}.recommendation label{display:block;font-size:11px;color:#776772;margin-bottom:7px}select{width:100%;padding:10px;border:1px solid #e4d7df;background:#fff;border-radius:6px;font-size:12px;color:#443640}.recommend-button{background:transparent;width:100%;color:var(--accent);padding:12px 0 0;justify-content:space-between;min-height:30px;font-size:12px}.rec-chip{border:1px solid #d9b9c7;background:#fff;color:var(--accent);border-radius:5px;padding:7px 9px;font-size:11px;margin:7px 5px 0 0}.rec-explanation{font-size:11px;line-height:1.5;color:#79636e;margin:10px 0 0}.save-area{border-top:1px solid var(--line);padding-top:20px;margin-top:22px;display:grid;grid-template-columns:1fr;gap:10px}.save-area .button{width:100%}.local-note{text-align:center;font-size:10px;color:#89818a;margin:1px 0 0}.studio-footnote{display:flex;justify-content:space-between;gap:25px;align-items:center;color:#928993;font-size:10px;margin-top:17px}.studio-footnote>span{white-space:nowrap;text-transform:uppercase;letter-spacing:1px}.studio-footnote p{max-width:580px;margin:0;line-height:1.5}.studio-footnote button{font-size:10px;white-space:nowrap}.makeup-presets{display:flex;flex-wrap:wrap;gap:6px}.makeup-presets button{padding:8px 9px;border:1px solid var(--line);border-radius:6px;background:#fff;color:#60545f;font-size:11px}.makeup-presets button:hover{border-color:var(--accent);color:var(--accent)}.palette-label{margin:23px 0 13px;font-size:12px}.makeup-palette .swatch-circle{width:39px;height:39px}.makeup-palette{grid-template-columns:repeat(4,1fr)}#makeup-panel .range-heading{margin-top:25px}.hint{font-size:11px;color:var(--muted);line-height:1.6;margin-top:18px}.saved-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(235px,1fr));gap:24px;padding:15px 0}.saved-card{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}.saved-card>img{width:100%;aspect-ratio:3/4;object-fit:cover;display:block}.saved-info{padding:16px}.saved-info h2{font-size:16px}.saved-info p{font-size:12px;color:var(--muted);line-height:1.6}.saved-actions{display:flex;gap:15px;flex-wrap:wrap}.empty-state{grid-column:1/-1;text-align:center;border:1px dashed #cbbec6;border-radius:16px;padding:75px 25px;margin:15px 0}.empty-state .empty-heart{font-size:40px;color:var(--accent)}.empty-state h2{margin:18px 0 8px}.empty-state p{font-size:14px;color:var(--muted)}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);max-width:calc(100% - 32px);padding:14px 23px;border-radius:10px;background:#332a30;color:#fff;font-size:14px;box-shadow:0 4px 30px #0002;z-index:20;text-align:center}dialog{max-width:420px;width:calc(100% - 35px);border:1px solid var(--line);border-radius:16px;padding:28px;box-shadow:0 10px 80px #0003}dialog::backdrop{background:#27232b66}dialog p{font-size:14px;line-height:1.6;color:var(--muted)}.dialog-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:24px}
@media(min-width:1500px){.photo-stage{padding-top:30px;padding-bottom:46px}.portrait-wrap{width:445px}}@media(max-width:1050px){.topbar{gap:36px;padding:0 4%}.private-note{font-size:10px}main{padding-left:4%;padding-right:4%}.workspace{grid-template-columns:minmax(0,1fr) 320px;gap:18px}.settings-panel{padding-left:18px;padding-right:18px}.photo-stage{padding-left:20px;padding-right:20px}.photo-footer>span{display:none}.photo-toolbar{padding:12px;font-size:11px}.view-switch button{padding:7px 8px;font-size:11px}.studio-footnote>span{display:none}.swatch{font-size:10px}}
@media(max-width:760px){.topbar{height:72px;gap:30px}.brand{font-size:30px}.private-note{display:none}.nav-button{font-size:12px}nav{gap:22px;margin-left:auto}.page-heading{align-items:flex-start;flex-direction:column;margin-bottom:22px;gap:20px}main{padding-top:25px}.eyebrow{font-size:10px}h1{font-size:27px}.page-heading .button{width:100%;justify-content:center}.workspace{grid-template-columns:1fr}.photo-stage{padding:18px 20px 40px;min-height:260px}.portrait-wrap{width:min(100%,375px)}.settings-panel{padding:0 22px 22px}.palette{grid-template-columns:repeat(6,1fr);gap:17px 9px}.makeup-palette{grid-template-columns:repeat(4,1fr)}.swatch-circle{width:42px;height:42px}.swatch{font-size:10px}.save-area{grid-template-columns:1fr 1fr}.local-note{grid-column:1/-1}.studio-footnote{align-items:flex-start;gap:14px;margin-bottom:15px}.studio-footnote p{font-size:10px}.saved-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.saved-info{padding:12px}.saved-info h2{font-size:14px}.saved-info p{font-size:11px}.saved-actions{gap:9px}.saved-actions button{font-size:11px}.category-tabs button{font-size:15px}.section-title h2{font-size:19px}.muted{font-size:13px}}
@media(max-width:390px){.topbar{padding:0 5%;gap:15px}.nav-button{font-size:11px}nav{gap:15px}.brand{font-size:27px}.palette{grid-template-columns:repeat(4,1fr)}.save-area{grid-template-columns:1fr}.photo-toolbar{flex-wrap:wrap}.view-switch{margin-left:auto}.photo-stage{padding-left:12px;padding-right:12px}.studio-footnote{flex-direction:column}.saved-grid{grid-template-columns:1fr}}
.eyebrow,.small-label,.private-note,.photo-toolbar,.view-switch button,.photo-footer,.status-pill,.local-note,.studio-footnote,.studio-footnote p,.studio-footnote button,.rec-explanation,.hint,.selected-shade button,.saved-info p{font-size:12px}.swatch{font-size:12px}.range-heading,.range-heading output,.recommendation label,.recommend-button,.palette-label,.makeup-presets button,.rec-chip,select,.text-button,.compare-control label{font-size:14px}.muted{font-size:14px}.range-heading{margin-top:8px}.recommendation{padding:16px}.selected-shade .small-label{font-size:10px}.studio-footnote{align-items:flex-start}.photo-toolbar{gap:8px}.photo-toolbar>span{max-width:45%;line-height:1.5}.view-switch button{font-size:12px}.swatch-circle{margin:4px 0}.save-area .button{font-size:14px}.saved-info .text-button{font-size:13px}.image-labels{font-size:12px}@media(max-width:760px){.nav-button{font-size:13px}.palette{grid-template-columns:repeat(4,1fr)}.photo-toolbar{font-size:12px}.studio-footnote p{font-size:12px}.eyebrow{font-size:11px}.saved-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

.photo-column{min-width:0}.category-tabs{gap:13px}.category-tabs button{font-size:13px}.field-label{display:block;font-size:13px;margin:15px 0 8px}#hair-palette,#nail-palette,#clothes-palette{margin-top:18px}.custom-color-label{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13px;margin-top:20px;color:#685866}.custom-color-label input{width:40px;height:34px;padding:2px;border:1px solid #d7c9d2;background:white;border-radius:6px;cursor:pointer}.hair-options{margin-top:18px}.hair-options .text-button{font-size:12px;margin-top:14px;text-align:left}.tone-label{margin-top:13px}.range-heading{margin-top:18px}.history-actions{display:flex;gap:15px}.history-actions button{font-size:12px}.history-actions button:disabled{opacity:.3;cursor:default}.photo-footer{flex-wrap:wrap}.photo-footer>span{display:none}.region-button{margin-top:20px;width:100%;font-size:13px}.check-label{display:flex;gap:8px;align-items:center;font-size:12px;line-height:1.5}.check-label input{accent-color:var(--accent);width:16px;height:16px}.export-options{display:grid;gap:8px;font-size:12px;margin:8px 0}.export-options select{font-size:12px}.photo-column .consultant-panel{margin-top:24px;padding:25px;background:#fff;border:1px solid var(--line);border-radius:16px}.consultant-heading{display:flex;gap:13px;align-items:center}.consultant-heading .eyebrow{margin-bottom:8px;font-size:10px}.consultant-mark{width:43px;height:43px;border-radius:12px;background:#f6e9ef;color:var(--accent);font-size:29px;display:grid;place-items:center}.consultant-panel label{font-size:14px;display:block;margin-bottom:9px}.consultant-panel textarea{font:inherit;font-size:14px;line-height:1.6;color:#42353e;resize:vertical;width:100%;min-height:95px;border:1px solid #dfd6dd;border-radius:9px;padding:13px;background:#fdfbfc}.prompt-chips{display:flex;flex-wrap:wrap;gap:7px;margin:11px 0 16px}.prompt-chips button{border:1px solid #e5dce2;background:#fff;color:#7a5b6b;border-radius:15px;padding:7px 11px;font-size:12px}.consultant-note,.consultant-summary{font-size:12px;color:#887580;line-height:1.6}.consultant-note{margin:15px 0 0}.consultant-summary{margin:24px 0 14px}.advice-card{border-top:1px solid var(--line);padding:18px 0 5px}.advice-card h3{font-size:16px}.advice-card p{font-size:13px;line-height:1.6;color:var(--muted)}.advice-card .button{min-height:38px;font-size:12px;padding:9px 14px}.advice-colors{display:flex;gap:15px;flex-wrap:wrap;margin:13px 0}.advice-colors span{font-size:11px;display:flex;gap:5px;align-items:center}.advice-colors i{width:17px;height:17px;border-radius:50%;border:1px solid #0001}.portrait-wrap #mask-editor{pointer-events:none;opacity:0;z-index:5}.portrait-wrap #mask-editor.editing{pointer-events:auto;opacity:1;cursor:crosshair;touch-action:none}.mask-tools{padding:15px 20px;background:#fff;border-top:1px solid #eee}.mask-tools strong{font-size:14px}.mask-tools label{font-size:12px;display:block;margin:12px 0 6px}.mask-tools p{font-size:12px;line-height:1.6;color:#81717b;margin-bottom:0}.brush-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}.brush-actions button{font-size:12px;border:1px solid #ded2da;border-radius:6px;padding:7px 11px;color:#6f495b;background:white}.brush-actions button[aria-pressed=true]{background:var(--accent);color:white}.brush-actions button:disabled{opacity:.35}.save-area .export-options{grid-column:1/-1}.swatch[hidden]{display:none!important}.settings-panel #makeup-panel .range-heading{margin-top:16px}.settings-panel .palette-label{margin-top:22px}
@media(max-width:760px){.photo-column .consultant-panel{padding:20px}.photo-column{display:contents}.photo-column .photo-panel{order:0}.settings-panel{order:1}.photo-column .consultant-panel{order:2;margin-top:0}.category-tabs{gap:14px}.category-tabs button{font-size:14px}.photo-footer .text-button{font-size:12px}.photo-footer{gap:10px}.save-area .export-options{order:1}.save-area #download-button{order:2}.save-area .local-note{order:3}.consultant-heading h2{font-size:18px}.swatch{min-height:64px}}
@media(pointer:coarse){.text-button,.prompt-chips button,.brush-actions button{min-height:40px}.category-tabs button{min-height:48px}.swatch-circle{width:46px;height:46px}input[type=range]{min-height:28px}select,textarea{font-size:16px!important}}

.demo-links{display:flex;align-items:center;gap:12px;white-space:nowrap}.demo-links>span{font-size:12px}

#export-dialog{max-width:680px}#export-preview{display:block;max-width:100%;max-height:58vh;object-fit:contain;margin:16px auto;border-radius:7px}#export-link{text-decoration:none}#export-details{overflow-wrap:anywhere}

/* Loading remains visible without covering the photo or blocking the page. */
.analysis-progress{position:absolute;bottom:58px;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;background:#fffffff2;padding:9px 14px;border-radius:10px;max-width:90%}.analysis-progress progress{width:90px;height:7px;accent-color:var(--accent)}.analysis-progress .text-button{font-size:14px}.status-pill{font-size:13px;max-width:92%}.photo-stage{padding-bottom:72px}.retry{bottom:72px}
