/* AstroMagic: a shared, fixed cosmic environment behind every route. */
:root{--bg:#0b0719;--sky-opacity:.88;--sky-position:70% center;--sky-filter:saturate(.95);--sky-mask:linear-gradient(90deg,transparent 0%,#0005 25%,#000 65%)}
html{background:#0b0719}
body{background:transparent;isolation:isolate}
body:before{display:none}
.page-enter{animation:none}
.cosmos-background{position:fixed;inset:0 0 auto;height:100vh;height:100lvh;z-index:-1;pointer-events:none;overflow:hidden;contain:layout paint;background:#0b0719}
.cosmos-clouds{position:absolute;inset:0;background:url('/assets/nebula.webp') var(--sky-position)/cover no-repeat;opacity:var(--sky-opacity);filter:var(--sky-filter);mask-image:var(--sky-mask);-webkit-mask-image:var(--sky-mask);transition:opacity .65s,filter .65s,background-position .8s}
.cosmos-shade{position:absolute;inset:0;background:linear-gradient(90deg,#0b0719e8 0%,#0b071997 30%,#0b071918 72%),linear-gradient(0deg,#0b071942,transparent 55%)}
.header{background:#170f2b7a}
.wordmark{font-size:27px;letter-spacing:-1.2px;font-weight:500;white-space:nowrap}
.brand-star{font-size:22px}
.hero{min-height:590px;overflow:visible;isolation:auto}
.hero-copy{width:65%;padding:95px 0 100px}
.hero h1{font-size:clamp(55px,5.7vw,85px);text-shadow:0 6px 40px #08031555}
.hero-copy>p{color:#ccc2da}
.hero-footnote{color:#beb0d0}
.intro-strip{background:#21133478;backdrop-filter:blur(18px)}
.practice{background:linear-gradient(135deg,#39205280,#180e2c9c);backdrop-filter:blur(15px)}
.practice-main{background:linear-gradient(135deg,#61408b72,#23133799)}
.approach{background:#1e122e91;backdrop-filter:blur(20px)}
.question-form,.result-sidebar,.journal-entry,.journal-empty{background:#201432a6;backdrop-filter:blur(22px)}
.result-body{background:#150d25ba;backdrop-filter:blur(20px)}
.footer{background:#0d081859;backdrop-filter:blur(12px)}
.footer .wordmark{font-size:24px}
.back-word{font-size:14px;letter-spacing:-.03em}
.design-dialog{max-height:85svh;overflow:auto}
.art-caption{right:8%;bottom:100px;background:linear-gradient(120deg,#9c6ac726,#39244735);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
.practice,.practice-main,.approach,.question-form,.result-sidebar,.journal-entry,.journal-empty,.result-body{background:linear-gradient(120deg,#9c6ac726,#39244735);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-color:#dac3ff30;box-shadow:0 20px 55px #0004,inset 0 1px 0 #edddff18}
.interpretation p{color:#ddd3e8}
@media(min-width:1600px){.hero{min-height:650px}.hero-copy{padding-top:110px}}
@media(max-width:1050px) and (min-width:701px){.hero-copy{width:77%}.hero{min-height:530px}.hero h1{font-size:clamp(50px,6.8vw,70px)}}
@media(max-width:700px){
 .wordmark{font-size:23px;letter-spacing:-.9px;gap:8px}.brand-star{font-size:20px}.header{padding:0 17px}
 .cosmos-clouds{background-position:66% center;mask-image:none;-webkit-mask-image:none;opacity:.66}
 .cosmos-shade{background:linear-gradient(90deg,#0b0719d4,#0b071948),linear-gradient(180deg,#0b071932,transparent 60%)}
 .hero{min-height:0;padding-bottom:38px}.hero-copy{padding:50px 25px 35px;width:100%}.hero h1{font-size:clamp(37px,10vw,58px);line-height:1.15;margin:25px 0 23px}.hero-copy>p{font-size:16px;margin-bottom:28px}.hero .eyebrow{font-size:10px}.hero-footnote{font-size:12px}
 .hero>.art-caption{position:relative;right:auto;bottom:auto;align-self:flex-end;margin:0 25px;max-width:310px;padding:18px;gap:14px}.art-caption span{font-size:14px}.art-caption small{font-size:10px;display:block}
 .intro-strip{margin-top:0}.ritual-shell{padding-top:27px}.back-word{font-size:10px}.footer{gap:22px}.footer .wordmark{font-size:23px}.footer p{width:auto}.footer>span{font-size:12px}
}



/* Constant-size texture: avoid repeated scaling, filters and masks on the moving layer. */
.cosmos-clouds{inset:-8%;filter:none;mask-image:none;-webkit-mask-image:none;transition:none;transform:translate3d(0,-20px,0);animation:nebula-orbit 40s linear infinite;will-change:transform;backface-visibility:hidden}
.art-caption{animation:none}
@media(max-width:700px){.cosmos-clouds{animation-name:nebula-orbit-mobile;animation-duration:28s}}
@keyframes nebula-orbit{
0%{transform:translate3d(0.0000px,-20.0000px,0)}
3.125%{transform:translate3d(6.6331px,-19.6157px,0)}
6.25%{transform:translate3d(13.0112px,-18.4776px,0)}
9.375%{transform:translate3d(18.8894px,-16.6294px,0)}
12.5%{transform:translate3d(24.0416px,-14.1421px,0)}
15.625%{transform:translate3d(28.2700px,-11.1114px,0)}
18.75%{transform:translate3d(31.4119px,-7.6537px,0)}
21.875%{transform:translate3d(33.3467px,-3.9018px,0)}
25%{transform:translate3d(34.0000px,-0.0000px,0)}
28.125%{transform:translate3d(33.3467px,3.9018px,0)}
31.25%{transform:translate3d(31.4119px,7.6537px,0)}
34.375%{transform:translate3d(28.2700px,11.1114px,0)}
37.5%{transform:translate3d(24.0416px,14.1421px,0)}
40.625%{transform:translate3d(18.8894px,16.6294px,0)}
43.75%{transform:translate3d(13.0112px,18.4776px,0)}
46.875%{transform:translate3d(6.6331px,19.6157px,0)}
50%{transform:translate3d(0.0000px,20.0000px,0)}
53.125%{transform:translate3d(-6.6331px,19.6157px,0)}
56.25%{transform:translate3d(-13.0112px,18.4776px,0)}
59.375%{transform:translate3d(-18.8894px,16.6294px,0)}
62.5%{transform:translate3d(-24.0416px,14.1421px,0)}
65.625%{transform:translate3d(-28.2700px,11.1114px,0)}
68.75%{transform:translate3d(-31.4119px,7.6537px,0)}
71.875%{transform:translate3d(-33.3467px,3.9018px,0)}
75%{transform:translate3d(-34.0000px,0.0000px,0)}
78.125%{transform:translate3d(-33.3467px,-3.9018px,0)}
81.25%{transform:translate3d(-31.4119px,-7.6537px,0)}
84.375%{transform:translate3d(-28.2700px,-11.1114px,0)}
87.5%{transform:translate3d(-24.0416px,-14.1421px,0)}
90.625%{transform:translate3d(-18.8894px,-16.6294px,0)}
93.75%{transform:translate3d(-13.0112px,-18.4776px,0)}
96.875%{transform:translate3d(-6.6331px,-19.6157px,0)}
100%{transform:translate3d(-0.0000px,-20.0000px,0)}
}
@keyframes nebula-orbit-mobile{
0%{transform:translate3d(0.0000px,-18.0000px,0)}
3.125%{transform:translate3d(5.4625px,-17.6541px,0)}
6.25%{transform:translate3d(10.7151px,-16.6298px,0)}
9.375%{transform:translate3d(15.5560px,-14.9665px,0)}
12.5%{transform:translate3d(19.7990px,-12.7279px,0)}
15.625%{transform:translate3d(23.2811px,-10.0003px,0)}
18.75%{transform:translate3d(25.8686px,-6.8883px,0)}
21.875%{transform:translate3d(27.4620px,-3.5116px,0)}
25%{transform:translate3d(28.0000px,-0.0000px,0)}
28.125%{transform:translate3d(27.4620px,3.5116px,0)}
31.25%{transform:translate3d(25.8686px,6.8883px,0)}
34.375%{transform:translate3d(23.2811px,10.0003px,0)}
37.5%{transform:translate3d(19.7990px,12.7279px,0)}
40.625%{transform:translate3d(15.5560px,14.9665px,0)}
43.75%{transform:translate3d(10.7151px,16.6298px,0)}
46.875%{transform:translate3d(5.4625px,17.6541px,0)}
50%{transform:translate3d(0.0000px,18.0000px,0)}
53.125%{transform:translate3d(-5.4625px,17.6541px,0)}
56.25%{transform:translate3d(-10.7151px,16.6298px,0)}
59.375%{transform:translate3d(-15.5560px,14.9665px,0)}
62.5%{transform:translate3d(-19.7990px,12.7279px,0)}
65.625%{transform:translate3d(-23.2811px,10.0003px,0)}
68.75%{transform:translate3d(-25.8686px,6.8883px,0)}
71.875%{transform:translate3d(-27.4620px,3.5116px,0)}
75%{transform:translate3d(-28.0000px,0.0000px,0)}
78.125%{transform:translate3d(-27.4620px,-3.5116px,0)}
81.25%{transform:translate3d(-25.8686px,-6.8883px,0)}
84.375%{transform:translate3d(-23.2811px,-10.0003px,0)}
87.5%{transform:translate3d(-19.7990px,-12.7279px,0)}
90.625%{transform:translate3d(-15.5560px,-14.9665px,0)}
93.75%{transform:translate3d(-10.7151px,-16.6298px,0)}
96.875%{transform:translate3d(-5.4625px,-17.6541px,0)}
100%{transform:translate3d(-0.0000px,-18.0000px,0)}
}
:root[data-background-paused=true] .cosmos-clouds{animation-play-state:paused}
:root[data-motion=off] .cosmos-clouds{animation:none;transform:none;will-change:auto}
@media(prefers-reduced-motion:reduce){.cosmos-clouds{animation:none;transform:none;will-change:auto}}

/* Symbol and editable name are independent parts of the brand lockup. */
.wordmark{gap:12px}.brand-mark{display:block;width:46px;height:46px;flex:none}.brand-name{display:block}.footer .brand-mark{width:39px;height:39px}
@media(max-width:700px){.wordmark{gap:9px}.brand-mark{width:37px;height:37px}.footer .brand-mark{width:34px;height:34px}}

/* Small material illustrations match the Tarot objects. */
.practice-art{position:absolute;right:22px;top:49px;width:170px;height:170px;object-fit:contain;pointer-events:none;filter:drop-shadow(0 12px 15px #09031480);transition:transform .4s}
.practice:hover .practice-art{transform:translateY(-4px) rotate(2deg)}
@media(min-width:701px) and (max-width:1050px){.practice-art{width:140px;height:140px;right:15px;top:52px}}
@media(max-width:700px){.practice:has(.practice-art){min-height:250px}.practice-art{width:142px;height:142px;right:21px;top:42px}.practice:has(.practice-art) .practice-bottom{margin-top:auto}.practice:has(.practice-art) h3{max-width:100%}}
@media(max-width:700px){.practice-grid .practice{min-height:290px}.practice-grid .mini-cards{top:58px}.practice-art{top:48px;width:138px;height:138px}}
@media(min-width:1051px){.practice-art{width:150px;height:150px;top:49px;right:25px}}

/* Firefox WebRender can snap slow axis-aligned movement to whole pixels.
   A constant tiny rotation forces fractional texture sampling (Mozilla 2069657).
   This is not a rotating animation; the orbit and duration stay unchanged. */
@supports (-moz-appearance:none){
 .cosmos-clouds{rotate:0.1deg}
 :root[data-motion=off] .cosmos-clouds{rotate:none}
 @media(prefers-reduced-motion:reduce){.cosmos-clouds{rotate:none}}
}