.cmpt{position:fixed;inset:auto 0 0 0;z-index:500;display:flex;flex-wrap:wrap;align-items:center;gap:16px;padding:14px var(--hm-gutter) calc(14px + env(safe-area-inset-bottom));background:var(--hm-ink);color:var(--hm-field)}
.cmpt[hidden]{display:none}
.cmpt__count{font-size:14px;font-weight:700}
.cmpt__thumbs{display:flex;gap:6px;margin:0;padding:0;list-style:none}
.cmpt__thumb{display:grid;place-items:center;width:40px;height:40px;padding:4px;border-radius:8px;background:var(--hm-field)}
.cmpt__thumb img{width:100%;height:100%;object-fit:contain}
.cmpt__note{flex:1;font-size:13px;color:var(--hm-on-ink-muted)}
.cmpt__clear,.cmpt__go{min-height:44px;padding:9px 14px;border-radius:8px;font-size:13px}
.cmpt__clear{border:1px solid var(--hm-on-ink-ghost-line);background:none;color:var(--hm-on-ink);font-weight:600}
.cmpt__go{padding-inline:18px;border:0;background:var(--hm-accent);color:var(--hm-on-accent);font-weight:800}
body.has-compare{padding-bottom:var(--cmpt-h,0)}
body.is-locked .cmpt{display:none}

.cmpm.modal{width:min(900px,calc(100vw - 40px));max-height:86vh;padding:0;overflow:auto}
.cmpm__head{position:sticky;top:0;z-index:1;display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid var(--hm-line);background:var(--hm-field)}
.cmpm__title{font-size:20px;font-weight:700}
.cmpm__close{font-size:24px}
.cmpm__scroll{overflow-x:auto;padding:8px}
.cmpm__error{margin:16px;color:var(--hm-muted)}
.cmpm__table{width:100%;min-width:520px;border-collapse:collapse}
.cmpm__table th,.cmpm__table td{padding:13px 14px}
.cmpm__corner{width:120px}
.cmpm__product{vertical-align:bottom;font-weight:400;text-align:center}
.cmpm__pic{display:grid;place-items:center;height:90px;margin-bottom:8px}
.cmpm__pic img{max-width:100%;max-height:90px;object-fit:contain}
.cmpm__name{font-size:13px;font-weight:700;line-height:1.3;color:var(--hm-ink)}
.cmpm__price{margin-top:6px;font-size:16px;font-weight:800;color:var(--hm-accent-text)}
.cmpm__table tbody tr:nth-child(even){background:var(--hm-surface)}
.cmpm__label{font-size:13px;font-weight:600;text-align:start;color:var(--hm-muted)}
.cmpm__value{font-size:14px;font-weight:600;text-align:center;color:var(--hm-ink)}
.cmpm__foot{display:flex;justify-content:flex-end;gap:10px;padding:18px 24px;border-top:1px solid var(--hm-line)}
@media (max-width:1023px){.cmpt{padding:12px 16px calc(12px + env(safe-area-inset-bottom))}}