.metal-sheet--nailable{pointer-events:auto;cursor:none;transform-style:preserve-3d;position:relative}.hammer-cursor{z-index:60;pointer-events:none;opacity:0;filter:drop-shadow(0 6px 8px #071b3a4d);width:72px;height:48px;transition:opacity .15s;position:fixed;top:0;left:0}.hammer-cursor[data-visible=true]{opacity:1}.hammer-arm{transform-origin:68px 23px}.nail{width:0;height:0;transform-style:preserve-3d;pointer-events:none;position:absolute}.nail-lift{transform-style:preserve-3d;transform:translateZ(16px)}.nail-head{background:radial-gradient(circle at 35% 35%,#fff,#b8c4d2 45%,#5b6b80);border-radius:50%;width:10px;height:10px;position:absolute;top:-5px;left:-5px;box-shadow:0 0 0 1px #071b3a59}.nail-shaft{transform-origin:50% 0;background:linear-gradient(90deg,#7d8ca0,#e2e8f0,#7d8ca0);width:3px;height:16px;position:absolute;top:0;left:-1.5px;transform:rotateX(-90deg)}.nail-shaft--cross{transform:rotate(90deg)rotateX(-90deg)}.nail-ring{opacity:0;border:2px solid #12bfeae6;border-radius:50%;width:26px;height:26px;position:absolute;top:0;left:0;box-shadow:0 0 10px #12bfea99}.hammer-hint{white-space:nowrap;color:#0759d9;background:#ffffffe6;border:1px solid #0878f933;border-radius:9999px;padding:.3rem .75rem;font-size:.72rem;font-weight:700;animation:.6s cubic-bezier(.16,.84,.24,1) 1.2s both hammer-hint-in;position:absolute;top:calc(100% + 18px);left:50%;translate:-50%;box-shadow:0 6px 16px -8px #071b3a40}.hammer-toast{z-index:60;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#071b3af5;border:1px solid #ffffff1f;border-radius:1.25rem;width:min(22rem,100vw - 2rem);padding:1rem 1.1rem 1.1rem;animation:.55s cubic-bezier(.16,.84,.24,1) both hammer-toast-in;position:fixed;bottom:1.5rem;right:1.5rem;box-shadow:0 24px 48px -16px #071b3a8c,0 0 40px -12px #0878f980}@keyframes hammer-hint-in{0%{opacity:0;transform:translateY(8px)}}@keyframes hammer-toast-in{0%{opacity:0;transform:perspective(800px)translateY(24px)rotateX(18deg)scale(.96)}}
.savings-range{appearance:none;background:linear-gradient(90deg, #0878f9 0 var(--fill), #e2e8f0 var(--fill) 100%);cursor:pointer;border-radius:9999px;width:100%;height:6px}.savings-range::-webkit-slider-thumb{appearance:none;background:#fff;border:2px solid #0878f9;border-radius:50%;width:22px;height:22px;transition:transform .15s;box-shadow:0 2px 8px #0878f959}.savings-range::-webkit-slider-thumb:hover{transform:scale(1.15)}.savings-range:active::-webkit-slider-thumb{transform:scale(1.15)}.savings-range::-moz-range-thumb{background:#fff;border:2px solid #0878f9;border-radius:50%;width:20px;height:20px;box-shadow:0 2px 8px #0878f959}.savings-stage{perspective:1000px;height:13rem;margin:.5rem 0 1rem;position:relative}@media (min-width:640px){.savings-stage{height:15rem}}.savings-stack{width:0;height:0;transform-style:preserve-3d;position:absolute;bottom:26%;left:50%;transform:rotateX(60deg)rotate(-36deg)}.savings-layer{--sheet-w:200px;--sheet-h:130px;left:calc(var(--sheet-w) / -2);top:calc(var(--sheet-h) / -2);opacity:0;transform:translateZ(calc(var(--i) * 6px + 90px));transition:opacity .35s,transform .55s cubic-bezier(.34,1.4,.64,1);transition-delay:calc(var(--i) * 18ms);position:absolute;box-shadow:0 2px #071b3a99}.savings-layer[data-on]{opacity:1;transform:translateZ(calc(var(--i) * 6px))}.savings-badge{color:#12bfea;font-variant-numeric:tabular-nums;background:#12bfea1a;border:1px solid #12bfea4d;border-radius:9999px;padding:.3rem .75rem;font-size:.75rem;font-weight:700;position:absolute;top:.5rem;right:0}@media (prefers-reduced-motion:reduce){.savings-layer{transition:none}}