/* Compact cartoon celebration, deliberately scoped to attendance only. */
.checkin-button{position:relative;border-radius:18px;border:1px solid #b5dac7;background:linear-gradient(180deg,#f0fff6,#dff5e9);box-shadow:0 7px 0 #123e33,0 11px 0 #092e2429,inset 0 2px 0 #ffffffd6;transform:translateY(0);transition:transform .12s cubic-bezier(.2,.8,.3,1),box-shadow .12s cubic-bezier(.2,.8,.3,1),background .15s;touch-action:manipulation;-webkit-tap-highlight-color:transparent;user-select:none}
.checkin-button:not(:disabled):hover{transform:translateY(-2px);box-shadow:0 9px 0 #123e33,0 13px 0 #092e2429,inset 0 2px 0 #fff;background:#f3fff7}
.checkin-button:not(.done):active,.checkin-button.is-pressed,.checkin-button.arming{transform:translateY(6px) scale(.985,.97);box-shadow:0 1px 0 #123e33,0 3px 0 #092e241c,inset 0 1px 0 #fff;background:#d8efdf}
.checkin-button .checkin-mark{border-color:#c7dbba;background:#fef3cf;box-shadow:inset 0 2px 0 #ffffffe0,0 3px 0 #c5d5b7;border-radius:14px;height:45px;width:45px;transition:transform .13s cubic-bezier(.2,1.4,.4,1);flex-shrink:0}
.checkin-button:not(:disabled):hover .checkin-mark{transform:rotate(-8deg) translateY(-1px)}.checkin-button.is-pressed .checkin-mark,.checkin-button.arming .checkin-mark{transform:rotate(7deg) scale(.92)}
.checkin-button .checkin-mark svg{display:block;overflow:visible}.checkin-button.done{border-color:#94cdb4;box-shadow:inset 0 2px 0 #effff4;transform:none}.checkin-button.done .checkin-mark{background:#bce6d0;border-radius:50%;box-shadow:none;border-color:#a2d4ba;color:#32684d;font-size:24px}
.checkin-preview.btn{border:0;background:transparent;color:#d4ebe2;font-size:11px;margin:9px auto 0;padding:3px 8px;min-height:28px;box-shadow:none}.checkin-preview.btn:hover{background:#ffffff10;color:white}.checkin-preview.btn:focus-visible{outline:2px solid #d4ebe2;outline-offset:2px}
dialog:has(.celebration-receipt){width:min(520px,calc(100% - 28px))}.checkin-button.is-working:before{display:none}.checkin-button.arming{opacity:1}
.celebration-receipt{max-width:440px;margin:0 auto 12px}.firework-stage{position:relative;width:min(320px,100%);height:225px;margin:-14px auto -2px;isolation:isolate;pointer-events:none;contain:layout style}
.firework-stage span,.firework-stage i{position:absolute;display:block;pointer-events:none}.fx-seed,.fx-check{left:50%;top:50%;width:112px;height:112px;transform:translate(-50%,-50%);opacity:0;z-index:3}.fx-star-art,.fx-check>svg{width:100%;height:100%;display:block;overflow:visible}.fx-eyes{transform-box:fill-box;transform-origin:center}.fx-check{z-index:6}.fx-seed{filter:drop-shadow(0 5px 0 #b4a06c1f)}
.fx-particle{left:50%;top:50%;opacity:0;background:var(--spark-color);width:9px;height:20px;border-radius:8px;z-index:4;box-shadow:inset 0 1px 0 #ffffff55;transform:translate(-50%,-50%)}.fx-particle.fx-dot{width:9px;height:9px;border-radius:50%}.fx-particle.fx-star{width:18px;height:18px;border-radius:0;clip-path:polygon(50% 0,63% 35%,100% 50%,64% 65%,50% 100%,36% 65%,0 50%,36% 35%)}
.fx-puff{left:50%;top:50%;width:45px;height:30px;transform:translate(-50%,-50%);opacity:0;z-index:1}.fx-puff svg{width:100%;height:100%;display:block;overflow:visible}.fx-aura{left:50%;top:50%;width:172px;height:172px;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,#fcedc9 0,#f5f6de80 55%,transparent 72%);opacity:0;z-index:0}
.fx-burst-ring{left:50%;top:50%;border:3px solid #e6d5a9;border-radius:50%;height:142px;width:142px;opacity:0;transform:translate(-50%,-50%);z-index:0}.fx-return-glow{left:50%;top:50%;width:132px;height:132px;border-radius:50%;background:radial-gradient(circle,#effff2 25%,#c9ecddaa 52%,#ebfcf200 72%);opacity:0;transform:translate(-50%,-50%);z-index:5}.fx-shadow{left:50%;top:78%;width:65px;height:9px;border-radius:50%;background:#6a8974;opacity:0;transform:translateX(-50%);filter:blur(1px);z-index:0}
.firework-stage.is-settled .fx-check{opacity:1;transform:translate(-50%,-50%) scale(1)}.firework-stage.is-settled .fx-aura{opacity:.26;transform:translate(-50%,-50%)}.firework-stage.is-settled .fx-shadow{opacity:.12;transform:translateX(-50%) scale(.75)}
.fx-static-spark{font-style:normal;color:#dcae55;font-size:23px;opacity:0;line-height:1}.fx-static-spark.one{left:24%;top:30%;transform:rotate(-10deg)}.fx-static-spark.two{right:23%;top:39%;font-size:15px;color:#6cb39b}.fx-static-spark.three{right:29%;top:66%;font-size:18px;color:#9cafdc}.firework-stage.is-settled .fx-static-spark{opacity:.55}
.celebration-message .receipt-status-pill{display:inline-flex;align-items:center;gap:5px;border:1px solid #c7e5d6;color:#376e58;background:#edf8f0;border-radius:30px;font-size:11px;line-height:1.4;padding:5px 11px;font-weight:500}.receipt-status-pill>span{font-size:12px}.celebration-message h2{font-size:25px;font-weight:650;letter-spacing:-.4px;margin:16px 0 10px}.celebration-message p{font-size:13px;color:var(--muted);margin:0;line-height:1.8}
.celebration-time{margin:24px auto 15px;display:flex;align-items:center;flex-direction:column;gap:7px}.celebration-time strong{font-size:35px;font-weight:500;line-height:1.2;letter-spacing:1.2px;font-variant-numeric:tabular-nums}.celebration-time>span{font-size:11px;color:var(--muted)}.celebration-receipt>.celebration-note{margin:13px 0 24px;font-size:11px;color:var(--muted);line-height:1.7}.celebration-actions{display:flex;align-items:center;flex-direction:column;gap:12px}.celebration-actions>.btn.primary{min-width:240px;min-height:46px;border-radius:11px;box-shadow:0 4px 0 color-mix(in srgb,var(--accent) 70%,#102b21);margin-bottom:3px}.celebration-actions>.btn.primary:active{transform:translateY(3px);box-shadow:0 1px 0 color-mix(in srgb,var(--accent) 70%,#102b21)}.celebration-replay.btn{border:0;background:transparent;box-shadow:none;color:var(--muted);font-size:11px;min-height:29px;padding:4px 11px;border-radius:8px}.celebration-replay.btn:hover{background:var(--surface-alt);color:var(--text)}
:root[data-theme=dark] .fx-aura{background:radial-gradient(circle,#6b745a77,#435e4433 50%,transparent 72%)}:root[data-theme=dark] .fx-burst-ring{border-color:#b6aa77}:root[data-theme=dark] .fx-return-glow{background:radial-gradient(circle,#d7fce7 0,#91e7b877 50%,transparent 72%)}:root[data-theme=dark] .receipt-status-pill{color:#b0e4c3;background:#244236;border-color:#416952}:root[data-theme=dark] .fx-check>svg{filter:drop-shadow(0 5px 12px #00000010)}
@media(max-width:800px){.celebration-receipt{margin-top:0}.firework-stage{height:202px;margin:-10px auto 0;width:min(300px,100%)}.fx-seed,.fx-check{width:100px;height:100px}.celebration-message h2{font-size:23px;margin-top:15px}.celebration-time{margin-top:20px}.celebration-time strong{font-size:32px}.celebration-receipt>.celebration-note{margin-bottom:20px}.celebration-actions>.btn.primary{min-width:min(240px,100%)}.checkin-preview.btn{display:block}.checkin-button{font-size:16px}}
@media(prefers-reduced-motion:reduce){.checkin-button,.checkin-button .checkin-mark{transition:none}.checkin-button:not(:disabled):hover{transform:none}.checkin-button:not(.done):active,.checkin-button.is-pressed,.checkin-button.arming{transform:none}}
:root[data-motion=reduced] .checkin-button,:root[data-motion=reduced] .checkin-button .checkin-mark{transition:none}