:root {
  --cdx-ink: #15131b;
  --cdx-ink-soft: #373240;
  --cdx-paper: #fffdf5;
  --cdx-warm: #f4f0df;
  --cdx-surface: #ffffff;
  --cdx-line: rgba(21, 19, 27, 0.12);
  --cdx-yellow: #ffd53d;
  --cdx-red: #ef3d53;
  --cdx-blue: #3559e8;
  --cdx-cyan: #39d7ff;
  --cdx-violet: #8158ff;
  --cdx-green: #35d07f;
  --cdx-shadow: 0 18px 60px rgba(28, 20, 40, 0.11);
  --cdx-radius: 22px;
  --cdx-shell: min(1220px, calc(100vw - 40px));
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--cdx-ink); background: var(--cdx-paper); font-family: "DM Sans", system-ui, sans-serif; font-size: 16px; line-height: 1.55; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 4px; }
img { display: block; max-width: 100%; }
button, input { font: inherit; }
.screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
.cdx-shell { width: var(--cdx-shell); margin-inline: auto; }
.cdx-skip-link { position: fixed; left: 14px; top: -60px; z-index: 9999; padding: 10px 16px; border-radius: 10px; background: var(--cdx-ink); color: white; }
.cdx-skip-link:focus { top: 14px; }

.cdx-site-header { position: sticky; top: 0; z-index: 100; background: color-mix(in srgb, var(--cdx-paper) 91%, transparent); border-bottom: 1px solid var(--cdx-line); backdrop-filter: blur(18px); }
.cdx-header-inner { min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.cdx-brand { display: inline-flex; align-items: center; gap: 13px; text-decoration: none; }
.cdx-brand-logo { display: block; width: 132px; line-height: 0; }
.cdx-brand-logo img { width: 100%; height: auto; }
.cdx-brand-product { display: flex; flex-direction: column; padding-left: 12px; border-left: 1px solid var(--cdx-line); line-height: 1; }
.cdx-brand-product strong { font: 700 18px/1 "Space Grotesk", sans-serif; letter-spacing: -.04em; }
.cdx-brand-product small { margin-top: 4px; color: #6e6873; font-size: 9px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.cdx-brand--footer .cdx-brand-logo { padding: 5px 8px; border-radius: 10px; background: var(--cdx-paper); }
.cdx-brand--footer .cdx-brand-product { border-color: rgba(255,255,255,.22); }
.cdx-brand--footer .cdx-brand-product small { color: rgba(255,255,255,.6); }
.cdx-brand-mark { width: 50px; aspect-ratio: 1; display: inline-flex; align-items: center; justify-content: center; gap: 2px; border: 2px solid var(--cdx-ink); border-radius: 15px; background: var(--cdx-yellow); box-shadow: 4px 4px 0 var(--cdx-ink); font-family: "Space Grotesk", sans-serif; font-weight: 700; transform: rotate(-2deg); }
.cdx-brand-mark i { width: 5px; height: 22px; border-radius: 10px; background: var(--cdx-red); transform: rotate(20deg); }
.cdx-brand-copy { display: flex; flex-direction: column; line-height: 1.02; }
.cdx-brand-copy strong { font: 700 21px/1 "Space Grotesk", sans-serif; letter-spacing: -0.6px; }
.cdx-brand-copy small { margin-top: 4px; color: #6e6873; font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; }
.cdx-navigation { display: flex; align-items: center; gap: 6px; }
.cdx-navigation a { padding: 10px 13px; border-radius: 12px; text-decoration: none; font-size: 14px; font-weight: 700; }
.cdx-navigation a:hover, .cdx-navigation a:focus-visible { background: rgba(21, 19, 27, 0.07); outline: none; }
.cdx-navigation .cdx-nav-plus { margin-left: 8px; color: white; background: var(--cdx-ink); box-shadow: 3px 3px 0 var(--cdx-yellow); }
.cdx-nav-toggle { display: none; width: 46px; height: 42px; border: 1px solid var(--cdx-line); border-radius: 13px; background: white; padding: 10px; }
.cdx-nav-toggle > span:not(.screen-reader-text) { display: block; height: 2px; margin: 4px 0; background: var(--cdx-ink); }

.cdx-site-main { min-height: 70vh; overflow: clip; }
.cdx-hero { position: relative; padding: 90px 0 76px; background: radial-gradient(circle at 16% 20%, rgba(255, 213, 61, 0.5), transparent 27%), radial-gradient(circle at 86% 22%, rgba(57, 215, 255, 0.35), transparent 28%), linear-gradient(180deg, #fffdf5 0%, #f8f3e3 100%); border-bottom: 1px solid var(--cdx-line); }
.cdx-hero::before { content: ""; position: absolute; inset: 0; opacity: 0.18; background-image: linear-gradient(rgba(21,19,27,.15) 1px, transparent 1px), linear-gradient(90deg, rgba(21,19,27,.15) 1px, transparent 1px); background-size: 34px 34px; mask-image: linear-gradient(to bottom, black, transparent 80%); }
.cdx-hero__grid { position: relative; display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; gap: 70px; }
.cdx-kicker, .cdx-eyebrow { display: inline-flex; align-items: center; gap: 8px; color: var(--cdx-red); font: 700 12px/1 "Space Grotesk", sans-serif; letter-spacing: .16em; text-transform: uppercase; }
.cdx-kicker::before { content: ""; width: 24px; height: 3px; border-radius: 10px; background: currentColor; }
.cdx-hero h1, .cdx-page-hero h1, .cdx-card-detail h1, .cdx-not-found h1 { margin: 19px 0 22px; font: 700 clamp(3rem, 7vw, 6.6rem)/.91 "Space Grotesk", sans-serif; letter-spacing: -.075em; }
.cdx-hero h1 em { color: var(--cdx-blue); font-style: normal; }
.cdx-hero__copy > p { max-width: 640px; color: #5f5865; font-size: clamp(1rem, 1.5vw, 1.22rem); }
.cdx-button-row { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.cdx-button { display: inline-flex; align-items: center; justify-content: center; min-width: 0; max-width: 100%; white-space: normal; overflow-wrap: anywhere; text-align: center; min-height: 48px; padding: 12px 20px; border: 2px solid var(--cdx-ink); border-radius: 14px; text-decoration: none; font-weight: 800; transition: transform .18s ease, box-shadow .18s ease; }
.cdx-button:hover, .cdx-button:focus-visible { transform: translate(-2px, -2px); outline: 3px solid rgba(53, 89, 232, .25); outline-offset: 2px; }
.cdx-button--primary { color: white; background: var(--cdx-ink); box-shadow: 5px 5px 0 var(--cdx-yellow); }
.cdx-button--secondary { background: white; box-shadow: 5px 5px 0 var(--cdx-cyan); }
.cdx-trust-line { display: flex; align-items: center; gap: 10px; margin-top: 28px; font-size: 13px !important; font-weight: 700; }
.cdx-trust-line span { width: 9px; height: 9px; border-radius: 50%; background: var(--cdx-green); box-shadow: 0 0 0 5px rgba(53,208,127,.15); }

.cdx-hero__visual { position: relative; min-height: 520px; display: grid; place-items: center; perspective: 1100px; }
.cdx-demo-card { position: absolute; width: min(290px, 68vw); aspect-ratio: .715; border: 4px solid var(--cdx-ink); border-radius: 24px; box-shadow: 14px 18px 0 rgba(21,19,27,.92), 0 35px 90px rgba(41,30,70,.24); font-family: "Space Grotesk", sans-serif; overflow: hidden; }
.cdx-demo-card--back { display: grid; place-content: center; color: white; background: repeating-radial-gradient(circle at center, #3559e8 0 16px, #1b2d89 17px 32px); transform: translate(-92px, 34px) rotateY(23deg) rotateZ(-11deg); }
.cdx-demo-card--back::before { content: ""; position: absolute; inset: 15px; border: 2px solid rgba(255,255,255,.8); border-radius: 16px; }
.cdx-demo-card--back b { font-size: 44px; letter-spacing: -.08em; }
.cdx-demo-card--back span { color: var(--cdx-yellow); font-size: 24px; font-weight: 700; letter-spacing: .35em; }
.cdx-demo-card--front { padding: 28px; color: var(--cdx-ink); background: linear-gradient(145deg, #fff 0 48%, #ffd53d 49% 70%, #ef3d53 71%); transform: translate(88px, -38px) rotateY(-18deg) rotateZ(8deg); }
.cdx-demo-card--front::before { content: ""; position: absolute; inset: 75px 25px 95px; border: 2px dashed rgba(21,19,27,.45); border-radius: 50%; background: radial-gradient(circle, rgba(57,215,255,.9), rgba(129,88,255,.65) 45%, transparent 46%); }
.cdx-demo-card--front small { font-weight: 800; letter-spacing: .16em; }
.cdx-demo-card--front strong { position: absolute; right: 24px; top: 20px; font-size: 40px; }
.cdx-demo-card--front span { position: absolute; left: 24px; right: 24px; bottom: 26px; font-size: 12px; font-weight: 800; letter-spacing: .09em; }
.cdx-demo-card--front i { position: absolute; inset: -40%; background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,.85) 42%, transparent 52%); animation: cdx-scan 5s ease-in-out infinite; }
.cdx-orbit { position: absolute; border: 2px dashed rgba(53,89,232,.35); border-radius: 50%; }
.cdx-orbit--one { width: 460px; height: 460px; }
.cdx-orbit--two { width: 350px; height: 350px; transform: rotateX(66deg); }
.cdx-scanline { position: absolute; width: 84%; height: 2px; background: linear-gradient(90deg, transparent, var(--cdx-cyan), transparent); box-shadow: 0 0 20px var(--cdx-cyan); animation: cdx-scanline 4.2s ease-in-out infinite; }
@keyframes cdx-scan { 0%, 28% { transform: translateX(-35%); } 65%, 100% { transform: translateX(55%); } }
@keyframes cdx-scanline { 0%, 100% { transform: translateY(-210px); opacity: 0; } 15%, 85% { opacity: 1; } 50% { transform: translateY(210px); } }

.cdx-section { padding: 88px 0; }
.cdx-section--stats { padding: 0; background: var(--cdx-ink); color: white; }
.cdx-stat-grid { display: grid; grid-template-columns: repeat(3, 1fr); }
.cdx-stat { display: flex; align-items: baseline; gap: 13px; padding: 24px 34px; border-inline-start: 1px solid rgba(255,255,255,.13); }
.cdx-stat:last-child { border-inline-end: 1px solid rgba(255,255,255,.13); }
.cdx-stat strong { color: var(--cdx-yellow); font: 700 32px/1 "Space Grotesk", sans-serif; }
.cdx-stat span { color: rgba(255,255,255,.7); font-size: 13px; font-weight: 700; }
.cdx-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 25px; margin-bottom: 34px; }
.cdx-section-heading h2, .cdx-split-callout h2, .cdx-independent-note h2 { margin: 12px 0 0; font: 700 clamp(2.2rem, 4.6vw, 4.4rem)/.98 "Space Grotesk", sans-serif; letter-spacing: -.055em; }
.cdx-section-heading > a { font-weight: 800; text-decoration: none; }

.cdx-card-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px 18px; }
.cdx-card-grid--archive { padding-top: 50px; padding-bottom: 80px; }
.cdx-card-grid--archive > div { min-width: 0; }
.cdx-card { min-width: 0; }
.cdx-card__link { display: block; text-decoration: none; }
.cdx-card__media, .cdx-card-stage__frame { --pointer-x: 50%; --pointer-y: 50%; --rotate-x: 0deg; --rotate-y: 0deg; position: relative; display: block; overflow: hidden; border: 1px solid rgba(21,19,27,.16); border-radius: 18px; background: #e7e1cf; box-shadow: 0 14px 35px rgba(31,24,48,.13); transform: perspective(900px) rotateX(var(--rotate-x)) rotateY(var(--rotate-y)); transform-style: preserve-3d; transition: transform .18s ease, box-shadow .18s ease; }
.cdx-card__media { aspect-ratio: .716; }
.cdx-card__media img, .cdx-card-stage__frame img { width: 100%; height: 100%; object-fit: cover; }
.cdx-card__link:hover .cdx-card__media { box-shadow: 0 23px 55px rgba(31,24,48,.23); }
.cdx-card__shine { position: absolute; inset: -2px; pointer-events: none; opacity: .76; mix-blend-mode: color-dodge; background: radial-gradient(circle at var(--pointer-x) var(--pointer-y), rgba(255,255,255,.92), transparent 18%), linear-gradient(112deg, transparent 18%, rgba(57,215,255,.38) 32%, rgba(255,213,61,.36) 46%, rgba(239,61,83,.34) 58%, rgba(129,88,255,.38) 70%, transparent 84%); background-size: 100% 100%, 220% 220%; background-position: center, var(--pointer-x) var(--pointer-y); filter: saturate(1.5) contrast(1.12); }
.cdx-card--cosmos .cdx-card__shine { background-image: radial-gradient(circle at var(--pointer-x) var(--pointer-y), white, transparent 17%), radial-gradient(circle at 18% 22%, rgba(255,255,255,.9) 0 1px, transparent 2px), radial-gradient(circle at 62% 35%, rgba(255,213,61,.95) 0 2px, transparent 3px), radial-gradient(circle at 74% 78%, rgba(57,215,255,.9) 0 1px, transparent 2px), linear-gradient(120deg, rgba(53,89,232,.22), rgba(239,61,83,.28), rgba(255,213,61,.2)); background-size: 100% 100%, 36px 42px, 65px 58px, 48px 55px, 200% 200%; }
.cdx-card--reverse .cdx-card__shine { mix-blend-mode: screen; opacity: .52; background: repeating-linear-gradient(125deg, rgba(57,215,255,.32) 0 7px, rgba(129,88,255,.25) 8px 15px, rgba(255,213,61,.28) 16px 23px); mask-image: linear-gradient(#000, #000); }
.cdx-card--rainbow .cdx-card__shine { opacity: .58; background: conic-gradient(from 180deg at var(--pointer-x) var(--pointer-y), #ff5577, #ffd53d, #35d07f, #39d7ff, #8158ff, #ff5577); mix-blend-mode: soft-light; }
.cdx-card__body { display: flex; flex-direction: column; align-items: flex-start; gap: 5px; padding: 14px 5px 0; }
.cdx-card__body strong { font: 700 18px/1.15 "Space Grotesk", sans-serif; }
.cdx-card__body > span:not(.cdx-badge) { color: #736c78; font-size: 13px; }
.cdx-badge { display: inline-flex; margin-top: 3px; padding: 4px 8px; border-radius: 999px; color: #1d2b65; background: rgba(53,89,232,.1); font-size: 11px; font-weight: 800; }
.cdx-card__body small { color: #8b5d10; font-size: 10px; font-weight: 700; }
.cdx-card__placeholder { display: grid; place-items: center; width: 100%; height: 100%; min-height: 240px; color: rgba(255,255,255,.85); background: radial-gradient(circle, #3559e8 0 20%, #182a83 21% 36%, #11172c 37%); }
.cdx-card__placeholder span { padding: 12px; border: 2px solid currentColor; border-radius: 50%; font: 700 34px/1 "Space Grotesk", sans-serif; }

.cdx-empty { grid-column: 1 / -1; display: flex; flex-direction: column; align-items: flex-start; gap: 5px; padding: 34px; border: 2px dashed rgba(21,19,27,.2); border-radius: 20px; background: white; }
.cdx-section--ink { position: relative; color: white; background: var(--cdx-ink); }
.cdx-section--ink::before { content: ""; position: absolute; inset: 0; opacity: .25; background: radial-gradient(circle at 10% 20%, var(--cdx-blue), transparent 25%), radial-gradient(circle at 90% 85%, var(--cdx-red), transparent 25%); }
.cdx-section--ink > * { position: relative; }
.cdx-section-heading--light .cdx-kicker { color: var(--cdx-yellow); }
.cdx-feature-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; border: 1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.14); }
.cdx-feature-grid article { min-height: 260px; padding: 28px; background: #191720; }
.cdx-feature-grid article > span { color: var(--cdx-yellow); font-family: "Space Grotesk", sans-serif; font-weight: 700; }
.cdx-feature-grid h3 { margin: 62px 0 12px; font: 700 24px/1.1 "Space Grotesk", sans-serif; }
.cdx-feature-grid p { color: rgba(255,255,255,.66); font-size: 14px; }

.cdx-split-callout { display: grid; grid-template-columns: 1fr .72fr; align-items: center; gap: 80px; }
.cdx-split-callout > div:first-child p { max-width: 650px; color: #675f6c; font-size: 18px; }
.cdx-plus-card { display: flex; flex-direction: column; align-items: flex-start; padding: 38px; border: 3px solid var(--cdx-ink); border-radius: 24px; background: var(--cdx-yellow); box-shadow: 12px 12px 0 var(--cdx-blue); transform: rotate(1.5deg); }
.cdx-plus-card > span { font: 700 12px/1 "Space Grotesk", sans-serif; letter-spacing: .13em; }
.cdx-plus-card > strong { margin-top: 24px; font: 700 68px/.9 "Space Grotesk", sans-serif; letter-spacing: -.08em; }
.cdx-plus-card > small { margin-bottom: 26px; font-weight: 700; }
.cdx-section--warm { background: var(--cdx-warm); border-block: 1px solid var(--cdx-line); }
.cdx-independent-note { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 28px; }
.cdx-independent-note h2 { font-size: clamp(1.8rem, 3vw, 3rem); }
.cdx-independent-note p { max-width: 760px; margin-bottom: 0; color: #655e68; }
.cdx-independent-note > a { font-weight: 800; }

.cdx-page-hero { padding: 80px 0 58px; background: radial-gradient(circle at 80% 20%, rgba(57,215,255,.26), transparent 28%), var(--cdx-warm); border-bottom: 1px solid var(--cdx-line); }
.cdx-page-hero h1 { max-width: 900px; font-size: clamp(3rem, 6vw, 6rem); }
.cdx-page-hero p { max-width: 720px; color: #625b66; font-size: 18px; }
.cdx-page-hero--catalog { background: radial-gradient(circle at 75% 10%, rgba(255,213,61,.65), transparent 28%), radial-gradient(circle at 10% 100%, rgba(53,89,232,.2), transparent 26%), var(--cdx-paper); }
.cdx-filter { display: flex; flex-direction: column; gap: 16px; max-width: 900px; margin-top: 28px; font-weight: 800; }
.cdx-filter label { display: flex; flex-direction: column; gap: 7px; color: var(--cdx-ink); font-size: 13px; }
.cdx-filter input,
.cdx-filter select { width: 100%; min-height: 50px; padding: 12px 15px; border: 2px solid var(--cdx-ink); border-radius: 14px; background: white; box-shadow: 4px 4px 0 var(--cdx-yellow); color: var(--cdx-ink); font: inherit; font-weight: 700; }
.cdx-filter__search { max-width: 540px; }
.cdx-filter__grid { display: grid; grid-template-columns: minmax(190px, 1.4fr) repeat(2, minmax(150px, .8fr)); gap: 14px; }
.cdx-filter__actions { display: flex; align-items: center; gap: 18px; }
.cdx-filter__clear { color: var(--cdx-ink); font-size: 13px; font-weight: 900; text-underline-offset: 4px; }
.cdx-results-summary { padding-top: 34px; color: #625b66; }
.cdx-results-summary strong { color: var(--cdx-ink); }
.cdx-search-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: stretch; }
.cdx-search-row .cdx-button { min-width: 110px; }
.cdx-content-shell { padding-block: 70px 100px; }
.cdx-prose { max-width: 780px; font-size: 17px; }
.cdx-prose--page { margin-inline: auto; }
.cdx-prose h1, .cdx-prose h2, .cdx-prose h3 { font-family: "Space Grotesk", sans-serif; letter-spacing: -.04em; line-height: 1.1; }
.cdx-prose h2 { margin-top: 2.2em; font-size: 2rem; }
.cdx-prose a { color: var(--cdx-blue); }
.cdx-prose table { width: 100%; border-collapse: collapse; }
.cdx-prose th, .cdx-prose td { padding: 12px; border: 1px solid var(--cdx-line); text-align: left; }
.cdx-prose blockquote { margin-inline: 0; padding: 16px 20px; border-left: 5px solid var(--cdx-yellow); background: var(--cdx-warm); }

.cdx-post-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; padding-block: 65px 100px; }
.cdx-post-card { padding: 28px; border: 1px solid var(--cdx-line); border-radius: 18px; background: white; box-shadow: 0 10px 35px rgba(21,19,27,.06); }
.cdx-post-card h2 { margin: 22px 0 14px; font: 700 26px/1.1 "Space Grotesk", sans-serif; letter-spacing: -.04em; }
.cdx-post-card h2 a { text-decoration: none; }
.cdx-post-card p { color: #6f6873; }
.cdx-post-card > a { font-weight: 800; }

.cdx-breadcrumbs { display: flex; flex-wrap: wrap; gap: 9px; padding: 30px 0; color: #716a76; font-size: 13px; font-weight: 700; }
.cdx-card-detail { padding-bottom: 100px; }
.cdx-card-detail__grid { display: grid; grid-template-columns: minmax(300px, 460px) 1fr; align-items: start; gap: 75px; }
.cdx-card-stage { position: sticky; top: 110px; }
.cdx-card-stage__frame { aspect-ratio: .716; border-radius: 25px; box-shadow: 0 30px 70px rgba(31,24,48,.25); }
.cdx-simulation-notice { padding: 14px 16px; border: 1px solid #e7c775; border-radius: 12px; color: #6d5010; background: #fff7d6; font-size: 12px; }
.cdx-finish-verified { padding: 14px 16px; border: 1px solid rgba(53,208,127,.45); border-radius: 12px; color: #165f3b; background: rgba(53,208,127,.1); font-size: 12px; }
.cdx-detail-section { margin-top: 34px; padding-top: 26px; border-top: 1px solid var(--cdx-line); }
.cdx-detail-section h2 { margin: 0 0 18px; font: 700 28px/1.05 "Space Grotesk", sans-serif; letter-spacing: -.04em; }
.cdx-variant-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.cdx-variant-list article, .cdx-battle-grid > div { display: flex; flex-direction: column; gap: 4px; padding: 14px; border: 1px solid var(--cdx-line); border-radius: 13px; background: white; }
.cdx-variant-list span, .cdx-battle-grid span { color: #706973; font-size: 12px; }
.cdx-move { margin-top: 12px; padding: 18px; border: 1px solid var(--cdx-line); border-radius: 15px; background: white; }
.cdx-move > span { color: var(--cdx-blue); font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.cdx-move h3 { display: flex; justify-content: space-between; gap: 20px; margin: 8px 0; font: 700 21px/1.1 "Space Grotesk", sans-serif; }
.cdx-move p { margin-bottom: 0; color: #655e68; }
.cdx-battle-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.cdx-card-detail__content { padding-top: 40px; }
.cdx-card-detail h1 { font-size: clamp(3.2rem, 6vw, 6.5rem); }
.cdx-lead { max-width: 690px; color: #625a67; font-size: 20px; }
.cdx-facts { display: grid; grid-template-columns: repeat(2, 1fr); margin: 36px 0; border-top: 1px solid var(--cdx-line); border-left: 1px solid var(--cdx-line); }
.cdx-facts div { padding: 16px; border-right: 1px solid var(--cdx-line); border-bottom: 1px solid var(--cdx-line); background: white; }
.cdx-facts dt { color: #817985; font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.cdx-facts dd { margin: 5px 0 0; font-weight: 800; }
.cdx-source-panel { display: flex; flex-direction: column; gap: 8px; margin-top: 34px; padding: 20px; border: 1px solid var(--cdx-line); border-radius: 16px; background: var(--cdx-warm); }
.cdx-source-panel small { color: #706973; }
.cdx-commerce-panel, .cdx-newsletter-card { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; margin-top: 24px; padding: 24px; border: 2px solid var(--cdx-ink); border-radius: 18px; background: white; box-shadow: 7px 7px 0 var(--cdx-yellow); }
.cdx-commerce-panel h2 { margin: 0; font: 700 25px/1.05 "Space Grotesk", sans-serif; letter-spacing: -.04em; }
.cdx-commerce-panel p, .cdx-newsletter-card span { margin: 0; color: #625a67; }
.cdx-commerce-panel small, .cdx-newsletter-card small { color: #736c78; }
.cdx-newsletter-card--inactive { border-color: var(--cdx-line); box-shadow: none; background: var(--cdx-warm); }
.cdx-newsletter-card > strong { font: 700 24px/1.05 "Space Grotesk", sans-serif; letter-spacing: -.04em; }
.cdx-not-found { min-height: 70vh; display: grid; place-items: center; text-align: center; background: radial-gradient(circle, rgba(255,213,61,.6), transparent 38%); }
.cdx-not-found p { max-width: 600px; margin: 0 auto 28px; color: #655e68; }

.cdx-footer { padding: 64px 0 25px; color: white; background: var(--cdx-ink); }
.cdx-footer__grid { display: grid; grid-template-columns: 1.6fr repeat(3, 1fr); gap: 45px; }
.cdx-brand--footer { color: white; }
.cdx-footer__grid > div { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.cdx-footer__grid p { max-width: 330px; color: rgba(255,255,255,.58); }
.cdx-footer__grid > div > strong { color: var(--cdx-yellow); font-family: "Space Grotesk", sans-serif; }
.cdx-footer__grid a:not(.cdx-brand) { color: rgba(255,255,255,.68); text-decoration: none; font-size: 14px; }
.cdx-footer__grid a:hover { color: white; }
.cdx-footer__bottom { display: flex; justify-content: space-between; gap: 25px; margin-top: 45px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.13); color: rgba(255,255,255,.45); font-size: 11px; }

.navigation.pagination { width: var(--cdx-shell); margin: 0 auto 80px; }
.nav-links { display: flex; gap: 8px; }
.page-numbers { padding: 8px 12px; border-radius: 10px; background: white; text-decoration: none; }
.page-numbers.current { color: white; background: var(--cdx-ink); }

:focus-visible { outline: 3px solid var(--cdx-blue); outline-offset: 3px; }
[hidden] { display: none !important; }

@media (max-width: 980px) {
  .cdx-hero__grid, .cdx-split-callout, .cdx-card-detail__grid { grid-template-columns: 1fr; }
  .cdx-hero__visual { min-height: 500px; }
  .cdx-card-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .cdx-feature-grid { grid-template-columns: repeat(2, 1fr); }
  .cdx-card-stage { position: relative; top: auto; width: min(480px, 100%); margin-inline: auto; }
  .cdx-footer__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 760px) {
  :root { --cdx-shell: min(100% - 28px, 1220px); }
  .cdx-header-inner { min-height: 68px; }
  .cdx-nav-toggle { display: block; }
  .cdx-navigation { position: absolute; left: 14px; right: 14px; top: calc(100% + 8px); display: none; flex-direction: column; align-items: stretch; padding: 12px; border: 1px solid var(--cdx-line); border-radius: 18px; background: var(--cdx-paper); box-shadow: var(--cdx-shadow); }
  .cdx-navigation.is-open { display: flex; }
  .cdx-navigation .cdx-nav-plus { margin: 4px 0 0; text-align: center; }
  .cdx-brand-mark { width: 43px; border-radius: 13px; }
  .cdx-brand-logo { width: 108px; }
  .cdx-brand-product { display: none; }
  .cdx-brand-copy strong { font-size: 18px; }
  .cdx-hero { padding: 64px 0 55px; }
  .cdx-hero__grid { gap: 28px; }
  .cdx-hero__visual { min-height: 420px; transform: scale(.88); }
  .cdx-demo-card { width: 250px; }
  .cdx-demo-card--back { transform: translate(-58px, 25px) rotateY(18deg) rotateZ(-9deg); }
  .cdx-demo-card--front { transform: translate(58px, -28px) rotateY(-13deg) rotateZ(7deg); }
  .cdx-stat-grid { grid-template-columns: 1fr; }
  .cdx-stat { border-right: 1px solid rgba(255,255,255,.13); border-bottom: 1px solid rgba(255,255,255,.13); }
  .cdx-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 12px; }
  .cdx-filter__grid { grid-template-columns: 1fr; }
  .cdx-filter__actions { align-items: stretch; flex-direction: column; }
  .cdx-filter__actions .cdx-button { width: 100%; }
  .cdx-search-row { grid-template-columns: 1fr; }
  .cdx-card__body strong { font-size: 15px; }
  .cdx-feature-grid, .cdx-post-grid { grid-template-columns: 1fr; }
  .cdx-feature-grid article { min-height: 210px; }
  .cdx-feature-grid h3 { margin-top: 35px; }
  .cdx-independent-note { grid-template-columns: 1fr; }
  .cdx-independent-note .cdx-brand-mark { width: 54px; }
  .cdx-facts { grid-template-columns: 1fr; }
  .cdx-variant-list, .cdx-battle-grid { grid-template-columns: 1fr; }
  .cdx-footer__grid { grid-template-columns: 1fr; }
  .cdx-footer__bottom { flex-direction: column; }
}

@media (max-width: 430px) {
  .cdx-card-grid { grid-template-columns: 1fr 1fr; }
  .cdx-card__body { padding-inline: 2px; }
  .cdx-card__body > span:not(.cdx-badge) { font-size: 11px; }
  .cdx-hero__visual { min-height: 360px; transform: scale(.72); margin-inline: -50px; }
  .cdx-section { padding: 65px 0; }
}

/* Collector shopping, editorial discovery and local collection tools. */
.cdx-shop-grid, .cdx-editorial-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; margin-block: 30px; }
.cdx-card__placeholder { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; }
.cdx-card__placeholder small { max-width: 90%; font-size: 13px; font-weight: 500; line-height: 1.4; letter-spacing: normal; text-align: center; }
.cdx-game-label { display: block; color: var(--cdx-muted); font-size: 12px; line-height: 1.5; }
.cdx-plus-card strong { font-size: clamp(26px, 4vw, 42px); overflow-wrap: anywhere; }
.cdx-shop-intro { max-width: 82ch; }
.cdx-shop-category, .cdx-editorial-card { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; padding: 25px; border: 1px solid var(--cdx-line); border-radius: 20px; background: var(--cdx-paper); overflow-wrap: anywhere; }
.cdx-shop-category h2, .cdx-editorial-card h2, .cdx-editorial-card h3 { margin: 12px 0; font-size: 22px; line-height: 1.25; }
.cdx-shop-category p, .cdx-editorial-card p { margin: 0 0 20px; line-height: 1.7; }
.cdx-shop-category .cdx-button, .cdx-editorial-card > a:last-child { margin-top: auto; }
.cdx-editorial-card time { margin-top: 9px; font-size: 12px; color: var(--cdx-muted); }
.cdx-archive-grid { margin-top: 30px; margin-bottom: 65px; }
.cdx-affiliate-disclosure { font-size: 13px; line-height: 1.7; }
.cdx-printing-shop { margin-top: 20px; padding-top: 12px; border-top: 1px solid var(--cdx-line); }
.cdx-printing-shop summary { cursor: pointer; min-height: 44px; padding-block: 10px; font-weight: 700; }
.cdx-printing-shop ul { list-style: none; padding: 0; display: grid; gap: 12px; }
.cdx-printing-shop li { min-width: 0; overflow-wrap: anywhere; }
.cdx-printing-shop .cdx-button { min-height: 44px; white-space: normal; text-align: left; }
.cdx-product-source { display: block; margin-top: 6px; font-size: 12px; }
.cdx-save-card { display: grid; gap: 9px; justify-items: start; margin: 24px 0; }
.cdx-save-card small { display: block; font-size: 12px; }
.cdx-save-card [role="status"]:empty { display: none; }
.cdx-collection-toolbar { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin: 25px 0; }
.cdx-collection-toolbar .cdx-button, .cdx-collection-toolbar input, [data-collection-list] button { min-height: 44px; }
.cdx-collection-toolbar input[type="file"] { max-width: 100%; width: 260px; font: inherit; }
[data-collection-list] { max-width: 100%; overflow: auto; }
[data-collection-list] table { width: 100%; border-collapse: collapse; }
[data-collection-list] th, [data-collection-list] td { padding: 12px 9px; border-bottom: 1px solid var(--cdx-line); text-align: left; }
[data-collection-list] input[type="number"] { width: 85px; min-height: 44px; padding: 8px; border: 1px solid var(--cdx-line); border-radius: 7px; font: inherit; }
[data-collection-list] button { padding: 7px 12px; border: 1px solid var(--cdx-line); border-radius: 8px; background: var(--cdx-paper); color: var(--cdx-ink); cursor: pointer; }
[data-collection-status], [data-collection-save-status] { font-size: 14px; overflow-wrap: anywhere; }
.cdx-content-shell:has(.cdx-shop-grid) .cdx-prose--page { max-width: none; }
@media (max-width: 1100px) {
  .cdx-nav-toggle { display: block; }
  .cdx-navigation { position: absolute; left: 14px; right: 14px; top: calc(100% + 8px); display: none; flex-direction: column; align-items: stretch; padding: 12px; border: 1px solid var(--cdx-line); border-radius: 18px; background: var(--cdx-paper); box-shadow: var(--cdx-shadow); }
  .cdx-navigation.is-open { display: flex; }
  .cdx-navigation a { min-height: 44px; display: flex; align-items: center; }
  .cdx-navigation .cdx-nav-plus { margin: 4px 0 0; justify-content: center; }
}
@media (max-width: 900px) { .cdx-shop-grid, .cdx-editorial-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) {
  .cdx-shop-grid, .cdx-editorial-grid { grid-template-columns: minmax(0, 1fr); }
  .cdx-shop-category, .cdx-editorial-card { padding: 21px; }
  .cdx-commerce-panel .cdx-button { max-width: 100%; white-space: normal; }
  .cdx-collection-toolbar { align-items: stretch; flex-direction: column; }
}

/* Discovery components: native details and buttons keep their keyboard semantics.
   A comparison scroll region should have tabindex="0" and an accessible label.
   Collection buttons use aria-pressed; use aria-selected only for real ARIA tabs. */
.cdx-start-actions { align-items: stretch; }
.cdx-start-actions .cdx-button { flex: 1 1 145px; }
.cdx-filter__search small { display: block; margin-top: 12px; color: var(--cdx-ink-soft); font-weight: 400; line-height: 1.6; }
.cdx-filter label, .cdx-filter__search, .cdx-filter__grid > *, .cdx-card-detail__content, .cdx-commerce-panel { min-width: 0; }
.cdx-filter select { max-width: 100%; text-overflow: ellipsis; }
.cdx-active-filters { margin-top: 28px; font-size: 14px; }
.cdx-active-filters > span { font-weight: 700; }
.cdx-active-filters ul { display: flex; flex-wrap: wrap; gap: 10px; padding: 0; margin: 12px 0 0; list-style: none; }
.cdx-active-filters li { min-width: 0; max-width: 100%; }
.cdx-filter-chip { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; max-width: 100%; padding: 8px 14px; border: 1px solid var(--cdx-ink); border-radius: 999px; color: var(--cdx-ink); background: white; overflow-wrap: anywhere; text-decoration: none; }
.cdx-filter-chip span { flex-shrink: 0; font-size: 20px; }
.cdx-filter-chip:hover { background: var(--cdx-warm); }
.cdx-filter__clear { display: inline-flex; align-items: center; min-height: 44px; }
.cdx-breadcrumbs { overflow-wrap: anywhere; }
.cdx-commerce-panel, .cdx-source-panel, .cdx-facts dd { overflow-wrap: anywhere; }
.cdx-merchant-option { display: inline-flex; flex-direction: column; align-items: flex-start; gap: 6px; min-width: 0; max-width: 100%; vertical-align: top; }
.cdx-affiliate-inline { display: block; color: var(--cdx-ink-soft); font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; }
.cdx-merchant-option > .cdx-button { max-width: 100%; }
.cdx-details { min-width: 0; margin-block: 24px; padding: 16px; border: 1px solid var(--cdx-line); border-radius: 16px; background: white; }
.cdx-details > summary { min-height: 44px; padding-block: 10px; cursor: pointer; font-weight: 800; overflow-wrap: anywhere; }
.cdx-details[open] > summary { margin-bottom: 12px; border-bottom: 1px solid var(--cdx-line); }
.cdx-details > :not(summary) { max-width: 100%; }
.cdx-printing-shop { width: 100%; min-width: 0; max-width: 100%; }
.cdx-pack-comparison { min-width: 0; max-width: 100%; }
.cdx-comparison { min-width: 0; max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; margin-block: 24px; border: 1px solid var(--cdx-line); border-radius: 12px; background: white; }
.cdx-comparison table { width: 100%; min-width: 640px; border-collapse: collapse; table-layout: fixed; }
.cdx-comparison caption { padding: 14px; text-align: left; font-weight: 800; }
.cdx-comparison th, .cdx-comparison td { padding: 14px; border: 1px solid var(--cdx-line); text-align: left; vertical-align: top; overflow-wrap: anywhere; }
.cdx-comparison th { background: var(--cdx-warm); }
.cdx-collection-tabs { display: flex; flex-wrap: wrap; gap: 10px; margin-block: 20px; }
.cdx-collection-tabs button, .cdx-wanted-toggle { min-width: 0; max-width: 100%; min-height: 44px; padding: 10px 16px; border: 2px solid var(--cdx-ink); border-radius: 12px; background: white; color: var(--cdx-ink); font: inherit; font-weight: 700; white-space: normal; overflow-wrap: anywhere; cursor: pointer; }
.cdx-collection-tabs [aria-pressed="true"], .cdx-collection-tabs [aria-selected="true"], .cdx-wanted-toggle[aria-pressed="true"] { color: white; background: var(--cdx-ink); box-shadow: 0 3px 0 var(--cdx-yellow); text-decoration: underline; text-underline-offset: 4px; }
.cdx-collection-tabs button:disabled, .cdx-wanted-toggle:disabled { cursor: not-allowed; opacity: .65; }
.cdx-set-checklist, .cdx-checklist, [data-set-checklist] { min-width: 0; max-width: 100%; margin-block: 28px; overflow-wrap: anywhere; }
.cdx-set-checklist [data-collection-list], .cdx-checklist [data-collection-list], [data-set-checklist] [data-collection-list] { overscroll-behavior-inline: contain; }
.cdx-checklist-summary, [data-set-checklist-summary] { padding: 16px; border-left: 4px solid var(--cdx-blue); background: var(--cdx-warm); }
.cdx-checklist-list, [data-set-checklist-missing] { display: grid; gap: 12px; padding: 0; list-style: none; }
.cdx-checklist-row, .cdx-collection-row { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; min-width: 0; padding: 16px; border: 1px solid var(--cdx-line); border-radius: 12px; background: white; }
.cdx-checklist-row > a, .cdx-collection-row > a { flex: 1 1 180px; min-width: 0; }
.cdx-checklist-row button, .cdx-set-checklist input, [data-set-checklist] button { min-height: 44px; max-width: 100%; font: inherit; }
.cdx-navigation.is-open { max-height: calc(100dvh - 100px); overflow-y: auto; }
@media (min-width: 1101px) and (max-width: 1240px) {
  .cdx-header-inner { flex-wrap: wrap; justify-content: center; gap: 10px; padding-block: 12px; }
  .cdx-navigation { flex-wrap: wrap; justify-content: center; }
}
@media (max-width: 600px) {
  .cdx-start-actions { flex-direction: column; }
  .cdx-start-actions .cdx-button { flex-basis: auto; width: 100%; }
  .cdx-commerce-panel { padding: 18px; }
  .cdx-details { padding: 12px; }
  .cdx-section-heading { align-items: flex-start; flex-direction: column; }
  .cdx-collection-tabs button { flex: 1 1 90px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
  .cdx-card__media, .cdx-card-stage__frame, .cdx-button { transform: none !important; }
  .cdx-card__shine { background-position: center !important; }
}
