/* Comparison charts & at-a-glance cards (20261016) */
.cmp-wrap{position:relative;margin:24px 0 28px;border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface);box-shadow:var(--shadow-md);overflow:hidden}
.cmp-head{display:flex;align-items:center;gap:12px;padding:14px 18px;background:linear-gradient(135deg,#f3f7ff 0%,#fff 70%);border-bottom:1px solid var(--line);flex-wrap:wrap}
.cmp-head img{width:40px;height:40px;border-radius:10px;flex:none}
.cmp-tools{display:flex;gap:8px;flex-wrap:wrap;margin-left:auto}
.cmp-tools input{font:inherit;font-size:14px;padding:7px 12px;border:1px solid var(--line-2);border-radius:999px;min-width:300px;background:#fff}
.cmp-tools input:focus{outline:2px solid var(--accent);outline-offset:1px}
.cmp-hint{font-size:13px;color:var(--muted)}
.cmp-wrap>div{overflow-x:auto}
table.cmp-table{width:100%;border-collapse:separate!important;border-spacing:0;font-size:15px;line-height:1.5;margin:0}
table.cmp-table th{position:sticky;top:0;background:#fafbfc;color:var(--ink-2);font-weight:600;font-size:13px;letter-spacing:.02em;text-transform:uppercase;padding:12px 16px;border-bottom:2px solid var(--line);text-align:left}
table.cmp-table td{padding:14px 16px;border-bottom:1px solid var(--line);vertical-align:top}
table.cmp-table tbody tr:last-child td{border-bottom:0}
table.cmp-table tbody tr:nth-child(even) td{background:#fbfcfd}
table.cmp-table tbody tr{transition:background .15s}
table.cmp-table tbody tr:hover td,table.cmp-table tbody tr.is-active td{background:#eef4ff}
table.cmp-table tbody tr.is-active td:first-child{box-shadow:inset 3px 0 0 var(--accent)}
table.cmp-table td:first-child{font-weight:600;color:var(--ink)}
.cmp-table--vs th:nth-child(2),.cmp-table--vs td:nth-child(2){background:linear-gradient(#f2f6ff,#f2f6ff)!important}
.cmp-table--vs th:nth-child(2){color:var(--accent)}
.cmp-table--vs tbody tr:hover td:nth-child(2),.cmp-table--vs tbody tr.is-active td:nth-child(2){background:#e3ecff!important}
.cmp-nc{display:inline-block;padding:2px 10px;border-radius:999px;background:#f1f2f4;color:var(--muted);font-size:13px;font-style:italic}
th.cmp-sort{cursor:pointer;user-select:none}
th.cmp-sort button{all:unset;cursor:pointer}
th.cmp-sort button:focus-visible{outline:2px solid var(--accent)}
th.cmp-sort button::after{content:" ↕";color:var(--muted-2)}
th.cmp-sort[aria-sort=ascending] button::after{content:" ↑";color:var(--accent)}
th.cmp-sort[aria-sort=descending] button::after{content:" ↓";color:var(--accent)}
tr.cmp-hidden{display:none}
.cmp-empty{padding:16px;color:var(--muted);display:none}
.card.glance{position:relative;border:1px solid #d9e4fb;background:linear-gradient(160deg,#f4f8ff 0%,#fff 55%);box-shadow:var(--shadow-md);padding-left:24px}
.card.glance::before{content:"";position:absolute;left:0;top:16px;bottom:16px;width:4px;border-radius:0 4px 4px 0;background:var(--accent)}
.card.glance>p:first-child{display:flex;align-items:center;gap:12px;margin-top:0}
.card.glance>p:first-child::before{content:"";flex:none;width:40px;height:40px;border-radius:10px;background:url(/assets/graphics/cmp-results-icon.webp) center/cover}
.card.glance ul{list-style:none;padding-left:0}
.card.glance li{position:relative;padding:8px 0 8px 30px;border-top:1px dashed var(--line)}
.card.glance li:first-child{border-top:0}
.card.glance li::before{content:"✓";position:absolute;left:0;top:8px;width:20px;height:20px;border-radius:50%;background:var(--accent);color:#fff;font-size:12px;line-height:20px;text-align:center;font-weight:700}
.card.glance li.is-active{background:#eef4ff;border-radius:8px}
.cmp-num{font-weight:700;color:var(--accent);font-variant-numeric:tabular-nums}
@media (max-width:640px){
 .cmp-tools{margin-left:0;width:100%}.cmp-tools input{flex:1;min-width:0}
 table.cmp-table thead{position:absolute;left:-9999px}
 table.cmp-table,table.cmp-table tbody,table.cmp-table tr,table.cmp-table td{display:block;width:100%;box-sizing:border-box}
 table.cmp-table tr{border-bottom:1px solid var(--line);padding:6px 0}
 table.cmp-table td{border:0;padding:6px 16px}
 table.cmp-table td[data-label]:not(:first-child)::before{content:attr(data-label);display:block;font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:600;margin-bottom:2px}
 table.cmp-table td:first-child{font-size:16px;padding-top:12px}
 table.cmp-table tbody tr:nth-child(even) td{background:transparent}
 .cmp-table--vs td:nth-child(2){border-radius:8px}
}
@media (prefers-reduced-motion:reduce){table.cmp-table tbody tr{transition:none}}
.cmp-table--vs th:first-child{padding-left:16px}
.cmp-table--vs th:first-child::before{content:"";display:inline-block;width:28px;height:28px;border-radius:7px;background:url(/assets/graphics/cmp-vs-icon.webp) center/cover;vertical-align:middle;margin-right:10px}
@media (max-width:640px){.cmp-wrap:has(.cmp-table--vs){border-top:4px solid var(--accent)}}
