/* Stellar landing pages · one stylesheet for "/", "/tarot" and "/bazi".
   On "/" the page lives inside the app's document and takes the app's own colour tokens.
   The tarot and BaZi pages are standalone (html.lp-page) and take the tokens defined here:
   cream and gold as the shared ground, a night version behind the same toggle, and one accent
   per page: navy for astrology, brown-gold for tarot, forest green for BaZi. */
html.lp-page{
  --rgb-line:92,74,40; --rgb-text:52,42,26; --rgb-gold:133,101,22; --rgb-teal:19,96,88; --rgb-ink2:255,251,242; --rgb-shadow:90,72,38; --rgb-veil:250,247,240;
  --ink-deep:#e7ddc8; --ink:#f4eee0; --ink2:#fffdf8; --surface:#faf5e9; --surface2:#f6efdf;
  --pure:#221c12; --star:#241e14; --text2:#3a3122; --text3:#4a4030; --dim:#6d6353;
  --gold:#856516; --gold-bright:#9a7413; --on-gold:#fffdf6; --teal:#136058;
  --line:rgba(92,74,40,.18); --gold-soft:rgba(133,101,22,.22);
  --r:18px; --r-md:10px; --r-pill:999px; --h-md:40px; --h-lg:48px;
  --accent:var(--page); --accent-ink:#fffdf6; --btn-ink:var(--text2); --btn-border:rgba(92,74,40,.35);
  --btn-face-hover:rgba(92,74,40,.08); --btn-face-active:rgba(92,74,40,.14); --focus-ring:var(--page);
  --page:#1d2a52; --rgb-page:29,42,82;
  color-scheme:light;
}
html.lp-page[data-page="tarot"]{--page:#7a4f1d; --rgb-page:122,79,29}
html.lp-page[data-page="bazi"]{--page:#1f5a3c; --rgb-page:31,90,60}
html.lp-page[data-theme="dark"]{
  --rgb-line:190,205,255; --rgb-text:223,230,255; --rgb-gold:232,201,122; --rgb-teal:127,200,196; --rgb-ink2:17,23,41; --rgb-shadow:0,0,0; --rgb-veil:11,16,32;
  --ink-deep:#070b16; --ink:#0a0e1a; --ink2:#111729; --surface:#0c1120; --surface2:#10182e;
  --pure:#fff; --star:#f4f0ff; --text2:#c9d4f5; --text3:#b9c3e8; --dim:#8b95b8;
  --gold:#e8c97a; --gold-bright:#ffe0a0; --on-gold:#1a1206; --teal:#7fc8c4;
  --line:rgba(190,205,255,.14); --gold-soft:rgba(232,201,122,.16);
  --accent:var(--gold); --accent-ink:#1a1206; --btn-border:rgba(190,205,255,.32);
  --btn-face-hover:rgba(190,205,255,.10); --btn-face-active:rgba(190,205,255,.16);
  color-scheme:dark;
}
html.lp-page[data-theme="dark"][data-page="tarot"]{--page:#d2a566; --rgb-page:210,165,102}
html.lp-page[data-theme="dark"][data-page="bazi"]{--page:#7fc9a0; --rgb-page:127,201,160}
:where(html.lp-page) *{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
:where(html.lp-page),html.lp-page body{background:var(--ink);color:var(--star);overflow-x:hidden;max-width:100%}
:where(html.lp-page) body{font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;min-height:100dvh;line-height:1.5;-webkit-font-smoothing:antialiased;
  background:radial-gradient(80% 50% at 85% 0%,rgba(var(--rgb-page),.10),transparent 60%),radial-gradient(60% 40% at 0% 30%,rgba(var(--rgb-gold),.08),transparent 60%),var(--ink)}
:where(html.lp-page) h1{font-size:clamp(40px,4.8vw,66px);font-weight:400;letter-spacing:-.01em;line-height:1;font-style:italic}
:where(html.lp-page) a{color:inherit}
:where(html.lp-page) .label{font-family:"SF Mono",ui-monospace,Menlo,monospace;font-size:13.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);font-weight:600}
:where(html.lp-page) .dim{color:var(--dim)}
:where(html.lp-page) .hide{display:none!important}
:where(html.lp-page) .mark{font-size:13px;letter-spacing:.5em;text-transform:uppercase;color:var(--gold)}
:where(html.lp-page) .tag{color:var(--dim)}
:where(html.lp-page) .btn{display:flex;align-items:center;justify-content:center;height:var(--h-lg);background:var(--accent);color:var(--accent-ink);border:1px solid var(--accent);font:inherit;font-weight:600;font-size:16px;letter-spacing:.02em;border-radius:var(--r-md);cursor:pointer;transition:background .13s,border-color .13s,color .13s,transform .13s}
:where(html.lp-page) .btn:hover{filter:brightness(1.08)}
:where(html.lp-page) .btn.ghost{background:transparent;color:var(--btn-ink);border:1px solid var(--btn-border)}
:where(html.lp-page) .btn.ghost:hover{background:var(--btn-face-hover);filter:none}
:where(html.lp-page) .btn:focus-visible,html.lp-page a:focus-visible,html.lp-page button:focus-visible,html.lp-page summary:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
:where(html.lp-page) .themebtn{width:var(--h-md);height:var(--h-md);border-radius:var(--r-pill);background:transparent;border:1px solid transparent;color:var(--gold);font-size:15px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
:where(html.lp-page) .themebtn:hover{background:var(--btn-face-hover);border-color:var(--btn-border)}
:where(html.lp-page) .plan-card{border:1px solid var(--gold-soft);border-radius:14px;padding:14px;background:var(--surface2)}
:where(html.lp-page) .plan-name{color:var(--gold);font-weight:600}
:where(html.lp-page) .plan-desc{color:var(--dim)}
:where(html.lp-page) img.face-art{filter:brightness(.66) saturate(1.3)}
:where(html.lp-page[data-theme="dark"]) img.face-art{filter:drop-shadow(0 0 22px rgba(var(--rgb-gold),.18))}

/* ===== shared components (all three pages) ===== */
.lp{max-width:1280px;margin:0 auto;padding:0 20px 40px}
.lp-nav{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:max(14px,env(safe-area-inset-top)) 0 10px;border-bottom:1px solid var(--line)}
.lp-brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--gold)}
.lp-star{font-size:26px;color:var(--gold);text-shadow:0 0 14px rgba(var(--rgb-gold),.7);line-height:1}
.lp-copy{position:relative}
@keyframes lpFaceIn{from{opacity:0;transform:scale(.96)}to{opacity:var(--faceop);transform:none}}
.lp-copy>*:not(.lp-face-bg){position:relative;z-index:1}
.lp-brand .mark{margin:0;letter-spacing:.42em;font-size:14px}
.lp-brand small{display:block;font-family:"SF Mono",ui-monospace,Menlo,monospace;font-size:9.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--dim);margin-top:2px}
.lp-links{display:flex;align-items:center;gap:26px;font-size:15px}
.lp-links a{color:var(--text2);text-decoration:none}
.lp-links a:hover{color:var(--gold)}
.lp-nav-right{display:flex;align-items:center;gap:10px}
.lp-nav-right .btn{width:auto;height:var(--h-md);padding:0 18px;margin:0;font-size:14.5px}
.lp-nav-right .btn.ghost{color:var(--text2)}
.lp-hero{position:relative;display:grid;grid-template-columns:1fr;gap:18px;align-items:center;padding:22px 0 8px}
.lp-hero>.sky{position:absolute;inset:-60px -20px -40px;pointer-events:none;opacity:.75;z-index:0}
.lp-hero>*{position:relative;z-index:1}
.lp-hero>.sky{z-index:0}
.lp-copy .label{font-size:12px}
.lp-copy h1{font-size:clamp(40px,4.8vw,66px);line-height:1;margin:10px 0 14px;font-weight:400}
.lp-copy .tag{font-size:clamp(16px,1.6vw,20px);line-height:1.55;letter-spacing:0;color:var(--text2);max-width:520px}
.lp-cta{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:22px 0 6px}
.lp-cta .btn{width:auto;min-width:200px;padding:0 26px;margin:0}
.lp-cta .btn.ghost{min-width:0}
.lp-cta .dim{font-size:13px;font-style:italic}
a.btn{text-decoration:none}
/* the control panel: the Today card's own scrubber, house switch and location, re-parented */
.lp-panel{background:rgba(var(--rgb-ink2),.72);backdrop-filter:blur(10px);border:1px solid rgba(var(--rgb-gold),.22);border-radius:22px;padding:20px 22px 18px;margin-top:26px;max-width:560px;box-shadow:0 20px 60px rgba(var(--rgb-shadow),.35)}
.lp-panel .label{font-size:11px;color:var(--gold)}
.lp-panel-grid{display:grid;grid-template-columns:1fr auto;gap:18px;align-items:center}
.lp-date{font-size:clamp(20px,2vw,26px);font-style:italic;line-height:1.15;margin-top:6px;color:var(--star)}
.lp-time{font-family:"SF Mono",ui-monospace,Menlo,monospace;font-size:clamp(30px,3.4vw,42px);font-weight:600;letter-spacing:.02em;line-height:1.1;margin-top:6px;color:var(--gold-bright)}
.lp-time small{font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;font-weight:400;font-size:13px;letter-spacing:0;color:var(--teal);margin-left:8px;font-style:italic;vertical-align:middle}
.lp-time small.stepped{color:var(--gold)}
.lp-time .lp-now{font:inherit;font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;font-size:13px;font-weight:400;letter-spacing:0;background:transparent;border:1px solid var(--line);border-radius:999px;color:var(--text2);padding:3px 10px;margin-left:8px;cursor:pointer;vertical-align:middle}
.lp-time .lp-now:hover{border-color:var(--gold);color:var(--gold)}
.lp-where{color:var(--dim);font-size:13px;font-style:italic;margin-top:8px}
.lp-loclinks{margin-top:2px;font-size:13px}
.lp-loclinks #now-loc{text-align:left!important;margin-top:4px!important}
.lp-loclinks #now-loc-form{max-width:320px}
.lp-panel-foot{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin-top:14px;padding-top:12px;border-top:1px solid var(--line);font-size:12.5px;color:var(--dim)}
.lp-reading{margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}
.lp-reading p{font-size:16px;line-height:1.55;font-style:italic;color:var(--star);margin-top:4px;min-height:2.5em}
.lp-wheel .wheelwrap.wheel-panel{left:auto;transform:none;width:100%;padding:0;margin:0;border:none;background:radial-gradient(circle at 50% 50%,rgba(var(--rgb-line),.10) 0%,rgba(var(--rgb-line),.04) 46%,transparent 70%)}
.lp-wheel svg.wheel{width:100%;max-width:none;aspect-ratio:1}
.lp-wheel{min-height:0}
/* the dial: a globe you spin; one turn is the unit under it */
.dial{position:relative;width:132px;height:132px;touch-action:none;user-select:none;cursor:grab;margin:0 auto}
.dial:active{cursor:grabbing}
.dial svg{width:100%;height:100%;display:block}
.dial .dial-knob{position:absolute;left:50%;top:50%;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:var(--gold-bright);box-shadow:0 0 0 3px rgba(var(--rgb-gold),.28),0 0 12px rgba(var(--rgb-gold),.7);pointer-events:none}
.dial-unit{display:block;margin:8px auto 0;background:transparent;border:1px solid var(--line);color:var(--text2);border-radius:999px;padding:4px 12px;font:inherit;font-size:12.5px;cursor:pointer;white-space:nowrap}
.dial-unit:hover{border-color:var(--gold);color:var(--gold)}
.dial-hint{text-align:center;font-size:11px;color:var(--dim);margin-top:5px;font-style:italic}
@media(max-width:999px){
  .lp-panel{margin-top:6px;padding:14px 16px 14px}
  .lp-panel-grid{grid-template-columns:1fr auto;gap:12px;align-items:center}
  .lp-panel .dial.earth,.lp-panel .dial{width:112px!important;height:112px!important}
  .lp-panel .dial-hint{display:none}
  .lp-panel .dial-unit{font-size:11.5px;padding:3px 9px;margin-top:6px}
  .lp-date{font-size:17px}
  .lp-time{font-size:30px}
  .lp-where{font-size:12px;margin-top:6px}
  .lp-wheel{margin-top:-6px}
}
#today-chart-card.lp-shell{display:none}
@media(min-width:1000px){
  .lp-hero{grid-template-columns:minmax(380px,520px) minmax(0,1fr);gap:36px;min-height:calc(100vh - 90px);padding:12px 0 24px}
  .lp-wheel svg.wheel{width:min(100%,calc(100vh - 130px));margin:0 auto;display:block}
}
@media(max-width:999px){
  .lp-links{display:none}
  .lp-nav-right .btn.ghost{display:none}
  .lp-nav-right .btn{white-space:nowrap;padding:0 14px;font-size:14px}
  .lp-brand small{display:none}
  .lp-hero{padding-top:16px}
  .lp-copy h1{font-size:clamp(40px,11vw,64px)}
  .lp-wheel{order:2}.lp-copy{order:1}.lp-panel{order:3;max-width:none}
  .lp-hero{display:flex;flex-direction:column;align-items:stretch}
}
@media(max-width:560px){.lp-wheel .wheelwrap.wheel-panel{padding:2px;margin:0 -8px;width:auto}}
.lp-sec{padding:44px 0 0;max-width:1100px;margin:0 auto}
.lp-sec h2{font-size:clamp(28px,3.4vw,40px);font-weight:400;font-style:italic;line-height:1.12;margin-bottom:6px}
.lp-sec>p{color:var(--text2);font-size:17px;line-height:1.6;max-width:640px}
.lp-feats{display:grid;grid-template-columns:1fr;gap:14px;margin-top:22px}
@media(min-width:800px){.lp-feats{grid-template-columns:repeat(3,1fr)}}
.lp-feat{background:linear-gradient(180deg,var(--ink2),rgba(var(--rgb-ink2),.6));border:1px solid var(--line);border-radius:var(--r);padding:22px 22px 20px}
.lp-feat .label{font-size:11.5px}
.lp-feat h3{font-size:24px;font-style:italic;font-weight:400;line-height:1.15;margin:10px 0 8px}
.lp-feat p{color:var(--text2);font-size:15.5px;line-height:1.6}
.lp-feat a{color:var(--teal);text-decoration:underline;text-underline-offset:3px;font-size:14.5px}
.lp-ways{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:10px}
.lp-plans{display:grid;grid-template-columns:1fr;gap:12px;margin-top:22px}
@media(min-width:800px){.lp-plans{grid-template-columns:repeat(4,1fr)}}
.lp-plans .plan-card{margin:0;display:flex;flex-direction:column;gap:8px;padding:20px 18px}
.lp-plans .plan-top{display:block}
.lp-plans .plan-name{display:block;font-size:19px}
.lp-plans .plan-price{display:block;margin-top:8px;font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;font-size:34px;font-weight:600;line-height:1;color:var(--gold-bright);text-shadow:0 0 18px rgba(var(--rgb-gold),.35)}
.lp-plans .plan-price small{display:block;font-family:"SF Mono",ui-monospace,Menlo,monospace;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-top:6px;text-shadow:none}
.lp-plans .plan-card{position:relative;transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.lp-plans .plan-card:hover{transform:translateY(-4px);border-color:rgba(var(--rgb-gold),.6);box-shadow:0 18px 40px rgba(var(--rgb-shadow),.4)}
.lp-plans .plan-card.lp-best{border-color:var(--gold);box-shadow:0 0 0 1px rgba(var(--rgb-gold),.35),0 20px 50px rgba(var(--rgb-shadow),.45);background:linear-gradient(180deg,rgba(var(--rgb-gold),.10),var(--surface2))}
.lp-founding{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;margin:22px 0 6px;padding:16px 20px;border-radius:16px;border:1px solid rgba(var(--rgb-gold),.7);background:linear-gradient(90deg,rgba(var(--rgb-gold),.16),rgba(var(--rgb-gold),.05));box-shadow:0 0 40px rgba(var(--rgb-gold),.18)}
.lp-founding-tag{font-family:"SF Mono",ui-monospace,Menlo,monospace;font-size:11px;letter-spacing:.2em;text-transform:uppercase;background:var(--accent);color:var(--accent-ink);border-radius:999px;padding:6px 12px;white-space:nowrap}
.lp-founding-text{flex:1 1 320px;font-size:16px;line-height:1.5;color:var(--text2)}
.lp-founding-text b{color:var(--gold-bright);font-weight:600}
.lp-founding-days{font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;font-style:italic;font-size:18px;color:var(--gold-bright);white-space:nowrap}
.lp-founding .btn{width:auto;margin:0;padding:0 22px;height:var(--h-md);font-size:15px}
@keyframes lpPulse{0%,100%{box-shadow:0 0 0 1px rgba(var(--rgb-gold),.5),0 20px 50px rgba(var(--rgb-shadow),.45)}50%{box-shadow:0 0 0 2px rgba(var(--rgb-gold),.9),0 0 46px rgba(var(--rgb-gold),.35),0 20px 50px rgba(var(--rgb-shadow),.45)}}
.lp-plans .plan-card.lp-founding-card{border-color:var(--gold);background:linear-gradient(180deg,rgba(var(--rgb-gold),.16),var(--surface2));animation:lpPulse 3.2s ease-in-out infinite}
.lp-ribbon-hot{background:var(--gold-bright);color:var(--on-gold);box-shadow:0 0 16px rgba(var(--rgb-gold),.7)}
@media(prefers-reduced-motion:reduce){.lp-plans .plan-card.lp-founding-card{animation:none}}
.lp-ribbon{position:absolute;top:-11px;left:18px;font-family:"SF Mono",ui-monospace,Menlo,monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;background:var(--accent);color:var(--accent-ink);border-radius:999px;padding:4px 10px}
.lp-plans .plan-card .btn.lp-gold{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
/* motion: a quiet entrance on load, features and plans rise in as they scroll into view */
@keyframes lpRise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
/* the headline and its paragraph slide but never start invisible: the largest text on the page must count as painted from the first frame */
@keyframes lpSlide{from{transform:translateY(18px)}to{transform:none}}
@keyframes lpBloom{from{opacity:0;transform:scale(.94)}to{opacity:1;transform:none}}
@keyframes lpSheen{0%{transform:translateX(-140%) skewX(-18deg)}100%{transform:translateX(240%) skewX(-18deg)}}
.lp-copy>*:not(.lp-face-bg){animation:lpRise .8s cubic-bezier(.2,.7,.2,1) both}
.lp-copy>:nth-child(1){animation-delay:.05s}.lp-copy>:nth-child(2){animation-delay:.15s}.lp-copy>:nth-child(3){animation-delay:.28s}.lp-copy>:nth-child(4){animation-delay:.4s}.lp-copy>:nth-child(5){animation-delay:.55s}
.lp-wheel{animation:lpBloom 1.2s cubic-bezier(.2,.7,.2,1) .2s both}
.lp-nav{animation:lpRise .7s ease both}
.lp-in{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
.lp-in.on{opacity:1;transform:none}
.lp-feats .lp-in:nth-child(2){transition-delay:.12s}.lp-feats .lp-in:nth-child(3){transition-delay:.24s}
.lp-plans .lp-in:nth-child(2){transition-delay:.1s}.lp-plans .lp-in:nth-child(3){transition-delay:.2s}.lp-plans .lp-in:nth-child(4){transition-delay:.3s}
.lp-cta .btn:not(.ghost),.lp-nav-right .btn:not(.ghost){position:relative;overflow:hidden}
.lp-cta .btn:not(.ghost)::after,.lp-nav-right .btn:not(.ghost)::after{content:"";position:absolute;top:0;bottom:0;width:40%;left:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);animation:lpSheen 3.6s ease-in-out 1.2s infinite;pointer-events:none}
.lp-feat{transition:transform .25s ease,border-color .25s ease}
.lp-feat:hover{transform:translateY(-3px);border-color:rgba(var(--rgb-gold),.45)}
@media(prefers-reduced-motion:reduce){.lp-copy>*,.lp-wheel,.lp-nav{animation:none}.lp-in{opacity:1;transform:none;transition:none}.lp-cta .btn::after,.lp-nav-right .btn::after{animation:none;display:none}}
/* the Earth: a canvas globe with real coastlines, gold on navy */
.dial.earth{width:164px;height:164px;border-radius:50%;box-shadow:0 0 0 1px rgba(var(--rgb-gold),.25),0 0 40px rgba(var(--rgb-gold),.18),inset 0 0 30px rgba(0,0,0,.4)}
.dial.earth canvas{width:100%;height:100%;display:block;border-radius:50%}
.dial.earth .dial-knob{display:none}
/* section dressing: gold eyebrow, a rule that grows in, aurora washes behind the page */
.lp-eyebrow{font-family:"SF Mono",ui-monospace,Menlo,monospace;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);display:flex;align-items:center;gap:12px;margin-bottom:10px}
.lp-eyebrow::after{content:"";flex:0 0 64px;height:1px;background:linear-gradient(90deg,var(--gold),transparent)}
.lp-wash{position:relative}
.lp-wash::before{content:"";position:absolute;inset:-40px -20vw;background:radial-gradient(60% 50% at 20% 30%,rgba(var(--rgb-gold),.07),transparent 70%),radial-gradient(50% 50% at 85% 70%,rgba(var(--rgb-teal),.07),transparent 70%);pointer-events:none;z-index:0}
.lp-wash>*{position:relative;z-index:1}
.lp-feat{position:relative;overflow:hidden}
.lp-feat::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,var(--gold),transparent 70%);opacity:.7}
.lp-ico{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:rgba(var(--rgb-gold),.10);border:1px solid rgba(var(--rgb-gold),.28);margin-bottom:12px;box-shadow:0 0 22px rgba(var(--rgb-gold),.12)}
.lp-ico svg{width:24px;height:24px}
.lp-seo-grid .lp-in{display:grid;grid-template-columns:40px 1fr;gap:12px;align-items:start}
.lp-seo-grid .lp-ico{width:40px;height:40px;margin:14px 0 0}
/* the showcase: the sky right now on paper, the way it prints */
.lp-show{display:grid;grid-template-columns:1fr;gap:26px;align-items:center;padding:54px 0 0;max-width:1100px;margin:0 auto}
@media(min-width:900px){.lp-show{grid-template-columns:1.1fr 1fr}}
.lp-paper{background:#fffdf8;border-radius:6px;padding:22px 22px 18px;box-shadow:0 30px 80px rgba(0,0,0,.55),0 2px 0 rgba(255,255,255,.6) inset;transform:rotate(-1.2deg);transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.lp-paper:hover{transform:rotate(0deg) scale(1.01)}
.lp-paper svg{width:100%;height:auto;display:block}
.lp-paper svg .gline{stroke:rgba(29,26,20,.55);fill:none}.lp-paper svg .gtick{stroke:rgba(29,26,20,.7)}.lp-paper svg .glyph{fill:#1d1a14}
.lp-paper .lp-paper-h{font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;font-style:italic;color:#1d1a14;font-size:20px;margin-bottom:4px}
.lp-paper .lp-paper-s{font-family:"SF Mono",ui-monospace,Menlo,monospace;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:#7a6a3e;margin-bottom:8px}
.lp-show h2{font-size:clamp(28px,3.4vw,40px);font-weight:400;font-style:italic;line-height:1.12;margin-bottom:10px}
.lp-show p{color:var(--text2);font-size:17px;line-height:1.6}
.lp-show ul{list-style:none;margin:14px 0 0;padding:0;color:var(--text2);font-size:15.5px;line-height:1.9}
.lp-show li::before{content:"✦ ";color:var(--gold)}
.lp-seo{padding:44px 0 0;max-width:1100px;margin:0 auto}
.lp-seo h2{font-size:clamp(28px,3.4vw,40px);font-weight:400;font-style:italic;line-height:1.12;margin-bottom:6px}
.lp-seo>p{color:var(--text2);font-size:17px;line-height:1.6;max-width:640px}
.lp-seo-grid{display:grid;grid-template-columns:1fr;gap:6px 28px;margin-top:18px}
@media(min-width:800px){.lp-seo-grid{grid-template-columns:1fr 1fr}}
.lp-seo-grid h3{font-size:19px;font-style:italic;font-weight:400;margin:14px 0 4px;color:var(--star)}
.lp-seo-grid p{color:var(--text2);font-size:15px;line-height:1.6}
.lp-faq{max-width:760px;margin:0 auto}
.lp-faq details{border-top:1px solid var(--line);padding:12px 0}
.lp-faq summary{cursor:pointer;font-size:18px;font-style:italic;list-style:none;display:flex;justify-content:space-between;gap:12px}
.lp-faq summary::-webkit-details-marker{display:none}
.lp-faq summary::after{content:"+";color:var(--gold);font-style:normal}
.lp-faq details[open] summary::after{content:"–"}
.lp-faq p{color:var(--text2);font-size:15.5px;line-height:1.6;margin-top:8px;max-width:640px}
.lp-plans .plan-desc{font-size:14.5px;line-height:1.55}
.lp-plans .plan-card .btn{margin-top:auto;width:100%}
.lp-data{margin-top:16px;font-size:14.5px;color:var(--dim);font-style:italic;line-height:1.6}
.lp-foot{max-width:1100px;margin:54px auto 0;padding-top:20px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 24px;font-size:13.5px;color:var(--dim);line-height:1.9}
.lp-foot a{color:var(--text2);text-decoration:none}
.lp-foot a:hover{color:var(--gold)}
.lp-foot .lp-links2{display:flex;flex-wrap:wrap;gap:2px 20px}
.lp-foot .lp-fine{flex-basis:100%;margin:2px 0 0;font-size:11px;line-height:1.5;color:var(--dim);opacity:.75}
.lp-panel .hsys-row{justify-content:flex-start}

/* ===== the tarot and BaZi pages ===== */
html.lp-page .lp-main{display:block}
.lp-hero-sub{align-items:center}
/* the sub-page hero sits in the same centred 1100px column as the sections under it, so the words are not pushed to the edge */
@media(min-width:1000px){.lp-hero-sub{max-width:1100px;margin:0 auto;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:56px;min-height:0;padding:40px 0 34px}}
html.lp-page .lp-copy .tag{color:var(--text2)}
html.lp-page .lp-seo-grid .lp-in{display:block}
.lp-across{margin-top:18px;font-size:17px;line-height:1.6;color:var(--text2);max-width:720px}
.lp-across a,html.lp-page .lp-data a{color:var(--page,var(--teal));text-decoration:underline;text-underline-offset:3px}
html.lp-page .lp-founding-card{animation:none}
/* tarot: a deck you tap, a card that turns */
.tr-pull{display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px}
.tr-deck{background:none;border:none;padding:0;cursor:pointer;perspective:1200px;width:min(62vw,250px);aspect-ratio:262/440;display:block}
.tr-deck:disabled{cursor:default}
.tr-card{position:relative;display:block;width:100%;height:100%;transform-style:preserve-3d;transition:transform .9s cubic-bezier(.2,.7,.2,1);border-radius:12px;box-shadow:0 24px 60px rgba(var(--rgb-shadow),.45),6px 6px 0 -1px rgba(var(--rgb-page),.35),12px 12px 0 -2px rgba(var(--rgb-page),.18)}
.tr-deck:not(.flipped):hover .tr-card{transform:translateY(-6px) rotate(-1.5deg)}
.tr-deck.flipped .tr-card{transform:rotateY(180deg);box-shadow:0 24px 60px rgba(var(--rgb-shadow),.45)}
.tr-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:12px;overflow:hidden;border:1px solid rgba(var(--rgb-gold),.5);background:#0b0a20}
.tr-face img{width:100%;height:100%;object-fit:cover;display:block}
.tr-front{transform:rotateY(180deg);background:#f4ecd8}
.tr-result{max-width:420px;min-height:150px}
.tr-name{font-size:28px;font-style:italic;line-height:1.15}
.tr-astro{font-family:"SF Mono",ui-monospace,Menlo,monospace;font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--page,var(--gold));margin-top:4px;min-height:1.2em}
.tr-mean{font-size:16.5px;line-height:1.6;color:var(--text2);margin-top:8px}
.tr-result .btn{margin:14px auto 0;padding:0 24px;width:auto;display:inline-flex}
.tr-map{display:grid;grid-template-columns:1fr;gap:0 28px;margin-top:18px;max-width:760px}
@media(min-width:640px){.tr-map{grid-template-columns:1fr 1fr}}
.tr-map [role="row"]{display:flex;justify-content:space-between;gap:12px;padding:8px 2px;border-top:1px solid var(--line);font-size:16px}
.tr-map [role="row"] span:last-child{font-family:"SF Mono",ui-monospace,Menlo,monospace;font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--page,var(--gold));align-self:center}
/* BaZi: four pillars, the day one ringed in gold */
.bz-hero{width:100%}
.bz-hero-h{display:block;text-align:center}
.bz-hero-h .dim{font-weight:400;letter-spacing:.04em;text-transform:none}
.bz-pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:12px 0 8px}
.bz-pillar{background:linear-gradient(180deg,var(--ink2),rgba(var(--rgb-ink2),.55));border:1px solid var(--line);border-radius:16px;padding:12px 6px 12px;text-align:center;min-height:228px}
.bz-pillar.bz-day{border-color:rgba(var(--rgb-gold),.7);box-shadow:0 0 0 1px rgba(var(--rgb-gold),.25),0 10px 30px rgba(var(--rgb-shadow),.25)}
.bz-pos{font-family:"SF Mono",ui-monospace,Menlo,monospace;font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--dim)}
.bz-han{font-size:clamp(34px,8vw,48px);line-height:1.1;margin-top:6px;font-family:"PingFang TC","Hiragino Sans","Noto Sans CJK TC","Microsoft JhengHei",serif;font-weight:500;min-height:1.1em}
.bz-han.sm{font-size:clamp(30px,7vw,42px)}
.bz-py{font-size:12.5px;line-height:1.3;color:var(--text2);min-height:2.6em;margin-top:2px}
.bz-sep{height:1px;background:var(--line);margin:8px 12px}
.bz-cap{font-size:13px;font-style:italic;color:var(--dim);text-align:center;line-height:1.5;max-width:520px;margin:0 auto}
.c-wood{color:#2f7d3a}.c-fire{color:#b7462e}.c-earth{color:#8a6414}.c-metal{color:#5b6472}.c-water{color:#2456b3}
html[data-theme="dark"] .c-wood{color:#7fcf8a}html[data-theme="dark"] .c-fire{color:#ef8a6a}html[data-theme="dark"] .c-earth{color:#d9b062}html[data-theme="dark"] .c-metal{color:#d7dce8}html[data-theme="dark"] .c-water{color:#7aa7f0}
.bz-dm{margin:18px auto 0;max-width:520px;background:rgba(var(--rgb-ink2),.72);border:1px solid rgba(var(--rgb-page),.35);border-radius:18px;padding:16px 18px}
.bz-dm label{display:block;font-size:11.5px;line-height:1.5}
.bz-dm-row{display:flex;gap:10px;margin-top:10px}
.bz-dm-row input{flex:1 1 auto;min-width:0;height:var(--h-lg);border-radius:var(--r-md);border:1px solid var(--btn-border);background:var(--ink2);color:var(--star);font:inherit;font-size:16px;padding:0 12px}
.bz-dm-row .btn{width:auto;padding:0 20px;margin:0}
.bz-dm-out{display:flex;gap:14px;align-items:flex-start;margin-top:12px;min-height:0}
.bz-dm-out:empty{display:none}
.bz-dm-han{font-size:54px;line-height:1;font-family:"PingFang TC","Hiragino Sans","Noto Sans CJK TC","Microsoft JhengHei",serif}
.bz-dm-name{font-size:20px;font-style:italic;line-height:1.2}
.bz-dm-sub{font-size:14px;color:var(--text2);line-height:1.55;margin-top:4px}
.bz-dm-out .btn{width:auto;display:inline-flex;padding:0 18px;height:var(--h-md);font-size:14.5px;margin-top:10px}

/* page accents over the shared components */
html.lp-page .lp-brand .mark i{font-style:italic;letter-spacing:.12em;text-transform:none;font-size:17px;margin-left:.2em;color:var(--page)}
html.lp-page .lp-links a[aria-current="page"]{color:var(--page);border-bottom:1px solid var(--page)}
html.lp-page .lp-plans .plan-price{color:var(--page);text-shadow:none}
html.lp-page .lp-plans .plan-price small{color:var(--gold)}
html.lp-page .lp-eyebrow{color:var(--page)}
html.lp-page .lp-eyebrow::after{background:linear-gradient(90deg,var(--page),transparent)}
html.lp-page .lp-feat::before{background:linear-gradient(90deg,var(--page),transparent 70%)}
html.lp-page .lp-panel{border-color:rgba(var(--rgb-page),.3)}
@media(max-width:999px){.tr-pull,.bz-hero{order:2}.lp-hero-sub{gap:22px}.bz-pillar{min-height:0;padding:10px 3px}.bz-py{font-size:11px}}

.lp-copy>h1,.lp-copy>.tag{animation-name:lpSlide!important}

/* the nine spreads: three by three, every row the same height, so one long blurb cannot open a gap under its neighbours */
.tr-spreads{gap:4px 32px}
@media(min-width:900px){.lp-seo-grid.tr-spreads{grid-template-columns:repeat(3,1fr);grid-auto-rows:1fr}}

/* the Earth as play button: a row with the rewind switch beside it, and one line of state under it */
.dial-row{display:flex;align-items:center;justify-content:center;gap:12px}
.dial-rew,.dial-rew-balance{flex:0 0 78px}
.dial-rew{height:30px;border-radius:999px;background:transparent;border:1px solid var(--line);color:var(--dim);font:inherit;font-size:12px;cursor:pointer;white-space:nowrap}
.dial-rew:hover{border-color:var(--gold);color:var(--gold)}
.dial-rew.on{background:var(--gold-soft);border-color:var(--gold);color:var(--gold)}
.dial.earth{cursor:pointer;transition:box-shadow .3s ease}
.dial.earth.playing{box-shadow:0 0 0 2px rgba(var(--rgb-gold),.75),0 0 34px rgba(var(--rgb-gold),.38),inset 0 0 22px rgba(0,0,0,.35)!important}
.dial-state{margin-top:6px;font-size:12px;font-style:italic;color:var(--dim);text-align:center;min-height:1.3em}
.lp-panel .dial-rew,.lp-panel .dial-rew-balance{flex-basis:0;width:0;padding:0;border:none;overflow:hidden;display:none}
.lp-panel .dial-state{font-size:11px}
[data-theme="light"] .dial.earth{box-shadow:0 0 0 1px rgba(133,101,22,.35),0 12px 30px rgba(90,72,38,.22),inset 0 0 18px rgba(133,101,22,.10)}
/* the sub-page hero: the words start near the top of the card beside them, not halfway down it */
@media(min-width:1000px){.lp-hero-sub{align-items:start}.lp-hero-sub .lp-copy{padding-top:44px}}

/* phones: the tarot and BaZi heroes read centred, like the card beneath them */
@media(max-width:999px){
  .lp-hero-sub .lp-copy{text-align:center}
  .lp-hero-sub .lp-copy .tag{margin-left:auto;margin-right:auto}
  .lp-hero-sub .lp-cta{justify-content:center}
  .lp-hero-sub .lp-cta .dim{flex-basis:100%;text-align:center}
}

/* each plan's "Read more": the rest of what it includes */
.lp-plans .lp-more{margin:0}
.lp-plans .lp-more summary{font-size:13px}
.lp-plans .lp-more li{font-size:13px;line-height:1.6;color:var(--text2)}
/* Deep Sky: gold like the rest, and every seven seconds or so a rainbow passes over it, through
   the border, the name and the button, with a soft shine across the card */
.lp-plans .plan-card.lp-founding-card{--ds-g:var(--gold-bright)}
[data-theme="light"] .lp-plans .plan-card.lp-founding-card{--ds-g:var(--gold)}
.lp-plans .plan-card.lp-founding-card::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:2px;pointer-events:none;
  background:linear-gradient(90deg,transparent 0%,transparent 38%,#ff8fd0 42%,#ffd36b 46%,#7ef0c0 50%,#7cc4ff 54%,#c29bff 58%,transparent 62%,transparent 100%);
  background-size:300% 100%;background-position:100% 0;animation:dsPass 7s ease-in-out infinite;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
.lp-plans .plan-card.lp-founding-card::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(90deg,transparent 0%,transparent 40%,rgba(255,236,250,.10) 46%,rgba(236,250,255,.16) 50%,rgba(255,250,228,.10) 54%,transparent 62%,transparent 100%);
  background-size:300% 100%;background-position:100% 0;animation:dsPass 7s ease-in-out infinite}
.lp-plans .lp-founding-card .plan-name{background:linear-gradient(100deg,var(--ds-g) 0%,var(--ds-g) 34%,#ff8fd0 40%,#ffd36b 45%,#7ef0c0 50%,#7cc4ff 55%,#c29bff 60%,var(--ds-g) 66%,var(--ds-g) 100%);
  background-size:300% 100%;background-position:100% 0;-webkit-background-clip:text;background-clip:text;color:transparent;display:inline-block;animation:dsPass 7s ease-in-out infinite}
[data-theme="light"] .lp-plans .lp-founding-card .plan-name{background-image:linear-gradient(100deg,var(--ds-g) 0%,var(--ds-g) 34%,#c2338a 40%,#b7791f 45%,#1f8a6a 50%,#2b6cb0 55%,#7048c8 60%,var(--ds-g) 66%,var(--ds-g) 100%)}
.lp-plans .lp-founding-card .btn.lp-gold{background:linear-gradient(100deg,var(--accent) 0%,var(--accent) 34%,#d9579c 40%,#d9a53a 45%,#2fa887 50%,#3d8fd6 55%,#8c62d9 60%,var(--accent) 66%,var(--accent) 100%);
  background-size:300% 100%;background-position:100% 0;border-color:var(--accent);animation:dsPass 7s ease-in-out infinite}
/* five seconds of gold, then the rainbow crosses from right to left */
@keyframes dsPass{0%,72%{background-position:100% 0}100%{background-position:0% 0}}
@media(prefers-reduced-motion:reduce){.lp-plans .plan-card.lp-founding-card::before,.lp-plans .plan-card.lp-founding-card::after,.lp-plans .lp-founding-card .plan-name,.lp-plans .lp-founding-card .btn.lp-gold{animation:none}}