.welcome-screen { position:fixed; z-index:100; inset:0; display:grid; place-items:center; min-height:100dvh; padding:28px; overflow:auto; background:#080912; transition:opacity .8s ease,visibility .8s ease; }
.welcome-screen::before { content:""; position:fixed; inset:0; opacity:.38; pointer-events:none; background:radial-gradient(circle at 22% 20%,#31507555,transparent 34%),radial-gradient(circle at 78% 75%,#7c542e33,transparent 32%); }
.welcome-aura { position:fixed; width:min(86vw,900px); aspect-ratio:1; pointer-events:none; border:1px solid #c8a66a18; border-radius:50%; box-shadow:0 0 0 70px #c8a66a08,0 0 0 140px #c8a66a04; animation:welcomeAura 8s ease-in-out infinite; }
.welcome-content { position:relative; z-index:1; display:grid; grid-template-columns:minmax(300px,610px) minmax(310px,430px); align-items:center; gap:clamp(36px,6vw,90px); width:min(1120px,100%); margin:auto; }
.welcome-art { display:block; overflow:hidden; border:1px solid #c8a66a55; box-shadow:0 35px 90px #000,0 0 60px #273b5a55; animation:welcomeArt 1.1s cubic-bezier(.2,.75,.25,1) both; }
.welcome-art img { display:block; width:100%; height:auto; }
.welcome-copy { animation:welcomeCopy .9s .25s ease both; }
.welcome-copy h1 { margin:14px 0 24px; font-size:clamp(52px,7vw,86px); }
.welcome-copy>p:not(.eyebrow) { max-width:390px; margin:0 0 30px; color:#a9a2ad; font-size:14px; line-height:1.8; }
.welcome-skip { position:fixed; z-index:2; right:28px; bottom:22px; padding:10px 0; color:#77717d; background:none; border-bottom:1px solid #ffffff18; font-size:9px; }
.welcome-skip:hover,.welcome-skip:focus-visible { color:var(--ink); outline:0; border-color:var(--gold); }
.welcome-screen.leaving { opacity:0; visibility:hidden; pointer-events:none; }
.welcome-seen .welcome-screen { display:none; }
body.welcome-open { overflow:hidden; }
.welcome-seen body.welcome-open { overflow:auto; }
@keyframes welcomeAura { 50%{opacity:.5;transform:scale(1.04)} }
@keyframes welcomeArt { from{opacity:0;transform:translateY(24px) scale(.975)} }
@keyframes welcomeCopy { from{opacity:0;transform:translateX(20px)} }
@media(max-width:820px){.welcome-screen{align-items:start;padding:18px 18px 80px}.welcome-content{grid-template-columns:1fr;gap:30px;max-width:620px}.welcome-art{width:min(100%,520px);margin:auto}.welcome-copy{text-align:center}.welcome-copy>p:not(.eyebrow){margin-inline:auto}.welcome-copy h1{font-size:clamp(46px,13vw,70px)}.welcome-skip{right:50%;transform:translateX(50%)}}
@media(max-width:430px){.welcome-screen{padding:12px 12px 70px}.welcome-content{gap:22px}.welcome-copy h1{margin:8px 0 16px}.welcome-copy>p:not(.eyebrow){margin-bottom:21px;font-size:12px}.welcome-copy .ritual-button{width:100%}}
@media(prefers-reduced-motion:reduce){.welcome-aura,.welcome-art,.welcome-copy{animation:none}.welcome-screen{transition:none}}

:root { --ink:#eee7d7; --muted:#aaa3b1; --gold:#c8a66a; --night:#0e0b18; --panel:#171224; }
* { box-sizing:border-box; }
[hidden] { display:none!important; }
html { min-height:100%; background:var(--night); }
body { margin:0; min-height:100vh; color:var(--ink); font-family:Manrope,sans-serif; background:radial-gradient(circle at 50% 32%,#29203b 0,#151021 32%,#0e0b18 68%); }
body::before { content:""; position:fixed; inset:0; pointer-events:none; opacity:.28; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.13'/%3E%3C/svg%3E"); }
main { position:relative; width:min(1180px,calc(100% - 36px)); margin:auto; }
.masthead { min-height:116px; display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:12px 20px; padding:16px 0 12px; border-bottom:1px solid #ffffff17; }
.masthead p, footer { color:#88818f; font-size:11px; letter-spacing:.16em; text-transform:uppercase; }
.brand { grid-column:1; color:var(--ink); text-decoration:none; white-space:nowrap; font:600 19px/1 "Cormorant Garamond",serif; letter-spacing:.32em; }
.brand span { color:var(--gold); }
.language-picker { grid-column:2; justify-self:end; }
.language-picker select { padding:9px 25px 9px 9px; color:var(--gold); background:#120e1b; border:1px solid #c8a66a44; outline:0; font:600 10px/1 Manrope,sans-serif; }
.language-picker select:focus { border-color:var(--gold); }
.mode-nav { grid-column:1/-1; display:flex; justify-content:center; align-items:stretch; flex-wrap:nowrap; gap:8px; min-width:0; }
.mode-button { padding:10px 15px; color:#807888; background:transparent; border:1px solid transparent; }
.mode-button:hover,.mode-button.active { color:var(--ink); border-color:#c8a66a55; background:#c8a66a0b; }
.music-controls { display:flex; align-items:stretch; gap:6px; }
.music-controls select { max-width:185px; padding:0 28px 0 10px; color:#aaa1af; background:#120e1b; border:1px solid #ffffff12; outline:0; font:500 10px/1.2 Manrope,sans-serif; letter-spacing:.04em; }
.music-controls select:hover,.music-controls select:focus { color:var(--ink); border-color:#c8a66a55; }
.sr-only { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
.sound-button { display:flex; align-items:center; gap:7px; padding:10px 12px; color:#807888; background:transparent; border:1px solid #ffffff12; }
.sound-button span { color:var(--gold); font-size:16px; }
.sound-button:disabled { opacity:.4; cursor:default; }
.sound-button:hover:not(:disabled),.sound-button.playing { color:var(--ink); border-color:#c8a66a55; }
.sound-button.playing span { animation:soundPulse 1.8s ease-in-out infinite; }
@keyframes soundPulse { 50%{ opacity:.45; transform:scale(.82); } }
.experience { min-height:calc(100vh - 142px); display:grid; grid-template-columns:minmax(280px,1fr) 380px minmax(340px,1.15fr); gap:42px; align-items:center; padding:28px 0; }
.experience .intro { grid-column:1/-1; width:min(900px,100%); margin:0 auto -10px; text-align:center; }
.experience .intro .lead { max-width:760px; margin-inline:auto; }
.experience .table-wrap { grid-column:2; }
.experience .controls { grid-column:3; }
.experience>.reading { grid-column:1/-1; width:min(820px,100%); margin-inline:auto; }
.eyebrow { color:var(--gold); font-size:11px; letter-spacing:.2em; text-transform:uppercase; }
h1,h2 { font-family:"Cormorant Garamond",serif; font-weight:500; margin:16px 0; line-height:.92; }
h1 { font-size:clamp(48px,6vw,82px); }
h1 em { color:var(--gold); font-weight:500; }
.lead,.meaning { color:var(--muted); line-height:1.8; font-size:14px; max-width:430px; }
.table-wrap { position:relative; width:380px; height:560px; display:grid; place-items:center; }
#game { position:relative; z-index:2; width:330px; height:550px; filter:drop-shadow(0 28px 28px #000a); perspective:1200px; }
.tarot-card { position:relative; width:100%; height:100%; padding:0; border:0; background:none; transform-style:preserve-3d; cursor:pointer; transition:transform .72s cubic-bezier(.2,.75,.25,1); }
.tarot-card.revealed { transform:rotateY(180deg); }
.card-face { position:absolute; inset:0; display:grid; place-items:center; overflow:hidden; border:2px solid #b99a62; border-radius:12px; backface-visibility:hidden; -webkit-backface-visibility:hidden; }
.card-back { background:repeating-linear-gradient(45deg,#171020 0 9px,#1e162b 9px 18px); box-shadow:inset 0 0 0 10px #171020,inset 0 0 0 11px #8e744b; }
.back-ring { display:grid; place-items:center; width:42%; aspect-ratio:1; color:#c8a66a; font-size:36px; border:1px solid #b99a62; border-radius:50%; box-shadow:0 0 0 9px #171020,0 0 0 10px #6f5a3d; }
.card-front { border-color:#d5bc86; background:#e8d8ad; transform:rotateY(180deg); }
.card-front img { display:block; width:100%; height:100%; object-fit:contain; background:#120e1b; }
.orbit { position:absolute; pointer-events:none; border:1px solid #c8a66a1f; border-radius:50%; }
.orbit-one { width:520px; height:520px; }
.orbit-two { width:440px; height:440px; border-style:dashed; animation:spin 50s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }
.controls { text-align:center; }
button { border:0; font:600 12px/1 Manrope,sans-serif; letter-spacing:.14em; text-transform:uppercase; cursor:pointer; }
.tarot-actions { display:flex; justify-content:center; flex-wrap:wrap; gap:10px; }
#drawButton { padding:20px 28px; min-width:220px; color:#17111f; background:linear-gradient(135deg,#e2c98f,#a98145); box-shadow:0 12px 35px #0008; clip-path:polygon(8px 0,calc(100% - 8px) 0,100% 8px,100% calc(100% - 8px),calc(100% - 8px) 100%,8px 100%,0 calc(100% - 8px),0 8px); transition:.25s; }
#drawButton:hover { transform:translateY(-3px); filter:brightness(1.08); }
#dailyCardButton { padding:18px 22px; color:#d6c39a; background:#171221; border:1px solid #c8a66a66; transition:.25s; }
#dailyCardButton:hover { transform:translateY(-3px); color:var(--ink); border-color:var(--gold); background:#21192d; }
#threeCardButton { padding:18px 22px; color:#d6c39a; background:#171221; border:1px solid #c8a66a66; transition:.25s; }
#threeCardButton:hover { transform:translateY(-3px); color:var(--ink); border-color:var(--gold); background:#21192d; }
.three-card-reading { grid-column:1/-1; width:100%; padding:20px 0 40px; animation:reveal .7s ease both; }
.three-card-heading { max-width:700px; margin:0 auto 34px; text-align:center; }
.three-card-heading h2 { margin:10px 0; }
.three-card-heading>p:last-child { color:var(--muted); }
.three-card-spread { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; align-items:start; }
.spread-card { overflow:hidden; background:linear-gradient(145deg,#1b1528,#100c18); border:1px solid #c8a66a38; box-shadow:0 24px 50px #0006; animation:spreadReveal .7s ease both; animation-delay:var(--reveal-delay); }
@keyframes spreadReveal { from { opacity:0; transform:translateY(24px) rotateY(-8deg); } }
.spread-card>.eyebrow { margin:0; padding:17px 20px; text-align:center; border-bottom:1px solid #ffffff12; }
.spread-card-image { aspect-ratio:2/3; margin:18px; overflow:hidden; border:1px solid #b99a62; border-radius:8px; background:#120e1b; }
.spread-card-image img { display:block; width:100%; height:100%; object-fit:contain; }
.spread-card-copy { position:relative; padding:4px 22px 24px; }
.spread-card-copy h3 { margin:5px 38px 8px 0; color:#ead9b1; font:500 31px/.95 "Cormorant Garamond",serif; }
.spread-number { position:absolute; top:6px; right:22px; color:#6f6875; font:500 24px/1 "Cormorant Garamond",serif; }
.spread-card .meaning { min-height:110px; font-size:12px; line-height:1.7; }
.spread-position { margin:18px 0; padding:14px; background:#ffffff05; border-top:1px solid #c8a66a33; }
.spread-position strong { color:var(--gold); font:500 17px/1.2 "Cormorant Garamond",serif; }
.spread-position p { margin:7px 0 0; color:#948b99; font-size:11px; line-height:1.6; }
.spread-card .reflection { margin:16px 0 0; }
.spread-card .reflection p { font-size:16px; }
.three-card-actions { justify-content:center; margin-top:28px; }
@media(max-width:900px){.three-card-spread{grid-template-columns:repeat(3,minmax(220px,1fr));overflow-x:auto;padding-bottom:16px}.spread-card .meaning{min-height:0}}
@media(max-width:700px){.three-card-spread{grid-template-columns:1fr;overflow:visible}.spread-card{display:grid;grid-template-columns:minmax(150px,.75fr) 1fr}.spread-card>.eyebrow{grid-column:1/-1}.spread-card-image{align-self:start}.spread-card-copy{padding-top:18px}}
@media(max-width:480px){.spread-card{display:block}.spread-card-image{max-width:260px;margin-inline:auto}.spread-card-copy{padding-top:4px}}

#drawButton:disabled { opacity:.55; cursor:wait; }
.controls p { margin-top:18px; color:#77717d; font-size:11px; }
.reading { animation:reveal .7s ease both; }
@keyframes reveal { from { opacity:0; transform:translateY(18px); } }
.reading-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; }
h2 { font-size:52px; }
.number { margin:0; color:#5f5868; font:500 42px/1 "Cormorant Garamond",serif; }
.divider { display:flex; align-items:center; gap:10px; color:var(--gold); }
.divider::before,.divider::after { content:""; height:1px; background:#ffffff18; flex:1; }
.keywords { color:#d2b77f; font:500 17px/1.5 "Cormorant Garamond",serif; }
.reflection { margin:26px 0; padding:16px 18px; border-left:1px solid var(--gold); background:#ffffff05; }
.reflection span { color:#756d7d; font-size:10px; letter-spacing:.16em; text-transform:uppercase; }
.reflection p { margin:8px 0 0; font:500 19px/1.35 "Cormorant Garamond",serif; }
.again { padding:10px 0; color:#aaa1af; background:none; border-bottom:1px solid #706879; }
.sigil-view { min-height:calc(100vh - 142px); padding:64px 0 80px; }
.sigil-hero { display:grid; grid-template-columns:1fr 1fr; align-items:end; gap:40px; margin-bottom:42px; }
.sigil-hero .eyebrow,.sigil-hero h1 { grid-column:1; }
.sigil-hero h1 { margin-top:0; }
.sigil-hero .lead { grid-column:2; grid-row:1 / span 2; }
.sigil-toolbar { display:flex; align-items:center; gap:20px; padding:16px 0 22px; border-top:1px solid #ffffff14; }
.sigil-toolbar label { color:#82798a; font-size:10px; letter-spacing:.16em; text-transform:uppercase; }
.sigil-toolbar input { width:min(360px,100%); padding:12px 4px; color:var(--ink); background:transparent; border:0; border-bottom:1px solid #766447; outline:0; font:14px Manrope,sans-serif; }
.sigil-toolbar input:focus { border-color:var(--gold); }
.sigil-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.sigil-tile { min-width:0; padding:0; color:var(--ink); text-align:left; background:#171221; border:1px solid #ffffff12; overflow:hidden; transition:.25s; }
.sigil-tile:hover { transform:translateY(-4px); border-color:#c8a66a77; box-shadow:0 18px 35px #0007; }
.sigil-thumb { display:grid; place-items:center; width:100%; aspect-ratio:1.18; padding:14px; background:linear-gradient(145deg,#d9c9a3,#aa9874); }
.sigil-thumb img { width:100%; height:100%; object-fit:contain; mix-blend-mode:multiply; }
.sigil-label { display:flex; align-items:center; justify-content:space-between; padding:15px 16px; }
.sigil-label strong { font:500 21px/1 "Cormorant Garamond",serif; text-transform:none; letter-spacing:0; }
.sigil-label span { color:var(--gold); }
.sigil-empty { grid-column:1/-1; padding:50px; color:var(--muted); text-align:center; }
.sigil-modal { position:fixed; z-index:20; inset:0; display:grid; place-items:center; padding:24px; }
.sigil-modal[hidden] { display:none; }
.sigil-modal-backdrop { position:absolute; inset:0; background:#08060dd9; backdrop-filter:blur(8px); }
.sigil-detail { position:relative; z-index:1; display:grid; grid-template-columns:minmax(280px,1fr) minmax(300px,.9fr); width:min(900px,100%); max-height:calc(100vh - 48px); overflow:auto; background:#171221; border:1px solid #c8a66a55; box-shadow:0 35px 90px #000; }
.sigil-art { position:relative; display:grid; place-items:center; min-height:500px; padding:32px; overflow:hidden; perspective:1100px; background:radial-gradient(circle at 50% 40%,#e8d9b4,#9e8a67); }
.sigil-art img { width:100%; height:100%; max-height:520px; object-fit:contain; mix-blend-mode:multiply; backface-visibility:hidden; will-change:transform,filter; }
.sigil-art.rolling img { animation:rollPaper 1.65s cubic-bezier(.65,.02,.2,1) forwards; }
.sigil-art.rolled img,.sigil-art.sealed img { transform:scaleX(.16) rotateY(-8deg); filter:sepia(.38) brightness(.76); }
.scroll-edge { position:absolute; z-index:3; top:15%; width:19px; height:70%; opacity:0; border-radius:50%; background:linear-gradient(90deg,#675233,#dbc89d 45%,#6e5838); box-shadow:0 7px 18px #32200faa,inset 3px 0 5px #f1e3ba88; }
.scroll-edge-left { left:calc(50% - 21px); }
.scroll-edge-right { right:calc(50% - 21px); }
.sigil-art.rolling .scroll-edge { animation:showRollEdges 1.65s ease forwards; }
.sigil-art.rolled .scroll-edge,.sigil-art.sealed .scroll-edge { opacity:1; }
.wax-seal { position:absolute; z-index:5; left:50%; top:53%; display:grid; place-items:center; width:72px; aspect-ratio:1; opacity:0; color:#e3b689; border-radius:46% 54% 48% 52%; background:radial-gradient(circle at 38% 30%,#c4533e,#7e1f20 58%,#3b0d12); box-shadow:0 8px 15px #26060c99,inset 0 0 0 5px #68191d,inset 0 0 0 7px #d17b5a55; transform:translate(-50%,-50%) scale(2.4) rotate(-14deg); }
.wax-seal span { display:grid; place-items:center; width:42px; aspect-ratio:1; color:#4f1216; border:2px solid #64181b; border-radius:50%; font-size:24px; text-shadow:0 1px #e58b6d55; }
.sigil-art.sealing .wax-seal { animation:stampWax .7s cubic-bezier(.25,.9,.25,1.25) forwards; }
.sigil-art.sealed .wax-seal { opacity:1; transform:translate(-50%,-50%) scale(1) rotate(-8deg); }
@keyframes rollPaper {
  0% { transform:scaleX(1) rotateY(0); filter:none; }
  35% { transform:scaleX(.72) rotateY(-3deg); filter:sepia(.08); }
  70% { transform:scaleX(.34) rotateY(-7deg); filter:sepia(.25) brightness(.88); }
  100% { transform:scaleX(.16) rotateY(-8deg); filter:sepia(.38) brightness(.76); }
}
@keyframes showRollEdges { 0%,35%{opacity:0;transform:scaleX(.2)} 100%{opacity:1;transform:scaleX(1)} }
@keyframes stampWax { 0%{opacity:0;transform:translate(-50%,-50%) scale(2.4) rotate(-14deg)} 65%{opacity:1;transform:translate(-50%,-50%) scale(.82) rotate(-8deg)} 100%{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(-8deg)} }
.sigil-copy { align-self:center; padding:45px; }
.trace-instruction { display:flex; gap:13px; align-items:flex-start; margin:22px 0; padding:15px 16px; color:#c6bba8; background:#c8a66a0b; border:1px solid #c8a66a2e; line-height:1.65; font-size:13px; }
.trace-instruction p { margin:0; }
.trace-instruction strong { color:#ddc58f; font-weight:600; }
.trace-symbol { flex:0 0 auto; color:var(--gold); font:28px/1 "Cormorant Garamond",serif; }
.sigil-close { position:absolute; z-index:2; top:14px; right:16px; width:36px; height:36px; color:#d4c8b4; background:#0e0b18aa; border:1px solid #ffffff20; border-radius:50%; font-size:24px; }
.ritual-button { padding:18px 22px; color:#17111f; background:linear-gradient(135deg,#e2c98f,#a98145); }
.ritual-button:disabled { cursor:wait; opacity:.65; }
.sigil-chosen { color:#d6bf8b; line-height:1.65; animation:reveal .5s ease both; }
body.modal-open { overflow:hidden; }
.bones-view { min-height:calc(100vh - 142px); padding:55px 0 80px; }
.bones-heading { display:grid; grid-template-columns:1fr minmax(320px,.72fr); gap:60px; align-items:end; margin-bottom:28px; }
.bones-heading h1 { margin-bottom:0; }
.bones-question { display:grid; gap:12px; padding-bottom:12px; }
.bones-question label { color:var(--gold); font-size:10px; letter-spacing:.17em; text-transform:uppercase; }
.bones-question input { padding:14px 2px; color:var(--ink); background:transparent; border:0; border-bottom:1px solid #786747; outline:0; font:15px Manrope,sans-serif; }
.bones-question input:focus { border-color:var(--gold); }
.bones-table { position:relative; height:min(58vh,590px); min-height:420px; overflow:hidden; background:radial-gradient(ellipse at 50% 45%,#30233b,#15101f 65%); border:1px solid #ffffff12; box-shadow:inset 0 0 90px #08050e; }
#bonesScene,#bonesScene canvas { width:100%; height:100%; display:block; }
.bones-loader { position:absolute; inset:0; display:grid; place-content:center; justify-items:center; gap:15px; color:#a39aa8; background:#110d19e8; transition:.4s; }
.bones-loader.done { opacity:0; pointer-events:none; }
.bones-loader.error span { display:none; }
.bones-loader.error p { max-width:420px; padding:0 24px; color:#d9b58d; text-align:center; line-height:1.6; }
.bones-loader span { width:42px; height:42px; border:1px solid #c8a66a44; border-top-color:var(--gold); border-radius:50%; animation:spin 1s linear infinite; }
.bones-loader p { font-size:12px; letter-spacing:.08em; }
.bones-loader b { color:var(--gold); }
.bones-result { display:grid; grid-template-columns:1.15fr .85fr; gap:45px; padding:32px 0; animation:reveal .6s ease both; }
.bone-faces { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
.bone-face { padding:17px 12px; text-align:center; background:#171221; border:1px solid #ffffff12; }
.bone-face span { display:block; color:#776c79; font-size:9px; letter-spacing:.14em; text-transform:uppercase; }
.bone-face strong { display:block; margin:9px 0 6px; color:#dec891; font:500 25px/1 "Cormorant Garamond",serif; }
.bone-face small { color:#948b98; }
.bones-verdict h2 { margin-top:10px; }
.bones-verdict .eyebrow span { margin-left:8px; color:var(--ink); }
.bones-legend { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; margin-top:12px; background:#ffffff12; border:1px solid #ffffff12; }
.bones-legend div { position:relative; padding:18px; background:#120e1b; }
.bones-legend strong { color:#d8c18b; font:500 22px/1 "Cormorant Garamond",serif; }
.bones-legend span { position:absolute; top:18px; right:18px; color:#7f7585; font-size:11px; }
.bones-legend p { margin:10px 0 0; color:#8e8593; font-size:11px; line-height:1.65; }

.horoscope-view { min-height:calc(100vh - 142px); padding:64px 0 80px; }
.horoscope-heading { display:grid; grid-template-columns:1fr minmax(300px,.72fr); gap:70px; align-items:end; }
.zodiac-picker { display:grid; gap:12px; padding:24px; background:#171221; border:1px solid #ffffff12; }
.zodiac-picker label { color:var(--gold); font-size:10px; letter-spacing:.17em; text-transform:uppercase; }
.zodiac-picker select { width:100%; padding:14px 8px; color:var(--ink); background:#100c19; border:0; border-bottom:1px solid #786747; outline:0; font:15px Manrope,sans-serif; }
.horoscope-reading { margin-top:42px; padding:34px; background:linear-gradient(145deg,#1b1528,#120e1b); border:1px solid #c8a66a3b; animation:reveal .6s ease both; }
.horoscope-title { display:flex; align-items:center; gap:24px; }
#horoscopeSymbol { display:grid; place-items:center; width:82px; aspect-ratio:1; color:var(--gold); border:1px solid #c8a66a66; border-radius:50%; font:42px/1 serif; }
.horoscope-title h2 { margin:7px 0 0; }
.horoscope-title .eyebrow { margin:0; }
.horoscope-daily-title { margin:28px 0 4px; color:var(--gold); font:600 13px/1.4 Manrope,sans-serif; letter-spacing:.16em; text-transform:uppercase; }
.horoscope-summary { max-width:780px; margin:4px 0 32px; color:#ded3bf; font:500 clamp(23px,3vw,34px)/1.35 "Cormorant Garamond",serif; }
.horoscope-aspects { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:#ffffff12; border:1px solid #ffffff12; }
.horoscope-aspects section { padding:24px; background:#120e1b; }
.horoscope-aspects span { color:var(--gold); font-size:20px; }
.horoscope-aspects h3 { margin:13px 0 10px; color:#dec891; font:500 24px/1 "Cormorant Garamond",serif; }
.horoscope-aspects p { margin:0; color:#9f96a4; font-size:13px; line-height:1.7; }
.horoscope-note { margin:22px 0 0; color:#6f6875; font-size:10px; line-height:1.6; }

.reading-actions { display:flex; flex-wrap:wrap; gap:16px; align-items:center; }
.reading-actions .again:disabled { opacity:.65; cursor:default; }
.sigil-share-actions { margin-top:18px; }
.my-space-view { min-height:calc(100vh - 142px); padding:64px 0 80px; }
.my-space-heading { display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:end; margin-bottom:42px; }
.my-space-heading .eyebrow,.my-space-heading h1 { grid-column:1; }
.my-space-heading h1 { margin-top:0; }
.my-space-heading .lead { grid-column:2; grid-row:1 / span 2; }
.space-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.space-panel { min-width:0; padding:30px; background:linear-gradient(145deg,#1a1427,#110d19); border:1px solid #ffffff12; }
.space-panel h2 { margin:10px 0 22px; font-size:38px; }
.space-panel small { display:block; margin-top:18px; color:#716a77; font-size:10px; line-height:1.55; }
.moon-display { display:flex; align-items:center; gap:22px; }
#moonIcon { color:var(--gold); font:68px/1 serif; text-shadow:0 0 30px color-mix(in srgb,var(--gold) 38%,transparent); }
.moon-display h2 { margin:0 0 7px; }
.moon-display p { margin:0; color:#8e8593; font-size:12px; }
.moon-track { height:3px; margin:28px 0; overflow:hidden; background:#ffffff12; }
.moon-track i { display:block; width:0; height:100%; background:var(--gold); transition:width .7s ease; }
.space-copy { color:#aaa1af; font-size:14px; line-height:1.75; }
.compatibility-pickers { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:12px; }
.compatibility-pickers select,.ritual-panel select,.ritual-panel input,.journal-panel textarea { width:100%; padding:13px; color:var(--ink); background:#0e0b18; border:1px solid #ffffff18; outline:0; font:13px Manrope,sans-serif; }
.compatibility-pickers select:focus,.ritual-panel select:focus,.ritual-panel input:focus,.journal-panel textarea:focus { border-color:var(--gold); }
.compatibility-pickers > span { color:var(--gold); }
.compatibility-result { margin-top:22px; padding:20px; background:#ffffff05; border-left:1px solid var(--gold); animation:reveal .4s ease both; }
.compatibility-result strong { color:#dec891; font:500 30px/1 "Cormorant Garamond",serif; }
.compatibility-result p { margin:10px 0 0; color:#aaa1af; font-size:13px; line-height:1.7; }
.ritual-panel { display:grid; align-content:start; gap:15px; }
.ritual-panel .eyebrow,.ritual-panel h2 { margin-bottom:0; }
.ritual-panel label { display:grid; gap:8px; color:#8d8492; font-size:10px; letter-spacing:.12em; text-transform:uppercase; }
.ritual-panel input[type="range"] { padding:5px 0; accent-color:var(--gold); }
.saved-status { min-height:20px; margin:0; color:var(--gold); font-size:12px; }
.journal-panel { grid-column:1/-1; }
.journal-heading { display:flex; justify-content:space-between; align-items:start; }
.journal-heading h2 { margin-bottom:10px; }
#journalCount { color:#756d7d; font-size:10px; letter-spacing:.12em; text-transform:uppercase; }
#journalForm { display:grid; grid-template-columns:1fr auto; gap:10px; margin:8px 0 25px; }
.journal-panel textarea { min-height:82px; resize:vertical; }
.journal-entries { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.journal-entry { padding:18px; background:#0e0b18; border:1px solid #ffffff10; }
.journal-entry > div { display:flex; justify-content:space-between; gap:12px; }
.journal-entry span { color:#746d79; font-size:9px; letter-spacing:.1em; text-transform:uppercase; }
.journal-entry button { flex:0 0 auto; padding:0; color:#776e7c; background:none; font-size:18px; }
.journal-entry button:hover { color:#d79a8d; }
.journal-entry h3 { margin:13px 0 8px; color:#dec891; font:500 23px/1.1 "Cormorant Garamond",serif; }
.journal-entry p { margin:0; color:#968d9b; font-size:12px; line-height:1.65; white-space:pre-wrap; }
.journal-empty { grid-column:1/-1; padding:25px; color:#746d79; text-align:center; border:1px dashed #ffffff15; }
.support-panel { grid-column:1/-1; display:flex; align-items:center; justify-content:space-between; gap:32px; border-color:#c8a66a35; background:radial-gradient(circle at 85% 50%,#c8a66a12,transparent 35%),linear-gradient(145deg,#1a1427,#110d19); }
.support-panel h2 { margin-bottom:10px; }
.support-panel p:not(.eyebrow) { max-width:650px; margin:0; color:#9f96a4; font-size:13px; line-height:1.7; }
.support-action { display:grid; justify-items:center; gap:8px; flex:0 0 auto; }
.support-button,.footer-support { display:inline-flex; align-items:center; justify-content:center; padding:15px 20px; color:#17111f; background:linear-gradient(135deg,#e2c98f,#a98145); text-decoration:none; font:600 10px/1 Manrope,sans-serif; letter-spacing:.1em; text-transform:uppercase; box-shadow:0 12px 28px #0006; transition:.2s; }
.support-button:not([aria-disabled="true"]):hover,.footer-support:not([aria-disabled="true"]):hover { transform:translateY(-2px); filter:brightness(1.08); }
.support-button[aria-disabled="true"],.footer-support[aria-disabled="true"] { opacity:.55; cursor:not-allowed; box-shadow:none; }
.support-float { position:fixed; z-index:45; right:22px; bottom:22px; display:flex; align-items:center; gap:9px; padding:15px 19px; color:#17111f; background:linear-gradient(135deg,#f0d89e,#a97c38); border:1px solid #f6dda4; border-radius:999px; text-decoration:none; font:700 11px/1 Manrope,sans-serif; letter-spacing:.08em; text-transform:uppercase; box-shadow:0 12px 35px #000a,0 0 28px #c8a66a30; transition:.22s; animation:coffeeGlow 3.2s ease-in-out infinite; }
.support-float span { font-size:18px; }
.support-float:hover { transform:translateY(-3px) scale(1.02); filter:brightness(1.08); }
.support-float[aria-disabled="true"] { opacity:1; cursor:pointer; }
@keyframes coffeeGlow { 50%{box-shadow:0 14px 38px #000b,0 0 38px #c8a66a58} }
.support-notice { position:fixed; z-index:46; right:24px; bottom:82px; max-width:290px; padding:12px 16px; color:#e7d9b8; background:#171221f2; border:1px solid #c8a66a66; border-radius:8px; font-size:11px; line-height:1.5; box-shadow:0 18px 40px #000a; opacity:0; transform:translateY(8px); transition:.25s; }
.support-notice.visible { opacity:1; transform:translateY(0); }
@media(max-width:620px){.support-float{right:12px;bottom:12px;padding:13px 15px;font-size:9px}.support-notice{right:12px;bottom:68px;max-width:calc(100vw - 24px)}}

.support-action small { margin:0; }
.site-footer { min-height:68px; height:auto; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:12px 0; }
.footer-support { padding:11px 14px; color:#d8c69d; background:#171221; border:1px solid #c8a66a55; box-shadow:none; white-space:nowrap; }
@media(max-width:700px){.support-panel,.site-footer{flex-direction:column;text-align:center}.support-action{width:100%}.support-button{width:100%}.site-footer{padding:18px 0}.footer-support{white-space:normal}}

@media(max-width:800px){.my-space-heading{display:block}.my-space-heading .lead{margin-top:20px}.space-grid{grid-template-columns:1fr}.journal-panel{grid-column:auto}.journal-entries{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.space-panel{padding:22px}.compatibility-pickers{grid-template-columns:1fr}.compatibility-pickers>span{text-align:center}.journal-entries{grid-template-columns:1fr}#journalForm{grid-template-columns:1fr}.reading-actions{justify-content:center}}

.experience,.bones-view,.horoscope-view,.crystal-past-view,.my-space-view,.sigil-view { position:relative; }
.view-help { position:absolute; z-index:8; top:18px; right:0; display:grid; place-items:center; width:44px; height:44px; padding:0; color:var(--gold); background:#15101fcc; border:1px solid #c8a66a66; border-radius:50%; font:500 22px/1 "Cormorant Garamond",serif; transition:.2s; }
.view-help:hover,.view-help:focus-visible { color:#17111f; background:var(--gold); outline:2px solid #eee7d766; outline-offset:3px; transform:translateY(-2px); }
.help-modal { position:fixed; z-index:60; inset:0; display:grid; place-items:center; padding:24px; }
.help-backdrop { position:absolute; inset:0; background:#08060de8; backdrop-filter:blur(9px); }
.help-card { position:relative; z-index:1; width:min(620px,100%); max-height:calc(100vh - 48px); overflow:auto; padding:44px; background:linear-gradient(145deg,#1c1629,#100c18); border:1px solid #c8a66a66; box-shadow:0 35px 90px #000; animation:reveal .45s ease both; }
.help-close { position:absolute; top:15px; right:17px; display:grid; place-items:center; width:40px; height:40px; padding:0; color:#bdb3c0; background:#0e0b18; border:1px solid #ffffff20; border-radius:50%; font-size:25px; }
.help-close:hover,.help-close:focus-visible { color:var(--ink); border-color:var(--gold); outline:0; }
.help-symbol { display:grid; place-items:center; width:72px; aspect-ratio:1; margin-bottom:24px; color:var(--gold); border:1px solid #c8a66a55; border-radius:50%; font:36px/1 serif; }
.help-card h2 { margin:10px 0 28px; font-size:clamp(38px,6vw,54px); }
.help-body h3 { margin:25px 0 8px; color:#d5bd87; font:500 24px/1.2 "Cormorant Garamond",serif; }
.help-body p { margin:0 0 14px; color:#aaa1af; font-size:14px; line-height:1.8; }
.help-note { margin:26px 0; padding:15px 17px; color:#807987; background:#ffffff05; border-left:1px solid var(--gold); font-size:10px; line-height:1.7; }
@media(max-width:600px){.view-help{top:10px;right:4px}.help-card{padding:34px 22px}.help-symbol{width:58px;font-size:29px}.help-body p{font-size:13px}}
footer { height:58px; display:grid; place-items:center; border-top:1px solid #ffffff12; text-align:center; }
@media(max-width:1080px){.mode-nav{flex-wrap:wrap}.music-controls{flex-basis:100%;justify-content:center}.music-controls select{min-height:38px}}
@media(max-width:620px){.masthead{grid-template-columns:1fr;gap:14px}.brand,.language-picker,.mode-nav{grid-column:1}.brand{justify-self:center}.language-picker{justify-self:center}.mode-nav{justify-content:center}.mode-button{padding:9px 8px;font-size:9px}.music-controls{width:100%;justify-content:center}.music-controls select{max-width:min(230px,calc(100vw - 120px));}}
@media(max-width:900px){ .sigil-grid{grid-template-columns:repeat(3,1fr)} .sigil-detail{grid-template-columns:1fr 1fr}.sigil-art{min-height:380px}.sigil-copy{padding:32px} }
@media(max-width:900px){ .experience { grid-template-columns:1fr; gap:25px; text-align:center; } .experience .intro,.experience .table-wrap,.experience .controls,.experience>.reading{grid-column:1} .lead { margin-inline:auto; } .table-wrap { order:2; margin:auto; width:320px; height:500px; } #game{width:300px;height:500px} .intro { order:1; } .controls,.reading { order:3; max-width:520px; margin:auto; } .orbit-one { width:420px;height:420px; } .orbit-two{width:350px;height:350px;} .masthead p{display:none;} h1{font-size:54px;} h2{font-size:44px;} .reading{text-align:left;} }
@media(max-width:600px){ .sigil-hero{display:block}.sigil-hero .lead{margin-top:22px}.sigil-toolbar{align-items:stretch;flex-direction:column;gap:8px}.sigil-grid{grid-template-columns:repeat(2,1fr)}.sigil-detail{display:block}.sigil-art{min-height:300px;height:42vh}.sigil-copy{padding:28px 22px}.sigil-label strong{font-size:18px} }
@media(max-width:700px){ .horoscope-heading{grid-template-columns:1fr;gap:28px}.horoscope-aspects{grid-template-columns:1fr}.horoscope-reading{padding:24px}.bones-heading,.bones-result{grid-template-columns:1fr;gap:28px}.bones-table{height:430px;min-height:0}.bone-faces,.bones-legend{grid-template-columns:repeat(2,1fr)} }
@media(max-width:430px){ main{width:calc(100% - 24px)} .experience{padding-top:24px}.table-wrap{width:290px;height:460px}#game{width:280px;height:468px}.orbit-one{width:360px;height:360px}.orbit-two{width:305px;height:305px} .mode-nav{gap:2px}.mode-button,.sound-button{padding:8px 6px;font-size:10px}.sigil-view{padding-top:40px}.sigil-grid{gap:9px}.sigil-thumb{padding:8px}.sigil-label{padding:12px 10px} footer{font-size:9px;} }
@media(prefers-reduced-motion:reduce){ *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;} }

@media(max-width:700px){.music-controls{width:100%;justify-content:center}.music-controls select{max-width:220px;min-height:38px}}