.outfit-page{max-width:1240px;padding:44px 28px 70px}
.outfit-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:30px}
.outfit-eyebrow{font-size:11px;letter-spacing:.22em;color:#607454;font-weight:800}
.outfit-heading h1{font-size:clamp(29px,4vw,43px);line-height:1.3;letter-spacing:-.055em;margin:10px 0 12px;font-family:inherit;font-weight:900}
.outfit-heading p{max-width:650px;color:#6b7067;font-size:14px;line-height:1.9;margin:0}
.outfit-heading>a{white-space:nowrap;font-size:13px;color:#46603b;border-bottom:1px solid #a9b49e;padding-bottom:4px}
.outfit-workspace{display:grid;grid-template-columns:minmax(0,1fr) 430px;gap:28px;align-items:start}
.outfit-stage-card{background:#fffdf8;border:1px solid #dedbd1;border-radius:18px;overflow:hidden;position:sticky;top:94px}
.outfit-stage-head{display:flex;justify-content:space-between;align-items:center;padding:17px 22px;font-size:11px;color:#73796c;letter-spacing:.06em}
.outfit-stage-head b{font-size:12px;color:#33452f;letter-spacing:0}
#outfit-art{padding:0 16px;display:flex;justify-content:center}
#outfit-art svg{display:block;width:100%;max-height:min(610px,calc(100dvh - 225px));height:auto}
.outfit-stage-foot{padding:16px 22px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid #ece9e0;margin-top:16px}
.outfit-stage-foot>div{font-size:11px;color:#7a7e73}.outfit-stage-foot strong{display:block;font-size:14px;color:#394e31;margin-bottom:4px}
.outfit-btn{font:inherit;font-size:12px;font-weight:800;border:1px solid #d5d8ca;border-radius:7px;padding:11px 15px;background:#fffdf8;color:#384e31;cursor:pointer;line-height:1.5}
.outfit-btn:hover{background:#f1f3eb}.outfit-btn.primary{background:#3e5734;color:#fff;border-color:#3e5734}.outfit-btn.primary:hover{background:#2b4124}
.outfit-btn:disabled{opacity:.5;cursor:wait}
.outfit-panel{display:grid;gap:18px}
.outfit-section{padding:24px;border:1px solid #dedbd1;border-radius:14px;background:#fffdf9}
.outfit-section h2{font-family:inherit;font-size:17px;margin:0 0 5px;letter-spacing:-.04em}
.outfit-section>.section-note{font-size:11px;color:#85897e;margin:0 0 18px;line-height:1.7}
.preset-list{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.outfit-preset{border:1px solid #e0e1d8;border-radius:8px;background:#fffdf9;padding:11px 13px;text-align:left;cursor:pointer;color:#505749;font:inherit;font-size:11px}
.outfit-preset:hover{background:#f3f5ee}.outfit-preset[aria-pressed=true]{border-color:#728665;background:#f0f3e9;box-shadow:inset 0 0 0 1px #728665}
.preset-swatches{display:flex;gap:5px;margin-bottom:8px}.preset-swatches i{width:21px;height:21px;border-radius:50%;border:1px solid #0000000d}
.outfit-recommend{width:100%;margin-top:12px}
.outfit-item{padding:16px 0;border-bottom:1px solid #ecece5;display:grid;grid-template-columns:1fr 1fr;gap:10px;align-items:center}
.outfit-item:last-of-type{border:0;padding-bottom:0}.outfit-item label{font-size:12px;font-weight:800;color:#424b3b}
.outfit-item select{width:100%;border:1px solid #dbded1;border-radius:6px;padding:8px;background:#fffdf9;color:#48563f;font:inherit;font-size:12px;min-width:0}
.outfit-color-row{grid-column:1/-1;display:flex;align-items:center;gap:8px}
.outfit-color-row input[type=color]{width:38px;height:36px;padding:3px;border:1px solid #dadcd0;border-radius:6px;background:#fff;cursor:pointer;flex-shrink:0}
.outfit-color-row input[type=text]{flex:1;min-width:0;font:12px monospace;border:1px solid #dadcd0;border-radius:6px;padding:10px;color:#526048;background:#fff}
.outfit-lock{font:inherit;font-size:11px;border:1px solid #deded4;border-radius:6px;padding:9px 10px;background:#fffdf8;cursor:pointer;color:#69705e;white-space:nowrap}
.outfit-lock[aria-pressed=true]{background:#e7edde;border-color:#81956e;color:#3d562d}
.outfit-color-row input:disabled{opacity:.4;cursor:not-allowed}
.outfit-skin{display:flex;gap:10px;margin-top:15px;align-items:center;flex-wrap:wrap}.outfit-skin label{font-size:11px;color:#69705e;margin-right:auto}.outfit-skin input{width:35px;height:30px;border:0;background:none}
.outfit-tip{font-size:12px;line-height:1.9;color:#5e6d55;padding:15px 18px;background:#eef1e7;border-radius:8px;margin:14px 0 0}
.outfit-actions{display:flex;gap:8px;flex-wrap:wrap}.outfit-actions button{flex:1}
#outfit-status{font-size:12px;color:#4e643e;min-height:22px;margin:0;padding:0 3px}
.outfit-help{margin-top:54px;padding-top:30px;border-top:1px solid #dbd9cd}.outfit-help h2{font-family:inherit;font-size:22px;margin-bottom:20px}
.outfit-help-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}.outfit-help h3{font-family:inherit;font-size:14px;margin-bottom:8px}.outfit-help p{font-size:12px;color:#6a7062;line-height:1.9}
.outfit-disclaimer{font-size:11px!important;border-top:1px solid #e0dfd6;padding-top:18px;margin-top:22px}
.outfit-page :focus-visible{outline:2px solid #4d713a;outline-offset:3px}
@media(min-width:1400px){#outfit-art svg{max-height:min(680px,calc(100dvh - 225px))}}
@media(max-width:950px){.outfit-workspace{grid-template-columns:minmax(0,1fr) 360px;gap:18px}.outfit-section{padding:18px}.outfit-stage-card{top:150px}.outfit-heading{align-items:flex-start;flex-direction:column;gap:14px}}
@media(max-width:730px){.outfit-page{padding:30px 16px 50px}.outfit-workspace{grid-template-columns:1fr}.outfit-stage-card{position:static}#outfit-art svg{max-height:530px}.outfit-heading h1{font-size:31px}.outfit-stage-foot{padding:14px 18px}.outfit-help-grid{grid-template-columns:1fr;gap:18px}.outfit-stage-head{padding:14px 18px}}