:root{--motion-gold:#e9be65;--motion-x:50%;--motion-y:20%}html{scroll-behavior:smooth}body{isolation:isolate;padding-bottom:96px;overflow-x:clip}body>main,body>.topbar,.tool-centre-nav{position:relative;z-index:1}.motion-scene{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;contain:strict;background:radial-gradient(ellipse at var(--motion-x) var(--motion-y),#dfb84d0b,transparent 45%)}.motion-orb{position:absolute;width:650px;height:650px;right:-310px;top:-210px;border-radius:50%;background:radial-gradient(circle,#d0a75513,transparent 62%);border:1px solid #e9be6512;box-shadow:0 0 140px #e9be6508,inset 0 0 100px #e9be6508}.motion-orb:before,.motion-orb:after{content:"";position:absolute;inset:55px;border:1px dashed #e9be6524;border-radius:50%}.motion-orb:after{inset:115px;border-style:solid;border-color:#e9be6512}.motion-aurora{position:absolute;width:80vw;height:45vh;left:-25vw;bottom:-28vh;border-radius:50%;background:radial-gradient(ellipse,#e9be6510,transparent 67%);filter:blur(20px)}.motion-star{position:absolute;left:var(--sx);top:var(--sy);width:var(--ss);height:var(--ss);border-radius:50%;background:#e9be65;opacity:.15;box-shadow:0 0 13px #e9be65aa}.motion-scroll{position:fixed;left:0;top:0;height:2px;width:100%;transform-origin:left;transform:scaleX(0);background:linear-gradient(90deg,#9c7936,#f9d68b);z-index:20;pointer-events:none;box-shadow:0 0 12px #e9be6580}.motion-intro{position:fixed;right:26px;top:90px;border:1px solid #e9be6533;border-radius:40px;background:#13181bea;padding:10px 20px;color:#e9be65;font:700 11px/1.4 Arial,sans-serif;letter-spacing:3px;pointer-events:none;z-index:15;opacity:0}.motion-intro:before{content:"";display:inline-block;width:6px;height:6px;background:#e9be65;border-radius:50%;margin-right:10px;box-shadow:0 0 14px #e9be65}.motion-card{position:relative;transform-style:preserve-3d;will-change:auto}.motion-card:before{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(320px circle at var(--card-x,50%) var(--card-y,20%),#e9be6517,transparent 70%);pointer-events:none;opacity:0;transition:opacity .25s}.motion-card:hover:before{opacity:1}.grid .card{box-shadow:0 16px 45px #0002;overflow:hidden;min-height:315px}.grid .card .num{font:300 42px/1 Arial,sans-serif;letter-spacing:-2px;color:#e9be65aa;margin-bottom:13px}.grid .card h2{margin:10px 0;font-size:24px}.grid .card .button{position:relative}.motion-ripple{position:absolute;width:14px;height:14px;margin:-7px;border-radius:50%;background:#e9be6550;pointer-events:none;z-index:10}.motion-dock{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);z-index:12;display:flex;align-items:center;gap:4px;padding:6px;background:#13181bf2;border:1px solid #e9be6535;border-radius:18px;box-shadow:0 12px 55px #0009;backdrop-filter:blur(18px);max-width:calc(100vw - 24px);font:13px/1.4 Arial,"Microsoft YaHei",sans-serif}.motion-dock a,.motion-dock button{display:flex;align-items:center;justify-content:center;gap:6px;text-decoration:none;color:#b6baba;border:0;background:none;min-height:42px;white-space:nowrap;border-radius:12px;padding:10px 15px;font:inherit;cursor:pointer}.motion-dock a[aria-current=page]{color:#19150d;background:#e9be65;box-shadow:0 3px 17px #e9be651b}.motion-dock a:hover,.motion-dock button:hover{color:#f5d592;background:#e9be6512}.motion-dock a[aria-current=page]:hover{color:#19150d;background:#f5d592}.motion-dock button{border-left:1px solid #ffffff12;border-radius:0 12px 12px 0;padding:10px 13px;font-size:18px}.motion-dock a:focus-visible,.motion-dock button:focus-visible{outline:2px solid #e9be65;outline-offset:2px}.motion-dock .dock-long{display:none}.chart-caption strong{color:#e9be65}.maintenance-item{background:#171d20}.hero{position:relative}.hero h1{max-width:800px}.eyebrow{display:flex;align-items:center;gap:8px}.hero .eyebrow:before{content:"";width:6px;height:6px;border-radius:50%;background:#e9be65;box-shadow:0 0 13px #e9be65}button,.button{position:relative}input:focus,select:focus,textarea:focus{box-shadow:0 0 0 4px #e9be6512;border-color:#e9be65!important}.payback-card{box-shadow:0 10px 35px #0002}.roi,.monthly strong{color:#f7d68e}
@media(min-width:1100px){.motion-dock .dock-long{display:inline}.motion-dock a{padding:11px 20px}}@media(max-width:720px){.motion-intro{right:18px;top:108px;font-size:9px;padding:8px 13px}.motion-dock{bottom:12px;gap:0;border-radius:15px}.motion-dock a{padding:11px 12px;font-size:12px}.motion-dock button{padding:10px 9px}.motion-orb{width:440px;height:440px;right:-255px;top:-100px}.grid .card{min-height:285px}}
@media(prefers-reduced-motion:no-preference){
 ::view-transition-old(root){animation:motion-exit .14s ease-out}::view-transition-new(root){animation:motion-page .38s cubic-bezier(.2,.8,.2,1)}
 .motion-orb{animation:motion-orbit 52s linear infinite}.motion-aurora{animation:motion-aurora 18s ease-in-out infinite alternate}.motion-star{animation:motion-star 6s ease-in-out infinite;animation-delay:var(--sd)}.motion-intro{animation:motion-intro 1.2s cubic-bezier(.2,.8,.2,1) forwards}.motion-dock{animation:motion-dock .65s cubic-bezier(.18,.9,.2,1) both}.hero h1,.page-title,.calculator,.workspace{animation:motion-page .55s cubic-bezier(.2,.8,.2,1) both}.hero p{animation:motion-page .65s .07s both}.grid .card{animation:motion-card .7s cubic-bezier(.2,.8,.2,1) both}.grid .card:nth-child(2){animation-delay:.1s}.grid .card:nth-child(3){animation-delay:.2s}.grid .card{transition:transform .28s cubic-bezier(.2,.8,.2,1),border-color .2s,box-shadow .25s}.grid .card:hover{border-color:#e9be6570;box-shadow:0 22px 60px #0005,0 0 28px #e9be6508}.grid .card .num{transition:color .2s,transform .3s}.grid .card:hover .num{color:#f6d997;transform:translateX(3px)}button,.button,.motion-dock a,summary{transition:transform .2s cubic-bezier(.2,.8,.2,1),box-shadow .2s,background .2s}.primary:hover,.button.primary:hover,.share-row button:hover{box-shadow:0 0 28px #e9be6526;transform:translateY(-2px)}button:active,.button:active,.motion-dock a:active{transform:scale(.955)}.motion-ripple{animation:motion-ripple .6s ease-out forwards}.metrics article{transition:transform .25s,border-color .25s}.metrics article:hover{transform:translateY(-3px);border-color:#e9be6560}.motion-result{animation:motion-result .45s ease-out}.chart-saving{stroke-dasharray:1600;stroke-dashoffset:0;animation:motion-chart 1.3s cubic-bezier(.2,.8,.2,1)}.chart-investment{animation:motion-page .8s}.hero .eyebrow:before{animation:motion-beacon 2.5s infinite}.motion-scene{transition:background .4s}.field input,select,.field textarea{transition:box-shadow .2s,border-color .2s}.brand{animation:motion-brand .65s ease-out}
 @keyframes motion-orbit{to{transform:rotate(360deg)}}@keyframes motion-aurora{to{transform:translate(25vw,-14vh) scale(1.4)}}@keyframes motion-star{0%,100%{opacity:.07;transform:translateY(0)}50%{opacity:.42;transform:translateY(-18px)}}@keyframes motion-intro{0%{opacity:0;transform:translateY(-8px)}20%,65%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-5px)}}@keyframes motion-page{from{opacity:.55;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes motion-card{from{opacity:.45;translate:0 18px}to{opacity:1;translate:0 0}}@keyframes motion-exit{to{opacity:.65;transform:translateY(-5px)}}@keyframes motion-dock{from{opacity:0;translate:0 15px}to{opacity:1;translate:0 0}}@keyframes motion-ripple{to{transform:scale(18);opacity:0}}@keyframes motion-result{0%{filter:brightness(1.5);transform:translateY(4px)}100%{filter:brightness(1);transform:none}}@keyframes motion-chart{from{stroke-dashoffset:1600}to{stroke-dashoffset:0}}@keyframes motion-beacon{50%{box-shadow:0 0 0 5px #e9be650d,0 0 20px #e9be65aa}}@keyframes motion-brand{from{opacity:.5;letter-spacing:5px}to{opacity:1}}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.motion-intro,.motion-star,.motion-ripple{display:none}.motion-card{transform:none!important}}
@media print{.motion-scene,.motion-dock,.motion-scroll,.motion-intro,.motion-ripple{display:none!important}}
.payback-card{background:linear-gradient(130deg,#332b1c,#191e21);border:1px solid #e9be6540;color:#f4f1e8}.payback-card .roi{color:#f7d68e}.chart-caption strong{color:#e9be65}


/* Fast document navigation: retain the dock while the work surface crossfades. */
@view-transition{navigation:auto}
.motion-dock{view-transition-name:tools-dock}
@media(prefers-reduced-motion:no-preference){
 ::view-transition-old(root){animation:tools-fade-out .12s ease-out both}
 ::view-transition-new(root){animation:tools-fade-in .18s ease-out both}
 ::view-transition-group(tools-dock){animation-duration:.18s}
 .motion-dock{animation:none}
 .hero h1,.page-title,.calculator,.workspace,.hero p,.brand{animation-duration:.22s;animation-delay:0s}
 .grid .card,.grid .card:nth-child(2),.grid .card:nth-child(3){animation-duration:.25s;animation-delay:0s}
 .chart-saving{animation-duration:.45s}
 @keyframes tools-fade-out{to{opacity:0}}
 @keyframes tools-fade-in{from{opacity:0}to{opacity:1}}
}
@media(prefers-reduced-motion:reduce){@view-transition{navigation:none}::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}}

.rate-loading-note{color:#e9be65;font-size:13px;min-height:18px;margin:14px 0}
.rate-pending .result strong,.rate-pending #rate,.rate-pending .plan{visibility:hidden}
.rate-pending .result{background-image:linear-gradient(110deg,transparent,#e9be6508,transparent)}
@media(prefers-reduced-motion:no-preference){.hero h1,.page-title,.calculator,.workspace,.hero p,.brand,.grid .card{animation:none}::view-transition-old(root){animation:tools-fade-out .1s ease-out both}::view-transition-new(root){animation:tools-fade-in .14s ease-out both}}

.tools-switching{box-shadow:inset 0 0 0 2px #e9be65!important}.motion-dock a.tools-switching{color:#e9be65;background:#e9be6518}

/* A first-entry brand reveal, never an interaction gate. */
.motion-intro.motion-opening{inset:0;border:0;border-radius:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;background:radial-gradient(ellipse at center,#252016,#0b0e10 72%);padding:0;z-index:30;letter-spacing:4px;pointer-events:none}
.motion-opening:before{position:absolute;width:180px;height:180px;border:1px solid #e9be6535;background:none;box-shadow:0 0 70px #e9be6512;margin:0}
.motion-opening strong{font:700 clamp(38px,9vw,64px)/1 Arial,sans-serif;letter-spacing:9px;color:#f3d58c;z-index:1;text-shadow:0 0 35px #e9be6530}
.motion-opening span{font:500 11px/1.6 Arial,"Microsoft YaHei",sans-serif;letter-spacing:3px;z-index:1;color:#c1ad7d}
@media(prefers-reduced-motion:no-preference){.motion-intro.motion-opening{animation:tools-opening .95s ease-out both}.motion-opening strong{animation:tools-opening-mark .65s cubic-bezier(.2,.8,.2,1) both}.motion-opening:before{animation:tools-opening-ring .85s ease-out both}@keyframes tools-opening{0%,45%{opacity:1}100%{opacity:0;visibility:hidden}}@keyframes tools-opening-mark{from{opacity:0;transform:translateY(8px);letter-spacing:14px}to{opacity:1;transform:none;letter-spacing:9px}}@keyframes tools-opening-ring{from{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1.15)}}}
@media(prefers-reduced-motion:reduce){.motion-intro.motion-opening{display:none}}

.opening-logo{width:64px;height:64px;object-fit:contain;z-index:1}.motion-opening:after{content:"";position:absolute;width:min(70vw,340px);height:1px;background:linear-gradient(90deg,transparent,#e9be65,transparent);transform:translateY(125px)}@media(prefers-reduced-motion:no-preference){.motion-opening:after{animation:opening-light .9s ease-out both}@keyframes opening-light{from{opacity:0;scale:.2 1}50%{opacity:1}to{opacity:0;scale:1.2 1}}}

/* Opening dissolves into the same dark scene without an opaque cut. */
.motion-intro.motion-opening{background:radial-gradient(ellipse at center,#252016de,#0b0e10ef 72%);backdrop-filter:blur(6px)}
@media(prefers-reduced-motion:no-preference){.motion-intro.motion-opening{animation:opening-unfold 1s cubic-bezier(.2,.8,.2,1) both}@keyframes opening-unfold{0%,25%{opacity:1;backdrop-filter:blur(6px)}100%{opacity:0;backdrop-filter:blur(0);visibility:hidden}}.motion-result{animation-duration:.18s}.motion-ripple{animation-duration:.4s}}