/* Larger typography and a luminous, full-artwork presentation. */
:root{--sans:'Segoe UI Variable','Segoe UI',Arial,sans-serif;--serif:var(--sans);--text:#f3f1ff;--muted:#c1bdd8;--gold:#e8c995;--line:rgba(178,135,255,.3);--violet:#b47cff;--cyan:#76e4ed}
body{font-size:18px;line-height:1.7}
.page-shell{max-width:1500px;padding:0 64px}
.site-header{min-height:112px;gap:28px}
.brand{font-family:var(--sans);font-weight:650;font-size:23px;letter-spacing:3px}
.brand small{font-size:11px;letter-spacing:2.4px}.brand-symbol{color:#c7a0ff;text-shadow:0 0 24px #a162ff}
nav{font-size:16px;gap:30px;color:#dfd9f3}.sound-button{font-size:14px;padding:10px 17px;background:#17152e99;border-color:#a883d466}
.hero{min-height:650px;padding:90px 0 100px;grid-template-columns:1.25fr 1fr;gap:45px}
.hero h1{font:600 clamp(42px,4.6vw,72px)/1.09 var(--sans);letter-spacing:-2.8px;max-width:800px}
h1 em,h2 em{font-style:normal;color:#c5a0ff;text-shadow:0 0 38px #9359ff66}
.hero-description{font-size:19px;line-height:1.8;max-width:560px;margin-top:30px}
.eyebrow{font-size:13px;letter-spacing:2.5px;color:#c9aaff}
.hero-note{font-size:14px;margin-top:22px;max-width:520px;color:#bcb4d1}
.primary-button{background:linear-gradient(110deg,#a981ff,#d0aeff 56%,#9af1ec);color:#111126;font-size:17px;padding:17px 28px;border-radius:12px;box-shadow:0 0 26px #9257ef55,inset 0 1px 0 #ffffff88;gap:38px}
.primary-button:hover{background:linear-gradient(110deg,#bc99ff,#e0caff,#adfff4);box-shadow:0 0 45px #a77bff77;transform:translateY(-3px)}
.hero-art{height:430px;transform:none}.hero-card-left,.hero-card-right{width:190px;height:285px;object-fit:contain;background:#090d1c}.hero-card-left{transform:translateX(-115px) rotate(-17deg)}.hero-card-right{transform:translateX(115px) rotate(17deg)}
.hero-card-center{width:208px;height:312px;display:flex;flex-direction:column;justify-content:space-evenly;align-items:center;overflow:hidden;background:radial-gradient(ellipse at 50% 0%,#39314a,transparent 45%),radial-gradient(ellipse at 50% 100%,#302a42,transparent 45%),#080d20;box-shadow:0 0 45px #b077ff66,0 25px 70px #0009}
.orbit{width:370px;height:370px;border-color:#af7cff55;box-shadow:0 0 24px #8352d722,inset 0 0 24px #8352d722}.orbit-two{width:320px;height:320px;border-color:#68dce955}.art-star{color:#a5ebff;text-shadow:0 0 20px #64ccff}.art-caption{font-size:11px;letter-spacing:2px;bottom:-6px;color:#c4b5d8;text-align:center}
.section-heading{margin-bottom:38px;align-items:center}.section-heading>p{font-size:16px;max-width:290px}.section-heading h2,.modes-section h2,.guide h2{font:600 clamp(28px,2.8vw,42px)/1.2 var(--sans);letter-spacing:-1px}
.modes-section{padding:35px 0 90px}.mode-grid{gap:30px;align-items:stretch}
.mode-card{--glow:166,108,255;position:relative;border:1px solid rgba(var(--glow),.65);border-radius:23px;background:linear-gradient(145deg,#211936ee,#101524f5);box-shadow:0 0 22px rgba(var(--glow),.16),inset 0 0 25px rgba(var(--glow),.06);overflow:hidden;display:flex;flex-direction:column;isolation:isolate;transition:transform .35s,border-color .35s,box-shadow .35s}
.mode-card:nth-child(2){--glow:82,222,224;background:linear-gradient(145deg,#112d36ee,#101524f5)}.mode-card:nth-child(3){--glow:234,107,232;background:linear-gradient(145deg,#2b1939ee,#101524f5)}
.mode-card::after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(380px circle at var(--pointer-x,50%) var(--pointer-y,0%),rgba(var(--glow),.14),transparent 65%);z-index:-1}
.mode-card:hover,.mode-card:focus-visible{transform:translateY(-7px);border-color:rgb(var(--glow));box-shadow:0 0 34px rgba(var(--glow),.35),0 20px 48px #0005,inset 0 0 22px rgba(var(--glow),.09)}
.mode-card[aria-pressed=true]{border-color:rgb(var(--glow));box-shadow:0 0 0 1px rgb(var(--glow)),0 0 42px rgba(var(--glow),.4)}
.mode-card>img{width:100%;height:auto;aspect-ratio:1/1;object-fit:contain;object-position:center;display:block;opacity:1;background:#0c1020}
.mode-copy{padding:27px;gap:0}.mode-title{font:600 27px/1.25 var(--sans);letter-spacing:-.7px;margin-bottom:16px}.mode-description{font-size:17px;line-height:1.75;color:#ccc8dc}.mode-meta{font-size:15px;margin-bottom:19px;color:rgb(var(--glow))}.mode-meta>span{font-size:11px;letter-spacing:1px;color:#d4cde4}.mode-link{font-size:15px;color:rgb(var(--glow));margin-top:26px;padding-top:20px;border-color:rgba(var(--glow),.3)}
.deck-note{font-size:15px;color:#c6bdd8;margin-top:35px}
.guide,.about{position:relative;padding:48px;border:1px solid #a67ee03d;background:linear-gradient(130deg,#17172ddd,#0e1529e8);box-shadow:0 0 30px #ac71ff12,inset 0 1px 0 #dac5ff12;border-radius:24px;margin-bottom:60px}
.guide-grid{gap:32px}.guide h3{font:600 25px/1.3 var(--sans)}.guide p:not(.eyebrow){font-size:17px;max-width:none}.guide-grid article{padding-left:23px;border-color:#b686ff77}.step-number{font:500 26px/1.2 var(--sans);color:#bb94ff;text-shadow:0 0 20px #a662ff55}
.about{gap:55px}.about h2{font:600 38px/1.2 var(--sans);letter-spacing:-1px}.about p:not(.eyebrow){font-size:17px;line-height:1.8}.about summary{font-size:17px}.about details{padding:23px 0}.section-star{color:#b287ef;text-shadow:0 0 25px #9a58ff}
.spread{padding:54px 0 75px}.spread>p,.spread-toolbar p{font-size:17px}.spread h2{font-weight:600}.text-button,.secondary-button{font-size:16px}.secondary-button{padding:12px 19px;border-color:#aa7de45e;background:#1b1730}.secondary-button:hover:not(:disabled){border-color:#b78bf8;box-shadow:0 0 20px #a05bea33}.spread-toolbar{margin:30px 0}.position-label{font-size:15px;line-height:1.5;min-height:52px}.card-cover{background-size:contain;background-repeat:no-repeat;background-color:#0b1020}.card-cover>span{font-size:14px}.card-inner{border-radius:14px}.card-face{box-shadow:0 0 24px #9d6ae733,0 15px 30px #0005}
.reading{padding:30px;border-color:#b281ed4d;box-shadow:0 0 25px #9252d918;background:#16182bef}.reading-position{font-size:13px}.reading h3{font-size:29px;font-weight:600}.reading p{font-size:18px}.reading .reflection{font-size:16px}.spread .reading-note{font-size:15px}.description-button{font-size:16px}
footer{padding:35px 0 45px}footer .brand{font-size:19px}footer .brand small{font-size:10px}footer p,footer>a:last-child{font-size:14px}
dialog{border-color:#c092ff88;box-shadow:0 0 65px #995dff33;background:#121528}.dialog-inner h2{font-size:28px;font-weight:600}.dialog-inner p{font-size:13px}.dialog-inner #original-image-link{font-size:14px}.card-side-switch [aria-pressed=true]{background:#39224e;color:#ead9ff;border-color:#c492ff}
.mage-shade{background:linear-gradient(90deg,#080e20ef,rgba(8,14,32,.55) 48%,rgba(8,14,32,.25) 76%,#080e2066),linear-gradient(0deg,#080e20b8,transparent 80%)}
.cosmic-lines{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;opacity:.5}.cosmic-lines svg{position:absolute;width:100%;height:125%;inset:-12% 0;transform:translate3d(0,var(--cosmic-y,0px),0) rotate(var(--cosmic-angle,0deg));transform-origin:65% 50%}.cosmic-lines path{fill:none;stroke:#a777fa;stroke-width:.8;stroke-dasharray:7 15;opacity:.32}.cosmic-lines circle{fill:#d2b5ff;filter:drop-shadow(0 0 4px #ac6cff)}.cosmic-lines .cyan-line{stroke:#77e8ec;stroke-dasharray:0;opacity:.22}
.reveal-pending{opacity:.18;transform:translateY(35px)}.reveal-ready{transition:opacity .8s ease,transform .8s cubic-bezier(.2,.65,.2,1)}.reveal-ready.is-revealed{opacity:1;transform:translateY(0)}
@media(min-width:1700px){.page-shell{max-width:1580px}.hero h1{font-size:78px}.hero{min-height:740px}.hero-art{transform:scale(1.12)}}
@media(max-width:1100px){.page-shell{padding:0 32px}.hero{grid-template-columns:1.3fr 1fr;gap:20px;min-height:580px}.hero h1{font-size:52px}.hero-art{transform:scale(.85);height:370px}.mode-grid{gap:20px}.mode-copy{padding:21px}.mode-title{font-size:24px}.mode-description{font-size:16px}.mode-meta{gap:8px}.mode-meta>span{font-size:10px}.guide,.about{padding:35px}.site-header{gap:18px}nav{gap:18px;font-size:14px}.brand{font-size:19px}.sound-button{font-size:12px}.about{gap:30px}}
@media(max-width:900px){.page-shell{padding:0 22px}.site-header{padding:20px 0;gap:16px}.brand{font-size:19px}.brand small{font-size:9px}.sound-button{font-size:12px;padding:8px 11px}nav{font-size:15px;gap:20px}.hero{grid-template-columns:1fr;padding:50px 0 60px;gap:25px;min-height:0}.hero h1{font-size:clamp(38px,8.9vw,60px);letter-spacing:-1.7px}.hero-description{font-size:18px;max-width:580px}.hero-note{font-size:13px}.hero-art{height:365px;transform:scale(.88);margin:5px 0 0}.art-caption{bottom:-5px;font-size:10px}.eyebrow{font-size:12px}.mode-grid{grid-template-columns:1fr;gap:30px;max-width:510px;margin:auto}.mode-card{display:flex;grid-template-columns:none}.mode-card>img{height:auto;width:100%;aspect-ratio:1;object-fit:contain}.mode-copy{padding:26px}.mode-title{font-size:28px}.mode-description{font-size:18px}.mode-meta>span{font-size:11px}.mode-link{font-size:16px}.modes-section{padding:20px 0 55px}.section-heading h2,.modes-section h2,.guide h2{font-size:31px}.deck-note{font-size:14px}.guide,.about{padding:28px 24px;margin-bottom:35px}.guide-grid{gap:32px}.guide h3{font-size:24px}.guide p:not(.eyebrow){font-size:17px}.about h2{font-size:32px}.about p:not(.eyebrow),.about summary{font-size:17px}.about{grid-template-columns:1fr;gap:22px}.section-star{font-size:36px}.cards-layout{gap:22px}.position-label{font-size:14px;min-height:62px}.spread-toolbar>div{gap:10px}.secondary-button{font-size:14px;padding:11px 14px}.reading{padding:24px}.reading p{font-size:17px}.reading .reflection{font-size:16px}.spread .reading-note{font-size:14px}.card-cover>span{font-size:12px}.mage-portrait{background-position:58% center}.cosmic-lines{opacity:.35}}
@media(max-width:420px){.page-shell{padding:0 18px}.brand{font-size:17px;letter-spacing:2px}.brand small{font-size:8px}.hero-art{transform:scale(.72);height:320px;margin:0 -10px}.hero h1{font-size:38px}.hero-description{font-size:17px}.mode-copy{padding:23px}.mode-title{font-size:26px}.mode-meta>span{font-size:10px}.mode-description{font-size:17px}.section-heading h2,.modes-section h2{font-size:29px}.guide,.about{padding:25px 20px}.art-caption{font-size:11px}.eyebrow{letter-spacing:1.5px}.sound-button{font-size:11px}nav{gap:17px;font-size:14px}}
@media(prefers-reduced-motion:reduce){.reveal-pending{opacity:1;transform:none}.cosmic-lines svg{transform:none!important}.mode-card:hover{transform:none}}

/* The frame follows the artwork: square cards are square, portrait cards keep their native ratio. */
.card-button{aspect-ratio:1 / 1;border-radius:14px}
.card-face,.card-inner{border-radius:14px}
.card-cover{background-size:cover;background-repeat:no-repeat;background-position:center}
.card-front img{object-fit:contain}

@media(max-width:360px){.hero-art{transform:scale(.59);height:285px}.primary-button{padding:16px 20px;gap:22px;font-size:16px}}

@media(min-width:761px) and (max-width:900px){.site-header{flex-wrap:wrap}nav{order:3;width:100%;justify-content:center;padding-top:14px;border-top:1px solid var(--line)}.guide-grid{grid-template-columns:1fr}.section-heading>p{display:none}}



.hero-card-center>img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain;flex:none}.card-ornament{display:block;color:#dec18a;font-size:17px;letter-spacing:7px;line-height:1;text-align:center;padding-left:7px;text-shadow:0 0 14px #d9ae5955}.hero-card-center::after{content:'';position:absolute;inset:5px;border:1px solid #b39a5c66;border-radius:7px;pointer-events:none}