/* Illustrated deck and reading experience. */
:root { --paper:#f5f1e7; --green:#123d35; --gold:#c5a66b; }
body { background:var(--paper); }
header { height:88px; border-bottom:1px solid #c5a66b25; }
button,.button { min-height:44px; }
.tarot.illustrated { padding:0; border:1px solid #bda06b; background:#153d34; border-radius:7px; display:flex; flex-direction:column; overflow:hidden; aspect-ratio:2/3.45; height:auto; }
.tarot.illustrated::before { display:none; }
.card-image { display:block; flex:1; width:100%; min-height:0; aspect-ratio:2/3; background-size:400% 400%; background-repeat:no-repeat; }
.card-caption { display:flex; flex-shrink:0; flex-direction:column; justify-content:center; width:100%; min-height:48px; background:#102e27; color:#f0deaf; padding:8px 5px; gap:4px; }
.card-caption small { font:8px Arial,sans-serif; letter-spacing:1.5px; color:#c2ac7d; }
.card-caption strong { font:500 15px 'Cormorant Garamond',Georgia,serif; }
.card-image.turned,.reversed-art .card-image { transform:rotate(180deg); }
.card-back-art { display:block; position:absolute; inset:0; background-image:url('assets/major-b.webp'); background-size:400% 400%; background-position:66.666667% 33.333333%; }
.back-wordmark { position:absolute; bottom:17px; left:12px; right:12px; text-align:center; font:8px Arial,sans-serif; letter-spacing:2px; padding:9px 0; background:#092b26e8; color:#e3cb8b; border-top:1px solid #c5a66b70; border-bottom:1px solid #c5a66b70; }
.hero-editorial { min-height:690px; padding-top:60px; padding-bottom:95px; position:relative; background:radial-gradient(ellipse at 73% 40%,#27564b 0,transparent 48%),#0d3029; }
.hero-editorial::before { content:''; position:absolute; inset:18px; border:1px solid #c5a66b16; pointer-events:none; }
.hero-editorial h1 { font-size:88px; line-height:.98; letter-spacing:-2px; margin-bottom:30px; }
.hero-editorial .lead { font-size:15px; line-height:1.9; color:#c3cbbc; }
.hero-editorial .hero-art { height:470px; }
.hero-editorial .hero-art .tarot { width:210px; height:365px; box-shadow:0 25px 65px #001912aa; }
.hero-art .tarot:nth-child(2) { transform:rotate(-16deg) translateX(-118px); }
.hero-art .tarot:nth-child(3) { transform:translateY(-25px); }
.hero-art .tarot:nth-child(4) { transform:rotate(16deg) translateX(118px); }
.hero-editorial .card-caption { min-height:52px; }
.hero-editorial .card-caption strong { font-size:21px; }
.hero-editorial .actions { align-items:center; gap:25px; }
.hero-link { color:#dec895; font-size:12px; padding:10px 0; border-bottom:1px solid #bda06b70; }
.hero-footnote { font:italic 16px 'Cormorant Garamond',Georgia,serif; color:#a5b9a9; margin-top:25px; }
.scroll-hint { position:absolute; bottom:26px; left:50%; transform:translateX(-50%); font-size:9px; letter-spacing:2px; color:#b8c2ac; background:none; border:0; padding:8px; min-height:0; border-radius:0; }
.scroll-hint:hover { transform:translateX(-50%); color:#fff; }
.constellation { color:#d9ba79; position:absolute; font:35px Georgia,serif; }
.c-one { right:0; top:10px; }.c-two { left:0; bottom:10px; font-size:20px; }
.orbit { width:510px; height:510px; }
.daily-section { display:flex; align-items:center; gap:55px; padding-top:65px; padding-bottom:65px; border-bottom:1px solid var(--line); }
.daily-preview { flex:0 0 145px; transform:rotate(-6deg); filter:drop-shadow(0 12px 16px #23382a26); }
.daily-preview .tarot { width:145px; height:245px; }
.daily-copy { flex:1; max-width:550px; }
.daily-copy h2 { font-size:43px; }
.daily-copy>p:not(.eyebrow) { color:var(--muted); max-width:470px; }
.daily-copy .small { margin-top:13px; margin-bottom:0; font-size:10px; }
.resume-panel { width:240px; border-left:1px solid var(--line); padding-left:35px; margin-left:auto; }
.resume-panel .eyebrow { letter-spacing:1.2px; font-size:9px; }
.resume-panel h3 { font-size:25px; margin-top:15px; margin-bottom:10px; }
.resume-panel p { font-size:12px; color:var(--muted); }
.resume-mini { display:flex; gap:6px; }
.resume-mini .tarot { width:46px; height:75px; }
.resume-mini .card-caption { display:none; }
.text-link { padding:0; min-height:36px; border:0; background:none; color:var(--green); font-size:11px; }
.featured { padding-top:75px; padding-bottom:80px; }
.featured .section-head { margin-bottom:35px; }
.spread-illustrated { border-radius:9px; background:#faf7f0; border-color:#d7d7c9; }
.spread-art { position:relative; overflow:hidden; display:flex; justify-content:center; gap:0; align-items:center; height:230px; background:radial-gradient(ellipse at center,#365c4c,#123b32); }
.spread-art .tarot { width:100px; height:173px; box-shadow:0 12px 24px #001b1660; transition:transform .35s; flex-shrink:0; }
.spread-art .tarot:first-child { transform:rotate(-12deg) translate(18px,13px); }
.spread-art .tarot:nth-child(2) { z-index:2; }
.spread-art .tarot:nth-child(3) { transform:rotate(12deg) translate(-18px,13px); }
.spread-art:hover .tarot:nth-child(2) { transform:translateY(-7px); }
.spread-art .card-caption { min-height:27px; padding:5px 2px; }
.spread-art .card-caption small { display:none; }
.spread-art .card-caption strong { font-size:11px; }
.spread-body { padding:25px 28px; }
.spread-body h3 { font-size:31px; min-height:64px; }
.spread-body p { font-size:12px; line-height:1.8; }
.spread-meta { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.spread-meta .meta { margin:0; font-size:9px; }
.favorite { padding:4px 10px; min-height:34px; font:24px Georgia,serif; border:0; background:none; color:#789184; }
.favorite.selected { color:#a46f43; }
.spread-start { display:flex; justify-content:space-between; font-size:12px; padding-top:18px; border-top:1px solid var(--line); margin-top:auto; }
.custom-invitation { display:flex; align-items:center; justify-content:space-between; gap:25px; margin-top:45px; border-top:1px solid var(--line); padding-top:35px; }
.custom-invitation p { margin:0; color:var(--muted); }
.collection-banner { display:grid; grid-template-columns:1fr 1fr; gap:60px; padding:80px max(6%,calc((100vw - 1136px)/2)); background:#10392f; color:var(--paper); overflow:hidden; }
.collection-banner .eyebrow { color:#c9ae75; }
.collection-banner h2 { font-size:48px; }
.collection-banner h2 em { color:#d6bb85; }
.collection-banner p { color:#b6c5b8; max-width:420px; }
.collection-cards { display:flex; align-items:center; justify-content:center; gap:15px; transform:rotate(-9deg); }
.collection-cards .tarot { width:145px; min-width:145px; height:250px; box-shadow:0 10px 20px #0005; }
.collection-cards .tarot:nth-child(even) { transform:translateY(35px); }
.ritual-layout { display:grid; grid-template-columns:.8fr 1fr; align-items:center; gap:90px; margin-top:20px; }
.ritual-layout h1 { font-size:58px; }
.setup-description { color:var(--muted); max-width:440px; }
.setup-art { padding:50px; position:relative; display:flex; align-items:center; flex-direction:column; background:radial-gradient(ellipse,#e2dfcd,transparent 70%); }
.setup-art .tarot { width:230px; height:395px; transform:rotate(-6deg); box-shadow:15px 20px 40px #22352a30; }
.art-note { font:italic 23px 'Cormorant Garamond',Georgia,serif; text-align:center; margin-top:35px; color:#8a7959; }
.topic-selector { padding:0; border:0; margin:25px 0; display:flex; gap:8px; flex-wrap:wrap; }
.topic-selector legend { font-size:11px; margin-bottom:12px; font-weight:600; }
.topic-selector label { cursor:pointer; position:relative; }
.topic-selector input { position:absolute; opacity:0; width:1px; }
.topic-selector span { display:block; border:1px solid #c5cabc; padding:8px 15px; border-radius:30px; font-size:11px; }
.topic-selector input:checked+span { background:var(--green); color:white; border-color:var(--green); }
.topic-selector input:focus-visible+span { outline:3px solid var(--gold); outline-offset:2px; }
.field small { color:var(--muted); font-weight:400; margin-left:8px; }
.setup-privacy { margin-top:12px; font-size:10px; }
.position-preview { display:flex; justify-content:center; gap:55px; flex-wrap:wrap; border-top:1px solid var(--line); padding-top:30px; margin-top:50px; }
.position-preview div { display:flex; align-items:center; gap:15px; }
.position-preview span { font:32px 'Cormorant Garamond',Georgia,serif; color:#ac9461; }
.position-preview p { font-size:11px; margin:0; }
.ritual-stage { background:radial-gradient(ellipse at 50% 60%,#245248,#0b3028); color:var(--paper); min-height:760px; }
.ritual-stage .wrap { padding-top:25px; padding-bottom:35px; }
.ritual-stage .back { color:#bdc7b6; }
.ritual-stage .eyebrow { color:#c9b17a; }
.ritual-stage h1 { font-size:49px; }
.ritual-stage .intro p:not(.eyebrow) { color:#b7c4b6; }
.chosen-slots { display:flex; justify-content:center; gap:18px; flex-wrap:wrap; }
.chosen-slot { width:125px; text-align:center; opacity:.55; transition:opacity .3s; }
.chosen-slot>span { display:grid; place-items:center; width:37px; height:50px; border:1px solid #b9a77460; border-radius:3px; margin:0 auto 8px; color:#c6ad75; font:17px Georgia,serif; }
.chosen-slot small { font-size:10px; }
.chosen-slot.filled { opacity:1; }
.chosen-slot.filled>span { background:#c1a060; color:#103c31; }
.card-table { padding:40px 0 10px; overflow:hidden; min-height:300px; }
.fan-row { display:flex; justify-content:center; align-items:center; min-height:250px; padding:20px 40px; }
.pick-card { flex:0 0 115px; height:195px; padding:0; border:1px solid #bfa061; border-radius:6px; position:relative; overflow:hidden; box-shadow:-8px 5px 17px #001c1690; margin-left:-51px; transform:translateY(var(--lift)) rotate(var(--rotation)); transform-origin:50% 110%; transition:transform .25s,opacity .25s,box-shadow .25s; }
.pick-card:first-child { margin-left:0; }
.pick-card:hover,.pick-card:focus-visible { transform:translateY(-25px) rotate(0deg); box-shadow:0 0 22px #c6ae6650; z-index:3; }
.pick-card .back-wordmark { font-size:5px; letter-spacing:1px; left:8px; right:8px; bottom:11px; }
.pick-card.chosen { opacity:.12; transform:translateY(-25px); }
.mixing .pick-card { animation:shuffle-in 1s both; animation-delay:calc(var(--index)*15ms); }
@keyframes shuffle-in { 0%{transform:translateX(calc((6 - var(--index))*63px)) rotate(0);opacity:.7} 40%{transform:translateX(calc((6 - var(--index))*50px)) rotate(-5deg)} 100%{transform:translateY(var(--lift)) rotate(var(--rotation));opacity:1} }
.deck-navigation { display:flex; gap:25px; justify-content:center; align-items:center; }
.deck-navigation button { background:transparent; border:1px solid #bda46e70; color:#d3ba84; width:42px; padding:7px; }
.deck-navigation p { margin:0; font-size:11px; color:#c9d1c2; text-align:center; }
.deck-navigation p span { display:block; font-size:9px; color:#96ad9c; margin-top:5px; }
.reading-stage { background:radial-gradient(ellipse at 50% 55%,#e4e2d3,transparent 65%); }
.reading-stage .wrap { padding-top:30px; padding-bottom:35px; }
.reading-stage h1 { font-size:55px; }
.reading-stage .question { font-size:24px; max-width:650px; margin:0 auto 15px; }
.reading-cards { gap:35px; margin:20px 0; }
.card-slot { width:180px; }
.three-cards .card-slot { width:230px; }
.slot-position { display:flex; flex-direction:column; margin:0 0 17px!important; color:#a58c57; font:24px 'Cormorant Garamond',Georgia,serif!important; gap:6px; }
.slot-position span { color:#4e6556; font:11px Arial,sans-serif; }
.flip-card { padding:0!important; border:0; background:none; width:100%; aspect-ratio:2/3.45; border-radius:8px; perspective:1200px; display:block; position:relative; overflow:visible; box-shadow:0 14px 25px #1a382a20; }
.flip-card:hover { transform:translateY(-4px); }
.flip-inner { position:absolute; inset:0; transform-style:preserve-3d; transition:transform .85s cubic-bezier(.2,.7,.2,1); }
.flip-card.is-open .flip-inner { transform:rotateY(180deg); }
.flip-front,.flip-back { position:absolute; inset:0; display:flex; flex-direction:column; border:1px solid #bca169; border-radius:8px; backface-visibility:hidden; -webkit-backface-visibility:hidden; overflow:hidden; background:#123c32; }
.flip-front { transform:rotateY(180deg); }
.flip-front .card-caption { min-height:53px; }
.flip-front .card-caption strong { font-size:21px; }
.orientation { font-size:9px!important; color:var(--muted); opacity:0; transition:opacity .4s; }
.card-slot:has(.is-open) .orientation { opacity:1; }
.reveal-action { text-align:center; min-height:50px; margin-top:25px; }
.reading-result { max-width:980px; padding-top:25px; animation:result-in .7s both; }
@keyframes result-in { from{opacity:0;transform:translateY(12px)} to{opacity:1;transform:none} }
.reading-heading { text-align:center; padding:35px 0; }
.reading-heading h2 { font-size:46px; }
.reading-heading em { color:#938057; }
.meaning { display:grid; grid-template-columns:130px 1fr; gap:35px; padding:38px 0; }
.meaning-art .tarot { width:130px; height:225px; }
.meaning h3 { font-size:38px; margin-bottom:8px; }
.meaning .eyebrow { font-size:9px; margin-bottom:12px; }
.meaning p { font-size:13px; line-height:1.9; }
.position-text { color:var(--muted); }
.meaning blockquote { border-left:1px solid #bba16b; padding-left:20px; margin:20px 0 0; font:italic 23px/1.3 'Cormorant Garamond',Georgia,serif; }
.reading-summary { padding:35px; background:#e9e7d9; border-radius:7px; margin:20px 0 55px; }
.reading-summary p:last-child { margin-bottom:0; font-size:13px; }
.reflection-panel { display:grid; grid-template-columns:.8fr 1fr; gap:40px; padding:40px; background:#103c32; color:#f3edda; border-radius:8px; }
.reflection-panel .eyebrow { color:#cbb583; font-size:9px; }
.reflection-panel h2 { font-size:40px; }
.reflection-panel p { color:#b6c7b7; font-size:12px; }
.reflection-panel textarea { background:#ffffff08; border-color:#a3b19b60; color:#f3edda; font-size:12px; }
.reflection-panel textarea::placeholder { color:#94ac9d; }
.reflection-panel button { background:var(--gold); color:#10362c; border-color:var(--gold); font-size:11px; padding:11px 20px; }
.reflection-panel .secondary { background:transparent; color:#ddca99; }
.reading-disclosure { font-size:10px; color:var(--muted); margin:22px auto; max-width:650px; text-align:center; }
.reading-end { display:flex; justify-content:space-between; border-top:1px solid var(--line); margin-top:30px; padding-top:25px; font-size:12px; }
.library .tarot.illustrated { height:auto; min-height:0; padding:0; }
.library .card-caption { min-height:45px; }
.library .card-caption strong { font-size:15px; }
.detail-card { width:180px; margin:0 auto 30px; }
.detail-card .tarot { height:310px; }
.quiz-card>.tarot { height:100%; }
@media(min-width:1400px){ .hero-editorial h1{font-size:102px}.hero-editorial .hero-art .tarot{width:235px;height:405px}.hero-editorial{min-height:760px} }
@media(max-width:1000px){ .hero-editorial h1{font-size:70px}.hero-editorial .hero-art{transform:scale(.83);margin-left:-20px}.hero-editorial{gap:0}.daily-section{gap:35px}.resume-panel{width:200px;padding-left:25px}.daily-copy h2{font-size:35px}.ritual-layout{gap:35px}.setup-art{padding:25px}.collection-banner{gap:25px}.collection-cards .tarot{width:120px;min-width:120px;height:207px}.three-cards .card-slot{width:205px}.reflection-panel{gap:25px;padding:30px}.spread-art .tarot{width:90px;height:155px} }
@media(max-width:700px){
  header{height:auto;gap:15px;padding:19px 20px}
  .hero-editorial{grid-template-columns:1fr;min-height:0;padding:45px 24px 70px;text-align:center}
  .hero-editorial h1{font-size:65px;letter-spacing:-1px;margin-bottom:24px}
  .hero-editorial .lead{font-size:13px;margin:auto}
  .hero-editorial .eyebrow{font-size:8px;letter-spacing:2px}
  .hero-editorial .actions{justify-content:center;gap:18px;margin-top:25px}
  .hero-editorial .hero-art{height:370px;transform:scale(.82);margin:0 -20px}
  .hero-editorial .hero-art .tarot{width:170px;height:293px}
  .hero-art .tarot:nth-child(2){transform:rotate(-16deg) translateX(-100px)}
  .hero-art .tarot:nth-child(4){transform:rotate(16deg) translateX(100px)}
  .orbit{width:360px;height:360px}
  .hero-footnote{font-size:14px;margin-bottom:0}
  .hero-link{font-size:10px}
  .daily-section{flex-wrap:wrap;gap:25px;padding-top:40px;padding-bottom:40px}
  .daily-preview{flex-basis:100px}.daily-preview .tarot{width:100px;height:173px}
  .daily-copy{flex-basis:calc(100% - 130px)}.daily-copy h2{font-size:30px}.daily-copy p{font-size:11px}.daily-copy .eyebrow{font-size:8px;letter-spacing:1px;margin-bottom:12px}
  .daily-copy .button{font-size:10px;padding:10px 16px}.daily-copy .small{font-size:8px}
  .resume-panel{display:grid;grid-template-columns:100px 1fr;width:100%;border-left:0;border-top:1px solid var(--line);padding:25px 0 0;gap:5px 20px}
  .resume-panel .eyebrow{grid-column:1/-1}.resume-mini{grid-row:2/5;gap:3px;align-self:center}.resume-mini .tarot{width:32px;height:55px}.resume-panel h3{margin:0;font-size:24px}.resume-panel p{margin:0}.resume-panel .text-link{justify-content:start}
  .featured{padding-top:40px;padding-bottom:45px}.featured h2{font-size:33px}.section-head{flex-wrap:wrap}.spread-body h3{min-height:0}.spread-art{height:220px}.spread-art .tarot{width:110px;height:190px}.spread-body{padding:25px}
  .collection-banner{grid-template-columns:1fr;padding:45px 25px;gap:25px}.collection-banner h2{font-size:42px}.collection-cards{height:240px;gap:12px}.collection-cards .tarot{width:105px;min-width:105px;height:180px}.collection-banner p{font-size:13px}
  .ritual-layout{grid-template-columns:1fr;gap:20px;margin-top:0}.setup-art{display:none}.ritual-layout h1{font-size:45px}.setup-description{font-size:13px}.position-preview{gap:22px;justify-content:start;margin-top:30px}.position-preview div{gap:10px}.position-preview p{font-size:10px}
  .ritual-stage{min-height:700px}.ritual-stage h1{font-size:37px}.ritual-stage .intro{margin-bottom:25px}.ritual-stage .intro p{font-size:12px}.chosen-slots{gap:8px}.chosen-slot{width:95px}.chosen-slot small{font-size:9px}
  .fan-row{justify-content:start;gap:0;padding:20px 13px;min-width:680px}.pick-card{flex-basis:80px;height:137px;margin-left:-31px;--rotation:0deg!important;--lift:0px!important}.pick-card:first-child{margin-left:0}.card-table{overflow-x:auto;min-height:220px;padding-top:20px;padding-bottom:10px;scrollbar-color:#ab945f #143b30;scrollbar-width:thin}.fan-row{min-height:180px}.pick-card .back-wordmark{font-size:4px;letter-spacing:.4px;padding:5px 0;left:4px;right:4px}.deck-navigation{margin-top:20px}.deck-navigation p{font-size:10px}.deck-navigation p span{font-size:8px}
  .reading-stage h1{font-size:41px}.reading-stage .question{font-size:21px}.reading-stage .intro{margin-bottom:20px}.reading-cards{gap:12px}.three-cards{gap:9px;flex-wrap:nowrap}.three-cards .card-slot{width:calc((100% - 18px)/3);max-width:170px}.card-slot{width:140px}.slot-position{font-size:20px!important}.slot-position span{font-size:9px;min-height:24px;line-height:1.4}.flip-front .card-caption{min-height:35px;padding:5px 2px}.flip-front .card-caption strong{font-size:13px}.flip-front .card-caption small{font-size:5px;letter-spacing:.4px}.orientation{font-size:7px!important}.flip-back .back-wordmark{font-size:5px;letter-spacing:.5px;left:5px;right:5px;bottom:10px;padding:6px 0}
  .reading-result{padding-top:0}.reading-heading{padding:25px 0}.reading-heading h2{font-size:36px}.meaning{grid-template-columns:75px 1fr;gap:18px;padding:28px 0}.meaning-art .tarot{width:75px;height:130px}.meaning-art .card-caption{min-height:24px;padding:4px 1px}.meaning-art .card-caption strong{font-size:10px}.meaning-art .card-caption small{display:none}.meaning h3{font-size:30px}.meaning p{font-size:12px}.meaning .eyebrow{font-size:8px;letter-spacing:1px}.meaning blockquote{font-size:21px;padding-left:13px}.reading-summary{padding:25px;margin-bottom:30px}.reflection-panel{grid-template-columns:1fr;padding:25px;gap:5px}.reflection-panel h2{font-size:35px}.reading-end{font-size:10px;gap:15px}.library .card-caption{min-height:37px}.library .card-caption strong{font-size:12px}.library .card-caption small{font-size:6px;letter-spacing:.6px}.custom-invitation{flex-direction:column;align-items:start}.collection-cards .card-caption strong{font-size:13px}
}
@media(prefers-reduced-motion:reduce){ .mixing .pick-card{animation:none}.flip-inner{transition:none}.reading-result{animation:none} }