body.modal-open{overflow:hidden}
.sync-button{margin-top:12px;border:1px solid var(--line);border-radius:999px;padding:7px 11px;background:#fff;color:var(--ink);font-size:11px;font-weight:700;cursor:pointer}
.sync-button:hover{border-color:var(--navy);background:var(--navy);color:#fff}
.sync-button:disabled{opacity:.55;cursor:wait}.sync-button.is-syncing{animation:sync-pulse 1.1s ease-in-out infinite}.sync-button.is-syncing::first-letter{display:inline-block;animation:sync-rotate .9s linear infinite}
@keyframes sync-pulse{0%,100%{box-shadow:0 0 0 0 rgba(75,85,100,0)}50%{box-shadow:0 0 0 5px rgba(75,85,100,.12)}}@keyframes sync-rotate{to{transform:rotate(360deg)}}
.modal-backdrop{position:fixed;inset:0;z-index:40;display:grid;place-items:center;padding:24px;background:rgba(27,38,56,.52);backdrop-filter:blur(5px)}
.modal-backdrop[hidden]{display:none}
.product-modal{position:relative;width:min(760px,100%);max-height:min(720px,calc(100vh - 48px));overflow:auto;border:1px solid rgba(255,255,255,.55);border-radius:16px;padding:28px;background:var(--paper);box-shadow:0 26px 80px rgba(20,29,44,.28)}
.product-modal h2{margin:6px 0 4px;color:var(--ink-strong);font:600 32px/1.05 'Space Grotesk',sans-serif;letter-spacing:-.04em}
.modal-close{position:absolute;top:16px;right:18px;width:32px;height:32px;border:0;border-radius:50%;background:var(--wash);color:var(--ink);font-size:23px;line-height:1;cursor:pointer}
.modal-subtitle{margin:0 0 22px;color:var(--muted);font-size:13px}
.variant-picker{display:flex;gap:8px;align-items:stretch;overflow:auto;margin:-8px 0 18px;padding:8px 1px 6px;scrollbar-width:thin}
.variant-picker[hidden]{display:none}
.variant-picker-label{display:flex;align-items:center;min-width:78px;color:#8a93a0;font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase}
.variant-button{min-width:160px;border:1px solid var(--line);border-radius:10px;padding:9px 11px;background:#fff;color:var(--ink);text-align:left;cursor:pointer;transition:border-color .18s ease,background .18s ease,transform .18s ease}
.variant-button:hover{border-color:#9ca6b4;transform:translateY(-1px)}
.variant-button.active{border-color:var(--navy);background:var(--navy);color:#fff}
.variant-button strong,.variant-button small{display:block;white-space:nowrap}.variant-button strong{font-size:11px}.variant-button small{margin-top:3px;color:#8c96a3;font-size:9px}.variant-button.active small{color:#cfd6df}
.offer-table-wrap{overflow:auto;border:1px solid var(--line);border-radius:10px;background:#fff}
.offer-table{width:100%;border-collapse:collapse;min-width:760px;text-align:left}
.offer-table th{padding:11px 14px;background:#f5f6f7;color:#8a93a0;font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.offer-table td{padding:14px;border-top:1px solid var(--line);color:var(--ink);font-size:12px;vertical-align:middle}
.offer-table td strong{display:inline-block;color:var(--ink-strong);font-weight:700}
.offer-table td small{display:block;margin-top:2px;color:#9aa2ad;font-size:10px}
.variant-cell{display:inline-block;max-width:180px;color:#5d6878;font-size:10px;line-height:1.35}
.offer-table .best-row{background:#f2faf6}
.row-badge{margin-left:7px;border-radius:999px;padding:3px 6px;background:#dff3e8;color:#257450;font-size:9px;font-weight:700;text-transform:uppercase}
.availability{display:inline-flex;border-radius:999px;padding:4px 8px;background:#e8f7ef;color:#257450;font-size:10px;font-weight:600;white-space:nowrap}
.availability.out{background:#f3ecec;color:#a06b6b}
.source-link{color:var(--ink);font-size:11px;font-weight:700;text-decoration:none;white-space:nowrap}
.source-link:hover{text-decoration:underline}
.modal-note{margin:16px 0 0;color:var(--muted);font-size:11px}