/* Tier colours and effects are presentation only; calculation stays in app.js. */
.calculator{--tier-accent:#a50839;--tier-pale:#faf0f4;--tier-line:#dfc5cf}
.calculator[data-tier="黃金"]{--tier-accent:#9b6508;--tier-pale:#fff7e4;--tier-line:#e4c97b}
.calculator[data-tier="白金"]{--tier-accent:#506b85;--tier-pale:#edf3fa;--tier-line:#adbdcd}
.calculator[data-tier="鑽石"]{--tier-accent:#057a9a;--tier-pale:#e9f9ff;--tier-line:#91d5e6}
.amount-stage{position:relative;isolation:isolate;margin-top:23px;padding:17px 19px 12px;background:linear-gradient(125deg,#fff,var(--tier-pale));border:1px solid var(--tier-line);border-radius:13px;transition:background .3s,border-color .3s;overflow:hidden}
.calculator .amount-stage .amount-row{margin:0;border:0;padding:0;position:relative;z-index:2}
.amount-stage .range{position:relative;z-index:3;margin-top:31px;height:7px}
.amount-stage .range::-webkit-slider-thumb{background:var(--tier-accent);width:24px;height:24px;box-shadow:0 0 0 1px var(--tier-line),0 2px 8px #19314a25}
.amount-stage .range::-moz-range-thumb{background:var(--tier-accent);width:17px;height:17px}
.amount-stage .range-labels{position:relative;z-index:2;color:#727c87}
.slider-hint{position:relative;z-index:2;font-size:9px;color:#8c8690;margin:12px 0 0;text-align:center}
.tier-status>span{color:var(--tier-accent);background:var(--tier-pale);border:1px solid var(--tier-line);font-size:12px}
.calculator .reward-result{background:var(--tier-pale);border:1px solid var(--tier-line);transition:background .3s,border-color .3s}
.calculator .reward-result output{color:var(--tier-accent)}
.tier-card b{display:inline-flex;align-items:center;gap:6px}.tier-emblem{font-size:18px;line-height:1;display:inline-flex;align-items:center;justify-content:center;width:23px;height:25px}
.tier-card[data-tier="黃金"] .tier-emblem{color:#a76b09}.tier-card[data-tier="白金"] .tier-emblem{color:#68829a;font-size:25px}
.tier-card.active{background:var(--tier-pale);border-color:var(--tier-line);box-shadow:inset 0 0 0 1px var(--tier-line)}
.tier-card.active b,.tier-card.active strong{color:var(--tier-accent)}
.tier-card small{font-size:9px;line-height:1.8}.tier-card[data-tier="鑽石"] small{font-weight:600;color:#217a92}
.reward-particles{position:absolute;inset:0;z-index:4;pointer-events:none;overflow:hidden}
.reward-particle{position:absolute;display:block;pointer-events:none;color:#d69a45;opacity:0;animation:reward-burst var(--life,1700ms) var(--delay,0ms) cubic-bezier(.15,.48,.42,1) both;filter:drop-shadow(0 2px 3px #253f5925)}
.reward-particle svg{display:block;width:100%;height:100%;stroke:none;fill:none}
.particle-diamond{filter:drop-shadow(0 0 5px #a1f4ff)}.particle-platinum{filter:drop-shadow(0 0 4px #d6e6f3)}
.tier-arrival{animation:tier-arrival .65s ease-out}
@keyframes reward-burst{0%{opacity:0;transform:translate(-50%,-10%) rotate(0) scale(.4)}12%{opacity:1}45%{opacity:1;transform:translate(calc(-50% + var(--dx) * .6),var(--rise)) rotate(calc(var(--spin) * .45)) scale(1)}100%{opacity:0;transform:translate(calc(-50% + var(--dx)),var(--fall)) rotate(var(--spin)) scale(.65)}}
@keyframes tier-arrival{0%{box-shadow:0 0 0 0 var(--tier-line)}50%{box-shadow:0 0 0 4px var(--tier-pale)}100%{box-shadow:0 0 0 0 transparent}}
.vip-tier-entry{width:100%;border:1px solid #a99a80;background:linear-gradient(115deg,#233248,#3c304a);color:#f8e2b0;border-radius:8px;display:flex;align-items:center;gap:8px;padding:10px 12px;margin-top:12px;text-align:left}
.vip-tier-entry>span:first-child{font-size:23px;line-height:1}.vip-tier-entry>b{font-size:12px}.vip-tier-entry>span:last-child{font-size:9px;margin-left:auto;color:#ede1cc}
.vip-tier-entry:hover{box-shadow:0 4px 15px #3b284126;border-color:#d6b66e}
.vip-project{position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:center;gap:23px;padding:30px 34px;margin-top:24px;border-radius:17px;background:linear-gradient(115deg,#18283c,#282038 68%,#493c46);color:#fff;border:1px solid #9d8766}
.vip-project:after{content:'';position:absolute;z-index:-1;right:-90px;top:-140px;width:480px;height:480px;border:1px solid #d2af6b32;border-radius:50%;box-shadow:0 0 0 40px #d2af6b07,0 0 0 80px #d2af6b05}
.vip-project-symbol{font-size:58px;color:#edce8d;line-height:1;border:1px solid #bda26f5c;width:87px;height:87px;display:flex;align-items:center;justify-content:center;border-radius:50%;flex:none;box-shadow:0 0 25px #d8b77315}
.vip-project .overline{color:#d8bc87;font-size:9px}.vip-project h2{font-size:26px;display:flex;align-items:center;gap:12px}.review-badge{display:inline-flex;padding:3px 9px;border:1px solid #cdb78377;border-radius:30px;font-size:10px;font-weight:500;color:#eddbb5;white-space:nowrap}
.vip-project-copy>p{font-size:11px;color:#c9c8d0;margin:7px 0 12px}.referral-highlight{display:flex;align-items:center;gap:8px;color:#ffe2a5;font-size:14px;line-height:1.8}.referral-highlight>span{font-size:19px}.vip-project-copy>small{font-size:9px;color:#aaa7b3;display:block;margin-top:3px}
.vip-project-button{margin-left:auto;background:#f5e4bd;color:#302b37;font-size:12px;min-height:46px;padding:11px 18px;flex:none}.vip-project-button:hover{background:#fff0d0;box-shadow:0 0 24px #ebd19733}
dialog.vip-dialog{width:min(600px,calc(100% - 32px));padding:0;background:#161d31;color:#fff;border-color:#c4a264;overflow-x:hidden;box-shadow:0 0 75px #8d72ad44,0 25px 90px #11182766}
.vip-dialog .dialog-close{background:#ffffff12;color:#fff;z-index:6;border:1px solid #ffffff38}
.vip-experience{text-align:center;padding:0 28px 30px;position:relative;background:radial-gradient(ellipse at 50% 8%,#554762aa,transparent 65%)}
.vip-constellation{height:220px;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;isolation:isolate}
.vip-crown{font-size:75px;line-height:1;color:#f7df9f;filter:drop-shadow(0 0 20px #e2b34f55);animation:vip-entrance 1.2s cubic-bezier(.2,.75,.2,1) both}
.vip-monogram{font:800 34px Georgia,serif;letter-spacing:10px;margin-left:10px;color:#fff3d0;animation:vip-entrance 1.4s ease-out both}
.vip-halo{position:absolute;inset:12px auto auto;width:190px;height:190px;border-radius:50%;border:1px solid #e5c88999;box-shadow:0 0 30px #caaa6244,inset 0 0 25px #c7ad5b11;z-index:-1;animation:vip-halo 1.5s ease-out both}
.halo-two{inset:32px auto auto;width:150px;height:150px;border-color:#b7c9fa77;animation-delay:.15s}
.vip-particles{position:absolute;inset:0 -25px;pointer-events:none;overflow:hidden;z-index:3}
.vip-experience>.overline{color:#d9be88;letter-spacing:3px}.vip-experience h2{font-size:31px;letter-spacing:2px;margin:8px 0}.vip-lead{font-size:13px;color:#c7c6d4;margin:0 0 22px}
.vip-referral{border:1px solid #ba9c5a66;background:linear-gradient(110deg,#d9b87513,#e2c68e08);border-radius:12px;padding:17px;color:#f7dda3;display:flex;justify-content:center;align-items:center;gap:12px;font-size:18px;line-height:1.7}
.vip-referral>span{font-size:29px}.vip-terms{font-size:11px;color:#aaa9bd;line-height:1.9;margin:16px 0}.vip-contact{width:100%;background:linear-gradient(100deg,#dec18a,#fff0c9);color:#252333;font-size:13px;justify-content:space-between}
@keyframes vip-entrance{from{opacity:0;transform:translateY(24px) scale(.6);filter:blur(7px)}to{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}
@keyframes vip-halo{from{opacity:0;transform:scale(.3) rotate(-60deg)}to{opacity:1;transform:scale(1) rotate(0)}}
@media(max-width:850px){.amount-stage{padding:16px 12px 12px}.vip-project{padding:26px;gap:18px}.vip-project-symbol{width:60px;height:60px;font-size:40px}.vip-project h2{font-size:22px}.referral-highlight{font-size:12px}.vip-project-button{padding:10px 13px;gap:12px;font-size:11px}.tier-card small{font-size:8px}}
@media(max-width:600px){.calculator .amount-stage .amount-row{gap:7px}.calculator .amount-stage .amount-input-wrap input{max-width:110px;font-size:25px}.calculator .amount-stage .amount-row>label{font-size:10px}.tier-card>div{gap:5px;flex-wrap:wrap}.tier-emblem{font-size:17px;width:20px}.tier-card b{font-size:11px}.tier-card strong{font-size:9px}.tier-card small{font-size:8px}.tier-status>span{font-size:11px}.slider-hint{font-size:8px}.vip-tier-entry>b{font-size:11px}.vip-tier-entry>span:last-child{font-size:8px}.vip-project{display:block;padding:24px 22px;margin-top:20px}.vip-project-symbol{position:absolute;top:22px;right:20px;width:48px;height:48px;font-size:34px}.vip-project .overline{font-size:7px;letter-spacing:1.4px;padding-right:35px}.vip-project h2{font-size:23px;display:block}.review-badge{margin-left:9px;font-size:8px;padding:2px 7px;vertical-align:middle}.vip-project-copy>p{margin-top:12px;font-size:10px}.referral-highlight{align-items:flex-start;font-size:13px}.vip-project-copy>small{font-size:8px;line-height:1.8}.vip-project-button{width:100%;margin-top:20px;justify-content:space-between}.vip-experience{padding:0 20px 25px}.vip-constellation{height:190px}.vip-halo{width:165px;height:165px}.halo-two{width:125px;height:125px}.vip-crown{font-size:63px}.vip-monogram{font-size:29px}.vip-experience h2{font-size:27px}.vip-referral{font-size:15px;padding:15px 10px;gap:9px}.vip-terms{font-size:10px}}
@media(prefers-reduced-motion:reduce){.reward-particle{display:none}.tier-arrival,.vip-crown,.vip-monogram,.vip-halo{animation:none!important}.vip-crown,.vip-monogram,.vip-halo{opacity:1;transform:none}}

/* Compact reward presentation; diamond offers are reviewed, not fixed totals. */
.reward-result [hidden]{display:none!important}
.calculator .reward-result.diamond-state{display:block;padding:20px 22px;min-height:136px;background:linear-gradient(115deg,#f2fbff,#e2f5fd)}
.diamond-benefits{display:flex;flex-direction:column;gap:7px;position:relative}
.diamond-benefits .diamond-eyebrow{font-size:10px;letter-spacing:1.3px;color:#547c8d;font-weight:500}
.diamond-benefits>strong{font-size:22px;line-height:1.5;color:#1b4257;font-weight:700}
.diamond-benefits em{font-style:normal;color:#057a9a;font-size:28px;white-space:nowrap}
.diamond-referral{font-size:14px;color:#076783;letter-spacing:.4px}.diamond-referral>span{color:#b78c42;margin-right:4px}
.reward-note{font-size:10px;line-height:1.8;color:#7b818a;margin:13px 0 0}
@media(max-width:600px){.calculator .reward-result.diamond-state{padding:18px 16px}.diamond-benefits>strong{font-size:17px}.diamond-benefits em{font-size:22px}.diamond-referral{font-size:13px}.reward-note{font-size:9px}}