:root{font-family:system-ui,-apple-system,sans-serif;color:#302932;background:#fff7ee}*{box-sizing:border-box}body{margin:0;font-size:17px;line-height:1.5}main.native-screen{max-width:1120px;padding:24px;margin:auto}h1,h2,h3{font-family:inherit;line-height:1.25}h1{font-size:25px}h2{font-size:21px;margin:24px 0 8px}h3{font-size:18px;margin:12px 0}p{margin:8px 0 16px}button,select{font:inherit;cursor:pointer}button:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid #b55782;outline-offset:3px}.native-header{display:flex;align-items:center;justify-content:space-between}.native-button{min-height:44px;border:1.5px solid #896782;background:#fffdf8;border-radius:16px;padding:10px 15px;color:inherit;font-weight:800}.native-actions{display:flex;gap:12px;flex-wrap:wrap;margin:18px 0}.native-button[aria-pressed=true]{background:#6d315f;color:#fff}.native-verdict{background:#fbf2fa;border:1.5px solid #c199bd;border-radius:20px;padding:20px}.tier-badge{display:inline-block;background:#fff1ce;padding:8px 14px;border-radius:14px;color:#795015;font-weight:900}.handling-score{display:flex;align-items:center;justify-content:space-between;gap:20px;border:2px solid #9c5b91;border-radius:18px;background:linear-gradient(90deg,#fbf2fa,#e9d4e6,#fbf2fa);padding:18px;margin:16px 0;min-height:78px}.rating-number{font-size:24px;white-space:nowrap}.native-view-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:20px 0}.native-view-tab{display:flex;flex-direction:column;align-items:center;gap:7px;min-width:0;padding:12px 8px;border-radius:18px;border:2px solid #a088ae;color:#302932;background:#f3eaf5}.native-view-tab.structure{background:#e2f0ec;border-color:#285c50}.native-view-tab.care{background:#fff1d7;border-color:#ba9252}.native-view-tab[aria-selected=true]{background:#285c50;color:#fff;border-color:#285c50}.native-view-tab.sew[aria-selected=true]{background:#6d315f;border-color:#6d315f}.native-view-tab.care[aria-selected=true]{background:#8c621f;border-color:#8c621f}.native-view-tab img{width:52px;height:52px;object-fit:contain}.native-view-tab strong{font-size:17px}.native-view-tab span{font-size:14px;line-height:1.35}.native-view-tab small{font-size:12px;font-weight:900}.native-view-status{background:#e7f3ef;border-left:5px solid #285c50;border-radius:14px;padding:14px;font-weight:800}.native-fabric-columns,.native-comparison-cells{display:grid;grid-template-columns:repeat(var(--columns,2),minmax(0,1fr));gap:12px}.native-fabric-card{display:flex;flex-direction:column;align-items:center;text-align:center;background:#e7f3ef;border:1.5px solid #638e82;border-radius:18px;padding:14px 8px;min-width:0}.native-fabric-card:first-child{background:#f1e7f1;border-color:#937099}.native-fabric-card>strong{font-size:14px}.fabric-photo-button{border:0;background:transparent;padding:0;display:block;margin:12px auto}.fabric-photo-button img{display:block;width:105px;height:105px;border-radius:18px;object-fit:cover;max-width:100%}.native-fabric-card select{width:100%;margin-top:8px;min-height:44px;border:1px solid #947797;border-radius:10px;background:#fff;padding:8px;font-size:14px}.native-fabric-card label{font-size:15px;font-weight:800;margin-top:12px;max-width:100%}.native-detail-row{margin:18px 0;padding:16px;background:#fffdf8;border:1px solid #d7c7b8;border-radius:16px}.native-detail-row h3{display:flex;align-items:center;gap:12px}.native-detail-row h3 img{width:32px;height:32px;object-fit:contain}.native-comparison-cells>div{min-width:0;padding:8px}.native-comparison-cells>div+div{border-left:1px solid #ded3c8}.comparison-state{display:inline-block;font-size:13px;font-weight:800;border-radius:8px;padding:5px 8px;background:#eee8e3}.comparison-state.match{background:#dbf0e6;color:#275b44}.comparison-state.different,.comparison-state.overlap{background:#fff0d1;color:#875d21}.alternative-card{border:1.5px solid #947797;padding:20px;border-radius:18px;background:#fffdf8;margin:18px 0}.native-panel{padding:20px;background:#f1e7f1;border:1.5px solid #947797;border-radius:18px}dialog{width:min(94vw,760px);max-height:92dvh;overflow:auto;padding:24px;border:1px solid #917194;border-radius:18px;background:#fff8ef}dialog::backdrop{background:#122e29b3}dialog img{display:block;width:100%;height:auto;margin-top:16px}dialog select{display:block;width:100%;margin:20px 0;min-height:48px}.native-detail-row p{overflow-wrap:anywhere}.preview-footer p{white-space:nowrap}@media(max-width:560px){main.native-screen{padding:16px}.native-verdict{padding:14px}.rating-number{font-size:20px}.native-fabric-card{padding:12px 6px}.fabric-photo-button img{width:76px;height:76px}.native-fabric-card h3{font-size:16px}.native-fabric-card select{font-size:13px}.native-comparison-cells{gap:4px}.native-comparison-cells>div{padding:4px;font-size:15px}.native-detail-row{padding:12px}.native-view-tab span{font-size:13px}.native-view-tab small{font-size:11px}}
/* Exact CompareScreen dimensions and colors, independent of the app runtime. */
body{font-size:16px;line-height:21px;background:#FFF7EF;color:#302730}main.native-screen{padding:24px}
.native-header{display:block}.match-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:12px 0}.match-title h1{font-size:28px;font-weight:900;color:#713E70}.match-title img{width:64px;height:64px;object-fit:contain}
.native-verdict{padding:13px 14px;border-radius:22px;border:2px solid #CDB8C8;background:#FBF2FA}.native-verdict h2{font-size:16px;line-height:23px;font-weight:800;margin:8px 0}.native-verdict p{font-size:13px;line-height:19px}.native-verdict .native-actions{margin:8px 0}
.handling-score{position:relative;padding:12px 106px 12px 16px;min-height:78px;margin:8px 0}.handling-score>strong:first-child{font-size:16px;line-height:21px;font-weight:900}.handling-score .rating-number{position:absolute;right:8px;width:88px;height:66px;border-radius:33px;border:4px solid #FFF9F1;display:flex;align-items:center;justify-content:center;background:linear-gradient(#43183daa,#43183daa),url('assets/match-rating-photo.png') center/cover;color:white;font-size:17px;line-height:20px;font-weight:900}
.native-button{font-size:13px;line-height:18px;min-height:44px;border-radius:12px;padding:10px 14px}.native-actions{gap:8px;margin:12px 0}
.native-overline{font-size:13px;line-height:18px;font-weight:900;color:#725169;text-transform:uppercase;margin:16px 0 8px}
.native-overline+p{font-size:13px;line-height:18px}
.native-view-tabs{gap:7px;margin:8px 0}.native-view-tab{min-height:90px;border-radius:16px;padding:8px 7px;gap:3px}.native-view-tab img{width:38px;height:38px}.native-view-tab strong{font-size:14px;line-height:17px}.native-view-tab span,.native-view-tab small{font-size:10px;line-height:13px}
.native-view-tab.structure{background:#EAF5F2;border-color:#63AFA4}.native-view-tab.structure[aria-selected=true]{background:#176C5B;border-color:#176C5B}.native-view-tab.sew{background:#F6EBF5;border-color:#A96FA1}.native-view-tab.sew[aria-selected=true]{background:#713E70;border-color:#713E70}.native-view-tab.care{background:#FFF2DE;border-color:#CC963C}.native-view-tab.care[aria-selected=true]{background:#865519;border-color:#865519}
.native-view-status{font-size:13px;line-height:18px;padding:9px 12px;border-left-width:4px;border-radius:12px;color:#275F55;margin:8px 0}.native-screen h2{font-size:18px;line-height:23px}
.native-fabric-columns{gap:8px}.native-fabric-card{min-height:160px;border-radius:15px;padding:10px 12px;border-color:#6BA99C;background:#E8F4F1;gap:6px}.native-fabric-card:first-child{border-color:#AD78A2;background:#F5EAF3}.native-fabric-card:nth-child(3){border-color:#D5A05B;background:#FFF0DD}.native-fabric-card>strong{font-size:13px;color:#275F55}.native-fabric-card h3{font-size:17px;line-height:22px;margin:0}.fabric-photo-button{margin:5px auto}.fabric-photo-button img{width:76px;height:76px;border-radius:14px}.native-fabric-card>button:not(.fabric-photo-button){width:44px;height:44px;padding:0;border-radius:22px;border:0;background:#FFF9F4}.native-fabric-card label{font-size:13px;line-height:18px}
.native-detail-row{border-radius:20px;border:1.5px solid #9FC9B8;overflow:hidden;padding:0;margin:10px 0;background:#EDF6F3}.native-detail-row:has(.different),.native-detail-row:has(.overlap){border-color:#D5B073}.native-detail-row.wash-1{background:#FAF3E8}.native-detail-row.wash-2{background:#F6EFF7}.native-detail-row.wash-3{background:#EEF4F8}.native-detail-row h3{min-height:58px;padding:8px 10px;margin:0;gap:7px;font-size:17px;line-height:20px;border-bottom:1px solid #D7D0C9}.native-detail-row h3 img{width:34px;height:34px}
.native-comparison-statuses{display:grid;grid-template-columns:repeat(var(--columns,2),minmax(0,1fr));gap:0}.native-comparison-statuses>div{min-height:44px;padding:5px 6px;display:flex;justify-content:center;align-items:center;border-bottom:1px solid #D7D0C9}
.native-comparison-cells{gap:0}.native-comparison-cells>div{padding:13px 10px;min-height:68px;display:flex;flex-direction:column;gap:8px;align-items:center;justify-content:center}.native-comparison-cells p{font-size:16px;line-height:20px;text-align:center;font-weight:600;margin:0}
.native-comparison-cells>div:first-child,.native-comparison-statuses>div:first-child{background:#F5EAF3}.native-comparison-cells>div:nth-child(2),.native-comparison-statuses>div:nth-child(2){background:#E8F4F1;border-left:1px solid #D7D0C9}.native-comparison-cells>div:nth-child(3),.native-comparison-statuses>div:nth-child(3){background:#FFF0DD;border-left:1px solid #D7D0C9}
.baseline-label{color:#65385D;font-weight:900;font-size:11px}.comparison-state{font-size:11px;line-height:13px;text-align:center;font-weight:900;min-height:32px;border-radius:16px;padding:5px 7px;max-width:160px;width:100%;align-content:center;background:#6F6675;color:white}.comparison-state.match{background:#4F8B69;color:white}.comparison-state.close{background:#39765A;color:white}.comparison-state.overlap{background:#2F6690;color:white}.comparison-state.different{background:#B67A2D;color:white}.comparison-state.not_applicable{background:#81766F;color:white}

/* Like MatchSlot: version choices sit below each compact fabric card. */
.native-fabric-columns{align-items:start}.native-fabric-column{min-width:0;display:flex;flex-direction:column;gap:6px}
.native-fabric-card.slot-0{background:#F5EAF3;border-color:#AD78A2}.native-fabric-card.slot-0>strong{color:#65385D}
.native-fabric-card.slot-1{background:#E8F4F1;border-color:#6BA99C}.native-fabric-card.slot-1>strong{color:#275F55}
.native-fabric-card.slot-2{background:#FFF0DD;border-color:#D5A05B}.native-fabric-card.slot-2>strong{color:#785021}
.native-version-picker{display:flex;flex-direction:column;gap:6px;margin-top:7px;font-size:13px;line-height:18px;color:#725169}
.native-version-choice{width:100%;min-width:0;min-height:42px;padding:6px 10px;text-align:left;border:1px solid #B8A6B4;border-radius:13px;background:#FFFDFC;color:#302730;font-size:13px;line-height:18px;font-weight:700}
.native-version-choice[aria-pressed=true]{border:2px solid #6D315F;background:#F0DDEA;font-weight:900}

/* Give fabric photography a substantial share of each comparison card. */
.native-fabric-card .fabric-photo-button{width:min(82%,240px);margin:14px auto}
.native-fabric-card .fabric-photo-button img{width:100%;height:auto;aspect-ratio:1;border-radius:20px}
.native-panel>.fabric-photo-button,.alternative-card>.fabric-photo-button{width:min(65%,240px);margin:16px auto}
.native-panel>.fabric-photo-button img,.alternative-card>.fabric-photo-button img{width:100%;height:auto;aspect-ratio:1;border-radius:20px}
@media(max-width:560px){.native-fabric-card .fabric-photo-button{width:88%;margin:12px auto}.native-fabric-card .fabric-photo-button img{border-radius:16px}}