@charset "UTF-8";
:root{color-scheme:light;--paper:#f3f0e8;--ink:#232620;--muted:#73756b;--rule:#d8d7cb;--red:#e43b2c}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}
button,a{-webkit-tap-highlight-color:transparent}
a{color:inherit;text-decoration:none}
.page{max-width:1440px;margin:auto;padding:0 64px}
.header{display:flex;align-items:center;gap:28px;min-height:109px;border-bottom:1px solid var(--rule)}
.brand{display:flex;align-items:center;gap:12px;font-size:21px;font-weight:700;letter-spacing:-.7px}
.brand-mark{display:grid;place-items:center;width:34px;height:34px;background:var(--red);color:var(--paper);font-size:29px;line-height:1;letter-spacing:-2px;padding-right:3px}
.edition{font-family:monospace;font-size:10px;letter-spacing:.7px;color:var(--muted);margin-left:auto}
.status{font-size:11px;display:flex;align-items:center;gap:7px;margin-left:25px;white-space:nowrap}
.status>span{width:6px;height:6px;border-radius:50%;background:#65844e;box-shadow:0 0 0 4px #65844e0d}
main{padding-top:56px}
.eyebrow,.label{font:10px/1.5 monospace;letter-spacing:1.1px}
.eyebrow{display:flex;align-items:center;gap:10px}
.tiny-cross{font-size:19px;line-height:1;color:var(--red)}
.hero{display:grid;grid-template-columns:1.02fr 1fr;gap:48px;align-items:center;padding:31px 0 53px}
h1{font-size:clamp(48px,5.6vw,80px);letter-spacing:-5px;line-height:1.03;font-weight:800;margin:0 0 29px}
h1>span{color:var(--red)}
.description{font-size:16px;line-height:1.75;margin:0;color:#64675e}
.instruction{display:flex;align-items:center;gap:16px;margin-top:35px;font-size:11px;line-height:1.6;color:var(--muted)}
.arrow{font-size:37px;font-weight:400;color:var(--ink)}
.machine{min-width:0;background:#eae8df;border:1px solid #d7d5c9;border-radius:3px;position:relative;padding:19px 23px 15px;box-shadow:0 3px 0 #dfded5}
.machine-heading{display:flex;justify-content:space-between;gap:12px;font:8px/1.4 monospace;letter-spacing:.4px;color:#77796f}
.button-area{height:325px;display:grid;place-items:center;position:relative;isolation:isolate}
.orbit{position:absolute;width:292px;height:292px;border:1px solid #d3d2c7;border-radius:50%;z-index:-1}
.orbit-two{width:320px;height:320px;border-style:dashed;border-color:#d6d5ca}
.button-base{width:256px;height:256px;border-radius:50%;padding:14px;background:linear-gradient(155deg,#b9b9ae,#f8f6ed 48%,#babbb0);box-shadow:0 10px 20px #292d2324,0 2px 2px #333b3040,inset 0 2px 3px #ffffffc4}
.big-button{border:0;width:100%;height:100%;border-radius:50%;cursor:pointer;touch-action:manipulation;background:radial-gradient(ellipse at 40% 20%,#f75b47 0%,#e43b2c 53%,#c32a20 100%);color:#fff7e9;box-shadow:0 10px 0 #9f251d,0 13px 5px #431c184d,inset 0 2px 2px #ffb1a58c,inset 0 -2px 4px #b52519;transform:translateY(-8px);transition:transform .12s,box-shadow .12s;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:11px;user-select:none}
.button-label{font:bold 17px/1 Arial,sans-serif;letter-spacing:3px;margin-left:3px;text-shadow:0 1px 1px #891a1766}
.button-plus{font:34px/1 Arial,sans-serif;font-weight:200;opacity:.65}
.big-button:hover{filter:brightness(1.045)}
.big-button:active,.big-button.pressed{transform:translateY(0);box-shadow:0 2px 0 #9f251d,0 4px 3px #431c184d,inset 0 2px 2px #ffb1a58c}
.big-button:focus-visible{outline:3px solid var(--ink);outline-offset:19px}
.side-note{position:absolute;right:-6px;top:50%;writing-mode:vertical-rl;font:8px monospace;letter-spacing:1px;color:#85877b}
.pop{position:absolute;top:48px;left:calc(50% + 63px);font:bold 29px monospace;color:var(--red);pointer-events:none;opacity:0;transform:rotate(-12deg)}
.pop.animate{animation:pop .6s ease-out}
@keyframes pop{0%{opacity:0;translate:0 12px}20%{opacity:1}100%{opacity:0;translate:8px -36px}}
.machine-bottom{border-top:1px solid #d4d4c8;padding-top:12px;display:flex;align-items:center;gap:7px;color:#797d70;font:9px monospace}
.small-dot{width:5px;height:5px;border:1px solid #79816a;border-radius:50%}
.serial{margin-left:auto;font-size:8px}
.readout{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);display:grid;grid-template-columns:1fr 1.18fr 130px;gap:35px;padding:29px 0 30px;align-items:center}
.label{color:var(--muted);font-size:9px;letter-spacing:.8px}
.counter{font:52px/1.25 monospace;letter-spacing:-3px;white-space:nowrap;margin:5px 0 3px;font-variant-numeric:tabular-nums}
.counter-caption{font-size:10px;color:var(--muted)}
.receipt{border-left:1px solid var(--rule);padding-left:35px}
.receipt p{font-size:19px;line-height:1.4;margin:15px 0 13px;min-height:54px;max-width:340px;letter-spacing:-.4px}
.receipt-detail{font-size:10px;color:var(--muted);line-height:1.6;display:block;max-width:280px}
.stamp{width:116px;height:116px;border:2px solid #d64a396b;color:#cb4e3f99;border-radius:50%;transform:rotate(-12deg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;position:relative;text-align:center}
.stamp:after{content:"";inset:5px;border:1px solid #d64a3945;border-radius:50%;position:absolute;pointer-events:none}
.stamp span{font:6px monospace;letter-spacing:.2px}
.stamp strong{font-size:19px;line-height:1.05;letter-spacing:1px}
footer{display:flex;justify-content:space-between;gap:20px;color:#838579;font-size:10px;padding:25px 0 29px}
footer a{font:9px monospace;color:var(--ink)}
a:focus-visible{outline:2px solid var(--red);outline-offset:5px}
.no-script{font-size:14px;color:var(--red)}
@media(min-width:1500px){.page{max-width:1350px}main{padding-top:65px}.hero{padding-bottom:65px}}
@media(max-width:1100px){.page{padding:0 35px}.hero{gap:30px}h1{letter-spacing:-3px}.edition{display:none}.status{margin-left:auto}.button-base{width:225px;height:225px}.orbit{width:255px;height:255px}.orbit-two{width:280px;height:280px}.button-area{height:300px}.machine{padding-inline:16px}.readout{gap:25px;grid-template-columns:1fr 1.1fr 110px}.receipt{padding-left:25px}.stamp{width:105px;height:105px}.counter{font-size:46px}}
@media(max-width:700px){.page{padding:0 23px}.header{min-height:80px}.brand{font-size:19px}.brand-mark{width:30px;height:30px;font-size:25px}.status{font-size:9px;gap:6px}.status>span{width:5px;height:5px}main{padding-top:31px}.eyebrow{font-size:8px;letter-spacing:.8px}.hero{grid-template-columns:1fr;gap:29px;padding:25px 0 32px}h1{font-size:clamp(43px,10.3vw,67px);letter-spacing:-2.5px;margin-bottom:20px}.description{font-size:14px;line-height:1.7}.instruction{display:none}.machine{max-width:440px;width:100%;justify-self:center;padding:17px 19px 13px}.machine-heading{font-size:7px}.button-area{height:295px}.button-base{width:230px;height:230px}.orbit{width:260px;height:260px}.orbit-two{width:282px;height:282px}.side-note{font-size:7px;right:-7px}.readout{grid-template-columns:1fr 78px;gap:25px 15px;padding:23px 0}.counter{font-size:46px}.counter-block{grid-row:1}.receipt{grid-column:1 / -1;grid-row:2;border-left:0;border-top:1px solid var(--rule);padding:22px 0 0}.receipt p{min-height:0;font-size:18px;margin:11px 0}.receipt-detail{max-width:none}.stamp{width:77px;height:77px;grid-column:2;grid-row:1;gap:6px}.stamp strong{font-size:13px}.stamp span{font-size:4px}.label{font-size:8px}footer{font-size:9px;line-height:1.6;padding:20px 0;gap:15px}footer>span:nth-child(2){display:none}footer a{font-size:8px;white-space:nowrap}.counter-caption{font-size:9px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.big-button{transition:none}.pop.animate{animation:none}}
