:root{
  --recall-champagne:#f1e3c7;
  --recall-sand:#d7b98a;
  --recall-amber:#b8834e;
  --recall-copper:#7a5236;
  --recall-deep:#3d2a24;
  --recall-ease:cubic-bezier(.23,1,.32,1);
}

body.recall-cinema-open{overflow:hidden!important}

/* Detail panel adopts the child world's own material identity. */
.panel.recall-detail{
  background:
    radial-gradient(circle at 15% 12%,rgba(184,131,78,.18),transparent 36%),
    linear-gradient(145deg,rgba(22,17,15,.82),rgba(6,6,9,.66));
  border-color:rgba(215,185,138,.16);
}
.panel.recall-detail .eyebrow{color:rgba(241,227,199,.56)}
.panel.recall-detail .full{color:rgba(215,185,138,.68)}
.panel.recall-detail .buttons .primary{background:var(--recall-champagne);color:#1d1712}

.recall-cinema{
  position:fixed;inset:0;z-index:230;
  background:#020308;color:#f7f7fb;
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity 360ms var(--recall-ease),visibility 360ms;
}
.recall-cinema.open{opacity:1;visibility:visible;pointer-events:auto}
.recall-cinema.closing{opacity:0;pointer-events:none}

.recall-cinema-header{
  position:absolute;left:0;right:0;top:0;z-index:80;height:62px;
  display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:24px;
  padding:0 clamp(18px,4vw,58px);
  border-bottom:1px solid rgba(255,255,255,.055);
  background:linear-gradient(to bottom,rgba(2,3,8,.90),rgba(2,3,8,.25));
  backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);
}
.recall-cinema-back,.recall-cinema-lang,.recall-cinema-nav button{
  border:0;background:none;color:rgba(255,255,255,.56);cursor:pointer;
  font:650 10px/1 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
  transition:color 150ms var(--recall-ease),transform 100ms var(--recall-ease);
}
.recall-cinema-back:active,.recall-cinema-lang:active,.recall-cinema-nav button:active{transform:scale(.97)}
@media (hover:hover) and (pointer:fine){
  .recall-cinema-back:hover,.recall-cinema-lang:hover,.recall-cinema-nav button:hover{color:#fff}
}
.recall-cinema-brand{display:flex;align-items:center;gap:10px;font-size:10px;letter-spacing:.14em;color:rgba(255,255,255,.45)}
.recall-cinema-brand strong{color:#fff;letter-spacing:.18em}.recall-cinema-brand strong.caelarium-brand-lockup{display:inline-flex;align-items:center;gap:7px}
.recall-cinema-brand b{color:rgba(215,185,138,.78);font-weight:690}
.recall-cinema-nav{display:flex;align-items:center;gap:22px}
.recall-cinema-lang{min-width:78px;text-align:right}

.recall-cinema-scroll{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-color:rgba(255,255,255,.22) transparent}
.recall-cinema-fixed{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;background:#020308}
#recallStarfield,#recallCinema3D{position:absolute;inset:0;width:100%;height:100%}
#recallStarfield{z-index:0;opacity:.72}
#recallCinema3D{z-index:3}
.recall-ambient{
  position:absolute;inset:-15%;z-index:1;
  background:
    radial-gradient(circle at 72% 54%,rgba(184,131,78,.15),transparent 27%),
    radial-gradient(circle at 54% 45%,rgba(215,185,138,.075),transparent 38%),
    radial-gradient(circle at 27% 73%,rgba(122,82,54,.05),transparent 28%);
}
.recall-grain{position:absolute;inset:0;z-index:5;opacity:.08;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='.95' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.34'/%3E%3C/svg%3E");mix-blend-mode:soft-light}
.recall-progress{position:absolute;left:32px;top:40%;height:150px;width:1px;background:rgba(255,255,255,.10);z-index:6}
.recall-progress i{display:block;width:1px;height:0;background:linear-gradient(to bottom,var(--recall-champagne),var(--recall-amber));box-shadow:0 0 16px rgba(184,131,78,.35)}
.recall-chapter{position:absolute;left:24px;top:calc(40% - 28px);z-index:6;font-size:9px;letter-spacing:.12em;color:rgba(255,255,255,.46)}

.recall-story{position:relative;z-index:10}
.recall-story-section{position:relative;min-height:136vh}
.recall-story-section.hero-stage{min-height:144vh}
.recall-story-section.final-stage{min-height:118vh}
.recall-story-inner{
  position:sticky;top:0;height:100vh;padding:clamp(92px,11vh,126px) clamp(34px,7vw,116px) clamp(56px,8vh,90px);
  display:grid;align-items:center;gap:clamp(28px,5vw,90px);
}
.editorial-wide{grid-template-columns:1fr}
.split-right{grid-template-columns:minmax(0,1fr) minmax(340px,.82fr)}
.split-left{grid-template-columns:minmax(340px,.82fr) minmax(0,1fr)}
.centered{grid-template-columns:1fr;justify-items:center;text-align:center}

.recall-copy{max-width:780px;opacity:1;transform:none}
.recall-story-section.is-active .recall-copy{filter:none}
.recall-kicker{margin-bottom:18px;color:rgba(215,185,138,.76);font-size:10px;font-weight:720;letter-spacing:.18em;text-transform:uppercase}
.recall-copy h1,.recall-copy h2,.recall-story-inner>h2{margin:0;color:#f8f8fb;letter-spacing:-.058em;font-weight:750;text-wrap:balance}
.recall-copy h1{font-size:clamp(64px,8.1vw,132px);line-height:.86;max-width:1040px}
.recall-copy h2,.recall-story-inner>h2{font-size:clamp(52px,6vw,96px);line-height:.90}
.recall-copy p,.boundary-inner>p,.final-inner>p{margin:25px 0 0;max-width:650px;color:rgba(247,247,251,.62);font-size:clamp(16px,1.35vw,21px);line-height:1.55}
.recall-status{margin-top:24px;display:inline-flex;align-items:center;gap:8px;color:rgba(255,255,255,.42);font-size:9px;letter-spacing:.15em}
.recall-status i{width:6px;height:6px;border-radius:50%;background:#c99a61;box-shadow:0 0 18px rgba(201,154,97,.66)}
.center-copy{max-width:1050px}.center-copy p{margin-left:auto;margin-right:auto}

.recall-visual{opacity:0;transform:translate3d(0,26px,0) scale(.985);will-change:opacity,transform}
.recall-story-section.is-active .recall-visual{filter:none}

.quote-field{position:relative;min-height:470px}
.quote-field article{position:absolute;width:min(300px,70vw);padding:20px 22px;border-radius:22px;border:1px solid rgba(215,185,138,.13);background:rgba(20,15,13,.48);backdrop-filter:blur(20px) saturate(140%);box-shadow:0 22px 70px rgba(0,0,0,.28)}
.quote-field article:nth-child(1){left:3%;top:4%}.quote-field article:nth-child(2){right:2%;top:35%}.quote-field article:nth-child(3){left:16%;bottom:0}
.quote-field small,.approval-card small{display:block;color:rgba(255,255,255,.32);font-size:8px;letter-spacing:.16em;margin-bottom:10px}
.quote-field strong{display:block;font-size:38px;letter-spacing:-.04em}.quote-field span{display:block;margin-top:6px;color:rgba(255,255,255,.47);font-size:11px}

.score-orbit{position:relative;display:grid;place-items:center;min-height:480px}
.score-ring{width:280px;height:280px;border-radius:50%;border:1px solid rgba(215,185,138,.22);box-shadow:0 0 0 46px rgba(184,131,78,.025),0 0 100px rgba(184,131,78,.10);display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(circle,rgba(184,131,78,.08),transparent 66%)}
.score-ring span{font-size:9px;letter-spacing:.17em;color:rgba(241,227,199,.58)}.score-ring strong{font-size:92px;line-height:.9;letter-spacing:-.07em}.score-ring em{font-style:normal;font-size:9px;color:rgba(255,255,255,.35);margin-top:8px}
.score-ghost{position:absolute;padding:9px 13px;border-radius:999px;border:1px solid rgba(255,255,255,.08);color:rgba(255,255,255,.32);font-size:11px}.score-ghost.g1{left:7%;top:16%}.score-ghost.g2{right:2%;top:42%}.score-ghost.g3{left:15%;bottom:9%;color:rgba(241,227,199,.72);border-color:rgba(215,185,138,.18)}

.reason-stack{display:grid;gap:11px;max-width:520px}
.reason-stack div{padding:17px 19px;border-radius:17px;border:1px solid rgba(255,255,255,.08);background:rgba(8,8,12,.46);display:flex;align-items:center;justify-content:space-between;gap:18px}.reason-stack b{font-size:16px}.reason-stack span{color:rgba(255,255,255,.38);font-size:11px;text-align:right}
.action-field{min-height:420px;display:flex;flex-wrap:wrap;align-content:center;justify-content:center;gap:13px;padding:12%}
.action-field span,.action-field strong{display:inline-flex;align-items:center;height:46px;padding:0 18px;border-radius:999px;border:1px solid rgba(255,255,255,.09);font-size:12px;color:rgba(255,255,255,.35);font-weight:570}.action-field strong{color:#1d1712;background:var(--recall-champagne);border-color:transparent;box-shadow:0 16px 60px rgba(184,131,78,.16)}

.approval-card{max-width:540px;padding:26px;border-radius:24px;border:1px solid rgba(215,185,138,.13);background:rgba(15,12,12,.55);backdrop-filter:blur(24px);box-shadow:0 28px 90px rgba(0,0,0,.35)}
.approval-card p{font-size:16px;line-height:1.58;color:rgba(255,255,255,.74)}.approval-card div{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}.approval-card button,.recall-cta-row button,.recall-cta-row a{height:38px;padding:0 14px;border-radius:999px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.05);color:#fff;font-size:11px}.approval-card button:first-child{background:var(--recall-champagne);color:#211912}

.state-line{display:flex;align-items:center;justify-content:center;gap:9px;max-width:1180px;flex-wrap:wrap}.state-line b{padding:11px 15px;border-radius:999px;border:1px solid rgba(215,185,138,.13);background:rgba(11,10,12,.48);font-size:11px;color:rgba(255,255,255,.76)}.state-line i{width:26px;height:1px;background:linear-gradient(to right,rgba(215,185,138,.16),rgba(215,185,138,.52))}.state-note{max-width:680px;color:rgba(255,255,255,.44);font-size:13px;line-height:1.6}

.inbox-card{width:min(620px,100%);border:1px solid rgba(215,185,138,.13);border-radius:26px;overflow:hidden;background:rgba(10,9,11,.56);backdrop-filter:blur(24px);box-shadow:0 30px 100px rgba(0,0,0,.32)}.inbox-card header{display:flex;flex-direction:column;padding:24px;border-bottom:1px solid rgba(255,255,255,.07)}.inbox-card header span{font-size:9px;letter-spacing:.14em;color:rgba(215,185,138,.64)}.inbox-card header strong{font-size:24px;margin-top:7px}.inbox-card header em{font-style:normal;color:rgba(255,255,255,.38);font-size:11px;margin-top:5px}.inbox-card>div{display:grid;grid-template-columns:1fr auto auto;gap:15px;align-items:center;padding:17px 22px;border-bottom:1px solid rgba(255,255,255,.055)}.inbox-card>div:last-child{border-bottom:0}.inbox-card>div b{font-size:13px}.inbox-card>div span{font-size:11px;color:rgba(255,255,255,.38)}.inbox-card>div strong{font-size:10px;color:var(--recall-sand)}

.revenue-inner{align-content:center}.revenue-inner>h2{max-width:1050px}.revenue-number{margin-top:38px;display:flex;flex-direction:column;align-items:center}.revenue-number small{font-size:8px;letter-spacing:.18em;color:rgba(255,255,255,.28)}.revenue-number strong{font-size:clamp(92px,13vw,220px);line-height:.84;letter-spacing:-.075em;color:var(--recall-champagne);text-shadow:0 0 80px rgba(184,131,78,.16)}.revenue-number span{font-size:12px;letter-spacing:.24em;color:rgba(215,185,138,.58);margin-top:14px}.revenue-metrics{margin-top:38px;display:flex;gap:10px;flex-wrap:wrap;justify-content:center;max-width:920px}.revenue-metrics span{padding:9px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.07);color:rgba(255,255,255,.36);font-size:10px}

.foundation-orbit{position:relative;width:min(620px,92vw);height:520px;display:grid;place-items:center}.foundation-orbit strong{font-size:70px;letter-spacing:-.06em;color:rgba(255,255,255,.86)}.foundation-orbit b{position:absolute;right:3%;bottom:13%;padding:14px 18px;border-radius:999px;color:#211912;background:var(--recall-champagne);font-size:12px}.foundation-orbit span{position:absolute;padding:8px 11px;border:1px solid rgba(255,255,255,.08);border-radius:999px;color:rgba(255,255,255,.40);font-size:10px}.foundation-orbit span:nth-of-type(1){left:10%;top:20%}.foundation-orbit span:nth-of-type(2){right:14%;top:14%}.foundation-orbit span:nth-of-type(3){left:4%;top:51%}.foundation-orbit span:nth-of-type(4){right:2%;top:48%}.foundation-orbit span:nth-of-type(5){left:22%;bottom:13%}.foundation-orbit span:nth-of-type(6){right:30%;bottom:4%}

.boundary-inner,.final-inner{max-width:1080px;margin:auto}.boundary-inner>p,.final-inner>p{margin-left:auto;margin-right:auto}.recall-cta-row{display:flex;justify-content:center;gap:10px;margin-top:30px}.recall-cta-row a{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;transition:transform 120ms var(--ease-out),background 160ms var(--ease-out)}.recall-cta-row a:first-child{background:var(--recall-champagne);color:#211912}.recall-cta-row a:active{transform:scale(.97)}
.recall-footer{position:relative;z-index:10;min-height:52vh;padding:90px clamp(30px,8vw,130px);border-top:1px solid rgba(255,255,255,.07);background:#06070b}.recall-footer-top{display:flex;justify-content:space-between;gap:28px;padding-bottom:34px;border-bottom:1px solid rgba(255,255,255,.07)}.recall-footer-top strong{font-size:17px;letter-spacing:.18em}.recall-footer-top p{max-width:420px;color:rgba(255,255,255,.42);font-size:12px;line-height:1.7}.recall-footer-columns{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:28px 24px;padding:34px 0}.recall-footer-column{display:flex;flex-direction:column;gap:10px}.recall-footer-column h4{margin:0 0 6px;font-size:11px;letter-spacing:.06em;color:rgba(255,255,255,.82)}.recall-footer-column a{color:rgba(255,255,255,.42);font-size:11px;line-height:1.55;text-decoration:none;transition:color 160ms var(--ease-out)}.recall-footer-column a:hover,.recall-footer-legal a:hover{color:#fff}.recall-footer-bottom{display:flex;justify-content:space-between;gap:18px;padding-top:18px;border-top:1px solid rgba(255,255,255,.07);color:rgba(255,255,255,.30);font-size:10px}.recall-footer-legal a{margin-left:18px;color:rgba(255,255,255,.38);text-decoration:none;transition:color 160ms var(--ease-out)}

@media (max-width:900px){
  .recall-cinema-header{grid-template-columns:auto 1fr auto;height:58px;padding:0 16px}.recall-cinema-nav{display:none}.recall-cinema-brand{justify-self:center}.recall-cinema-lang{min-width:auto}.recall-progress,.recall-chapter{display:none}
  .recall-story-section{min-height:126vh}.recall-story-inner{padding:92px 20px 46px;display:flex;flex-direction:column;justify-content:center;align-items:stretch;gap:28px}.split-right,.split-left{grid-template-columns:1fr}.recall-copy{max-width:none}.recall-copy h1{font-size:clamp(48px,13vw,78px)}.recall-copy h2,.recall-story-inner>h2{font-size:clamp(42px,11vw,64px)}.recall-copy p,.boundary-inner>p,.final-inner>p{font-size:15px}.quote-field{min-height:350px}.quote-field article{width:72%;padding:15px 16px}.quote-field article:nth-child(1){left:0}.quote-field article:nth-child(2){right:0}.quote-field article:nth-child(3){left:8%}.score-orbit{min-height:350px}.score-ring{width:220px;height:220px}.score-ring strong{font-size:72px}.approval-card{padding:20px}.inbox-card>div{grid-template-columns:1fr auto}.inbox-card>div strong{grid-column:2}.inbox-card>div span{grid-column:1}.foundation-orbit{height:360px}.foundation-orbit strong{font-size:54px}.recall-footer{min-height:42vh;padding:68px 22px}.recall-footer-top{display:block;padding-bottom:26px}.recall-footer-top p{margin-top:14px}.recall-footer-columns{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 18px;padding:28px 0}.recall-footer-bottom{display:block;line-height:1.7}.recall-footer-legal{display:block;margin-top:8px}.recall-footer-legal a{margin:0 16px 0 0}
}

@media (prefers-reduced-motion:reduce){
  .recall-copy,.recall-visual{transform:none!important;filter:none!important;transition:opacity 180ms ease-out!important}
  .recall-cinema{transition:opacity 180ms ease-out,visibility 180ms}
  .recall-ambient,.recall-grain{opacity:.5}
}

/* v0.89.1 scroll-orchestrated copy motion */
.recall-kicker,.recall-copy h1,.recall-copy h2,.recall-copy p,.recall-status,.state-note,.revenue-number,.revenue-metrics,.recall-cta-row{opacity:0;will-change:opacity,transform}
.score-ring strong,.revenue-number strong{font-variant-numeric:tabular-nums}
.quote-field article,.reason-stack>div,.action-field>*,.state-line>*,.inbox-card>div,.revenue-metrics span,.foundation-orbit span,.foundation-orbit b{will-change:opacity,transform}


/* v0.89.3 — continuous camera-depth story.
   The 3D world now supplies the spatial progression, so story content stays
   compositionally calm. These are contrast safeguards only; no section gets
   its own planet-position animation. */
.recall-copy h1,.recall-copy h2,.recall-story-inner>h2{
  text-shadow:0 2px 34px rgba(2,3,8,.34);
}
.recall-copy p,.boundary-inner>p,.final-inner>p{
  text-shadow:0 1px 18px rgba(2,3,8,.42);
}
.recall-visual{
  transform-origin:50% 50%;
}


/* v0.89.4 — editorial composition tuning.
   Stage 02 moves the score visual to the right so the large headline can sit
   over the left-anchored Recall planet. */
.recall-story-section[data-recall-stage="2"] .recall-story-inner{
  grid-template-columns:minmax(0,1.05fr) minmax(320px,.72fr);
}
.recall-story-section[data-recall-stage="2"] .recall-copy{
  order:1;
  position:relative;
  z-index:14;
  margin-left:clamp(24px,4vw,74px);
  max-width:860px;
}
.recall-story-section[data-recall-stage="2"] .score-orbit{
  order:2;
  justify-self:end;
  margin-right:clamp(10px,3vw,42px);
}
.recall-story-section[data-recall-stage="2"] .score-ring{
  box-shadow:0 0 0 42px rgba(184,131,78,.022),0 0 86px rgba(184,131,78,.08);
}

/* Keep visual widgets from fighting with the planet when the sphere becomes
   the dominant image. */
.recall-story-section[data-recall-stage="4"] .action-field,
.recall-story-section[data-recall-stage="6"] .state-line,
.recall-story-section[data-recall-stage="7"] .inbox-card,
.recall-story-section[data-recall-stage="9"] .foundation-orbit{
  position:relative;
  z-index:14;
}


/* v0.89.4.2 — readability + centered shrink polish.
   As the Recall world scales down from stage 04 onward, supporting widgets
   get stronger separation from the amber planet so they stay legible. */
.score-ring{
  background:radial-gradient(circle,rgba(6,8,12,.86) 0%,rgba(6,8,12,.74) 38%,rgba(184,131,78,.12) 68%,transparent 74%);
  box-shadow:0 0 0 40px rgba(184,131,78,.03),0 22px 90px rgba(0,0,0,.42),0 0 0 1px rgba(255,255,255,.04) inset;
}
.score-ghost,
.action-field span,
.state-line b,
.revenue-metrics span,
.foundation-orbit span{
  background:rgba(7,9,14,.66);
  backdrop-filter:blur(16px);
  border-color:rgba(255,255,255,.14);
  color:rgba(255,255,255,.78);
  box-shadow:0 14px 36px rgba(0,0,0,.26);
}
.action-field strong,
.foundation-orbit b{
  box-shadow:0 16px 48px rgba(0,0,0,.22),0 12px 42px rgba(184,131,78,.12);
}
.score-ghost.g3,
.revenue-metrics span,
.foundation-orbit span{
  color:rgba(241,227,199,.82);
}
.recall-story-section[data-recall-stage="4"] .action-field,
.recall-story-section[data-recall-stage="8"] .revenue-metrics,
.recall-story-section[data-recall-stage="9"] .foundation-orbit{
  position:relative;
  z-index:16;
}
.recall-story-section[data-recall-stage="8"] .revenue-number small,
.recall-story-section[data-recall-stage="8"] .revenue-number span{
  color:rgba(241,227,199,.82);
  text-shadow:0 2px 18px rgba(3,4,8,.34);
}
.recall-story-section[data-recall-stage="8"] .revenue-number strong{
  text-shadow:0 0 52px rgba(184,131,78,.18),0 4px 24px rgba(2,3,8,.24);
}


/* v0.89.4.3 — longer reading cadence.
   The sticky frame intentionally persists longer so completed copy can be
   read without immediately entering the next crossfade. Planet motion is
   now limited to those crossfade windows in recall-cinema.js. */

/* v0.89.4.4 — stage 06 readability hold.
   Give the follow-up state-machine chapter a little more scroll distance so
   the lower explanatory line can be read before the next transition begins. */
.recall-story-section[data-recall-stage="6"]{
  min-height:152vh;
}

/* v0.92.6 — calmer product-story typography + shared glass secondary CTA */
.recall-copy h1{font-size:clamp(58px,7vw,110px)!important;line-height:.90!important}
.recall-copy h2,.recall-story-inner>h2{font-size:clamp(46px,5.25vw,82px)!important;line-height:.94!important}
.revenue-number strong{font-size:clamp(82px,11vw,180px)!important}
.recall-cta-row a{min-height:42px!important;padding:0 18px!important;backdrop-filter:blur(18px) saturate(150%)!important;-webkit-backdrop-filter:blur(18px) saturate(150%)!important}
.recall-cta-row a:not(:first-child){background:rgba(255,255,255,.055)!important;border-color:rgba(255,255,255,.14)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 10px 30px rgba(0,0,0,.18)!important}
@media(max-width:640px){.recall-copy h1{font-size:clamp(46px,12.2vw,68px)!important}.recall-copy h2,.recall-story-inner>h2{font-size:clamp(38px,10vw,58px)!important}.revenue-number strong{font-size:clamp(72px,20vw,120px)!important}}


/* v0.92.8 — safer display leading across Recall storytelling. */
.recall-copy h1{line-height:1.00!important;letter-spacing:-.045em!important}
.recall-copy h2,.recall-story-inner>h2{line-height:1.06!important;letter-spacing:-.040em!important}
.recall-copy p,.boundary-inner>p,.final-inner>p{line-height:1.72!important}
