/* numerology calculator: the second weekly page of week 11 Oct 2026; scoped to .calc-* / .merge-* / .mean-* so no other page changes */
.calc-hero{grid-template-columns:1fr minmax(0,460px)}
.calc-private{display:flex;gap:10px;align-items:baseline;font-size:15px;color:var(--muted);max-width:52ch}
.calc-private span{color:var(--gold)}

.calc-card{position:relative;justify-self:start;width:100%;max-width:460px;padding:clamp(28px,4vw,44px);border-radius:var(--r);background:rgba(255,255,255,.86);box-shadow:0 0 0 1px rgba(184,137,58,.28),0 40px 80px -46px rgba(8,38,37,.6);text-align:center;overflow:hidden;isolation:isolate}
.calc-ring{position:absolute;width:150%;aspect-ratio:1;inset-inline-start:-25%;top:-28%;z-index:-1;opacity:.35;animation:svcspin 120s linear infinite}
.calc-ring circle{fill:none;stroke:var(--gold);stroke-width:1.2}
.calc-ring circle.thin{stroke-dasharray:2 7}
.calc-ring .digits{transition:opacity .5s}
.calc-card.has-out .calc-ring .digits{opacity:0}
.calc-card.has-out .calc-ring{opacity:.14}
.calc-ring text{font-family:var(--display);font-size:30px;fill:var(--gold-t);text-anchor:middle;dominant-baseline:middle}
.calc-form{display:grid;gap:12px}
.calc-form label{font-family:var(--display);font-size:clamp(24px,2.2vw,30px);color:var(--lagoon);line-height:1.2}
.calc-form input{min-height:54px;width:100%;padding:0 18px;border-radius:999px;border:1px solid rgba(184,137,58,.6);background:#fff;color:var(--ink);font:inherit;font-size:17px;text-align:center}
.calc-form .btn{width:100%}
.calc-err{color:#8A2A1E;font-size:15px}
.calc-out{margin-top:26px;padding-top:22px;border-top:1px solid rgba(14,59,58,.12);perspective:800px}
.calc-out-label{font-size:14px;font-weight:500;color:var(--gold-t)}
.calc-big{display:inline-block;font-family:var(--display);font-size:clamp(96px,14vw,140px);line-height:1;color:var(--gold);animation:flipin 1.1s cubic-bezier(.2,.7,.2,1) both}
.calc-steps{list-style:none;display:grid;gap:4px;margin:6px 0 16px;direction:ltr;font-size:15px;color:var(--muted);font-variant-numeric:tabular-nums}
.calc-trait{font-size:clamp(17px,1.3vw,19px);font-weight:500;line-height:1.55;color:var(--lagoon)}
.calc-ask{margin-top:10px;color:var(--muted)}
.calc-not{margin:12px 0 20px;font-size:14px;color:var(--muted)}

/* how it is calculated: the example date's digits merge as the visitor scrolls (--m from 0 to 1, set by calc.js) */
.calc-merge{--m:0;position:relative;height:240vh;overflow-x:clip;background:linear-gradient(180deg,var(--pearl),var(--mist))}
.calc-merge-stick{position:sticky;top:0;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding:90px var(--pad) 40px}
.calc-merge .sec-head{margin-bottom:clamp(22px,4vw,44px)}
.merge-stage{position:relative;height:clamp(150px,22vw,230px);max-width:900px;width:100%;margin:0 auto;direction:ltr}
.merge-row{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:clamp(4px,1vw,12px);font-family:var(--display);color:var(--lagoon)}
.merge-row .t{display:inline-grid;place-items:center;min-width:clamp(30px,6.6vw,70px);height:clamp(44px,8vw,86px);padding:0 4px;border-radius:14px;background:#fff;box-shadow:0 0 0 1px rgba(184,137,58,.3),0 16px 30px -22px rgba(8,38,37,.6);font-size:clamp(28px,5vw,56px);line-height:1}
.merge-row i{font-style:normal;font-size:clamp(18px,3vw,34px);color:var(--gold)}
.merge-row .t-gold{background:linear-gradient(135deg,var(--gold-l),var(--gold));color:var(--deep);min-width:clamp(70px,12vw,120px);height:clamp(70px,12vw,120px);border-radius:50%;font-size:clamp(40px,7vw,76px)}
/* row a: tiles fly in from a scatter, then lift away; row b: the sum; row c: the reduction to 11 */
.merge-a .t{transform:translate(calc(var(--sx,0) * (1 - var(--a))),calc(var(--sy,0) * (1 - var(--a)))) rotate(calc(var(--sr,0deg) * (1 - var(--a))));opacity:calc(.25 + var(--a) * .75)}
.merge-a i{opacity:var(--a)}
.merge-a{--a:clamp(0,var(--m) * 3.2,1);transform:translateY(calc(clamp(0,(var(--m) - .36) * 6,1) * -38%)) scale(calc(1 - clamp(0,(var(--m) - .36) * 6,1) * .35));opacity:calc(1 - clamp(0,(var(--m) - .42) * 5,1))}
.merge-b{--b:clamp(0,(var(--m) - .36) * 6,1);opacity:calc(var(--b) - clamp(0,(var(--m) - .66) * 6,1));transform:scale(calc(.6 + var(--b) * .4)) translateY(calc(clamp(0,(var(--m) - .62) * 6,1) * -38%))}
.merge-c{--c:clamp(0,(var(--m) - .66) * 5,1);opacity:var(--c);transform:scale(calc(.7 + var(--c) * .3))}
.merge-c .t-gold{box-shadow:0 0 calc(var(--c) * 50px) rgba(228,199,126,.8)}
.merge-captions{list-style:none;max-width:640px;margin:clamp(24px,4vw,40px) auto 0;display:grid;gap:8px;text-align:center}
.merge-captions li{color:var(--muted);transition:opacity .4s,color .4s}
.merge-captions b{color:var(--gold-t);font-weight:500}
.m3d .merge-captions li{opacity:.35}
.m3d .merge-captions li.on{opacity:1;color:var(--ink)}

/* the meanings: a night world with gold dust; the visitor's own number lights up */
.calc-world{position:relative;overflow:clip;padding:clamp(80px,11vw,150px) var(--pad);color:#fff;background:radial-gradient(55% 45% at 85% 0%,rgba(228,199,126,.22),rgba(8,38,37,0) 70%),radial-gradient(50% 45% at 0% 100%,rgba(55,190,156,.25),rgba(8,38,37,0) 70%),linear-gradient(180deg,var(--lagoon),var(--deep));background-color:var(--deep)}
.calc-world>*{position:relative;z-index:1}
.calc-world>.dust{position:absolute;z-index:0}
.calc-world .sec-head h2{color:#fff}
.calc-world .eyebrow{color:var(--gold-l)}
.calc-world .sub{color:rgba(255,255,255,.8)}
.mean-grid{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,1.6vw,20px)}
.mean{display:flex;align-items:center;gap:18px;padding:clamp(18px,2.2vw,26px);border-radius:20px;background:rgba(255,255,255,.06);border:1px solid rgba(228,199,126,.28);transition:background .5s,border-color .5s,box-shadow .5s}
.mean-n{flex:none;font-family:var(--display);font-size:clamp(46px,4.4vw,60px);line-height:1;color:var(--gold-l);min-width:1.1em;text-align:center}
.mean p{color:rgba(255,255,255,.88);line-height:1.5}
.mean.is-you,.mean-master-n span.is-you{background:rgba(228,199,126,.2);border-color:var(--gold-l);box-shadow:0 0 0 1px var(--gold-l),0 20px 50px -20px rgba(228,199,126,.6)}
.mean-master{max-width:var(--max);margin:clamp(14px,1.6vw,20px) auto 0;display:flex;align-items:center;gap:clamp(18px,3vw,36px);padding:clamp(20px,2.6vw,30px);border-radius:20px;border:1px solid rgba(228,199,126,.28);background:rgba(255,255,255,.04)}
.mean-master-n{flex:none;display:flex;gap:10px}
.mean-master-n span{display:grid;place-items:center;width:clamp(58px,6vw,74px);aspect-ratio:1;border-radius:50%;border:1px solid rgba(228,199,126,.45);font-family:var(--display);font-size:clamp(26px,2.6vw,32px);color:var(--gold-l);transition:background .5s,box-shadow .5s}
.mean-master p{color:rgba(255,255,255,.86)}
.calc-world .calc-note{color:#fff}

.calc-steps{overflow-wrap:anywhere}

/* the name calculator (week 1 Nov 2026): live letter tiles, the life-path number beside it, and the letters of the scroll scene turning into their values */
.calc-form .name-date-label{font-family:var(--body);font-size:15px;font-weight:500;margin-top:6px}
.name-date-label span{display:block;font-weight:400;font-size:14px;color:var(--muted)}
.calc-card:has(#nameForm) .calc-ring{opacity:.2}
.name-live{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;min-height:0}
.name-live:empty{display:none}
.nl{display:grid;justify-items:center;width:36px;padding:5px 0 4px;border-radius:10px;background:#fff;box-shadow:0 0 0 1px rgba(184,137,58,.35);font-family:var(--display);font-size:20px;line-height:1.1;color:var(--lagoon);animation:nlin .35s cubic-bezier(.2,.7,.2,1) both}
.nl b{font-family:var(--body);font-weight:500;font-size:13px;color:var(--gold-t)}
@keyframes nlin{from{opacity:0;transform:translateY(8px) scale(.8)}to{opacity:1;transform:none}}
.name-life{margin:18px 0 6px;padding:16px;border-radius:16px;background:rgba(14,59,58,.05)}
.name-life-n{display:block;font-family:var(--display);font-size:56px;line-height:1.1;color:var(--lagoon)}
.name-life .calc-steps{margin:4px 0 8px}
.name-life-t{font-size:15px;line-height:1.5;color:var(--lagoon)}
.name-merge .merge-a{direction:rtl;--a:clamp(0,var(--m) * 8,1);--f:clamp(0,(var(--m) - .1) * 6,1)}
.name-merge .t-in{position:relative;display:grid;place-items:center;width:100%;height:100%;transform-style:preserve-3d;transform:rotateY(calc(var(--f) * 180deg))}
.name-merge .t-in b{grid-area:1/1;font-weight:400;backface-visibility:hidden}
.name-merge .t-in b+b{transform:rotateY(180deg);color:var(--gold-t)}
.mean-letters{font-family:var(--display);font-size:clamp(22px,2vw,27px);line-height:1.2;color:#fff!important;margin-bottom:4px}

@media (max-width:860px){
  .calc-hero{grid-template-columns:1fr}
  .calc-card{justify-self:stretch;max-width:none}
  .mean-grid{grid-template-columns:1fr 1fr}
  .mean{flex-direction:column;align-items:flex-start;gap:6px}
  .mean-master{flex-direction:column;align-items:flex-start}
  .mean-l:nth-child(9){grid-column:1/-1}
}
@media (max-width:420px){.merge-row{gap:3px}.merge-row .t{border-radius:10px}}
@media (prefers-reduced-motion:reduce){
  .calc-ring{animation:none}
  .calc-merge{height:auto}
  .calc-merge-stick{position:static;min-height:0}
  .merge-stage{height:auto;display:grid;gap:14px}
  .merge-row{position:static;opacity:1!important;transform:none!important}
  .merge-a .t,.merge-a i{transform:none;opacity:1}
  .nl{animation:none}
  .name-merge .t-in{display:flex;gap:6px;transform:none}
  .name-merge .t-in b,.name-merge .t-in b+b{transform:none;backface-visibility:visible}
  .name-merge .merge-a .t{padding:0 10px}
}