/* Homepage CTA and download dialog styles, scoped to their shared components. */
.img--night,.img--platinum{display:none}
[data-theme=night] .img--night,[data-theme=platinum] .img--platinum{display:block}
.badge--light,.badge--dark{display:none}
[data-theme=platinum] .badge--light,[data-theme=night] .badge--dark{display:block}
.nav.is-stuck .nav__cta{translate:calc(-1 * var(--nav-trim)) 0}
.nav__cta{height:44px;padding:0 18px;border-radius:13px;font-size:15px;white-space:nowrap}
.nav__cta{flex:none}
.nav__cta{transition:transform .16s var(--ease-out),box-shadow .16s var(--ease-out),translate .48s var(--ease-out)}
@media(max-width:1060px){.no-js .nav__cta{margin-left:auto}}
@media(max-width:480px){.nav__cta{padding:0 14px}}
@media(max-width:400px){.nav__cta{margin-left:auto}}
.cta .cta__inner>.cta__gl{position:absolute;z-index:0;left:50%;top:50%;width:calc(clamp(360px,56vw,600px)*1.5);aspect-ratio:1;transform:translate(-50%,-50%);pointer-events:none;opacity:0;transition:opacity .6s var(--ease-out)}
.cta.cta--live .cta__inner>.cta__gl{opacity:1}
.cta--live .cta__ring{opacity:0!important;transition:opacity .6s var(--ease-out)}
.cta__get{display:flex;align-items:center;justify-content:center;gap:22px}
.qr-pass{--rx: 0deg;--ry: 0deg;--gx: 30%;--gy: 0%;position:relative;display:grid;grid-template-columns:auto auto;align-items:stretch;border-radius:22px;background:#fff;color:#0b1f52;text-align:left;box-shadow:0 30px 60px -26px #0b1f528c,0 2px 6px #0b1f521f,inset 0 0 0 1px #0b1f520f;transform:perspective(900px) rotateX(var(--rx)) rotateY(var(--ry));will-change:transform}
.qr-pass:after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(90% 70% at var(--gx) var(--gy),rgba(255,255,255,.7),rgba(255,255,255,0) 60%),linear-gradient(115deg,#143c9e12,#143c9e00 40%);mix-blend-mode:soft-light}
.qr-pass__code{position:relative;padding:14px 14px 14px 16px}
.qr-pass__code>img:first-child{display:block;width:112px;height:112px}
.qr-pass__icon{position:absolute;left:72px;top:70px;width:25px;height:25px;transform:translate(-50%,-50%)}
.qr-pass__text{position:relative;display:grid;align-content:center;gap:5px;width:236px;padding:14px 22px;border-left:2px dashed rgba(11,31,82,.16)}
.qr-pass__text:before,.qr-pass__text:after{content:"";position:absolute;left:-9px;width:16px;height:16px;border-radius:50%;background:var(--bg)}
.qr-pass__text:before{top:-8px}
.qr-pass__text:after{bottom:-8px}
.qr-pass__kicker{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;font-size:10.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#4e6274}
.qr-pass__kicker svg{flex:none;width:13px;height:13px;color:#1a4fd6}
.qr-pass b{font-family:var(--display);font-weight:600;font-size:19px;letter-spacing:-.015em}
.qr-pass small{font-size:12.5px;line-height:1.4;color:#4e6274}
.qr-pass.is-called{animation:qr-call 1.3s var(--ease-out)}
@keyframes qr-call{0%{box-shadow:0 30px 60px -26px #0b1f528c,0 0 #1a4fd680}45%{box-shadow:0 30px 60px -26px #0b1f528c,0 0 0 14px #1a4fd600}to{box-shadow:0 30px 60px -26px #0b1f528c,0 0 #1a4fd600}}
@media(max-width:1100px),(hover:none){.qr-pass{display:none}}
.get-dialog{width:min(980px,calc(100vw - 48px));max-width:none;padding:0;border:0;background:transparent;color:var(--text);overflow:visible}
.get-dialog::backdrop{background:#050b1a80;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.get-dialog__card{position:relative;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);align-items:center;gap:40px;padding:18px 48px 18px 18px;border-radius:34px;background:var(--surface);box-shadow:0 60px 120px -48px #030a28b3,0 0 0 1px var(--line)}
.get-dialog__close{position:absolute;right:16px;top:16px;z-index:2;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;color:var(--muted);background:var(--subtle);transition:background-color .18s var(--ease-out),color .18s var(--ease-out),transform .18s var(--ease-out)}
.get-dialog__close svg{width:20px;height:20px}
@media(hover:hover)and (pointer:fine){.get-dialog__close:hover{color:var(--text);transform:rotate(90deg)}}
.get-dialog__stage{--rx: 0deg;--ry: 0deg;position:relative;height:470px;border-radius:26px;overflow:hidden;background:linear-gradient(160deg,var(--brand-deep) 0%,var(--brand-mid) 50%,var(--brand-hi) 100%);perspective:1100px;isolation:isolate}
.get-dialog__stage:before{content:"";position:absolute;inset:0;opacity:.5;background-image:radial-gradient(rgba(255,255,255,.16) 1px,transparent 1.2px);background-size:22px 22px;mask-image:radial-gradient(120% 80% at 50% 100%,#000 20%,transparent 75%);-webkit-mask-image:radial-gradient(120% 80% at 50% 100%,#000 20%,transparent 75%)}
.get-dialog__phone{position:absolute;left:11%;top:44px;transform-style:preserve-3d;transform:rotateX(calc(6deg + var(--rx))) rotateY(calc(-16deg + var(--ry))) translateZ(-30px);transition:transform .5s var(--ease-out)}
.get-dialog__phone .phone{--phone-w: 236px}
.get-dialog__pass{position:absolute;right:7%;bottom:34px;transform-style:preserve-3d;transform:rotateX(calc(4deg + var(--rx) * 1.4)) rotateY(calc(-10deg + var(--ry) * 1.4)) rotate(3deg) translateZ(70px);transition:transform .5s var(--ease-out)}
.qr-pass--big{grid-template-columns:1fr;width:212px}
.qr-pass--big .qr-pass__code{padding:20px 20px 16px}
.qr-pass--big .qr-pass__code>img:first-child{width:172px;height:172px}
.qr-pass--big .qr-pass__icon{left:106px;top:106px;width:38px;height:38px}
.qr-pass--big .qr-pass__text{width:auto;padding:16px 20px 20px;border-left:0;border-top:2px dashed rgba(11,31,82,.16)}
.qr-pass--big .qr-pass__kicker{letter-spacing:.05em}
.qr-pass--big .qr-pass__text:before,.qr-pass--big .qr-pass__text:after{top:-9px;bottom:auto;left:-9px;background:var(--brand-mid)}
.qr-pass--big .qr-pass__text:after{left:auto;right:-9px}
.get-dialog__copy{padding:40px 0}
.get-dialog__copy .display{font-size:clamp(30px,3.2vw,42px);margin:10px 0 0;text-wrap:balance}
.get-dialog__lede{margin:16px 0 0;color:var(--muted);font-size:17px;line-height:1.55;max-width:32ch}
.get-dialog__actions{display:grid;justify-items:start;gap:14px;margin-top:28px}
.get-dialog__actions .small{margin:0;line-height:1.6}
@media(prefers-reduced-motion:no-preference){.get-dialog[open] .get-dialog__card{animation:gd-in .42s var(--ease-out)}
.get-dialog[open]::backdrop{animation:gd-fade .32s var(--ease-out)}
.get-dialog[open] .get-dialog__pass{animation:gd-pass .76s var(--ease-out) .14s both}
.get-dialog[open] .get-dialog__phone{animation:gd-phone .76s var(--ease-out) 60ms both}
.get-dialog.is-closing .get-dialog__card{animation:gd-out .2s ease-in forwards}
.get-dialog.is-closing::backdrop{animation:gd-fade .2s ease-in reverse forwards}}
@keyframes gd-in{0%{opacity:0;transform:translateY(18px) scale(.97)}}
@keyframes gd-out{to{opacity:0;transform:translateY(10px) scale(.98)}}
@keyframes gd-fade{0%{opacity:0}}
@keyframes gd-pass{0%{opacity:0;translate:40px 60px;rotate:8deg}}
@keyframes gd-phone{0%{opacity:0;translate:0 70px}}
.cta{overflow:clip;padding-block:clamp(40px,5vw,72px)}
.cta__inner{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:22px;min-height:clamp(420px,60vw,660px)}
.cta__inner>:not(.cta__ring){position:relative;z-index:1}
.cta__inner .lede{margin:0}
.cta__inner .small{margin:-6px 0 0}
.cta__icon{width:104px;height:104px;margin-bottom:2px;filter:drop-shadow(0 16px 28px rgba(5,12,20,.28))}
.cta__ring{position:absolute;z-index:0;left:50%;top:50%;width:clamp(360px,56vw,600px);aspect-ratio:1;transform:translate(-50%,-50%);opacity:.55;background:conic-gradient(from -4.5deg,var(--accent) 0 132deg,var(--line) 132deg 360deg);-webkit-mask:repeating-conic-gradient(from -4.5deg,#000 0 9deg,transparent 9deg 12deg),radial-gradient(closest-side,transparent calc(100% - 12px),#000 calc(100% - 11px) calc(100% - 1px),transparent 100%);-webkit-mask-composite:source-in;mask:repeating-conic-gradient(from -4.5deg,#000 0 9deg,transparent 9deg 12deg),radial-gradient(closest-side,transparent calc(100% - 12px),#000 calc(100% - 11px) calc(100% - 1px),transparent 100%);mask-composite:intersect}
@media(max-width:640px){.cta__icon{width:88px;height:88px}
.cta__ring{width:420px}
.cta__inner{min-height:460px}}
.cta a:not(.btn):not(.badge-store){transition:color .18s var(--ease-out),opacity .18s var(--ease-out)}
.js .cta__inner.reveal{transform:none}
html:has(.get-dialog[open]){overflow:hidden;scrollbar-gutter:stable}

/* Calculator navigation shares the legal shell's responsive breakpoint. */
.nav__inner{position:relative}
.nav__links{gap:16px}
.nav__links a,.calculators-panel a{display:inline-flex;align-items:center;gap:6px;min-height:44px}
.nav__links img,.calculators-panel img{width:18px;height:18px;border-radius:50%;flex:none}
.nav.is-stuck .nav__cta{translate:none}
.calculators-toggle{display:none;min-height:44px;padding:0 12px;border-radius:13px;font-size:14px;font-weight:600;background:var(--surface);color:var(--muted);box-shadow:inset 0 0 0 1px var(--line)}
.calculators-panel{position:absolute;top:calc(100% + 8px);left:0;right:0;padding:12px;display:grid;border-radius:18px;background:var(--surface);color:var(--text);box-shadow:var(--shadow-card),inset 0 0 0 1px var(--line)}
.calculators-panel a{padding:8px 12px;border-radius:10px;text-decoration:none}
.calculators-panel a:hover,.calculators-panel a[aria-current=page]{background:var(--subtle);color:var(--accent)}
.nav.is-stuck .calculators-toggle{background:#ffffff14;color:var(--nav-text);box-shadow:inset 0 0 0 1px #ffffff29}
@media(min-width:861px){.calculators-panel{display:none}}
@media(min-width:861px) and (max-width:1120px){.nav .wordmark__text{display:none}.nav__inner{gap:12px}.nav__links{gap:12px;font-size:14px}}
@media(max-width:860px){.calculators-toggle{display:inline-flex;align-items:center}.nav__tools{margin-left:auto}}
@media(max-width:480px){.nav__cta{padding:0 14px;font-size:15px}.calculators-toggle{padding:0 9px;font-size:13px}.nav .wordmark__text{display:none}.nav__tools{margin-left:0}.nav__inner{justify-content:space-between}}
.no-js .calculators-toggle{display:none}
body.get-app-open{overflow:hidden}
.get-dialog .qr-pass{display:grid}
.get-dialog{max-height:calc(100dvh - 32px);overflow:auto;border-radius:34px}
@media(max-width:760px){
  .get-dialog{width:calc(100vw - 32px);border-radius:24px}
  .get-dialog__card{grid-template-columns:1fr;gap:0;padding:12px;border-radius:24px}
  .get-dialog__stage{height:270px;border-radius:18px}
  .get-dialog__phone{top:22px;left:10%}
  .get-dialog__phone .phone{--phone-w:160px}
  .get-dialog__pass{right:7%;bottom:16px}
  .get-dialog .qr-pass--big{width:156px}
  .get-dialog .qr-pass--big .qr-pass__code{padding:14px}
  .get-dialog .qr-pass--big .qr-pass__code>img:first-child{width:128px;height:128px}
  .get-dialog .qr-pass--big .qr-pass__icon{left:78px;top:78px;width:28px;height:28px}
  .get-dialog .qr-pass--big .qr-pass__text{padding:10px 14px 12px;gap:3px}
  .get-dialog .qr-pass b{font-size:15px}
  .get-dialog .qr-pass small{font-size:11px}
  .get-dialog .qr-pass__kicker{font-size:7px;gap:3px}
  .get-dialog__copy{padding:22px 12px 14px}
  .get-dialog__copy .display{font-size:28px}
  .get-dialog__lede{font-size:15px;margin-top:12px}
  .get-dialog__actions{margin-top:18px;gap:10px}
}
/* Keep the existing reserved spaces while small result states change. */
.tl-err{display:block;min-height:1.4em;line-height:1.4}
.tl-row-hint{display:block;min-height:1.4em}
.tl-row-hint:empty,.tl-err:empty{display:block}
#count-content,#timeline-content,.tl-example #res-total,.tl-input{transition:opacity .22s var(--ease-out)}
.tl-earliest .s{min-height:1.5em}
.tl-faq details.is-closing summary svg{transform:rotate(90deg)}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}
}
@media print{.cta,.get-dialog,.calculators-panel{display:none!important}}

/* Errors and example labels retain their space when the live result replaces them. */
#count-content[hidden],#timeline-content[hidden]{display:block!important;visibility:hidden}
#result-error{position:absolute;top:76px;left:32px;right:32px;margin:0}
.tl-example-tag[hidden]{display:inline-flex!important;visibility:hidden}
.tl-mbar .tl-example-tag[hidden]{display:none!important}
#timeline-track,#timeline-pin,#timeline-mark{transition:opacity .22s var(--ease-out)}
.uk-projections p[hidden]{display:block!important;visibility:hidden}
.cta .display,.get-dialog .display{font-weight:600}
.cta .display--l{font-size:clamp(34px,4vw,56px)}
.cta .lede{font-size:clamp(17px,1.3vw,20px)}
@media(max-width:760px){
  .get-dialog__stage{height:300px}
  .get-dialog .qr-pass--big .qr-pass__text small{display:none}
}

/* Result card app row: gentle 3D tilt toward the pointer + moving glare (mouse/pen only, off under reduced motion). */
@media (hover: hover) and (pointer: fine) {
  #result .tl-cta{position:relative;overflow:hidden;transform:perspective(700px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));transition:transform .55s var(--ease-out),box-shadow .55s var(--ease-out);will-change:transform}
  #result .tl-cta.is-tilting{transition:transform .12s linear,box-shadow .3s var(--ease-out);box-shadow:inset 0 0 0 1px rgba(255,255,255,.46),0 22px 36px -18px rgba(3,8,20,.7)}
  #result .tl-cta::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .4s var(--ease-out);background:radial-gradient(240px circle at var(--glare-x,50%) var(--glare-y,50%),rgba(255,255,255,.22),transparent 60%)}
  #result .tl-cta.is-tilting::after{opacity:1}
}
@media (prefers-reduced-motion: reduce) { #result .tl-cta{transform:none!important} #result .tl-cta::after{display:none} }
/* Seven calculators stay inline at 1240 px; the existing panel serves smaller screens. */
@media(min-width:1240px){.nav .nav__links{display:flex;gap:14px;font-size:14px}.calculators-toggle{display:none}.calculators-panel{display:none}}
@media(max-width:1239px){.nav .nav__links{display:none}.calculators-toggle{display:inline-flex;align-items:center}.calculators-panel{display:grid}.nav__tools{margin-left:auto}}
.spt-features{display:grid;grid-template-columns:minmax(0,1fr) 190px;align-items:center;gap:24px}
.spt-feature-shot{border-radius:24px;overflow:hidden;box-shadow:var(--shadow-card)}
.spt-feature-shot img{width:100%;height:auto}
.counter-centre .big.big--word{font-size:36px}
[data-tool=us-spt] .counter-centre .sub,[data-tool=snowbird] .counter-centre .sub{max-width:172px;line-height:1.5;margin-inline:auto}
@media(max-width:640px){.spt-features{grid-template-columns:1fr}.spt-feature-shot{width:190px;margin-inline:auto}}

.language-switcher { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin:0 0 24px; font-size:14px; }
.language-switcher a { padding:10px 8px; min-height:44px; display:inline-flex; align-items:center; }
.language-switcher a[aria-current="page"] { font-weight:700; text-decoration:underline; text-underline-offset:4px; }
.language-store-label { display:flex; align-items:center; justify-content:center; min-height:52px; padding:8px 14px; border:1px solid currentColor; border-radius:12px; text-align:center; font-size:15px; font-weight:600; line-height:1.25; }
html[lang="zh-Hant"] .counter-centre .lab { letter-spacing:0; }

@media(max-width:480px){html:not([lang="en"]) .nav__inner{gap:8px}html:not([lang="en"]) .nav__cta{padding:0 10px;font-size:13px}html:not([lang="en"]) .calculators-toggle{padding:0 7px;font-size:12px}html:not([lang="en"]) .nav__tools{gap:8px}}

html:not([lang="en"]) .counter-centre .lab,html:not([lang="en"]) .counter-centre .sub{max-width:160px;margin-inline:auto;line-height:1.3}
html:not([lang="en"]) .counter-centre .lab{font-size:13px}

@media(min-width:1240px) and (max-width:1599px){html:not([lang="en"]) .nav .nav__links{display:none}html:not([lang="en"]) .calculators-toggle{display:inline-flex;align-items:center}html:not([lang="en"]) .calculators-panel{display:grid}html:not([lang="en"]) .nav__tools{margin-left:auto}}
/* Seven inline calculators + the wordmark do not fit the narrower stuck pill (1072 px): the wordmark text
   folds away with the pill's own animation and the round mark stays. */
@media(min-width:1240px){
  .nav .wordmark__text{display:inline-block;max-width:170px;overflow:hidden;white-space:nowrap;transition:max-width .48s var(--ease-out),opacity .24s var(--ease-out)}
  .nav .wordmark{transition:gap .48s var(--ease-out)}
  .nav.is-stuck .wordmark__text{max-width:0;opacity:0}
  .nav.is-stuck .wordmark{gap:0}
}
@media(min-width:1240px) and (max-width:1359px){.nav .wordmark__text{max-width:0;opacity:0}.nav .wordmark{gap:0}}
@media(prefers-reduced-motion:reduce){.nav .wordmark__text,.nav .wordmark{transition:none}}