:root{--night-950:#080611;--night-900:#0d0816;--night-850:#120a1d;--night-800:#160d25;--night-700:#211238;--violet-900:#2d1848;--violet-700:#51316f;--violet-500:#76549b;--lavender-300:#b69ad8;--lavender-200:#d1bde5;--gold-700:#a8834d;--gold-500:#d8b878;--gold-400:#e3c78e;--gold-300:#f0d9a4;--ivory:#f8f1e7;--cream:#fff7eb;--text-primary:#f6eee5;--text-secondary:#c8b9c9;--text-muted:#8e8196}
body.night-active[data-reader]{--night-bg:var(--night-900);--night-ink:var(--text-primary);--night-muted:var(--text-secondary);--night-metal:var(--gold-400);--night-line:#d8b87866;--night-panel:#160d25b8;--night-accent:#76549b;background:var(--night-900);color:var(--text-primary)}
#night-root{isolation:isolate;position:relative;background:linear-gradient(#0d081690,#0d0816ba),url('/assets/web/hd-v8/altar-1536.webp') center bottom/cover fixed;font-family:'KaiTi','STKaiti','Songti SC','SimSun',serif;min-height:100svh}#night-root:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:radial-gradient(1px 1px at 7% 12%,#eddfba80,transparent),radial-gradient(1px 1px at 83% 8%,#eddfba90,transparent),radial-gradient(1px 1px at 49% 21%,#efe0ff70,transparent),radial-gradient(1px 1px at 17% 73%,#eddfba80,transparent),radial-gradient(1px 1px at 94% 64%,#eddfba80,transparent);background-size:360px 420px}#night-root button{font-family:inherit}#night-root .night-note{font-family:inherit;font-size:16px;line-height:1.8;color:var(--text-secondary)}.gold-frame{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:3;overflow:visible}.night-page{position:relative;max-width:1120px;min-height:calc(100svh - 40px);padding:104px 36px 58px}.night-page>h2{font-size:34px;text-align:center;color:var(--gold-300);font-weight:400;margin:15px 0;line-height:1.4}.night-page>.night-eyebrow{display:none}.night-page>.night-note{text-align:center;font-size:15px}.night-nav{position:absolute;top:0;left:0;right:0;height:76px;z-index:40;display:flex;gap:28px;padding:0 34px;background:linear-gradient(#08061165,transparent);border:0}.night-brand{font-size:24px;letter-spacing:.07em;color:var(--cream);gap:10px}.night-brand img{width:48px;height:48px;border:1px solid var(--gold-400);box-shadow:0 0 12px #b69ad833}.night-brand small{font:italic 11px Georgia,serif;letter-spacing:.05em;color:#e3c78e;line-height:1.5;margin-top:3px}.night-links{margin-left:auto;gap:26px}.night-link{font-size:15px;letter-spacing:.08em;color:#d7c9de;padding:0 3px}.night-nav-icons{display:flex;gap:12px}.night-nav-icons button{width:36px;min-height:44px;border:0;background:none;color:var(--cream);font-size:22px;padding:0}.night-menu{display:none}.night-btn{position:relative;border:1px solid #d8b878bb;background:linear-gradient(130deg,#352142bb,#17101fcc);color:var(--ivory);border-radius:24px;padding:12px 25px;min-height:44px;letter-spacing:.05em;font-size:17px}.night-btn span{position:relative;z-index:4}.night-btn.primary{color:#6c4254;background:linear-gradient(100deg,#f9e9d4,#f3ddea 50%,#f4e6ce);border-color:#e3c78e;box-shadow:inset 0 0 12px #fff8e8,0 0 16px #dfc8ed26}.night-btn:before,.night-btn:after{content:'✧';color:#e3c78e;position:absolute;top:50%;transform:translateY(-50%);font-size:24px;opacity:.7;left:8px;pointer-events:none}.night-btn:after{left:auto;right:8px}.night-btn:hover{transform:translateY(-1px);box-shadow:0 0 20px #b69ad830}.night-btn:focus-visible{outline:2px solid var(--gold-300);outline-offset:5px}.night-bottom{font-size:11px;color:#b29dbb;background:none;padding:12px}.night-hero{min-height:100svh;height:100svh;padding:0;display:block;position:relative;background:#0d0816;overflow:hidden}.night-art{inset:0;background:url('/assets/scene/hero-v3.webp') center 40%/cover no-repeat;opacity:1;transform:none}.night-hero:after{background:linear-gradient(0deg,#0d08166b,transparent 43%),linear-gradient(90deg,#08061122,transparent 20%,transparent 80%,#08061133)}.night-hero-copy{position:absolute;top:54%;left:50%;transform:translateX(-50%);width:620px;max-width:90%;text-align:center;z-index:5}.night-hero h1{font-family:'KaiTi','STKaiti','Songti SC','SimSun',serif;font-size:clamp(62px,6.4vw,100px);letter-spacing:.065em;color:#fff0db;text-shadow:0 3px 25px #3b152c,0 0 18px #b98ac699;font-weight:400;line-height:1.08}.night-hero h1 em{font:italic .48em/1.3 'Monotype Corsiva','URW Chancery L',Georgia,serif;letter-spacing:0;color:#f8ead7;margin-top:6px}.night-hero .night-verse{font-size:20px;line-height:1.6;margin:16px 0 22px;color:#f7e9ec;text-shadow:0 1px 6px #160d25}.night-hero .night-btn{display:block;margin:14px auto;min-width:350px;max-width:100%;font-size:20px;min-height:56px}.night-hero .night-btn.primary{color:#6c4254;background:linear-gradient(100deg,#f9e9d4,#f3ddea 50%,#f4e6ce)}.night-hero .hero-resume{min-width:300px;min-height:44px;font-size:16px;background:#120a1dab;color:#eee1ec;border-color:#d8b87880}.hero-side-verse{position:absolute;top:17%;right:4%;writing-mode:vertical-rl;z-index:5;font-size:19px;letter-spacing:.18em;color:#f0d9a4;padding:20px 12px;border-inline:1px solid #d8b87877;background:#100a1b66}.fate-stars{position:absolute;inset:0;pointer-events:none}.fate-stars:before{content:'✧';position:absolute;left:22%;top:15%;color:#e7c89a;font-size:42px;text-shadow:0 0 20px #d1bde5}.fate-stars:after{content:'✦';position:absolute;right:28%;top:55%;font-size:24px;color:#fff6df;filter:drop-shadow(0 0 8px #e3c78e)}body[data-night-page=home] .night-bottom{display:none}
@media(max-width:1000px){.night-nav{gap:14px;padding-inline:24px}.night-links{gap:16px}.night-link{font-size:13px}.night-brand{font-size:20px}.night-nav-icons{gap:5px}}
@media(max-width:700px){.night-nav{height:68px;padding:0 18px;gap:12px}.night-brand{font-size:19px}.night-brand img{width:40px;height:40px}.night-links,.night-nav-icons{display:none}.night-menu{display:block;margin-left:auto;position:relative}.night-menu summary{list-style:none;width:44px;height:44px;display:grid;place-items:center;color:var(--gold-300);font-size:22px;cursor:pointer}.night-menu>div{position:absolute;right:0;top:50px;width:180px;background:#160d25f5;border:1px solid var(--gold-700);padding:10px;box-shadow:0 8px 40px #0008}.night-menu>div button{display:block;width:100%;background:none;border:0;text-align:left;color:var(--ivory);padding:12px;font-size:16px;min-height:44px}.night-page{padding:90px 20px 40px;min-height:100svh}.night-page>h2{font-size:27px}.night-page>.night-note{font-size:14px}.night-art{background-position:51% 30%}.night-hero-copy{top:58%;width:90%;max-width:90%}.night-hero h1{font-size:52px;letter-spacing:.035em}.night-hero h1 em{font-size:30px;margin-top:8px}.night-hero .night-verse{font-size:16px;margin:17px 0 18px}.night-hero .night-btn{min-width:0;width:290px;font-size:17px;min-height:52px;padding:10px 14px}.night-hero .hero-resume{min-width:0;width:245px;min-height:43px;font-size:14px}.hero-side-verse{top:16%;right:4%;font-size:14px;padding:13px 6px}.night-bottom{font-size:10px}}
@media(max-width:350px){.night-brand{font-size:17px}.night-hero-copy{top:56%}.night-hero h1{font-size:45px}.night-hero .night-btn{width:270px;font-size:16px}.night-hero .night-verse{font-size:14px}}
@media(prefers-reduced-motion:reduce){.fate-astrolabe{animation:none!important}}
/* Hero A uses the original artwork while the wide composition is pending. */
.night-art{background-position:center 16%}
body.night-active #view-home{padding:0}.night-hero .night-btn.primary{width:420px}.night-hero .hero-resume{width:330px}.night-hero-copy{top:52.5%}.night-hero h1{font-size:clamp(62px,7.2vw,102px)}
@media(max-width:700px){.night-hero-copy{top:58%}.night-hero .night-btn.primary{width:290px}.night-hero .hero-resume{width:245px}.night-hero h1{font-size:52px}}
.night-hero:before{content:'';position:absolute;inset:0;z-index:2;background:url('/assets/web/hd-v8/altar-1536.webp') center/cover;mask-image:linear-gradient(90deg,#000 0%,#000b 7%,transparent 25%,transparent 75%,#000b 93%,#000 100%);pointer-events:none}.night-hero:after{z-index:3}.fate-stars{z-index:4}
/* Panel 02: the copy remains inside the portrait, never below a separate image. */
.night-readers{display:grid;grid-template-columns:1fr 1fr;gap:25px;max-width:790px;margin:25px auto 0}.night-reader{position:relative;aspect-ratio: .59;display:block;text-align:center;border:1px solid #d8b87899;border-radius:4px;background:#0d0816;padding:0;box-shadow:0 0 28px #08061188;overflow:hidden;color:var(--ivory)}.night-reader .night-portrait{position:absolute;inset:0;width:100%;height:100%;min-height:0;aspect-ratio:auto;object-fit:cover;object-position:center 16%;border:0;transition:transform .8s}.night-reader:after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 28%,#08061150 50%,#080611fa 76%);pointer-events:none}.night-reader.med{background:#b69ad8;color:#51316f}.night-reader.med:after{background:linear-gradient(transparent 30%,#d1bde550 50%,#d1bde5ed 74%,#ead8eafb)}.night-reader:hover{transform:none}.night-reader:hover .night-portrait{transform:scale(1.015);filter:brightness(1.05)}.night-reader .night-reader-copy{position:absolute;bottom:5%;left:6%;right:6%;padding:0;z-index:4;text-align:center}.night-reader-copy strong{font:40px/1.15 Georgia,serif;letter-spacing:.025em;color:var(--gold-300)}.night-reader-copy p{font-size:18px;line-height:1.5;margin:9px 0;color:inherit}.night-reader-copy small{font-size:16px;line-height:1.5;letter-spacing:.03em;margin:14px 0;color:#c8b9c9}.night-reader.med .night-reader-copy strong{color:#fff4d7;text-shadow:0 1px 8px #6f4878}.night-reader.med .night-reader-copy small{color:#7b5887}.reader-card-choice{display:block;border:1px solid #e3c78eb0;background:linear-gradient(#4a3150a6,#170f2390);border-radius:28px;padding:10px 15px;font-size:17px;min-height:42px;color:#f0d9a4;margin-top:16px}.med .reader-card-choice{background:linear-gradient(120deg,#f9e9d4,#e7d0ef);color:#51316f;box-shadow:inset 0 0 12px #fff8eb}.night-duo{position:relative;display:flex;justify-content:space-between;text-align:center;align-items:center;gap:20px;width:100%;max-width:790px;margin:22px auto 0;padding:12px 25px;border:1px solid #d8b87888;background:#160d25bd;color:#f0d9a4;border-radius:3px;cursor:pointer}.night-duo strong{display:block;font:27px/1.25 Georgia,serif;letter-spacing:.02em}.night-duo small{display:block;color:#c8b9c9;font-size:17px;margin-top:7px}.chibi-avatar{display:block;width:78px;height:88px;flex-shrink:0;background:url('/assets/brand/chibi-duo.jpg') 77% 20%/220%;border-radius:50%;mask-image:radial-gradient(ellipse,#000 45%,transparent 73%)}.chibi-avatar.med{background-position:21% 32%}.reader-resume{text-align:center;margin:18px}.night-hero .night-btn{border-radius:999px}
@media(max-width:700px){.night-readers{grid-template-columns:1fr;gap:22px;max-width:340px}.night-reader{aspect-ratio:.68}.night-reader .night-portrait{width:100%;height:100%;min-height:0;aspect-ratio:auto}.night-reader .night-reader-copy{padding:0;left:8%;right:8%;bottom:6%}.night-reader-copy strong{font-size:36px}.night-reader-copy p{font-size:16px}.night-reader-copy small{font-size:15px}.reader-card-choice{font-size:16px;margin-top:13px}.night-duo{max-width:340px;flex-direction:row;gap:5px;padding:13px 12px}.night-duo strong{font-size:20px}.night-duo small{font-size:13px}.chibi-avatar{width:49px;height:66px}}
/* Panel 02 second pass: match the reference's compact portrait pair and visible duo strip. */
body[data-night-page=readers] #night-root{background:linear-gradient(#0d0816d9,#0d0816ed),url('/assets/web/hd-v8/altar-1536.webp') center/cover}
body[data-night-page=readers] .night-page{padding-top:90px;padding-bottom:26px}
body[data-night-page=readers] .night-page>h2{font-size:28px;margin:10px 0}
.night-readers{max-width:660px;margin-top:18px;gap:20px}.night-reader-copy strong{font-size:36px}.night-reader-copy p{font-size:16px}.night-reader-copy small{font-size:15px;margin:10px 0}.reader-card-choice{font-size:16px;margin-top:12px;padding:8px 15px}.night-duo{max-width:660px;margin-top:18px;padding:7px 20px}.night-duo strong{font-size:25px}.night-duo small{font-size:15px}.chibi-avatar{height:74px;width:66px}
@media(max-width:700px){.night-readers,.night-duo{max-width:340px}.night-duo strong{font-size:20px}.night-duo small{font-size:13px}.chibi-avatar{height:60px;width:46px}body[data-night-page=readers] .night-page>h2{font-size:25px}}
/* Panel 03 / 08: one complete face rotates, including its live names and number. */
.celestial-face,.night-library .celestial-face,.detail-art .celestial-face{display:block;padding:0;aspect-ratio:300/510;height:auto;border:2px solid #e0ba8b;border-radius:15px;background:linear-gradient(145deg,#fff9ea,#f6dfea);box-shadow:inset 0 0 0 5px #fff8ed,0 0 18px #f0d9a425;container-type:inline-size;overflow:hidden}.celestial-face:before{inset:5%;border-color:#d0a774;border-radius:11px;z-index:2}.celestial-face .gold-frame{z-index:5;inset:2%;width:96%;height:96%}.celestial-art,.night-library .celestial-art,.detail-art .celestial-art{position:absolute;inset:5.5% 7%;min-height:0;border-radius:10px;border:1px solid #dcbe97;overflow:hidden;background:#b69ad8}.celestial-art img,.night-library .celestial-art img{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;object-fit:cover;transform:none;border:0;border-radius:0}.star-card .celestial-art img,.night-card .star-card .celestial-art img{transform:scale(1.35);transform-origin:50% 0%}.celestial-art:after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 66%,#edd9e899 84%,#f8eddddb);pointer-events:none}.celestial-number,.night-library .celestial-number,.detail-art .celestial-number{position:absolute;left:12%;right:auto;top:7%;padding:0;font:5cqw/1.4 Georgia,serif;min-height:0;color:#fff7dc;text-shadow:0 1px 4px #51316f;z-index:3}.celestial-name,.night-library .celestial-name,.detail-art .celestial-name{position:absolute;bottom:8.5%;left:8%;right:8%;padding:0;min-height:0;gap:4px;z-index:4;display:flex;text-shadow:0 0 6px #fff8eb;color:#785235}.celestial-name strong,.night-library .celestial-name strong,.detail-art .celestial-name strong{font:9cqw/1.2 'KaiTi','SimSun',serif;letter-spacing:.04em}.celestial-name small,.night-library .celestial-name small,.detail-art .celestial-name small{font:3.8cqw/1.3 Georgia,serif;letter-spacing:.05em;color:#795c4e!important}.card-crown,.card-root{position:absolute;color:#ddae6a;text-shadow:0 0 8px #fff7dc;z-index:6;font-size:16cqw;line-height:1;left:50%;transform:translateX(-50%);top:-.5%}.card-root{top:auto;bottom:-.5%;font-size:12cqw}.tarot-showcase{display:flex;justify-content:center;gap:38px;margin:30px auto 60px}.tarot-showcase>button{width:245px;max-width:40%;background:none;border:0;color:#f0d9a4;text-align:center;padding:0;cursor:pointer}.tarot-showcase>button>span{display:block;font-size:20px;margin:18px 0 6px}.tarot-showcase>button>small{font:13px Georgia,serif;display:block;color:#d1bde5}.night-detail{background:linear-gradient(110deg,#211238ed,#0d0816f5),url('/assets/web/hd-v8/altar-1536.webp') center/cover;border-radius:8px;border:1px solid #d8b87899;width:min(900px,calc(100vw - 32px));padding:36px;max-height:90svh;color:#eaddf0;font-family:'KaiTi','SimSun',serif}.night-detail>.gold-frame{position:absolute;z-index:0}.detail-close{position:absolute;right:15px;top:15px;background:#0d0816;color:#f0d9a4;z-index:8}.detail-columns{gap:34px;grid-template-columns:minmax(180px,245px) 1fr;align-items:center}.night-detail h2{font:32px/1.4 'KaiTi','SimSun',serif;color:#f0d9a4;border-bottom:1px solid #d8b87840;margin:10px 0 20px;padding-bottom:14px;letter-spacing:.04em}.night-detail h3{font:14px/1.8 'KaiTi','SimSun',serif;color:#c8b9c9;margin:20px 0 10px}.night-detail h3>span{display:inline-block;background:linear-gradient(#f0d9a4,#cf9b64);color:#69412e;padding:1px 8px;border-radius:4px;margin-right:5px}.night-detail h3>span.reversed-badge{background:#b691ac;color:#fff4e4}.night-detail p{font:16px/1.85 'KaiTi','SimSun',serif;margin:8px 0}.detail-art>p{color:#f0d9a4;font-size:18px;line-height:1.5}.detail-art>p>small{display:block;font:11px/1.6 Georgia,serif}.card-metadata{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:25px}.card-metadata>div{background:#b69ad817;border:1px solid #d8b87820;border-radius:6px;padding:12px 5px;text-align:center}.card-metadata small{display:block;font-size:12px;color:#ad98b8;margin-bottom:9px}.card-metadata strong{font-size:16px;font-weight:400}
/* Panel 04: candle / crystal scenery and the lilac letter-sized input. */
body[data-night-stage=QUESTION] #night-root{background:linear-gradient(#0d081645,#0d081660),url('/assets/web/hd-v8/altar-1536.webp') center/cover;min-height:100svh}body[data-night-stage=QUESTION] .night-page{padding-top:27svh;max-width:1060px;text-align:center}body[data-night-stage=QUESTION] .night-page:before{display:none}body[data-night-stage=QUESTION] .night-page>h2{font-size:36px;color:#fff0db;margin-bottom:5px}body[data-night-stage=QUESTION] .night-page>.night-note{font:11px/1.8 Georgia,serif;letter-spacing:.07em;margin:0 0 24px;color:#e7d4eb}body[data-night-stage=QUESTION] .night-question{margin:0 auto;max-width:760px}.question-letter{position:relative;background:linear-gradient(115deg,#f9eff4f5,#d8c4e4ed);border:2px solid #e3c78e;box-shadow:0 0 0 5px #211238c0,0 0 0 6px #e3c78e80,inset 0 0 22px #fff7eb;padding:15px 20px;border-radius:3px}.question-letter>.gold-frame{inset:4px;width:calc(100% - 8px);height:calc(100% - 8px)}body[data-night-stage=QUESTION] .question-letter .night-input{border:0;background:transparent;box-shadow:none;min-height:118px;height:118px;padding:12px 0 26px;font:17px/1.8 'KaiTi','SimSun',serif;color:#6f527c;resize:vertical;border-radius:0;position:relative;z-index:4}body[data-night-stage=QUESTION] .question-letter .night-input:focus{outline:0;box-shadow:none}.letter-star{position:absolute;left:48%;top:18%;font-size:65px;color:#fff8eb80;pointer-events:none}.question-count{position:absolute;right:21px;bottom:12px;font:12px Georgia,serif;color:#8e6e96;z-index:5}body[data-night-stage=QUESTION] .night-chips{gap:11px;margin:26px 0 14px;justify-content:center}body[data-night-stage=QUESTION] .night-chips button{font-size:16px;min-height:44px;padding:8px 20px;background:#21123880;color:#e8d6ee}body[data-night-stage=QUESTION] .night-chips button[aria-pressed=true]{background:linear-gradient(#c4a8d690,#6e4b83ab);box-shadow:0 0 14px #d1bde545}body[data-night-stage=QUESTION] .question-consent{text-align:center;font-size:12px;margin:16px 0;color:#d1bde5}body[data-night-stage=QUESTION] .night-question>.night-btn{width:400px;max-width:100%;min-height:58px;margin:20px auto;font-size:20px}
/* Panel 05: real patterned mini cards and one direct choice button per spread. */
body[data-night-stage=SPREAD] #night-root{background:linear-gradient(#0d0816dc,#0d0816ed),url('/assets/web/hd-v8/altar-1536.webp') center/cover}.night-spreads{max-width:960px;margin:30px auto 18px;gap:25px;grid-template-columns:repeat(3,1fr)}.night-spread{position:relative;background:linear-gradient(#33213b9c,#160d25db);border:1px solid #d8b87870;border-radius:20px;text-align:center;padding:24px 22px 22px;overflow:hidden;min-height:370px}.night-spread:hover{background:linear-gradient(#51316f99,#211238eb);border-color:#e3c78e}.night-spread strong{display:block;font-size:24px;color:#f0d9a4}.night-spread small{font-size:16px;margin:7px 0 16px;color:#c8b9c9}.night-spread p{font-size:16px;line-height:1.7;min-height:55px}.night-preview{height:145px;margin-bottom:17px}.night-preview i{width:29px;height:48px;border-width:2px;border-radius:3px;opacity:1}.night-preview i>span{font-size:15px}.night-preview i:before{inset:4px}.night-preview i:after{width:80%}.spread-use{display:block;padding:10px 12px;color:#e8d0eb;border:1px solid #b69ad8b0;border-radius:24px;background:#51316f55;font-size:16px;margin-top:18px}.spread-browse{text-align:center}.spread-browse .night-btn{background:none;border:none;color:#d8b878;box-shadow:none}.spread-browse .night-btn:before,.spread-browse .night-btn:after{display:none}.recommend-note{text-align:center;color:#9f8baa;font-size:12px;margin:8px}
@media(max-width:700px){.tarot-showcase{gap:22px;margin:25px auto 35px}.tarot-showcase>button{max-width:44%;width:160px}.tarot-showcase>button>span{font-size:16px;margin-top:14px}.tarot-showcase>button>small{font-size:10px}.night-detail{padding:42px 22px 24px}.detail-columns{grid-template-columns:1fr;gap:12px}.detail-art{width:175px;max-width:100%}.night-detail h2{font-size:27px}.night-detail p{font-size:15px}.card-metadata{gap:5px}.card-metadata strong{font-size:14px}.card-metadata small{font-size:11px}body[data-night-stage=QUESTION] .night-page{padding:24svh 24px 40px}body[data-night-stage=QUESTION] .night-page>h2{font-size:27px}body[data-night-stage=QUESTION] .night-page>.night-note{font-size:8px}.question-letter{padding:9px 14px}body[data-night-stage=QUESTION] .question-letter .night-input{min-height:114px;height:114px;font-size:16px;padding-top:10px}body[data-night-stage=QUESTION] .night-chips{gap:8px;margin:23px 0 15px}body[data-night-stage=QUESTION] .night-chips button{padding:7px 13px;font-size:14px}body[data-night-stage=QUESTION] .night-question>.night-btn{width:300px;font-size:18px}.night-spreads{grid-template-columns:1fr;max-width:340px;gap:20px}.night-spread{min-height:350px;padding:22px}.night-spread p{font-size:15px}.night-preview{height:140px}.night-preview i{width:27px;height:46px}.night-spread strong{font-size:23px}}
/* Panel 06: the actual deck uses the same ivory/gold celestial backs throughout. */
.night-back{border:5px solid #fff2df;border-radius:11px;background:linear-gradient(#51316f80,#211238a8),url('/assets/web/star-v3.webp') center 30%/cover;box-shadow:inset 0 0 0 2px #cfa66e,inset 0 0 15px #f0d9a450,0 12px 22px #08061180;color:#f0d9a4}.night-back:before{inset:7px;border:1px solid #e3c78e;border-radius:6px;box-shadow:inset 0 0 0 3px #d8b87830}.night-back:after{width:72%;border:1px solid #e3c78eb0;box-shadow:0 0 0 6px #e3c78e18;border-radius:50%;transform:rotate(30deg)}.night-back>span{position:relative;font-size:0!important;width:48%;aspect-ratio:1;filter:drop-shadow(0 0 8px #fff4dc)}.night-back>span:before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,#fff7df,#e3c78e 45%,#a8834d);clip-path:polygon(50% 0,56% 34%,85% 15%,66% 44%,100% 50%,66% 56%,85% 85%,56% 66%,50% 100%,44% 66%,15% 85%,34% 56%,0 50%,34% 44%,15% 15%,44% 34%)}.night-back>span:after{content:'';position:absolute;inset:14%;background:#fff4df;clip-path:polygon(50% 0,55% 36%,100% 50%,55% 64%,50% 100%,45% 64%,0 50%,45% 36%);opacity:.9}.night-back[data-back=lavender]{background:linear-gradient(#b69ad850,#76549b80),url('/assets/web/star-v3.webp') center 30%/cover}.night-back[data-back=midnight]{background:linear-gradient(#080611b0,#0d0816d0),url('/assets/web/star-v3.webp') center 30%/cover}.night-back[data-back=eclipse]{background:linear-gradient(120deg,#d1bde560,#0d0816b0),url('/assets/web/star-v3.webp') center 30%/cover}.night-preview i{border-width:2px;border-radius:3px;box-shadow:inset 0 0 0 1px #d8b878,0 0 7px #d1bde560}.night-preview i:before{inset:2px;border-radius:1px}.night-progress{justify-content:center;font-size:14px;gap:20px;margin:25px 0}.night-progress .on{color:#fff0db;text-shadow:0 0 10px #d1bde5}.night-table{position:relative;background:radial-gradient(ellipse,#51316f50,transparent 70%);padding:30px 0 12px;min-height:420px}.night-stack{width:180px;height:302px;transform:rotate(-8deg) rotateX(12deg);margin:0 auto 38px}.night-stack .night-back{transform:translate(calc(var(--i)*3px),calc(var(--i)*-3px)) rotate(calc(var(--i)*1.1deg))}.night-stack.shuffling .night-back{transform:translate(calc((var(--i) - 2)*65px),calc(var(--i)*-8px)) rotate(calc((var(--i) - 2)*18deg))}.night-cuts{gap:40px;margin:35px 0 45px}.night-cut{width:160px;height:273px;transform:rotateX(12deg) rotate(-4deg);box-shadow:4px 5px 0 #d5bfa1,7px 8px 0 #927b69,0 18px 30px #08061188}.night-cut:nth-child(2){transform:rotateX(12deg) rotate(2deg)}.night-cut:nth-child(3){transform:rotateX(12deg) rotate(7deg)}.night-cut small{bottom:16px;color:#fff1d3}.night-fan{max-width:940px;margin:0 auto;padding:30px 25px 32px;min-height:210px;perspective:1100px}.night-fan .night-back{width:106px;min-width:106px;height:180px;margin-right:-57px;transform:rotate(-7deg);transition:transform .3s,box-shadow .3s}.night-fan .night-back:nth-child(3n){transform:rotate(3deg)}.night-fan .night-back:hover,.night-fan .night-back:focus-visible{transform:translateY(-20px) rotate(0);box-shadow:0 0 28px #d1bde57a;z-index:8}.night-layout{height:400px}.night-card-front{border:0;overflow:visible}.night-card .celestial-face{height:100%;aspect-ratio:auto}.night-card{width:110px;height:187px}.night-slot{width:110px}.night-card:disabled{opacity:.85!important}body[data-night-stage=DRAW] .night-layout:not(.is-complex){height:240px;margin:10px auto}body[data-night-stage=REVEAL] .night-card{width:150px;height:255px}body[data-night-stage=REVEAL] .night-slot{width:150px}.night-status{font-size:16px;text-align:center;color:#e3c78e}
/* Panel 07: the card is beside its reading, and the text gets the larger column. */
body[data-night-stage=FOLLOW_UP] #night-root{background:linear-gradient(#0d0816bd,#0d0816e0),url('/assets/web/hd-v8/altar-1536.webp') center/cover fixed}.night-reading{max-width:1040px}.night-reading .spread-drawer{margin:0 0 20px;border-bottom:0;scroll-margin-top:20px}.spread-drawer>summary{min-height:36px;font-size:13px}.offline-notice{font-size:12px;text-align:center;color:#bca1c7;margin:0 0 20px}.reading-card-section{display:grid;grid-template-columns:190px minmax(0,1fr);gap:35px;margin:0 0 32px;align-items:start}.reading-card-rail{padding-top:8px;text-align:center}.reading-face-button{display:block;width:100%;background:none;border:0;padding:0;cursor:pointer}.reading-up{width:44px;height:44px;border:1px solid #d8b878;border-radius:50%;font-size:26px;color:#f0d9a4;background:#21123880;margin:14px auto;cursor:pointer}.reading-gold-panel{position:relative;padding:28px 30px 24px;background:linear-gradient(120deg,#29163390,#0d0816cc);border-radius:18px;border:1px solid #d8b87860;min-height:330px}.reading-gold-panel>h3{font-size:24px;font-weight:400;line-height:1.5;margin:0 0 18px;color:#f0d9a4}.reading-gold-panel>h3>span{font:26px Georgia,serif;margin-right:10px}.direction-badge{display:inline-block;font-size:13px;vertical-align:middle;margin-left:10px;color:#e7d7ed;background:#76549b55;border:1px solid #b69ad840;border-radius:4px;padding:2px 10px}.direction-badge.reversed{background:#a8834d30;color:#f0d9a4}.reading-gold-panel .night-reading-head{padding:0 0 17px;border:0;margin:0;gap:13px}.night-reading-head>img{width:48px;height:48px;border:1px solid #d8b87890}.night-reading-head strong{font:18px Georgia,serif;font-weight:400;color:#e8d5ed}.night-reading-head p{font-size:15px;color:#bca5c9;margin:4px 0}.reading-gold-panel .night-narrative{font:18px/1.85 'KaiTi','SimSun',serif;margin:0;white-space:normal}.reading-gold-panel .reading-paragraph p{margin-bottom:18px}.reading-speaker{font-size:15px;margin-bottom:10px}.reading-detail-link{display:block;position:relative;z-index:5;border:1px solid #d8b87845;background:#76549b20;color:#c8b9c9;font-size:14px;border-radius:24px;padding:9px 15px;text-align:left;min-height:44px;margin-top:18px;cursor:pointer}.reading-intro{margin:25px 0 30px 225px;color:#c8b9c9;font:17px/1.85 'KaiTi','SimSun',serif}.reading-switch-action{text-align:center;margin:25px 0 35px}#night-follow{max-width:815px;margin-left:auto}#night-follow .night-input{background:#21123899;border:1px solid #d8b87877;color:#ede1ee;font:17px/1.8 'KaiTi','SimSun',serif}.night-chat{margin-left:225px;font:17px/1.85 'KaiTi','SimSun',serif}.reading-basic-meaning{margin:0;color:#d5c0dd}
/* Panel 09: the same independent portraits in a proper dialog. */
.reader-switch-dialog{width:min(620px,calc(100vw - 28px));padding:36px 32px 28px}.reader-switch-dialog>h2{text-align:center;font-size:27px;border:0;margin:0 0 23px;padding:0}.reader-switch-dialog .night-readers{margin:0;gap:20px;max-width:none}.reader-switch-dialog .night-reader{aspect-ratio:.65}.reader-switch-dialog .night-reader-copy strong{font-size:30px}.reader-switch-dialog .night-reader-copy p{font-size:15px;line-height:1.5}.reader-switch-dialog .night-reader-copy small,.reader-switch-dialog .reader-card-choice{display:none}.reader-switch-dialog .night-reader-copy{bottom:6%}.reader-switch-dialog .night-duo{padding:10px 18px;max-width:none;margin-top:20px;background:linear-gradient(120deg,#f9e9d4,#e7d0ef);color:#51316f;border-radius:30px;min-height:52px}.reader-switch-dialog .night-duo strong,.reader-switch-dialog .chibi-avatar{display:none}.reader-switch-dialog .night-duo small{color:#51316f;font-size:18px;margin:0}.reader-switch-dialog .night-duo>span{margin:auto}.reader-switch-dialog .night-duo .gold-frame{display:none}
/* Panel 10: fine rotating astrolabe, reading steps, and the original chibi pair. */
.loading-page{display:flex;align-items:center;justify-content:center;min-height:100svh;padding:100px 32px 40px}.night-loading{display:grid;position:relative;grid-template-columns:280px 1fr;gap:45px;text-align:left;align-items:center;width:760px;max-width:100%;margin:0;min-height:520px;padding-bottom:200px}.loading-wheel{width:280px;color:#d8b878;filter:drop-shadow(0 0 8px #d8b87830)}.fate-astrolabe{width:100%;height:auto;animation:star-orbit 42s linear infinite}.loading-copy h2{font-size:32px;font-weight:400;color:#f0d9a4;margin:0 0 20px;line-height:1.5}.loading-rule{height:1px;background:linear-gradient(#d8b87899,transparent);margin-bottom:20px}.loading-copy ul{list-style:none;padding:0;margin:0;color:#c8b9c9;font-size:17px;line-height:2.1}.loading-copy li:before{content:'·';color:#e3c78e;margin-right:12px}.loading-copy .night-status{text-align:left;font-size:12px;color:#a58dad;margin-top:15px;min-height:32px}.loading-readers{position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:250px;height:215px;mask-image:radial-gradient(ellipse at 50% 60%,#000 36%,transparent 72%);overflow:hidden}.loading-readers img{width:100%;height:auto;object-fit:contain;object-position:center;border:0;border-radius:0;margin:0}
body[data-night-page=library] #night-root{background:#0d0816}
@media(max-width:700px){.night-progress{font-size:12px;gap:8px;margin:22px 0}.night-table{min-height:370px;padding-top:20px}.night-stack{width:155px;height:264px;margin-bottom:32px}.night-cuts{gap:18px;margin:30px 0 35px}.night-cut{width:83px;height:141px;border-width:3px}.night-fan{min-height:180px;padding:25px 14px 32px}.night-fan .night-back{width:90px;min-width:90px;height:153px;margin-right:-39px}.night-card{width:82px;height:139px}.night-slot{width:82px}.night-layout{height:360px}body[data-night-stage=DRAW] .night-layout:not(.is-complex){height:240px}body[data-night-stage=REVEAL] .night-card{width:94px;height:160px}body[data-night-stage=REVEAL] .night-slot{width:94px}.night-status{font-size:14px}.reading-card-section{grid-template-columns:82px minmax(0,1fr);gap:14px;margin-bottom:24px}.reading-gold-panel{padding:20px 17px 18px;border-radius:10px;min-height:300px}.reading-gold-panel>h3{font-size:18px;margin-bottom:13px}.reading-gold-panel>h3>span{font-size:19px;margin-right:4px}.direction-badge{font-size:11px;margin-left:4px;padding:2px 5px}.reading-gold-panel .night-reading-head{gap:9px;padding-bottom:14px}.night-reading-head>img{width:34px;height:34px}.night-reading-head strong{font-size:16px}.night-reading-head p{font-size:12px;line-height:1.6}.reading-gold-panel .night-narrative{font-size:16px;line-height:1.85}.reading-detail-link{font-size:12px;padding:8px 10px;line-height:1.5}.reading-up{width:40px;height:40px;font-size:23px;margin-top:12px}.reading-intro,.night-chat{margin-left:0;font-size:15px}.reading-switch-action{margin:25px 0}#night-follow{margin:0}#night-follow .night-input{font-size:16px}.reader-switch-dialog{padding:45px 20px 25px}.reader-switch-dialog .night-readers{grid-template-columns:1fr 1fr;gap:12px}.reader-switch-dialog .night-reader{aspect-ratio:.56;display:block}.reader-switch-dialog .night-reader-copy{left:6%;right:6%;padding:0}.reader-switch-dialog .night-reader-copy strong{font-size:24px}.reader-switch-dialog .night-reader-copy p{font-size:12px;line-height:1.65}.reader-switch-dialog .night-duo small{font-size:16px}.reader-switch-dialog>h2{font-size:25px}.loading-page{padding:100px 22px 40px}.night-loading{grid-template-columns:120px minmax(0,1fr);gap:20px;min-height:480px;padding-bottom:210px}.loading-wheel{width:120px}.loading-copy h2{font-size:23px;margin-bottom:12px}.loading-copy ul{font-size:14px;line-height:2}.loading-copy li:before{margin-right:7px}.loading-copy .night-status{font-size:10px}.loading-readers{width:225px;height:210px}}
@media(max-width:370px){.reading-card-section{grid-template-columns:64px minmax(0,1fr);gap:10px}.reading-gold-panel{padding:18px 13px}.reading-gold-panel>h3{font-size:16px}.reading-gold-panel .night-narrative{font-size:15px}.direction-badge{display:inline-block;margin-left:0}.night-page{padding-left:16px;padding-right:16px}.night-cuts{gap:12px}.night-cut{width:77px;height:131px}.night-loading{grid-template-columns:105px 1fr;gap:12px}.loading-wheel{width:105px}.loading-copy h2{font-size:21px}.loading-copy ul{font-size:13px}}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
body[data-night-stage=FOLLOW_UP] .night-page>h2{font-family:'KaiTi','SimSun',serif;font-size:28px;margin:4px 0 12px}.reading-gold-panel .gold-frame{z-index:0}.reading-gold-panel>*:not(.gold-frame){position:relative;z-index:1}
.night-back{background:linear-gradient(#b69ad82a,#51316f30),url('/assets/scene/card-back-v3.svg') center/cover}.night-back[data-back=lavender]{background:linear-gradient(#d1bde550,#b69ad825),url('/assets/scene/card-back-v3.svg') center/cover}.night-back[data-back=midnight]{background:linear-gradient(#08061190,#0d0816b0),url('/assets/scene/card-back-v3.svg') center/cover}.night-back[data-back=eclipse]{background:linear-gradient(115deg,#d1bde530,#0d081688),url('/assets/scene/card-back-v3.svg') center/cover}
body[data-night-stage=QUESTION] #night-root .night-page>.night-note{font:11px/1.8 Georgia,serif;letter-spacing:.06em}body[data-night-stage=QUESTION] .question-letter .night-input{resize:none}.night-btn.primary{clip-path:polygon(0 50%,3% 25%,8% 18%,10% 0,90% 0,92% 18%,97% 25%,100% 50%,97% 75%,92% 82%,90% 100%,10% 100%,8% 82%,3% 75%);border-radius:0!important}
@media(max-width:700px){body[data-night-stage=QUESTION] #night-root .night-page>.night-note{font-size:8px}}
/* Mobile A check found collisions in percentage-positioned three-card spreads. */
@media(max-width:700px){.night-layout:not(.is-complex){display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;align-items:center;justify-items:center;padding:24px 0;min-height:255px;height:auto}.night-layout:not(.is-complex)[data-count="1"]{grid-template-columns:1fr}.night-layout:not(.is-complex)[data-count="2"]{grid-template-columns:repeat(2,minmax(0,1fr))}.night-layout:not(.is-complex) .night-slot{position:relative;left:auto;top:auto;transform:none;width:100%;text-align:center}.night-layout:not(.is-complex) .night-card{width:min(100%,94px);height:auto;aspect-ratio:300/510}.night-layout:not(.is-complex) .night-position-label{font-size:12px!important}.night-layout:not(.is-complex) .night-orientation{font-size:10px!important}body[data-night-stage=DRAW] .night-layout:not(.is-complex){height:auto;min-height:240px;margin:8px 0}body[data-night-stage=REVEAL] .night-layout:not(.is-complex){min-height:300px}body[data-night-stage=REVEAL] .night-layout:not(.is-complex) .night-slot{width:100%}body[data-night-stage=REVEAL] .night-layout:not(.is-complex) .night-card{width:min(100%,94px);height:auto}}
.celestial-face:not(.star-card) .celestial-art img{transform:scale(1.2);transform-origin:50% 50%}
.night-detail>.detail-close{position:sticky;float:right;top:0;right:auto;margin:-18px -18px -26px 0;z-index:10}
@media(prefers-reduced-motion:reduce){.night-card-inner,.night-stack .night-back,.night-reader .night-portrait{transition:none}.night-fan .night-back{transition:none}}
/* Phone second pass: keep both reader choices and the duo strip together. */
@media(max-width:700px){body[data-night-page=readers] .night-readers{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;max-width:340px}body[data-night-page=readers] .night-reader{aspect-ratio:.48;display:block}body[data-night-page=readers] .night-reader-copy{bottom:5%;left:7%;right:7%}body[data-night-page=readers] .night-reader-copy strong{font-size:28px}body[data-night-page=readers] .night-reader-copy p{font-size:13px;line-height:1.55;margin:8px 0}body[data-night-page=readers] .night-reader-copy small{font-size:11px;letter-spacing:0;margin:8px 0}body[data-night-page=readers] .reader-card-choice{font-size:14px;padding:8px 4px;min-height:40px;margin-top:10px}body[data-night-page=readers] .night-duo{margin-top:18px}}
@media(max-width:350px){body[data-night-page=readers] .night-readers{gap:10px}body[data-night-page=readers] .night-reader-copy strong{font-size:24px}body[data-night-page=readers] .night-reader-copy p{font-size:12px}body[data-night-page=readers] .night-reader-copy small{font-size:10px}body[data-night-page=readers] .reader-card-choice{font-size:12px}}
.night-btn:not(.primary):hover{background:linear-gradient(#51316f80,#211238cc)}
@media(max-width:350px){body[data-night-stage=QUESTION] .night-page>h2{font-size:24px;letter-spacing:.025em}}
.night-spread{display:flex;flex-direction:column;align-items:stretch}.night-spread .night-preview{flex-shrink:0}.night-spread p{margin-bottom:20px}.night-spread .spread-use{margin-top:auto}
@media(max-width:700px) and (max-height:700px){.night-hero-copy{top:48%}.night-hero h1{font-size:46px}.night-hero h1 em{font-size:27px}.night-hero .night-verse{font-size:14px;margin:12px 0}.night-hero .night-btn{min-height:48px;margin:12px auto}.night-hero .hero-resume{min-height:40px}}
/* Long readings must size their illustration against the viewport, not document height. */
body[data-night-stage=FOLLOW_UP] #night-root{background-size:auto,max(100vw,150svh) auto;background-repeat:no-repeat;background-position:center,center top;background-attachment:scroll,fixed}