{"release_id":"01a1c502-4ad1-0000-ec62-adc54d3c69aa","chunk_id":"01a1c502-4bd8-7783-a8be-128c7338d389","file":"BeP7KjfM.mjs","mappings":"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","names":["durationSeconds","targetMs","$$props","startMs","$.derived","now","$.state","$.proxy","didFire","interval","onDestroy","phase","$.get","remainingSec","ms","displayNum","$.user_effect","TOTAL_MS","prevDigit","currDigit","flipping","lastSeen","endTimer","next","$.set","section","root","div","div_1","div_2","$.first_child","fragment","div_3","span","div_4","div_5","span_1","classes","$.set_class","$$render","consequent","alternate","div_6","fragment_2","div_7","span_2","div_8","div_9","span_3","consequent_1","h2","span_4","$.sibling","text_4","t","span_5","text_6","span_6","text_8","consequent_2","consequent_3","alternate_1","p","$.template_effect","$0","$.set_text","text_10"],"sources":["../../../../../../src/lib/components/duel/SyncCountdown.svelte"],"sourcesContent":["<script lang=\"ts\">\n\timport { t } from '$lib/i18n';\n\timport { onDestroy } from 'svelte';\n\n\tinterface Props {\n\t\t/** ISO string — server timestamp when the \"3\" begins. */\n\t\tcountdownStartedAt: string;\n\t\t/** Seconds the countdown lasts (default 3). */\n\t\tdurationSeconds?: number;\n\t\t/** Fires when the countdown hits zero. Idempotent — parent should handle multiple calls. */\n\t\toncomplete?: () => void;\n\t}\n\n\tlet { countdownStartedAt, durationSeconds = 3, oncomplete }: Props = $props();\n\n\tconst targetMs = $derived(new Date(countdownStartedAt).getTime() + durationSeconds * 1000);\n\tconst startMs = $derived(new Date(countdownStartedAt).getTime());\n\n\tlet now = $state(Date.now());\n\tlet didFire = false;\n\n\tconst interval = setInterval(() => {\n\t\tnow = Date.now();\n\t}, 50);\n\tonDestroy(() => clearInterval(interval));\n\n\tconst phase = $derived.by<'lead' | 'tick' | 'done'>(() => {\n\t\tif (now < startMs) return 'lead';\n\t\tif (now >= targetMs) return 'done';\n\t\treturn 'tick';\n\t});\n\n\tconst remainingSec = $derived.by(() => {\n\t\tconst ms = Math.max(0, targetMs - now);\n\t\treturn Math.ceil(ms / 1000);\n\t});\n\n\tconst displayNum = $derived(phase === 'done' ? 0 : phase === 'lead' ? null : remainingSec);\n\n\t$effect(() => {\n\t\tif (phase === 'done' && !didFire) {\n\t\t\tdidFire = true;\n\t\t\toncomplete?.();\n\t\t}\n\t});\n\n\t// ─── Solari split-flap state ──────────────────────────────────\n\t// Total flip = 560ms (fold 280ms then flip 280ms, sequenced via CSS animation-delay).\n\tconst FOLD_MS = 280;\n\tconst FLIP_MS = 280;\n\tconst TOTAL_MS = FOLD_MS + FLIP_MS;\n\n\tlet prevDigit = $state<number | null>(null);\n\tlet currDigit = $state<number | null>(null);\n\tlet flipping = $state(false);\n\tlet lastSeen: number | null = null;\n\tlet endTimer: ReturnType<typeof setTimeout> | null = null;\n\n\t$effect(() => {\n\t\tconst next = displayNum;\n\t\tif (next === lastSeen) return;\n\n\t\tif (lastSeen !== null && next !== null) {\n\t\t\tprevDigit = lastSeen;\n\t\t\tcurrDigit = next;\n\t\t\tflipping = true;\n\t\t\tif (endTimer) clearTimeout(endTimer);\n\t\t\tendTimer = setTimeout(() => {\n\t\t\t\tflipping = false;\n\t\t\t\tprevDigit = null;\n\t\t\t}, TOTAL_MS + 20); // small buffer so the css end state settles\n\t\t} else {\n\t\t\tcurrDigit = next;\n\t\t}\n\n\t\tlastSeen = next;\n\t});\n\n\tonDestroy(() => {\n\t\tif (endTimer) clearTimeout(endTimer);\n\t});\n</script>\n\n<section class=\"flex flex-col items-center px-5 py-8 text-center\">\n\t<div class=\"flex flex-col items-center\">\n\t\t<div class=\"card\" aria-live=\"polite\">\n\t\t\t{#if currDigit !== null}\n\t\t\t\t<!-- NEW TOP — static, sits under the folding old top (revealed when old top folds away) -->\n\t\t\t\t<div class=\"half top z-new-static\">\n\t\t\t\t\t<div class=\"digit-wrap\">\n\t\t\t\t\t\t<span class=\"digit\">{currDigit}</span>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\n\t\t\t\t<!-- NEW BOTTOM — held edge-on (rotateX 90) during fold, then flips down to flat -->\n\t\t\t\t<div class=\"half bottom z-flap\" class:bottom-flipping={flipping}>\n\t\t\t\t\t<div class=\"digit-wrap\">\n\t\t\t\t\t\t<span class=\"digit\">{currDigit}</span>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t{:else}\n\t\t\t\t<div class=\"half top z-new-static\">\n\t\t\t\t\t<div class=\"digit-wrap\"><span class=\"digit digit--placeholder\">·</span></div>\n\t\t\t\t</div>\n\t\t\t\t<div class=\"half bottom z-new-static\">\n\t\t\t\t\t<div class=\"digit-wrap\"><span class=\"digit digit--placeholder\">·</span></div>\n\t\t\t\t</div>\n\t\t\t{/if}\n\n\t\t\t{#if flipping && prevDigit !== null}\n\t\t\t\t<!-- OLD TOP — folds DOWN (rotateX 0 → -90, hinge at card middle) -->\n\t\t\t\t<div class=\"half top z-flap top-folding\">\n\t\t\t\t\t<div class=\"digit-wrap\">\n\t\t\t\t\t\t<span class=\"digit\">{prevDigit}</span>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\n\t\t\t\t<!-- OLD BOTTOM — static, visible until covered by NEW BOTTOM landing -->\n\t\t\t\t<div class=\"half bottom z-old-static\">\n\t\t\t\t\t<div class=\"digit-wrap\">\n\t\t\t\t\t\t<span class=\"digit\">{prevDigit}</span>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t{/if}\n\n\t\t\t<!-- hairline at the fold -->\n\t\t\t<div class=\"card-split\"></div>\n\t\t</div>\n\n\t\t<h2 class=\"mt-10 font-display text-[clamp(1.6rem,5vw,2.5rem)] font-bold leading-[1] tracking-tighter\">\n\t\t\t{#if phase === 'lead'}\n\t\t\t\t{t('get ready.')}<br /><span class=\"text-muted\">{t('both sealed.')}</span>\n\t\t\t{:else if phase === 'done'}\n\t\t\t\t{t('scores')}<br /><span class=\"text-blue\">{t('drop now.')}</span>\n\t\t\t{:else}\n\t\t\t\t{t('scores drop in')}<br /><span class=\"text-blue\">{t('seconds.')}</span>\n\t\t\t{/if}\n\t\t</h2>\n\n\t\t<p class=\"mt-6 text-xs text-muted/30\">{t('no peeking. no edits. final.')}</p>\n\t</div>\n</section>\n\n<style>\n\t/* ─── card ─── */\n\t.card {\n\t\tposition: relative;\n\t\twidth: clamp(220px, 28vw, 320px);\n\t\taspect-ratio: 5 / 6;\n\t\tborder-radius: 18px;\n\t\toverflow: hidden;\n\t\tborder: 1px solid var(--color-border);\n\t\tbackground: var(--color-surface);\n\t\tbox-shadow:\n\t\t\t0 30px 60px -30px rgba(0, 0, 0, 0.7),\n\t\t\t0 1px 0 rgba(255, 255, 255, 0.04) inset;\n\t\tperspective: 1400px;\n\t}\n\n\t.card-split {\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\tright: 0;\n\t\ttop: 50%;\n\t\theight: 1px;\n\t\tbackground: rgba(0, 0, 0, 0.6);\n\t\tbox-shadow: 0 1px 0 rgba(255, 255, 255, 0.04);\n\t\tz-index: 100;\n\t\tpointer-events: none;\n\t}\n\n\t/* ─── halves — fully opaque so flaps don't bleed through ─── */\n\t.half {\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\tright: 0;\n\t\theight: 50%;\n\t\toverflow: hidden;\n\t\tbackface-visibility: hidden;\n\t}\n\t.half.top {\n\t\ttop: 0;\n\t\ttransform-origin: bottom;\n\t\t/* slight light tone (Solari panel face) — opaque base + subtle highlight */\n\t\tbackground:\n\t\t\tlinear-gradient(180deg, rgba(255, 255, 255, 0.025) 0%, transparent 100%),\n\t\t\tvar(--color-surface);\n\t}\n\t.half.bottom {\n\t\tbottom: 0;\n\t\ttransform-origin: top;\n\t\t/* slight darker tone — opaque base + subtle shadow */\n\t\tbackground:\n\t\t\tlinear-gradient(0deg, rgba(0, 0, 0, 0.3) 0%, transparent 100%),\n\t\t\tvar(--color-surface);\n\t}\n\n\t/* z-stack:\n\t   - new statics underneath (z=10)\n\t   - old-bottom static above new-bottom (z=20) so it's visible until new flap lands\n\t   - flapping elements on top (z=30) */\n\t.z-new-static {\n\t\tz-index: 10;\n\t}\n\t.z-old-static {\n\t\tz-index: 20;\n\t}\n\t.z-flap {\n\t\tz-index: 30;\n\t}\n\n\t/* digit alignment: digit-wrap is full card height so the visible halves\n\t   compose into ONE coherent digit straddling the fold */\n\t.digit-wrap {\n\t\tposition: absolute;\n\t\tleft: 0;\n\t\tright: 0;\n\t\theight: 200%;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t}\n\t.half.top .digit-wrap {\n\t\ttop: 0;\n\t}\n\t.half.bottom .digit-wrap {\n\t\tbottom: 0;\n\t}\n\t.digit {\n\t\tfont-family: var(--font-display);\n\t\tfont-weight: 900;\n\t\tfont-size: clamp(7rem, 19vw, 13rem);\n\t\tline-height: 1;\n\t\tletter-spacing: -0.06em;\n\t\tfont-variant-numeric: tabular-nums;\n\t\tcolor: rgba(255, 255, 255, 0.95);\n\t}\n\t.digit--placeholder {\n\t\tcolor: rgba(255, 255, 255, 0.18);\n\t}\n\n\t/* ─── flap animations ─── */\n\n\t/* OLD TOP: rotateX 0 → -90deg, gravity drop (easeInQuart) */\n\t.top-folding {\n\t\tanimation: fold-down 280ms cubic-bezier(0.55, 0.085, 0.68, 0.53) forwards;\n\t}\n\t@keyframes fold-down {\n\t\tfrom {\n\t\t\ttransform: rotateX(0deg);\n\t\t}\n\t\tto {\n\t\t\ttransform: rotateX(-90deg);\n\t\t}\n\t}\n\n\t/* NEW BOTTOM: held edge-on (rotateX 90) for the fold duration via animation-delay,\n\t   then rotateX 90 → 0, soft landing (easeOutQuart) */\n\t.bottom-flipping {\n\t\ttransform: rotateX(90deg);\n\t\tanimation: flip-down 280ms cubic-bezier(0.165, 0.84, 0.44, 1) 280ms forwards;\n\t}\n\t@keyframes flip-down {\n\t\tfrom {\n\t\t\ttransform: rotateX(90deg);\n\t\t}\n\t\tto {\n\t\t\ttransform: rotateX(0deg);\n\t\t}\n\t}\n\n\t@media (prefers-reduced-motion: reduce) {\n\t\t.top-folding,\n\t\t.bottom-flipping {\n\t\t\tanimation: none;\n\t\t\ttransform: none;\n\t\t}\n\t}\n</style>\n"],"version":3}