/* Homepage 1.1. Loaded after style.css, obsidian.css, privacy.css and controls.css; every rule is scoped to the new page (cm- classes or body.home).
   Two typefaces only: Georgia for titles, the system sans for everything else. Text sizes: --fs-body, --fs-small, --fs-label. */
:root{
  --cm-black:#05060b;--cm-ink:#0d0f1c;--cm-line:#e0bd7533;--cm-line-soft:#ffffff1a;
  --cm-gold:#e0bd75;--cm-gold-hi:#f7e2ac;--cm-violet:#8c6cff;--cm-cyan:#72e4ea;
  --cm-text:#f4f0e6;--cm-muted:#c3bfd2;--cm-display:Georgia,'Times New Roman',serif;
  --cm-body:system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  --fs-body:1.125rem;--fs-small:1rem;--fs-label:.875rem;
  --cm-wrap:1200px;--cm-gutter:clamp(20px,4vw,48px);--cm-radius:22px;--cm-header:76px;--cm-strip:156px;
}
body.home{background:var(--cm-black);color:var(--cm-text);font-family:var(--cm-body)}
.home main{display:block}
.cm-wrap{width:min(var(--cm-wrap),calc(100% - 2*var(--cm-gutter)));margin-inline:auto}
.home h1,.home h2,.home h3{font-family:var(--cm-display);font-weight:400;font-style:normal;letter-spacing:-.01em;color:var(--cm-text);text-transform:none}
.home h2{font-size:clamp(2rem,3.4vw,3.1rem);line-height:1.12;text-wrap:balance}
.home h3{font-size:1.375rem;line-height:1.25}
.home main p,.home main li,.home main dd{font-family:var(--cm-body);font-size:var(--fs-body);line-height:1.6;color:var(--cm-text)}
.home main .cm-muted{color:var(--cm-muted)}
.home :focus-visible{outline:2px solid var(--cm-cyan);outline-offset:4px}

/* Header: always a black bar, fixed above the page. */
.home .site-header{position:fixed;z-index:50;height:var(--cm-header);padding-inline:clamp(16px,3vw,40px);background:#05060bf5;border-bottom:1px solid #e0bd752e}
.home .site-header .brand img{width:196px;height:auto}
.home .site-footer .brand img{width:170px;height:auto}
.home .desktop-nav{gap:clamp(18px,2.2vw,34px)}
.home .desktop-nav a{font-size:var(--fs-small);color:#e6e1d4}
.home .desktop-nav a:hover{color:var(--cm-gold-hi)}
.home .header-actions{gap:12px}
.cm-header-cta{min-height:44px;padding:10px 22px;font-size:var(--fs-label)}
/* The local preview stays noindex; its banner would only cover the hero being reviewed. */
body.home>.preview-notice{display:none}

/* Hero: title on the left, the phone playing a real game on the right, everything within the first screen.
   Backdrop: the four home-screen backgrounds of the game (celestial, sanctuary, waterfall, ember) in one centred panorama. */
.cm-hero{position:relative;overflow:hidden;isolation:isolate;display:flex;align-items:center;min-height:max(560px,calc(100svh - var(--cm-strip)));padding:calc(var(--cm-header) + 20px) 0 20px;background:#0a0b1a}
.cm-hero-backdrop{position:absolute;inset:0;z-index:-2}
.cm-hero-backdrop img{width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.cm-hero::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(48% 62% at 30% 52%,#05060bc7 0,#05060b80 55%,#05060b26 100%),linear-gradient(0deg,#05060bcc 0,#05060b00 18%)}
.cm-hero-inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:clamp(24px,4vw,64px)}
.cm-hero-copy{max-width:580px}
.cm-hero h1{font-size:clamp(2.6rem,4.4vw,4.4rem);line-height:1.04;letter-spacing:-.02em;text-shadow:0 2px 8px #000c,0 6px 40px #000a}
.cm-hero-copy p{text-shadow:0 2px 10px #000}
.cm-hero h1 .cm-hero-kicker{display:block;margin-bottom:14px;font-family:var(--cm-body);font-size:var(--fs-body);font-weight:600;line-height:1.35;letter-spacing:0;color:var(--cm-gold-hi)}
.cm-hero-claim{display:block}
.cm-hero-lead{margin-top:22px}
.cm-proof{margin-top:6px;display:flex;flex-wrap:wrap;gap:.3em;align-items:baseline;min-height:1.6em}
.cm-proof-list{display:inline-grid;color:var(--cm-gold-hi);text-align:left}
.cm-proof-item{grid-area:1/1;opacity:0;transform:translateY(.4em);transition:opacity .5s,transform .5s}
.cm-proof-item.is-current{opacity:1;transform:none}
.cm-stores{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-top:30px}
.cm-store{display:block;border-radius:10px;transition:transform .2s,box-shadow .2s}
.cm-store img{height:56px;width:auto}
.cm-store:hover{transform:translateY(-2px);box-shadow:0 10px 30px #8c6cff40}
.home main .cm-hero-note{margin-top:14px;color:var(--cm-muted)}
.cm-play-sound{display:inline-flex;align-items:center;gap:10px;margin-top:22px;padding:11px 20px;border-radius:999px;border:1px solid #ffffff2e;background:#ffffff12;backdrop-filter:blur(8px);color:var(--cm-text);font-size:var(--fs-small);font-weight:600}
.cm-play-sound:hover{background:#ffffff24;color:#fff}
.cm-play-sound span{color:var(--cm-gold-hi)}
.cm-hero-stage{position:relative;display:grid;place-items:center;min-height:calc(var(--phone-h) + 20px);--phone-h:clamp(420px,calc(100svh - var(--cm-strip) - var(--cm-header) - 80px),640px)}
.cm-phone{position:relative;z-index:2;height:var(--phone-h);aspect-ratio:444/962;border-radius:40px;padding:9px;background:linear-gradient(160deg,#3a335c,#0d0c19 40%,#2a2347);box-shadow:0 0 0 1px #ffffff2e,0 40px 90px #000c,0 0 90px #8c6cff55}
.cm-phone-video{display:block;width:100%;height:100%;object-fit:cover;border-radius:32px;background:#0b0a16}
.cm-video-toggle{position:absolute;right:-14px;bottom:44px;z-index:4;width:40px;height:40px;display:grid;place-items:center;border-radius:50%;border:1px solid #ffffff3d;background:#0b0a16d9;color:#fff;font-size:.8125rem}
.cm-video-toggle span::before{content:"❚❚"}
.cm-video-toggle[aria-pressed="true"] span::before{content:"▶"}
.cm-float-card{position:absolute;z-index:1;width:clamp(92px,8.6vw,138px);border-radius:12px;box-shadow:0 0 0 1px #f7e2ac59,0 22px 44px #000b}
.cm-c1{left:2%;top:4%;transform:rotate(-15deg)}
.cm-c2{left:-2%;top:36%;transform:rotate(-6deg);z-index:3}
.cm-c3{left:5%;top:68%;transform:rotate(-17deg)}
.cm-c4{right:3%;top:2%;transform:rotate(12deg)}
.cm-c5{right:-2%;top:35%;transform:rotate(6deg);z-index:3}
.cm-c6{right:4%;top:67%;transform:rotate(16deg)}
[data-motion="active"] .cm-float-card{animation:cm-float 7s ease-in-out infinite}
[data-motion="active"] .cm-c2,[data-motion="active"] .cm-c5{animation-delay:-2.3s}
[data-motion="active"] .cm-c3,[data-motion="active"] .cm-c6{animation-delay:-4.6s}
@keyframes cm-float{50%{translate:0 -10px}}

/* The fifteen spells under the hero: the hero and this strip share the first screen exactly (--cm-strip).
   With animations on, the strip scrolls; with reduced motion, the fifteen cards stand still, centred. */
.cm-strip{position:relative;display:flex;align-items:center;height:var(--cm-strip);background:linear-gradient(#0b0a17,#05060b);border-top:1px solid #e0bd7526;border-bottom:1px solid #e0bd7526;overflow:hidden}
.cm-strip-viewport{display:flex;width:100%;overflow:hidden;padding-block:8px}
.cm-strip-track{list-style:none;margin:0;padding:0 16px;display:flex;gap:12px;width:max-content;flex:none}
[data-motion="active"] .cm-strip-viewport{mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
[data-motion="active"] .cm-strip-track{animation:cm-marquee 70s linear infinite}
.cm-strip:hover .cm-strip-track,.cm-strip:focus-within .cm-strip-track{animation-play-state:paused}
[data-motion="paused"] .cm-strip-viewport{overflow-x:auto;scrollbar-width:thin}
[data-motion="paused"] .cm-strip-track{margin-inline:auto}
[data-motion="paused"] .cm-strip-track li[aria-hidden="true"]{display:none}
@keyframes cm-marquee{to{transform:translateX(calc(-50% - 6px))}}
.cm-strip a{position:relative;display:block;width:clamp(64px,calc((100vw - 220px)/15),88px);border-radius:10px;overflow:hidden;box-shadow:0 0 0 1px #f7e2ac40;transition:transform .25s,box-shadow .25s}
.cm-strip a:hover,.cm-strip a:focus-visible{transform:translateY(-4px);box-shadow:0 0 0 1px var(--cm-gold-hi),0 0 24px #e0bd7555}
.cm-strip img{width:100%;aspect-ratio:560/820;object-fit:cover}
.cm-strip span{position:absolute;inset:auto 0 0;padding:18px 6px 6px;background:linear-gradient(transparent,#05060bf0);font-size:var(--fs-label);font-weight:600;text-align:center;color:#fff}

/* Sections and bands */
.cm-section{position:relative;padding:clamp(80px,10vw,136px) 0}
.cm-band-violet{background:radial-gradient(90% 70% at 15% 0,#3a2a7a66 0,transparent 60%),radial-gradient(80% 70% at 100% 100%,#1f6f8a40 0,transparent 60%),linear-gradient(#120d27,#0b0918)}
.cm-band-gold{background:radial-gradient(80% 60% at 85% 0,#8a632466 0,transparent 60%),radial-gradient(70% 60% at 0 100%,#5a3a1640 0,transparent 60%),linear-gradient(#17110a,#0c0905)}
.cm-heading{max-width:780px;margin-bottom:clamp(40px,5vw,64px)}
.home main .cm-heading p{margin-top:18px;color:var(--cm-muted)}
.cm-subtitle{margin:clamp(64px,8vw,96px) 0 28px}

/* Manifesto */
.cm-manifesto{padding:clamp(72px,9vw,120px) 0;background:linear-gradient(180deg,var(--cm-black),#0b0a17)}
.cm-manifesto-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(32px,6vw,96px);align-items:center}
.home main .cm-manifesto-story p{color:#ddd8ea}
.cm-manifesto-story p+p{margin-top:16px}
.cm-manifesto-story h2{margin-top:28px;font-size:clamp(2.4rem,4.6vw,4.2rem);line-height:1.04;color:var(--cm-gold-hi)}
.cm-keep-change{display:grid;gap:16px}
.cm-keep,.cm-change{padding:28px 30px;border-radius:var(--cm-radius);border:1px solid var(--cm-line-soft);background:#ffffff08}
.cm-change{border-color:#8c6cff66;background:linear-gradient(135deg,#2a1e5a99,#14102b99);box-shadow:0 0 60px #8c6cff22}
.home .cm-keep h3,.home .cm-change h3{font-size:1.375rem;margin-bottom:12px;color:var(--cm-muted)}
.home .cm-change h3{color:#cbbcff}
.cm-keep ul,.cm-change ul{margin:0;padding:0;list-style:none;display:grid;gap:8px}
.cm-keep li,.cm-change li{padding-left:22px;position:relative}
.cm-keep li::before{content:"";position:absolute;left:0;top:.62em;width:8px;height:8px;border:1px solid var(--cm-muted);transform:rotate(45deg)}
.cm-change li::before{content:"";position:absolute;left:0;top:.6em;width:9px;height:9px;background:var(--cm-violet);transform:rotate(45deg);box-shadow:0 0 12px var(--cm-violet)}

/* Screenshots */
.cm-shot{display:block;border-radius:24px;overflow:hidden;border:1px solid var(--cm-line-soft);box-shadow:0 30px 60px #000a;background:#0b0a16;transition:transform .35s,box-shadow .35s}
.cm-shot img{width:100%;height:auto}
.cm-shot:hover{transform:translateY(-4px);box-shadow:0 36px 70px #000c,0 0 0 1px var(--cm-line)}

/* Steps */
.cm-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,40px)}
.cm-step{width:100%;max-width:300px;margin-inline:auto}
.cm-step-copy{margin-top:26px;position:relative;padding-left:56px}
.cm-step-number{position:absolute;left:0;top:-2px;width:40px;height:40px;display:grid;place-items:center;border-radius:50%;border:1px solid var(--cm-gold);color:var(--cm-gold-hi);font-family:var(--cm-body);font-weight:600;font-size:var(--fs-small)}
.home main .cm-step-copy p{margin-top:10px;color:var(--cm-muted)}
.cm-rule{margin-top:clamp(40px,5vw,64px);padding:22px 28px;border-radius:16px;border:1px solid var(--cm-line);background:linear-gradient(90deg,#e0bd7514,#e0bd7505);text-align:center}
.cm-rule strong{color:var(--cm-gold-hi);font-weight:600}

/* Trailer and real moments */
.cm-trailer-grid{display:grid;grid-template-columns:minmax(0,620px) minmax(260px,360px);justify-content:space-between;gap:clamp(32px,6vw,96px);align-items:center}
.cm-trailer-copy p{margin-top:18px}
.cm-trailer{margin:0}
.cm-trailer-video{display:block;width:100%;height:auto;aspect-ratio:664/1440;max-height:72vh;margin-inline:auto;border-radius:28px;background:#000;box-shadow:0 0 0 1px #ffffff26,0 40px 90px #000c,0 0 80px #8c6cff33}
.cm-trailer figcaption{margin-top:12px;text-align:center;font-size:var(--fs-label);color:var(--cm-muted)}
.cm-moments{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.cm-moment{display:flex;flex-direction:column;height:100%;border-radius:20px;overflow:hidden;border:1px solid var(--cm-line-soft);background:#0d0b1c;transition:transform .35s,border-color .35s}
.cm-moment:hover{transform:translateY(-4px);border-color:var(--cm-line)}
.cm-moment img{aspect-ratio:900/1000;object-fit:cover;object-position:50% 40%}
.cm-moment-copy{display:block;padding:18px 20px 22px;font-size:var(--fs-small);line-height:1.55;color:var(--cm-muted)}
.cm-moment-copy strong{display:block;margin-bottom:6px;font-family:var(--cm-display);font-weight:400;font-size:1.375rem;line-height:1.25;color:var(--cm-text)}

/* Spell grimoire */
.cm-spells{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(12px,1.6vw,22px)}
.cm-spell{position:relative;perspective:900px}
.cm-spell-face{position:relative;display:block;width:100%;padding:0;border:0;background:none;color:inherit;text-align:left;border-radius:16px;transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transform-style:preserve-3d;transition:transform .25s ease-out}
.cm-spell-face img{width:100%;aspect-ratio:560/820;object-fit:cover;border-radius:16px;box-shadow:0 0 0 1px #f7e2ac40,0 20px 40px #000b;transition:box-shadow .3s}
.cm-spell-face::after{content:"";position:absolute;inset:0 0 auto;aspect-ratio:560/820;border-radius:16px;pointer-events:none;background:radial-gradient(circle at var(--gx,50%) var(--gy,0%),#ffffff40,transparent 45%);opacity:0;transition:opacity .3s}
.cm-spell-face:hover::after,.cm-spell-face:focus-visible::after{opacity:1}
.cm-spell-face:hover img,.cm-spell-face:focus-visible img{box-shadow:0 0 0 1px var(--cm-gold-hi),0 26px 50px #000c,0 0 40px #e0bd7540}
.cm-spell-name{display:block;margin-top:14px;font-family:var(--cm-display);font-size:1.375rem;color:var(--cm-text)}
.cm-spell-tag{display:block;margin-top:4px;font-size:var(--fs-small);line-height:1.4;color:var(--cm-muted)}
.cm-spell-badge{position:absolute;top:10px;left:10px;padding:4px 10px;border-radius:999px;background:#0b0a16cc;border:1px solid #72e4ea80;color:var(--cm-cyan);font-size:var(--fs-label);font-weight:600}
.cm-spell-more{margin-top:8px}
.cm-spell-more summary{cursor:pointer;font-size:var(--fs-small);color:var(--cm-gold-hi)}
.js .cm-spell-more{display:none}
.cm-spell-sheet dl,.cm-spell-dialog-sheet dl{margin:14px 0 0;display:grid;gap:12px}
.cm-spell-sheet dt,.cm-spell-dialog-sheet dt{font-size:var(--fs-label);font-weight:700;color:var(--cm-gold-hi)}
.cm-spell-sheet dd,.cm-spell-dialog-sheet dd{margin:2px 0 0}
.home main .cm-spell-hook{color:var(--cm-gold-hi)}
.home main .cm-spells-note{margin-top:32px;color:var(--cm-muted)}
.cm-season{margin-top:clamp(48px,6vw,80px);display:grid;grid-template-columns:auto 1fr;gap:clamp(28px,5vw,64px);align-items:center;padding:clamp(28px,4vw,44px);border-radius:28px;border:1px solid #8c6cff55;background:radial-gradient(80% 120% at 0 50%,#3a2a7a88,transparent 70%),#0e0b1f}
.cm-season-cards{list-style:none;margin:0;padding:0 0 0 20px;display:flex}
.cm-season-cards li{width:clamp(80px,9vw,118px);aspect-ratio:2/3;margin-left:-20px;border-radius:12px;border:1px solid #e0bd7599;background:url(/assets/emblem.webp) center/56% no-repeat,repeating-linear-gradient(45deg,#ffffff08 0 6px,transparent 6px 12px),linear-gradient(160deg,#3b2b7c,#140f2c);box-shadow:0 18px 36px #000a,inset 0 0 30px #8c6cff55;transform:rotate(calc(var(--i,0)*7deg - 7deg))}
.cm-season-cards li:nth-child(1){--i:0}.cm-season-cards li:nth-child(2){--i:1;transform:translateY(-10px) rotate(0deg)}.cm-season-cards li:nth-child(3){--i:2}
.home main .cm-season-copy p{margin-top:12px;color:#ddd6f3}
[data-motion="active"] .cm-season-cards li{animation:cm-glow 4s ease-in-out infinite}
[data-motion="active"] .cm-season-cards li:nth-child(2){animation-delay:-1.3s}
[data-motion="active"] .cm-season-cards li:nth-child(3){animation-delay:-2.6s}
@keyframes cm-glow{50%{box-shadow:0 18px 36px #000a,inset 0 0 44px #b49bff99,0 0 30px #8c6cff55}}

/* Spell dialog */
.cm-spell-dialog{width:min(920px,calc(100% - 24px));max-height:calc(100dvh - 24px);padding:0;border:1px solid var(--cm-line);border-radius:26px;background:linear-gradient(160deg,#1b1538,#0b0a16);color:var(--cm-text);box-shadow:0 40px 120px #000}
.cm-spell-dialog::backdrop{background:#03030acc;backdrop-filter:blur(8px)}
.cm-spell-dialog-body{display:grid;grid-template-columns:minmax(0,320px) 1fr;gap:clamp(20px,3vw,40px);padding:clamp(22px,3vw,40px);overflow:auto;max-height:calc(100dvh - 120px)}
.cm-spell-dialog-art{width:100%;border-radius:18px;box-shadow:0 0 0 1px #f7e2ac59,0 24px 50px #000b}
.home .cm-spell-dialog h3{font-size:clamp(1.8rem,3vw,2.4rem)}
.home .cm-spell-dialog p,.home .cm-spell-dialog dd{font-family:var(--cm-body);font-size:var(--fs-small);line-height:1.6;color:#e7e2f2}
.home .cm-spell-dialog .cm-spell-dialog-tag{margin-top:6px;color:var(--cm-cyan)}
.cm-spell-dialog-sheet .cm-spell-hook{margin-top:16px}
.home .cm-spell-dialog .cm-spell-dialog-rule{margin-top:20px;padding-top:16px;border-top:1px solid var(--cm-line-soft);color:var(--cm-muted)}
.cm-dialog-close{position:absolute;top:12px;right:12px;width:44px;height:44px;border-radius:50%;border:1px solid var(--cm-line);background:#0b0a16cc;color:var(--cm-gold-hi);font-size:1.6rem;line-height:1}
.cm-dialog-nav{display:flex;align-items:center;justify-content:center;gap:20px;padding:0 0 22px}
.cm-dialog-nav button{width:44px;height:44px;border-radius:50%;border:1px solid var(--cm-line);background:transparent;color:var(--cm-gold-hi);font-size:1.25rem}
.cm-dialog-count{font-size:var(--fs-small);color:var(--cm-muted)}

/* Decks */
.cm-decks{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.4vw,32px)}
.cm-deck{padding:28px 26px 30px;border-radius:var(--cm-radius);border:1px solid var(--cm-line);background:linear-gradient(170deg,#ffffff0d,#ffffff03)}
.cm-deck-cards{list-style:none;margin:0 0 26px;padding:10px 0 0;display:flex;justify-content:center}
.cm-deck-cards li{width:22%;margin-inline:-2.5%;transform:rotate(calc((var(--n) - 2)*7deg)) translateY(calc(var(--d)*6px));transform-origin:50% 120%;transition:transform .35s}
.cm-deck-cards li:nth-child(1){--n:0;--d:2}.cm-deck-cards li:nth-child(2){--n:1;--d:.5}.cm-deck-cards li:nth-child(3){--n:2;--d:0}.cm-deck-cards li:nth-child(4){--n:3;--d:.5}.cm-deck-cards li:nth-child(5){--n:4;--d:2}
.cm-deck:hover .cm-deck-cards li{transform:rotate(calc((var(--n) - 2)*11deg)) translateY(calc(var(--d)*8px - 6px))}
.cm-deck-cards img{width:100%;aspect-ratio:560/820;object-fit:cover;border-radius:8px;box-shadow:0 0 0 1px #f7e2ac59,0 10px 22px #000b}
.home .cm-deck h3{color:var(--cm-gold-hi)}
.home main .cm-deck p{margin-top:10px;color:var(--cm-muted)}
.home main .cm-decks-note{margin-top:36px;max-width:760px;color:#efe4c6}

/* Arenas: the board is a real 3D plane the visitor can turn */
.cm-arena-layout{display:grid;grid-template-columns:1fr;gap:clamp(28px,4vw,48px)}
.cm-arena-layout>*,.cm-pieces-grid>*,.cm-online-grid>*,.cm-trailer-grid>*,.cm-faq-grid>*,.cm-fair-grid>*,.cm-manifesto-grid>*,.cm-hero-inner>*{min-width:0}
.cm-arena-stage{margin:0;perspective:1500px;padding-top:12px}
.cm-arena-plane{position:relative;width:min(78%,600px);margin:-4% auto 0;aspect-ratio:1;transform:rotateX(52deg) rotateZ(var(--spin,-18deg));transform-style:preserve-3d;cursor:grab;touch-action:pan-y;border-radius:12px;box-shadow:0 60px 80px #000c}
.cm-arena-plane.is-dragging{cursor:grabbing}
.cm-arena-art{width:100%;height:100%;border-radius:12px;user-select:none;-webkit-user-drag:none}
.cm-arena-board{position:absolute;inset:25%;border-radius:2px;background:repeating-conic-gradient(#efe4cd 0 25%,#46516a 0 50%) 0 0/25% 25%;box-shadow:0 0 0 3px #2b2418,0 0 0 5px #c9a45c,0 10px 30px #000a}
.cm-arena-board::after{content:"";position:absolute;width:12.5%;height:12.5%;left:62.5%;top:37.5%;background:#72e4ea66;box-shadow:0 0 24px 6px #72e4eaaa}
[data-motion="active"] .cm-arena-board::after{animation:cm-pulse 2.6s ease-in-out infinite}
@keyframes cm-pulse{50%{opacity:.35}}
.cm-arena-stage figcaption{position:relative;z-index:2;margin-top:0;text-align:center}
.cm-arena-name{display:block;font-family:var(--cm-display);font-weight:400;font-size:1.375rem;color:var(--cm-gold-hi)}
.cm-arena-hint{display:block;margin-top:6px;font-size:var(--fs-small);color:var(--cm-muted)}
.cm-arena-picks{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(7,1fr);gap:12px}
.cm-arena-pick{position:relative;display:block;width:100%;padding:0;border:1px solid var(--cm-line-soft);border-radius:12px;overflow:hidden;background:#0d0b1c;color:var(--cm-text);text-align:left;transition:border-color .2s,transform .2s}
.cm-arena-pick img{width:100%;aspect-ratio:1;object-fit:cover}
.cm-arena-pick span{position:absolute;inset:auto 0 0;padding:16px 6px 5px;background:linear-gradient(transparent,#05060be6);font-size:var(--fs-label);line-height:1.2}
.cm-arena-pick[data-free]::after{content:"★";position:absolute;top:5px;right:6px;width:24px;height:24px;display:grid;place-items:center;border-radius:50%;background:#0b0a16cc;color:var(--cm-gold-hi);font-size:var(--fs-label)}
.cm-arena-pick:hover{transform:translateY(-2px);border-color:var(--cm-line)}
.cm-arena-pick[aria-pressed="true"]{border-color:var(--cm-gold-hi);box-shadow:0 0 0 1px var(--cm-gold-hi),0 0 24px #e0bd7555}
.home main .cm-arena-note{margin-top:18px;color:var(--cm-muted);text-align:center}

/* Pieces */
.cm-pieces-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,.55fr);gap:clamp(32px,5vw,72px);align-items:center}
.home main .cm-pieces-copy>p{margin-top:18px;max-width:720px;color:var(--cm-muted)}
.cm-families{list-style:none;margin:36px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.home main .cm-families li{padding:14px 16px 18px;border-radius:18px;border:1px solid var(--cm-line-soft);background:radial-gradient(90% 70% at 50% 0,#8c6cff26,transparent 70%),#ffffff06;color:var(--cm-muted);font-size:var(--fs-small);line-height:1.5;transition:border-color .3s,transform .3s}
.cm-families li:hover{border-color:var(--cm-line);transform:translateY(-3px)}
.cm-families img{width:100%;height:auto;aspect-ratio:2/1;object-fit:contain;filter:drop-shadow(0 12px 14px #000a)}
.cm-families strong{display:block;margin-top:8px;font-family:var(--cm-display);font-weight:400;font-size:1.375rem;color:var(--cm-text)}
.cm-pieces-shots .cm-shot{max-width:300px;margin-inline:auto}

/* Online */
.cm-online-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,72px);align-items:center}
.cm-online-shots{display:flex;justify-content:center;align-items:flex-start;gap:clamp(12px,2vw,24px)}
.cm-online-shots .cm-shot{width:min(48%,270px)}
.cm-features{list-style:none;margin:32px 0 18px;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:26px 30px}
.home .cm-features h3{color:var(--cm-gold-hi)}
.home main .cm-features p{margin-top:8px;color:var(--cm-muted);font-size:var(--fs-small)}

/* Solo */
.cm-modes{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.home main .cm-modes li{padding:26px 24px;border-radius:var(--cm-radius);border:1px solid var(--cm-line);background:#ffffff08}
.home main .cm-modes p{margin-top:10px;color:var(--cm-muted);font-size:var(--fs-small)}

/* Letter to purists */
.cm-letter-section{background:radial-gradient(60% 80% at 50% 0,#2a210f99,transparent 70%),var(--cm-black)}
.cm-letter{max-width:760px;margin-inline:auto;padding:clamp(32px,5vw,64px);border-radius:6px;border:1px solid var(--cm-line);background:linear-gradient(170deg,#1a150c,#0e0b07);box-shadow:0 40px 80px #000a}
.home .cm-letter h2{color:var(--cm-gold-hi);margin-bottom:24px}
.home main .cm-letter p{color:#eadfc6}
.cm-letter p+p{margin-top:16px}
.home main .cm-letter-sign{margin-top:28px;color:var(--cm-gold)}

/* Fairness */
.cm-fair-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,88px);align-items:start}
.cm-fair-copy p+p{margin-top:16px}

/* FAQ */
.cm-faq-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(32px,6vw,88px);align-items:start}
.cm-faq details{border-top:1px solid var(--cm-line-soft)}
.cm-faq details:last-child{border-bottom:1px solid var(--cm-line-soft)}
.cm-faq summary{display:flex;justify-content:space-between;gap:20px;padding:22px 0;cursor:pointer;list-style:none;font-family:var(--cm-display);font-size:1.375rem;line-height:1.3;color:var(--cm-text)}
.cm-faq summary::-webkit-details-marker{display:none}
.cm-faq summary::after{content:"+";font-family:var(--cm-body);color:var(--cm-gold);font-size:1.5rem;line-height:1;transition:transform .25s}
.cm-faq details[open] summary::after{transform:rotate(45deg)}
.home main .cm-faq details p{padding:0 0 22px;color:var(--cm-muted)}
.cm-faq a{color:var(--cm-gold-hi);text-decoration:underline;text-underline-offset:3px}

/* Final call to action: the app home screen, its crown emblem above the wordmark, then the store badges. */
.cm-finale{position:relative;overflow:hidden;isolation:isolate;padding:clamp(400px,38vw,540px) 0 clamp(72px,9vw,120px);text-align:center;background:#120c26 url(/assets/finale-home-crown.webp) 50% 0/auto clamp(860px,78vw,1180px) no-repeat}
.cm-finale::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#120c2600 30%,#120c26b3 60%,#120c26 92%),linear-gradient(180deg,var(--cm-black) 0,#05060b00 12%)}
.cm-finale-inner{display:grid;justify-items:center}
.cm-finale-wordmark{width:min(440px,80vw);height:auto;margin-bottom:28px;filter:drop-shadow(0 4px 24px #000c)}
.home main .cm-poem{color:#e9dcc0}
.cm-finale h2{margin-top:30px;max-width:18ch;font-size:clamp(2.2rem,4.4vw,3.8rem)}
.cm-finale .cm-stores{justify-content:center}
.cm-contact{padding:clamp(56px,7vw,88px) 0;border-top:1px solid var(--cm-line);background:var(--cm-ink)}
.cm-contact-inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:28px}
.cm-contact h2{font-size:clamp(1.6rem,2.6vw,2.3rem)}
.home main .cm-contact p{margin-top:10px;color:var(--cm-muted)}
.cm-contact-actions{display:flex;flex-wrap:wrap;align-items:center;gap:24px}
.cm-contact-actions .text-link{margin-top:0;font-size:var(--fs-small)}
.home .site-footer{width:min(var(--cm-wrap),calc(100% - 2*var(--cm-gutter)))}
.home .site-footer p,.home .site-footer nav{font-size:var(--fs-label)}
.home .site-footer .cm-footer-motion{display:inline-flex;align-items:center;justify-content:center;width:auto;height:auto;min-width:0;min-height:44px;padding:8px 18px;border-radius:999px;border:1px solid #ffffff2e;background:#ffffff0d;color:var(--cm-muted);font-family:var(--cm-body);font-size:var(--fs-label)}
.cm-footer-motion:hover{color:#fff}

/* Responsive */
@media (max-width:1100px){
  .cm-spells{grid-template-columns:repeat(4,1fr)}
  .cm-moments{grid-template-columns:repeat(2,1fr)}
  .cm-modes{grid-template-columns:repeat(2,1fr)}
  .cm-arena-layout,.cm-pieces-grid,.cm-online-grid,.cm-fair-grid,.cm-faq-grid,.cm-manifesto-grid{grid-template-columns:1fr}
  .cm-online-shots{order:2}
}
@media (max-width:960px){
  .cm-hero{min-height:0}
  .cm-hero-inner{grid-template-columns:1fr;justify-items:center;text-align:center}
  .cm-hero-copy{display:grid;justify-items:center}
  .cm-hero::after{background:radial-gradient(70% 40% at 50% 24%,#05060bc2 0,#05060b80 60%,#05060b33 100%),linear-gradient(0deg,#05060bcc 0,#05060b00 18%)}
  .cm-proof{flex-direction:column;align-items:center;gap:0}
  .cm-proof-list{text-align:center}
  .cm-stores{justify-content:center}
  .cm-hero-stage{width:min(100%,560px);--phone-h:min(520px,110vw)}
}
@media (max-width:820px){
  .cm-steps,.cm-decks{grid-template-columns:1fr;max-width:520px;margin-inline:auto}
  .cm-step{display:grid;grid-template-columns:150px 1fr;gap:20px;align-items:center;max-width:none}
  .cm-step-copy{margin-top:0}
  .cm-spells{grid-template-columns:repeat(3,1fr)}
  .cm-trailer-grid{grid-template-columns:1fr}
  .cm-trailer{max-width:340px;margin-inline:auto}
  .cm-season{grid-template-columns:1fr;justify-items:center;text-align:center}
  .cm-features{grid-template-columns:1fr}
  .cm-spell-dialog-body{grid-template-columns:1fr}
  .cm-spell-dialog-art{max-width:220px;margin-inline:auto}
}
@media (max-width:560px){
  :root{--cm-header:68px}
  .home .site-header{padding-inline:14px;gap:10px}
  .home .site-header .brand img{width:132px}
  .home .header-actions{gap:8px}
  .cm-header-cta{display:none}
  .cm-hero h1{font-size:clamp(2.3rem,10.5vw,3rem)}
  .cm-hero-backdrop img{object-position:50% 30%}
  .cm-hero-stage{--phone-h:min(460px,118vw)}
  .cm-float-card{width:78px}
  .cm-c1,.cm-c4{top:6%}
  .cm-c3,.cm-c6{top:66%}
  .cm-video-toggle{right:-8px}
  .cm-store img{height:48px}
  .cm-strip a{width:88px}
  .cm-step{grid-template-columns:110px 1fr;gap:16px}
  .cm-step-copy{padding-left:0}
  .cm-step-number{position:static;margin-bottom:10px;width:34px;height:34px}
  .cm-spells{grid-template-columns:repeat(2,1fr)}
  .cm-moments{grid-template-columns:1fr}
  .cm-moment{display:grid;grid-template-columns:120px 1fr}
  .cm-moment img{height:100%;aspect-ratio:auto}
  .cm-moment-copy{padding:14px 16px}
  .cm-modes{grid-template-columns:1fr}
  .cm-families{grid-template-columns:1fr 1fr;gap:10px}
  .home main .cm-families li{padding:10px 10px 14px}
  .cm-families strong{font-size:1.125rem}
  .cm-arena-picks{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px}
  .cm-arena-picks li{flex:0 0 96px;scroll-snap-align:start}
  .cm-online-shots{gap:12px}
  .cm-contact-inner{flex-direction:column;align-items:flex-start}
}
@media (prefers-reduced-motion:reduce){
  .cm-proof-item,.cm-spell-face,.cm-shot,.cm-moment,.cm-deck-cards li,.cm-strip a{transition:none}
}

/* Rules page (/regles/): same header, type and gold accents as the homepage; one centred column for text, the 1200 px container for grids. */
.cm-rules-page main{background:var(--cm-black)}
.cm-rules-hero{padding:calc(var(--cm-header) + clamp(44px,5vw,72px)) 0 clamp(40px,4vw,56px);text-align:center;background:radial-gradient(ellipse 60% 80% at 50% 0,#8c6cff2e,#8c6cff00 70%),linear-gradient(180deg,#120c26,var(--cm-black))}
.cm-rules-hero-inner{display:grid;justify-items:center}
.cm-breadcrumb{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;font-size:var(--fs-small);color:var(--cm-muted)}
.cm-breadcrumb a{color:var(--cm-gold-hi);text-decoration:none}
.cm-breadcrumb a:hover{text-decoration:underline}
.cm-rules-hero h1{margin-top:20px;font-size:clamp(2.4rem,4.6vw,4.2rem);line-height:1.06}
.home main .cm-rules-lead{max-width:780px;margin-top:22px;font-size:1.25rem;color:var(--cm-text)}
.home main .cm-rules-updated{margin-top:14px;font-size:var(--fs-small);color:var(--cm-muted)}
.cm-rules-toc{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:30px}
.cm-rules-toc a{min-height:44px;display:inline-flex;align-items:center;padding:8px 18px;border-radius:999px;border:1px solid var(--cm-line);background:#ffffff0a;color:var(--cm-text);font-size:var(--fs-small);text-decoration:none;transition:border-color .2s,color .2s}
.cm-rules-toc a:hover,.cm-rules-toc a:focus-visible{border-color:var(--cm-gold);color:var(--cm-gold-hi)}
.cm-rules-section{padding:clamp(48px,5.5vw,80px) 0;scroll-margin-top:var(--cm-header)}
.cm-rules-section+.cm-rules-section{border-top:1px solid var(--cm-line-soft)}
.cm-rules-section:nth-of-type(odd){background:linear-gradient(180deg,#0d0f1c,var(--cm-black))}
.cm-rules-prose{max-width:860px;margin-inline:auto}
.cm-rules-prose h2{font-size:clamp(1.9rem,3vw,2.7rem)}
.home main .cm-rules-prose p{margin-top:18px}
.cm-rules-prose .text-link{margin-top:6px;font-size:var(--fs-small)}
.cm-rules-prose .cm-rule{margin-top:28px}
.cm-rules-steps{counter-reset:rule-step;display:grid;gap:20px;margin:28px 0 0;padding:0;list-style:none}
.home main .cm-rules-steps li{position:relative;padding-left:60px;counter-increment:rule-step}
.cm-rules-steps li::before{content:counter(rule-step);position:absolute;left:0;top:-4px;width:40px;height:40px;display:grid;place-items:center;border-radius:50%;border:1px solid var(--cm-gold);color:var(--cm-gold-hi);font-weight:600;font-size:var(--fs-small)}
.cm-rules-steps strong{color:var(--cm-gold-hi);font-weight:600}
.cm-rule-spells{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin:44px 0 0;padding:0;list-style:none}
.cm-rule-spell{display:grid;grid-template-columns:96px minmax(0,1fr);gap:4px 18px;align-items:start;padding:22px;border-radius:var(--cm-radius);border:1px solid var(--cm-line-soft);background:linear-gradient(160deg,#ffffff0d,#ffffff04);scroll-margin-top:calc(var(--cm-header) + 16px)}
.cm-rule-spell img{width:96px;height:auto;border-radius:10px;box-shadow:0 10px 30px #000a}
.cm-rule-spell h3{font-size:1.6rem;line-height:1.15}
.home main .cm-rule-spell-tag{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:6px;font-size:var(--fs-small);color:var(--cm-muted)}
.cm-rule-spell-free{padding:3px 12px;border-radius:999px;border:1px solid #72e4ea80;color:var(--cm-cyan);font-size:var(--fs-label);font-weight:600}
.home main .cm-rule-spell .cm-spell-hook{margin-top:12px}
.cm-rule-spell dl{grid-column:1/-1;display:grid;gap:12px;margin:14px 0 0;padding-top:16px;border-top:1px solid var(--cm-line-soft)}
.cm-rule-spell dt{font-size:var(--fs-label);font-weight:700;color:var(--cm-gold-hi)}
.cm-rule-spell dd{margin:2px 0 0}
.cm-rules-modes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:40px 0 0;padding:0;list-style:none}
.cm-rules-modes li{padding:24px 26px;border-radius:18px;border:1px solid var(--cm-line-soft);background:#ffffff08}
.cm-rules-modes h3{font-size:1.375rem;line-height:1.25}
.home main .cm-rules-modes p{margin-top:10px;color:var(--cm-muted)}
.cm-rules-page .cm-finale{padding-top:clamp(360px,34vw,500px)}
.cm-rules-cta{margin-top:28px;text-align:center}
.cm-rules-cta .text-link{margin-top:0;font-size:var(--fs-small)}
@media (max-width:960px){
  .cm-rule-spells{grid-template-columns:minmax(0,1fr)}
  .cm-rules-modes{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:560px){
  .cm-rules-hero{text-align:left}
  .cm-rules-hero-inner{justify-items:start}
  .cm-breadcrumb,.cm-rules-toc{justify-content:flex-start}
  .home main .cm-rules-lead{font-size:var(--fs-body)}
  .cm-rule-spells{grid-template-columns:minmax(0,1fr)}
  .cm-rule-spell{grid-template-columns:84px minmax(0,1fr);gap:4px 16px;padding:18px}
  .cm-rule-spell img{width:84px}
  .cm-rule-spell h3{font-size:1.45rem}
  .cm-rules-modes{grid-template-columns:minmax(0,1fr)}
  .home main .cm-rules-steps li{padding-left:54px}
}
@media (prefers-reduced-motion:reduce){
  .cm-rules-toc a{transition:none}
}