.cmp-hero{background:var(--surface);border-bottom:var(--bw) solid var(--ink);padding:36px 24px 28px}.cmp-hero-inner{max-width:1440px;margin:0 auto}.cmp-title{flex-wrap:wrap;align-items:flex-end;gap:18px;display:flex}.cmp-title h1{font:700 clamp(36px, 5vw, 56px) / .95 var(--font-display);letter-spacing:-.03em;margin:0}.cmp-title .cmp-ico{background:var(--cta);color:var(--cta-ink);border-radius:var(--r-3);border:var(--bw) solid var(--ink);width:56px;height:56px;box-shadow:var(--sh-offset-sm);justify-content:center;align-items:center;margin-right:12px;display:inline-flex;transform:rotate(-3deg)}.cmp-sub{font:500 16px/1.5 var(--font-body);color:var(--ink-2);max-width:600px;margin:16px 0 0}.cmp-wrap{max-width:1440px;margin:0 auto;padding:32px 24px 64px;overflow-x:auto}.cmp-table{--cmp-label-w:220px;--cmp-col-w:0px;border:var(--bw) solid var(--ink);border-radius:var(--r-5);background:var(--surface);min-width:760px;display:grid;overflow:hidden}.cmp-cell{border-right:1px solid var(--rule);border-bottom:1px solid var(--rule);background:var(--surface);min-height:56px;font:500 14px/1.4 var(--font-body);color:var(--ink);align-items:center;padding:18px 22px;display:flex}.cmp-cell.cmp-last-col{border-right:0}.cmp-cell.cmp-label{background:var(--surface-3);font:600 13px/1.2 var(--font-display);color:var(--ink-muted);letter-spacing:.01em;border-right:var(--bw) solid var(--ink)}.cmp-cell.cmp-winner{background:var(--winner-bg);position:relative}.cmp-cell.cmp-best{color:var(--cta-ink);font-weight:700}.cmp-cell.cmp-best:before{content:"★";color:var(--cta-ink);margin-right:6px}.cmp-cell.cmp-price-cell{font:700 18px/1 var(--font-mono);font-variant-numeric:tabular-nums}.cmp-rating-inline{align-items:center;gap:8px;display:inline-flex}.cmp-muted{color:var(--ink-muted)}.cmp-header{border-bottom:var(--bw) solid var(--ink);flex-direction:column;align-items:stretch;min-height:0;padding:0;display:flex}.cmp-header.cmp-label{background:var(--ink);color:var(--surface);border-right:0;flex-direction:column;justify-content:space-between;gap:16px;padding:24px 22px;display:flex}.cmp-header.cmp-label h2{font:700 22px/1 var(--font-display);letter-spacing:-.02em;color:var(--surface);margin:0}.cmp-header.cmp-label .cmp-note{font:500 12px/1.4 var(--font-body);color:var(--ink-inverse-2);margin:6px 0 0}.cmp-header.cmp-label .cmp-legend{font:600 11px/1 var(--font-display);letter-spacing:.06em;align-items:center;gap:8px;display:flex}.cmp-header.cmp-label .cmp-swatch{background:var(--cta);border:1px solid var(--surface);border-radius:var(--r-1);width:12px;height:12px}.cmp-product-card{background:var(--surface);flex-direction:column;gap:10px;padding:22px 20px 24px;display:flex;position:relative}.cmp-product-card.cmp-winner{background:var(--winner-bg)}.cmp-flag{background:var(--cta);color:var(--cta-ink);border-bottom-left-radius:var(--r-3);font:700 11px/1 var(--font-display);letter-spacing:.06em;border-left:var(--bw) solid var(--ink);border-bottom:var(--bw) solid var(--ink);align-items:center;gap:6px;padding:6px 12px;display:inline-flex;position:absolute;top:0;right:0}.cmp-product-card .cmp-img{aspect-ratio:4/3;background-color:var(--surface-2);border-radius:var(--r-3);border:var(--bw) solid var(--ink);margin-bottom:4px;position:relative;overflow:hidden}.cmp-product-card .cmp-img-empty{height:100%;color:var(--ink-muted);justify-content:center;align-items:center;display:flex}.cmp-remove{z-index:2;border-radius:var(--r-pill);background:var(--surface);border:var(--bw) solid var(--ink);width:30px;height:30px;color:var(--ink);cursor:pointer;justify-content:center;align-items:center;display:inline-flex;position:absolute;top:14px;left:14px}.cmp-remove:hover{background:var(--ink);color:var(--surface)}.cmp-remove:focus-visible{outline:3px solid var(--surprise);outline-offset:2px}.cmp-product-card .cmp-brand{font:600 10px/1 var(--font-display);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-muted)}.cmp-product-card .cmp-name{font:700 17px/1.15 var(--font-display);letter-spacing:-.015em;color:var(--ink);margin:0}.cmp-product-card .cmp-name a:hover{text-decoration:underline}.cmp-product-card .cmp-price{align-items:center;gap:10px;margin:4px 0;display:flex}.cmp-product-card .cmp-price .cmp-chip{font-family:var(--font-mono);background:var(--cta);color:var(--cta-ink);border-radius:var(--r-2);border:var(--bw) solid var(--ink);letter-spacing:-.02em;padding:8px 12px;font-size:26px;font-weight:700;line-height:1}.cmp-product-card .cmp-price .cmp-old{font:500 13px/1 var(--font-mono);color:var(--ink-muted);font-variant-numeric:tabular-nums;text-decoration:line-through}.cmp-cta-cell{background:var(--surface-3);flex-direction:column;align-items:stretch;gap:10px;padding:22px}.cmp-cta-cell.cmp-winner{background:var(--winner-bg)}.cmp-cta-cell .btn{width:100%}.cmp-cta-cell .cmp-meta{font:500 12px/1.4 var(--font-body);color:var(--ink-muted);flex-wrap:wrap;align-items:center;gap:6px;display:flex}.cmp-cell.cmp-cta-label{background:var(--ink);color:var(--surface);border-right:var(--bw) solid var(--ink)}.cmp-cta-label strong{color:var(--cta);font:700 13px/1 var(--font-display)}.cmp-verdict{background:var(--ink);color:var(--surface);border-radius:var(--r-6);border:var(--bw) solid var(--ink);grid-template-columns:80px 1fr auto;align-items:center;gap:24px;margin-top:24px;padding:32px;display:grid}.cmp-verdict .cmp-badge{background:var(--cta);color:var(--cta-ink);border-radius:var(--r-4);border:var(--bw) solid var(--ink);width:80px;height:80px;box-shadow:4px 4px 0 var(--surface);justify-content:center;align-items:center;display:inline-flex}.cmp-verdict h3{font:700 24px/1.15 var(--font-display);letter-spacing:-.02em;color:var(--surface);margin:0 0 6px}.cmp-verdict p{font:500 14px/1.5 var(--font-body);color:var(--ink-inverse-2);max-width:540px;margin:0}.cmp-verdict .btn{white-space:nowrap}.cmp-empty{text-align:center;max-width:720px;margin:0 auto;padding:64px 24px 96px}.cmp-empty .cmp-empty-ico{border-radius:var(--r-4);background:var(--surface-3);border:var(--bw) solid var(--ink);width:72px;height:72px;color:var(--ink);justify-content:center;align-items:center;margin:0 auto 20px;display:inline-flex}.cmp-empty h2{font:700 28px/1.1 var(--font-display);letter-spacing:-.02em;margin:0 0 12px}.cmp-empty p{font:500 15px/1.6 var(--font-body);color:var(--ink-2);max-width:460px;margin:0 auto 24px}@media (max-width:1000px){.cmp-verdict{text-align:center;grid-template-columns:1fr}.cmp-verdict .cmp-badge{margin:0 auto}}@media (max-width:700px){.cmp-wrap{padding:20px 16px 48px;overflow:visible}.cmp-table{--cmp-label-w:100px;--cmp-col-w:202px;border-radius:0;min-width:0;overflow:visible}.cmp-cell.cmp-label{z-index:5;position:sticky;left:0}.cmp-cell{padding:13px;font-size:13px}.cmp-header.cmp-label{gap:10px;padding:16px 12px}.cmp-header.cmp-label h2{font-size:16px}.cmp-header.cmp-label .cmp-note,.cmp-header.cmp-label .cmp-legend{display:none}.cmp-product-card{gap:8px;padding:16px 14px 18px}.cmp-product-card .cmp-img{aspect-ratio:1}.cmp-product-card .cmp-name{font-size:14px}.cmp-product-card .cmp-price .cmp-chip{font-size:19px}.cmp-cta-cell{padding:14px}.cmp-verdict{gap:16px;padding:22px 18px}}.cmp-toolbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px;display:flex}.cmp-count{font:700 13px/1 var(--font-display);letter-spacing:.04em;text-transform:uppercase;color:var(--ink-muted)}.cmp-add-btn{border-radius:var(--r-pill);border:var(--bw) solid var(--ink);background:var(--cta);color:var(--cta-ink);font:700 14px/1 var(--font-display);cursor:pointer;box-shadow:var(--sh-offset-sm);align-items:center;gap:8px;padding:12px 18px;transition:transform .12s,box-shadow .12s;display:inline-flex}.cmp-add-btn:hover{box-shadow:var(--sh-offset);transform:translate(-2px,-2px)}.cmp-add-btn:focus-visible{outline:3px solid var(--surprise);outline-offset:2px}.cmp-add-btn span[aria-hidden]{font-size:18px;line-height:0}.cmp-scroll{overflow-x:auto}.cmp-addcol{background:var(--surface-2);cursor:pointer;min-height:220px;color:var(--ink-2);border-right:0;border-left:var(--bw) dashed var(--ink);flex-direction:column;justify-content:center;align-items:center;gap:12px;transition:background .15s,color .15s}.cmp-addcol:hover{background:var(--cta);color:var(--cta-ink)}.cmp-addcol:focus-visible{outline:3px solid var(--surprise);outline-offset:2px}.cmp-addcol-plus{border-radius:var(--r-pill);border:var(--bw) solid currentColor;width:46px;height:46px;font:700 26px/1 var(--font-display);justify-content:center;align-items:center;display:inline-flex}.cmp-addcol-label{font:700 14px/1.2 var(--font-display);text-align:center;max-width:140px}.cmp-filler{background:var(--surface-2);border-right:0}.cmp-picker{flex-direction:column;min-height:0;display:flex}.cmp-picker-head{justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;display:flex}.cmp-picker-head h3{font:700 20px/1.1 var(--font-display);letter-spacing:-.02em;margin:0}.cmp-picker-close{border-radius:var(--r-pill);border:var(--bw) solid var(--ink);background:var(--surface);width:36px;height:36px;color:var(--ink);cursor:pointer;flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.cmp-picker-close:hover{background:var(--ink);color:var(--surface)}.cmp-picker-close:focus-visible{outline:3px solid var(--surprise);outline-offset:2px}.cmp-cats{gap:8px;margin-bottom:14px;padding-bottom:2px;display:flex}.cmp-cats .chip{padding:8px 14px;font-size:12px}.cmp-search{border:var(--bw) solid var(--ink);border-radius:var(--r-pill);background:var(--surface);color:var(--ink-muted);align-items:center;gap:10px;margin-bottom:16px;padding:0 14px;display:flex}.cmp-search input{font:500 15px/1 var(--font-body);color:var(--ink);background:0 0;border:0;outline:0;flex:1;padding:13px 0}.cmp-search input::placeholder{color:var(--ink-muted)}.cmp-picker-empty{text-align:center;color:var(--ink-muted);font:500 14px/1.5 var(--font-body);margin:0;padding:32px 0}.cmp-picker-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px;padding:2px;display:grid;overflow-y:auto}.cmp-pick{text-align:left;border:var(--bw) solid var(--ink);border-radius:var(--r-4);background:var(--surface);cursor:pointer;align-items:center;gap:12px;padding:10px;transition:transform .12s,box-shadow .12s;display:flex}.cmp-pick:hover{box-shadow:var(--sh-offset-sm);transform:translate(-2px,-2px)}.cmp-pick:focus-visible{outline:3px solid var(--surprise);outline-offset:2px}.cmp-pick-img{border-radius:var(--r-2);background:var(--surface-2);border:1px solid var(--rule);width:60px;height:60px;color:var(--ink-muted);flex-shrink:0;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.cmp-pick-img-media{width:100%;height:100%;position:absolute;inset:0}.cmp-pick-body{flex-direction:column;flex:1;gap:3px;min-width:0;display:flex}.cmp-pick-brand{font:700 9px/1 var(--font-display);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-muted)}.cmp-pick-name{font:600 13px/1.25 var(--font-display);color:var(--ink);-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.cmp-pick-foot{align-items:center;gap:10px;margin-top:2px;display:flex}.cmp-pick-price{font:700 13px/1 var(--font-mono);color:var(--ink)}.cmp-pick-rating{font:600 12px/1 var(--font-body);color:var(--star)}.cmp-pick-add{border-radius:var(--r-pill);background:var(--cta);width:34px;height:34px;color:var(--cta-ink);border:var(--bw) solid var(--ink);font:700 22px/1 var(--font-display);flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.cmp-empty-picker{text-align:left;border:var(--bw) solid var(--ink);border-radius:var(--r-5);background:var(--surface);box-shadow:var(--sh-offset-sm);margin:8px 0 28px;padding:22px}.cmp-empty-picker .cmp-picker-grid{max-height:420px}.cmp-modal{z-index:60;background:oklch(from var(--ink) l c h / .55);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);justify-content:center;align-items:flex-start;padding:6vh 16px 16px;display:flex;position:fixed;inset:0}.cmp-modal-inner{background:var(--surface);border:var(--bw) solid var(--ink);border-radius:var(--r-6);width:min(760px,100%);max-height:84vh;box-shadow:var(--sh-offset-lg);flex-direction:column;padding:24px;display:flex;overflow:hidden}.cmp-modal-inner .cmp-picker{max-height:100%}.cmp-modal-inner .cmp-picker-grid{max-height:60vh}@media (max-width:700px){.cmp-addcol{min-height:160px}.cmp-picker-grid{grid-template-columns:1fr}.cmp-modal{padding:3vh 10px 10px}.cmp-modal-inner{max-height:90vh;padding:18px}.cmp-remove,.cmp-picker-close{width:44px;height:44px}}@media (prefers-reduced-motion:reduce){.cmp-add-btn,.cmp-pick,.cmp-addcol{transition:none}.cmp-add-btn:hover,.cmp-pick:hover{transform:none}}
