#outfit-compare *{box-sizing:border-box}#outfit-compare{margin:0;background:#f6f7f2;color:#263a31;font:15px/1.6 system-ui,'Malgun Gothic',sans-serif}#outfit-compare header{max-width:1280px;margin:auto;padding:22px 30px;display:flex;justify-content:space-between;border-bottom:1px solid #dde3d7}#outfit-compare header a{color:inherit;font-size:25px;font-weight:800;text-decoration:none}#outfit-compare header small,#outfit-compare header span{font-size:12px}#outfit-compare{max-width:1280px;margin:auto;padding:25px 30px}#outfit-compare .eyebrow{font-size:11px;letter-spacing:.13em;color:#71826b;font-weight:700}#outfit-compare .outfit-title{font-size:34px;line-height:1.3;letter-spacing:-.04em;margin:10px 0}#outfit-compare .outfit-title br{display:none}#outfit-compare .intro{color:#74806e;font-size:13px;margin-bottom:24px}#outfit-compare .layout{display:grid;grid-template-columns:minmax(0,1.9fr) minmax(270px,1fr);gap:24px}#outfit-compare .viewer{border-radius:18px;overflow:hidden;background:#e9ece4;align-self:start}#outfit-compare nav{display:flex;gap:6px;flex-wrap:wrap;padding:14px}#outfit-compare .caption{display:flex;justify-content:space-between;padding:0 20px 12px;font-size:12px;gap:10px}#outfit-compare button{font:inherit;cursor:pointer;border:1px solid #d4ddce;background:white;color:inherit;border-radius:9px;padding:9px 14px}#outfit-compare button[aria-pressed=true]{background:#294d3b;color:white;border-color:#294d3b}#outfit-compare button:focus-visible,#outfit-compare input:focus-visible,#outfit-compare .stage:focus-visible{outline:3px solid #be8554;outline-offset:2px}#outfit-compare nav button{font-size:12px}#outfit-compare .stage{height:580px;display:grid;grid-template-columns:1fr;gap:10px;padding:0 14px;touch-action:none;overflow:hidden}#outfit-compare .stage.all{grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr}#outfit-compare .pane{position:relative;min-height:0;overflow:hidden;background:#dedfdd;border-radius:8px;cursor:grab}#outfit-compare .pane:active{cursor:grabbing}#outfit-compare .pane img{width:100%;height:100%;object-fit:contain;display:block;user-select:none;pointer-events:none;transform-origin:center}#outfit-compare .pane span{position:absolute;bottom:9px;left:10px;border-radius:5px;background:#ffffffe0;padding:3px 9px;font-size:11px;pointer-events:none}#outfit-compare .tools{display:flex;justify-content:center;align-items:center;gap:10px;padding:15px 0 0}#outfit-compare .tools button{font-size:12px}#outfit-compare output{font-size:12px;min-width:45px;text-align:center}#outfit-compare .hint{text-align:center;font-size:11px;color:#74806e}#outfit-compare aside{background:#fff;border:1px solid #e0e6d9;border-radius:18px;padding:24px;align-self:start}#outfit-compare h2{font-size:21px;margin:5px 0 20px}#outfit-compare #looks{display:grid;gap:8px}#outfit-compare #looks button{text-align:left;padding:16px;font-size:13px;overflow-wrap:anywhere}#outfit-compare .note,#outfit-compare details p,#outfit-compare .notice p{font-size:12px;color:#788372}#outfit-compare .notice{background:#f5f1e6;padding:15px;border-radius:10px;margin-top:24px}#outfit-compare .notice strong{font-size:12px}#outfit-compare details{border-top:1px solid #e1e6dd;padding-top:15px;margin-top:20px}#outfit-compare summary{cursor:pointer;font-size:13px}#outfit-compare label{display:block;font-size:12px;margin:12px 0}#outfit-compare input{display:block;width:100%;margin-top:5px;padding:8px;border:1px solid #d7dfd1;border-radius:6px;font:inherit}#outfit-compare input[type=file]{font-size:11px}#outfit-compare footer{margin-top:24px;font-size:11px;color:#7c8975}#outfit-compare #message{color:#925f39}#outfit-compare button:disabled{opacity:.5;cursor:wait}@media(max-width:800px){#outfit-compare header{padding:16px}#outfit-compare header span{font-size:10px}#outfit-compare{padding:20px 16px}#outfit-compare .layout{grid-template-columns:1fr;gap:16px}#outfit-compare .stage{height:500px}#outfit-compare .outfit-title{font-size:29px}#outfit-compare .outfit-title br{display:block}#outfit-compare nav{gap:4px;padding:12px}#outfit-compare nav button{padding:8px 10px;font-size:11px}#outfit-compare .caption{font-size:11px;padding:0 15px 10px}#outfit-compare .stage.all{height:570px}#outfit-compare aside{padding:20px}}@media(max-width:360px){#outfit-compare .stage{height:430px}#outfit-compare .stage.all{height:490px}#outfit-compare nav button{padding:7px 8px}}#outfit-compare .compare-tools{padding:14px 14px 0;display:flex;gap:12px;align-items:center;flex-wrap:wrap}#outfit-compare .compare-tools button{font-size:12px}#outfit-compare .compare-tools label{margin:0;font-size:11px}#outfit-compare .compare-tools select{margin-left:7px;max-width:230px;padding:7px;border:1px solid #cfd9c8;border-radius:7px;background:white;color:inherit}#outfit-compare .compare-tools [hidden]{display:none}#outfit-compare .stage.compare{grid-template-columns:minmax(0,1fr) minmax(0,1fr);height:580px}#outfit-compare .stage.compare .pane span{right:8px;left:8px;bottom:8px;font-size:11px;text-align:center;overflow-wrap:anywhere}#outfit-compare .stage.compare .pane img{width:100%;height:100%}@media(max-width:800px){#outfit-compare .stage.compare{height:430px;gap:6px;padding:0 10px}#outfit-compare .stage.compare .pane span{font-size:10px;padding:4px}#outfit-compare .compare-tools select{max-width:200px}}@media(max-width:400px){#outfit-compare .stage.compare{height:340px}#outfit-compare .caption{flex-wrap:wrap}}

#outfit-compare{max-width:none;margin:28px 0;padding:24px 0;border-top:1px solid #d4ddce}#outfit-compare .outfit-next a{display:inline-block;padding:14px;color:#294d3b;text-decoration:underline}#outfit-compare button{min-height:44px}#outfit-compare .pane img{max-width:none;margin:0}#outfit-compare nav{border:0}#outfit-compare .stage.compare{grid-template-columns:repeat(2,minmax(0,1fr))}
