:root{--bg:#101117;--bg2:#181921;--bg3:#22232d;--text:#f9f7f2;--muted:#a6a3ab;--soft:#73717b;--accent:#ff7956;--accent2:#ffbc72;--line:rgba(255,255,255,.105);--paper:#f3eee3;--ink:#252027;--shadow:0 27px 70px rgba(0,0,0,.35)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;min-height:100vh;background:var(--bg);color:var(--text);font-family:Inter,"Segoe UI",Roboto,Arial,sans-serif;-webkit-font-smoothing:antialiased;line-height:1.5;overflow-x:hidden}
button,input{font:inherit}
button{cursor:pointer}
button:disabled{cursor:not-allowed}
a{color:inherit}
:focus-visible{outline:3px solid #ffbd6b;outline-offset:3px}
[hidden]{display:none!important}
.wrap{width:min(1160px,calc(100% - 48px));margin-inline:auto;position:relative}
.page-glow{position:absolute;inset:0 0 auto;min-height:875px;pointer-events:none;z-index:0;background:radial-gradient(ellipse 48% 32% at 83% 30%,rgba(255,112,77,.13),transparent 100%),radial-gradient(ellipse 36% 30% at 12% 12%,rgba(246,162,119,.08),transparent 100%)}
.page-glow:after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px);background-size:46px 46px;mask-image:linear-gradient(to bottom,black,transparent 85%)}
.skip-link{position:absolute;z-index:20;left:20px;top:-70px;background:white;color:#141414;padding:12px 16px;border-radius:8px}.skip-link:focus{top:12px}
.site-header{height:90px;display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid var(--line)}
.brand{text-decoration:none;display:inline-flex;gap:11px;align-items:center;font-size:20px;font-weight:850;letter-spacing:-.8px}
.brand-mark{width:37px;height:37px;display:grid;place-items:center;border-radius:10px;background:var(--accent);color:#251a1a;font-size:26px;line-height:1;font-weight:950;position:relative}
.brand-mark-dot{font-size:28px;position:absolute;right:5px;bottom:-3px}
.brand-accent{color:var(--accent)}
.header-stamp{font-size:10px;color:#c7c3cc;font-weight:750;letter-spacing:1.6px;white-space:nowrap;border:1px solid var(--line);border-radius:50px;padding:9px 13px;background:rgba(255,255,255,.025)}
.stamp-dot{display:inline-block;width:6px;height:6px;background:#b8f19e;border-radius:50%;margin-right:7px;vertical-align:1px;box-shadow:0 0 10px rgba(184,241,158,.5)}
.hero{padding:65px 0 40px}
.hero-kicker{display:flex;align-items:center;gap:8px;color:#d0c7be;font-size:11px;text-transform:uppercase;letter-spacing:2.15px;font-weight:750}
.asterisk{font-size:21px;color:var(--accent);line-height:0}
h1{font-size:clamp(52px,7vw,94px);font-weight:900;letter-spacing:-5px;line-height:1.04;margin:20px 0 22px;max-width:1060px}
h1 em{font-style:normal;color:var(--accent);position:relative}
.title-muted{color:#a7a3a8}
.hero-intro{font-size:17px;max-width:700px;color:#b9b5bd;line-height:1.73;margin:0 0 27px}
.hero-intro strong{color:#f5eee7;font-weight:750}
.fact-strip{display:flex;align-items:center;flex-wrap:wrap;gap:8px 0;color:#aaa7af;font-size:12px;font-weight:520}
.fact-strip>span{padding:0 19px;border-right:1px solid #393740;line-height:1.2}
.fact-strip>span:first-child{padding-left:0}
.fact-strip>span:last-child{border:0}
.fact-strip strong{color:#e4dee1}
.calculator{display:grid;grid-template-columns:1.03fr .97fr;gap:30px;align-items:start;margin-top:20px}
.control-panel{padding:35px;background:#1b1c24;border:1px solid #38313a;border-radius:18px;box-shadow:var(--shadow);min-width:0}
.panel-overline,.receipt-intro{font-size:10px;color:var(--accent);font-weight:800;letter-spacing:2.2px}
.panel-heading h2{font-size:clamp(29px,3vw,39px);letter-spacing:-1.7px;line-height:1.12;margin:14px 0 10px;font-weight:860}
.panel-heading h2 span{color:var(--accent)}
.panel-heading p{font-size:13px;color:#a5a1ad;margin:0 0 34px}
.field-label{display:flex;align-items:baseline;justify-content:space-between;gap:12px;font-size:13px;color:#f2eaf0;font-weight:750;margin-bottom:11px}
.label-suffix{font-size:11px;font-weight:450;color:#9d99a3;text-align:right}
.input-combo{height:75px;padding:8px;display:flex;align-items:center;border:1px solid #55505a;border-radius:12px;background:#111219;transition:border-color .18s,box-shadow .18s}
.input-combo:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px rgba(255,121,86,.11)}
.input-combo.invalid{border-color:#ff7183}
.input-combo input{background:transparent;color:white;border:0;outline:none;min-width:0;width:100%;font-size:34px;letter-spacing:-1.2px;font-weight:750;padding:8px 12px;font-variant-numeric:tabular-nums}
.input-combo input::placeholder{color:#585660}
.unit-switch{display:flex;background:#292a33;border-radius:9px;padding:3px;flex:none}
.unit-option{background:transparent;border:0;border-radius:7px;padding:11px 13px;color:#a6a4ae;font-size:13px;font-weight:800;min-width:45px}
.unit-option.is-selected{background:#f5eee7;color:#242028;box-shadow:0 2px 4px rgba(0,0,0,.18)}
.field-help{font-size:11px;color:#aaa5ad;margin:10px 0 0;line-height:1.55}
.field-error{font-size:12px;color:#ff9fa3;margin:6px 0}
.presets{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-top:22px}
.preset-title{color:#ada8b0;font-size:11px;margin-right:3px}
.preset{background:transparent;color:#c5bfc7;border:1px solid #4e4750;border-radius:40px;padding:7px 10px;font-size:11px;font-weight:650;transition:.15s}
.preset:hover,.preset.is-selected{background:rgba(255,121,86,.13);border-color:var(--accent);color:#ffb398}
.section-separator{height:1px;background:var(--line);margin:30px 0 26px}
.period-switch{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid #4c4750;border-radius:11px;padding:4px;gap:5px;background:#14151c}
.period-option{min-width:0;min-height:52px;padding:10px 5px;text-align:center;color:#a9a3af;background:transparent;border:0;border-radius:7px;font-size:11px;font-weight:750;line-height:1.35}
.period-option.is-selected{background:#343039;color:#fff1e9}
.primary-button{width:100%;border:0;border-radius:11px;background:var(--accent);color:#2d1715;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:20px 19px;margin-top:29px;text-align:left;font-size:12px;letter-spacing:.5px;font-weight:950;box-shadow:0 9px 30px rgba(255,121,86,.2);transition:background .2s,transform .2s,box-shadow .2s}
.primary-button:hover{background:#ff9978;transform:translateY(-2px);box-shadow:0 14px 32px rgba(255,121,86,.24)}
.primary-button:active{transform:translateY(0)}
.primary-button .arrow{font-size:25px;line-height:.7}
.pending-hint{margin:12px 0 0;padding:10px 12px;border:1px solid #8e644b;border-radius:8px;background:rgba(255,180,99,.08);color:#ffca96;font-size:11px;line-height:1.5}
.receipt-pending{margin:-6px 0 14px;padding:9px 12px;border:1px solid #86634f;border-radius:8px;color:#ffcd9a;background:rgba(255,150,79,.07);font-size:11px;line-height:1.5}
.fireworks-layer{position:absolute;inset:0;z-index:6;pointer-events:none;overflow:visible;isolation:isolate}
.firework-spark{position:absolute;display:block;left:0;top:0;width:7px;height:7px;border-radius:2px;background:var(--spark-color,#ff7956);opacity:0;box-shadow:0 0 11px var(--spark-color,#ff7956);transform:translate(-50%,-50%) rotate(0deg) scale(.4);animation:firework-spark 1200ms cubic-bezier(.15,.6,.26,1) both;animation-delay:var(--spark-delay,0ms)}
.firework-spark.is-star{width:5px;height:5px;border-radius:50%;box-shadow:0 0 14px 3px var(--spark-color,#ff7956)}
.firework-ring{position:absolute;display:block;width:12px;height:12px;left:0;top:0;border:2px solid #ffc891;border-radius:50%;transform:translate(-50%,-50%) scale(.2);animation:firework-ring 700ms ease-out both;opacity:0}
@keyframes firework-spark{0%{opacity:0;transform:translate(-50%,-50%) rotate(0deg) scale(.25)}12%{opacity:1}60%{opacity:1;transform:translate(calc(-50% + var(--spark-x-mid)),calc(-50% + var(--spark-y-mid))) rotate(320deg) scale(1)}100%{opacity:0;transform:translate(calc(-50% + var(--spark-x)),calc(-50% + var(--spark-y) + 65px)) rotate(550deg) scale(.35)}}
@keyframes firework-ring{0%{opacity:.9;transform:translate(-50%,-50%) scale(.2)}100%{opacity:0;transform:translate(-50%,-50%) scale(12)}}
.privacy-note{display:flex;align-items:baseline;gap:7px;color:#95909d;font-size:11px;line-height:1.5;margin:24px 0 0}
.privacy-note span{color:#b5deac;font-size:15px}
.receipt-wrap{min-width:0}
.receipt-intro{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:1px 0 15px;color:#c9b7b5}
.live-light{color:#afa7ad;font-size:10px;letter-spacing:1.3px}
.live-light i{display:inline-block;border-radius:50%;width:6px;height:6px;background:#a4df96;vertical-align:1px;margin-right:3px}
.receipt{position:relative;isolation:isolate;background:var(--paper);color:var(--ink);border-radius:7px 7px 0 0;box-shadow:0 30px 50px rgba(0,0,0,.33);transform:rotate(.6deg);transition:transform .25s;min-height:560px}
.receipt:hover{transform:rotate(0deg)}
.receipt-head{display:flex;align-items:center;gap:11px;padding:26px 27px 21px}
.receipt-icon{display:grid;place-items:center;background:#272029;color:#f4f0e6;border-radius:50%;width:45px;height:45px;flex:none;font-size:26px;font-family:Georgia,serif;font-weight:700}
.receipt-heading{display:flex;flex-direction:column;min-width:0}
.receipt-heading strong{font-size:13px;letter-spacing:1.6px;font-weight:900}
.receipt-heading span{font-size:10px;color:#6f6469;line-height:1.5}
.receipt-number{margin-left:auto;white-space:nowrap;font-size:9px;color:#81777a;font-weight:700}
.receipt-rule{border-bottom:3px solid #242128;border-top:1px solid #242128;height:6px;margin:0 27px}
.receipt-body{padding:23px 28px 26px;min-height:352px}
.empty-state{text-align:center;display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:300px}
.empty-icon{font-size:48px;color:#e28a6b;line-height:1}
.empty-state h3{max-width:300px;font-size:28px;line-height:1.16;letter-spacing:-1px;margin:18px 0 8px}
.empty-state p{font-size:13px;max-width:310px;color:#716970;line-height:1.65;margin:0 0 23px}
.waiting-stamp{border:1.5px solid #c4b7b2;color:#9b8885;font-size:10px;font-weight:900;letter-spacing:1.5px;padding:7px 12px;transform:rotate(-5deg);border-radius:3px}
.result-eyebrow{font-size:10px;letter-spacing:1.2px;color:#8a5556;font-weight:850}
.result-eyebrow span{font-size:15px;color:#b2524f}
.congrats{font-size:21px;line-height:1.25;letter-spacing:-.65px;margin:22px 0 8px;color:#34262c}
.congrats strong{font-size:28px;font-weight:900}
.result-amount{font-weight:950;letter-spacing:-4px;font-size:clamp(53px,5.4vw,78px);line-height:1.08;margin:0;color:#df624e;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.fake-tag{font-size:12px;font-weight:750;letter-spacing:.05px;margin:11px 0 22px;color:#6d5f65}
.receipt-dash{border-top:2px dashed #d2c3bd;margin-bottom:18px}
.receipt-line{display:flex;justify-content:space-between;gap:15px;margin:9px 0;font-size:11px;color:#6d656a}
.receipt-line strong{color:#2c272b;font-weight:850;text-align:right}
.snark{display:flex;gap:11px;background:#ebe2d5;border-left:3px solid #e68f6d;padding:11px 14px 12px;margin:20px 0 0}
.snark-symbol{font:40px Georgia,serif;line-height:1;color:#bb7160}
.snark p{font-size:13px;line-height:1.5;font-weight:650;margin:3px 0}
.receipt-footer{background:#e9e0d5;padding:20px 28px 21px;border-top:1px dashed #c4b5b2}
.footer-warning{display:inline-block;background:#302932;color:#fff1e9;font-size:10px;letter-spacing:.45px;font-weight:900;padding:6px 9px}
.receipt-footer p{font-size:11px;line-height:1.6;margin:10px 0 0;color:#645d60}
.receipt-edge{height:13px;position:absolute;left:0;right:0;bottom:-12px;background:var(--paper);clip-path:polygon(0 0,100% 0,100% 15%,98% 100%,96% 15%,94% 100%,92% 15%,90% 100%,88% 15%,86% 100%,84% 15%,82% 100%,80% 15%,78% 100%,76% 15%,74% 100%,72% 15%,70% 100%,68% 15%,66% 100%,64% 15%,62% 100%,60% 15%,58% 100%,56% 15%,54% 100%,52% 15%,50% 100%,48% 15%,46% 100%,44% 15%,42% 100%,40% 15%,38% 100%,36% 15%,34% 100%,32% 15%,30% 100%,28% 15%,26% 100%,24% 15%,22% 100%,20% 15%,18% 100%,16% 15%,14% 100%,12% 15%,10% 100%,8% 15%,6% 100%,4% 15%,2% 100%,0 15%)}
.receipt.is-printed{animation:pop-in .42s cubic-bezier(.2,.8,.2,1)}
@keyframes pop-in{0%{transform:rotate(.6deg) scale(.975);filter:brightness(1.15)}100%{transform:rotate(.6deg) scale(1);filter:brightness(1)}}
.receipt-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:26px}
.secondary-button{display:flex;justify-content:center;align-items:center;gap:10px;min-height:48px;background:rgba(255,255,255,.04);border:1px solid #55505a;color:#f4eee9;border-radius:9px;font-size:12px;font-weight:800;transition:.16s}
.secondary-button:not(:disabled):hover{background:#31303b;border-color:#aaa0ac}
.secondary-button:disabled{opacity:.4}
.secondary-button span{font-size:18px;font-weight:400;line-height:1}
.action-feedback{color:#b1dda9;text-align:center;font-size:12px;min-height:20px;margin:12px 0 0}
.explain{margin-top:100px;padding-bottom:62px}
.explain-heading{text-align:center}
.explain-heading h2{font-size:clamp(31px,4vw,50px);letter-spacing:-2.2px;line-height:1.15;margin:16px 0 12px}
.explain-heading h2 em{font-style:normal;color:var(--accent)}
.explain-heading>p{margin:0;font-size:15px;color:#afaab4}
.explain-heading>p strong{color:white}
.info-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;margin:36px 0 24px}
.info-card{padding:25px 23px;min-height:211px;border:1px solid #39353c;background:#1b1b24;border-radius:12px}
.info-icon{display:inline-grid;place-items:center;background:#3a292d;color:#ffab8d;border-radius:6px;font-size:11px;font-weight:900;width:29px;height:29px}
.info-card h3{margin:22px 0 8px;letter-spacing:-.5px;font-size:18px;line-height:1.2}
.info-card p{color:#b3acb5;font-size:12px;line-height:1.75;margin:0}
.method-details{max-width:920px;margin:0 auto;background:#1a1b22;border:1px solid #3b363f;border-radius:10px;overflow:hidden}
.method-details summary{display:flex;align-items:center;justify-content:space-between;padding:18px 21px;color:#e3dde3;font-size:13px;font-weight:750;cursor:pointer;list-style:none}
.method-details summary::-webkit-details-marker{display:none}
.method-details summary span{font-size:20px;font-weight:400;color:var(--accent)}
.method-details[open] summary span{transform:rotate(45deg)}
.details-content{padding:0 22px 23px;font-size:13px;line-height:1.75;color:#b3aeb6}
.details-content p{margin:11px 0}
.details-content a{color:#ffb295;text-underline-offset:3px}
.site-footer{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;border-top:1px solid var(--line);padding:26px 0 37px;color:#8d8893;font-size:11px}
.site-footer strong{color:#e7dfe4}
@media(min-width:900px){.receipt-wrap{padding-top:11px}}
@media(max-width:900px){.calculator{grid-template-columns:1fr;gap:40px;max-width:620px}.receipt{min-height:0}.hero{padding-top:55px}.hero h1{letter-spacing:-3px}.info-grid{grid-template-columns:1fr}.info-card{min-height:0}.explain{margin-top:78px}}
@media(max-width:580px){.wrap{width:min(100% - 32px,1160px)}.site-header{height:72px}.brand{font-size:18px}.brand-mark{width:33px;height:33px;font-size:22px}.header-stamp{max-width:150px;font-size:8px;line-height:1.5;white-space:normal;letter-spacing:.85px;padding:6px 8px}.hero{padding:43px 0 25px}.hero-kicker{font-size:9px;letter-spacing:1.3px}h1{font-size:clamp(48px,12vw,64px);letter-spacing:-3.2px;margin:19px 0}.hero-intro{font-size:14px;line-height:1.7;margin-bottom:24px}.fact-strip{font-size:10px;line-height:1.5}.fact-strip>span{padding:0 10px}.control-panel{padding:26px 20px}.panel-heading p{margin-bottom:27px}.panel-heading h2{font-size:31px}.field-label{font-size:12px}.label-suffix{font-size:10px}.input-combo{height:68px}.input-combo input{font-size:30px;padding:8px 9px}.unit-option{min-width:38px;padding:9px 10px}.period-option{font-size:10px;padding:9px 4px;min-height:55px}.primary-button{font-size:10px;padding:19px 14px;letter-spacing:0}.receipt-head{padding:21px 19px 17px}.receipt-rule{margin:0 19px}.receipt-body{padding:22px 20px}.receipt-footer{padding:18px 20px}.receipt-heading strong{font-size:10px;letter-spacing:.8px}.receipt-heading span{font-size:9px}.receipt-number{font-size:8px}.receipt-icon{width:38px;height:38px;font-size:23px}.congrats{font-size:18px}.congrats strong{font-size:25px}.result-amount{font-size:clamp(48px,10vw,67px);letter-spacing:-3px}.secondary-button{gap:5px;font-size:11px}.explain-heading h2{letter-spacing:-1px}.info-grid{margin-top:25px}}
@media(max-width:360px){.header-stamp{display:none}.input-combo input{font-size:26px}.receipt-number{display:none}.receipt-actions{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;transition-duration:.001ms!important;scroll-behavior:auto!important}.fireworks-layer{display:none}}
