:root{--cmp-indigo:#625bf6;--cmp-indigo-dark:#4b44d4;--cmp-ink:#0b0b10;--cmp-muted:#5e6270;--cmp-faint:#8a8e9b;--cmp-line:#e8e9ee;--cmp-win:#0b7a3b;--cmp-shadow-sm:0 1px 2px rgba(11,11,16,0.04),0 1px 3px rgba(11,11,16,0.06);--cmp-shadow-md:0 4px 12px rgba(11,11,16,0.07),0 2px 4px rgba(11,11,16,0.04);--cmp-shadow-lg:0 18px 40px rgba(11,11,16,0.12),0 4px 10px rgba(11,11,16,0.05)}.cmp-vs{display:grid;place-items:center;width:46px;height:46px;border-radius:999px;background:linear-gradient(180deg,var(--cmp-indigo),var(--cmp-indigo-dark));color:#fff;font-size:.74rem;font-weight:800;letter-spacing:.06em;box-shadow:var(--cmp-shadow-lg),0 0 0 5px rgba(98,91,246,.16)}.cmp-vs--sm{width:32px;height:32px;font-size:.62rem;box-shadow:var(--cmp-shadow-md),0 0 0 4px rgba(98,91,246,.12)}.cmp-card{position:relative;display:flex;flex-direction:column;border-radius:18px;background:#fff;border:1px solid var(--cmp-line);overflow:hidden;box-shadow:var(--cmp-shadow-sm);transition:transform .2s cubic-bezier(.22,.61,.36,1),box-shadow .2s cubic-bezier(.22,.61,.36,1),border-color .2s ease-out}.cmp-card:hover{border-color:rgba(98,91,246,.45)}.cmp-card:focus-visible,.cmp-card:hover{transform:translateY(-3px);box-shadow:var(--cmp-shadow-lg)}.cmp-card:focus-visible{outline:2px solid var(--cmp-indigo);outline-offset:3px}.cmp-card:before{content:"";position:absolute;inset:0 0 auto 0;height:3px;background:linear-gradient(90deg,var(--cmp-indigo),#8e88ff);transform:scaleX(0);transform-origin:left;transition:transform .24s cubic-bezier(.22,.61,.36,1);z-index:1}.cmp-card:focus-visible:before,.cmp-card:hover:before{transform:scaleX(1)}.cmp-card-stage{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:.5rem;height:140px;padding:.75rem 1rem 0;background:radial-gradient(120% 90% at 15% 0,rgba(98,91,246,.13) 0,transparent 62%),radial-gradient(120% 90% at 85% 0,rgba(98,91,246,.09) 0,transparent 58%),linear-gradient(180deg,#fcfcfe,#f1f1f9)}.cmp-card-img{width:100%;height:104px;object-fit:contain;mix-blend-mode:multiply}.cmp-card-body{border-top:1px solid rgba(232,233,238,.9);background:#fff;padding:.875rem 1rem 1rem}.cmp-card-title{text-align:center;font-size:.9375rem;font-weight:700;line-height:1.35;color:var(--cmp-ink);letter-spacing:-.01em}.cmp-card-title .vs{color:var(--cmp-indigo);margin:0 .3em;font-weight:800}.cmp-card-meta{display:flex;align-items:center;justify-content:center;gap:.5rem;margin-top:.5rem}.cmp-card-chip{padding:.1875rem .5rem;border-radius:999px;background:#f3f3fa;color:var(--cmp-muted);font-size:.6875rem;letter-spacing:.02em;text-transform:uppercase}.cmp-card-chip,.cmp-card-cta{display:inline-flex;align-items:center;font-weight:600}.cmp-card-cta{gap:.25rem;font-size:.75rem;color:var(--cmp-indigo)}.cmp-card-cta svg{transition:transform .2s cubic-bezier(.22,.61,.36,1)}.cmp-card:hover .cmp-card-cta svg{transform:translateX(3px)}@media (prefers-reduced-motion:reduce){.cmp-card,.cmp-card-cta svg,.cmp-card:before{transition:none}.cmp-card:focus-visible,.cmp-card:hover{transform:none}.cmp-card:focus-visible:before,.cmp-card:hover:before{transform:scaleX(1)}.cmp-card:hover .cmp-card-cta svg{transform:none}}.cmp-rail{display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;margin-inline:-1rem;padding-inline:1rem;padding-block:.25rem;scroll-padding-inline:1rem;scrollbar-width:none;-webkit-overflow-scrolling:touch}.cmp-rail::-webkit-scrollbar{display:none}.cmp-rail>.cmp-card{scroll-snap-align:start;flex:0 0 82%}@media (min-width:640px){.cmp-rail{margin-inline:0;padding-inline:0;scroll-padding-inline:0}.cmp-rail>.cmp-card{flex:0 0 calc((100% - 1rem) / 2.2)}}@media (min-width:1024px){.cmp-rail>.cmp-card{flex:0 0 calc((100% - 2rem) / 3.2)}}@media (prefers-reduced-motion:reduce){.cmp-rail{scroll-behavior:auto}}