:root{--bg:#f5efe6;--text:#2a2433;--accent:#ff5d8f;--accent-shadow:#ff5d8f66;--stage-size:min(72vmin, 58vh, 560px);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;font-family:system-ui,-apple-system,Segoe UI,sans-serif}@media (prefers-color-scheme:dark){:root{--bg:#14141a;--text:#efece6;--accent:#ff7aab}}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);overscroll-behavior:none;margin:0}body{justify-content:center;align-items:center;padding:clamp(20px,3.5vmin,40px);display:flex;overflow:hidden}#app{width:100%;height:100%}.scene{grid-template-rows:minmax(0,1fr) auto;place-items:center;gap:clamp(20px,4vmin,40px);width:100%;height:100%;display:grid}.stage{width:var(--stage-size);height:var(--stage-size);touch-action:none;-webkit-user-select:none;user-select:none;position:relative}.circle{mix-blend-mode:multiply;pointer-events:none;will-change:transform, opacity;border-radius:50%;transition:opacity .4s;position:absolute}@media (prefers-color-scheme:dark){.circle{mix-blend-mode:screen}}.circle--in{animation:.6s cubic-bezier(.34,1.56,.64,1) both fade-bounce-in}.circle--out{animation:.4s forwards fade-out}.circle--faded{opacity:.15}.circle--focus{opacity:1;animation:1.6s cubic-bezier(.34,1.56,.64,1) focus-pulse}.circle-label{pointer-events:none;text-align:center;z-index:2;max-width:42%;padding-bottom:clamp(4px,1vmin,10px);line-height:1.2;position:absolute;transform:translate(-50%,-100%)}.circle-label__inner{color:var(--text);font-size:clamp(13px,2.4vmin,20px);font-weight:700;animation:.5s cubic-bezier(.34,1.56,.64,1) both fade-bounce-in}.overlap-readout{color:var(--text);pointer-events:none;z-index:3;text-shadow:0 1px 2px #ffffff80;font-size:clamp(22px,5vmin,40px);font-weight:800;position:absolute;transform:translate(-50%,-50%)}@media (prefers-color-scheme:dark){.overlap-readout{text-shadow:0 1px 2px #0009}}.readout{text-align:center;flex-direction:column;align-items:center;gap:clamp(8px,2vmin,16px);animation:.5s cubic-bezier(.34,1.56,.64,1) both fade-bounce-in;display:flex}.readout__hint{opacity:.75;max-width:90vw;margin:0;font-size:clamp(14px,2.4vmin,18px);line-height:1.5}.submit{font:inherit;letter-spacing:.02em;background:var(--accent);color:#fff;cursor:pointer;box-shadow:0 6px 18px var(--accent-shadow);border:none;border-radius:999px;padding:14px 28px;font-size:clamp(16px,2.8vmin,20px);font-weight:700;transition:transform .15s cubic-bezier(.34,1.56,.64,1),box-shadow .15s}.submit--delayed{animation:.5s cubic-bezier(.34,1.56,.64,1) .7s both fade-bounce-in}.submit:hover{box-shadow:0 10px 24px var(--accent-shadow);transform:translateY(-2px)scale(1.03)}.submit:active{transform:translateY(1px)scale(.98)}.result{gap:clamp(16px,5vmin,48px);display:flex}.result__row{flex-direction:column;align-items:center;gap:4px;display:flex}.result__label{text-transform:uppercase;letter-spacing:.1em;opacity:.6;font-size:clamp(12px,2vmin,14px)}.result__value{font-size:clamp(24px,5vmin,36px);font-weight:700}.score{justify-content:center;align-items:center;min-height:clamp(60px,11vmin,100px);display:flex;position:relative}.score__number{color:var(--accent);letter-spacing:-.02em;font-size:clamp(48px,10vmin,88px);font-weight:800;animation:.7s cubic-bezier(.34,1.56,.64,1) both score-pop}.score__float{color:var(--accent);pointer-events:none;font-size:clamp(20px,4vmin,32px);font-weight:700;animation:1.4s cubic-bezier(.16,1,.3,1) .15s both score-float;position:absolute}@keyframes fade-bounce-in{0%{opacity:0;transform:scale(.6)}60%{opacity:1;transform:scale(1.08)}to{opacity:1;transform:scale(1)}}@keyframes fade-out{to{opacity:0}}@keyframes focus-pulse{0%{transform:scale(1)}35%{transform:scale(1.12)}to{transform:scale(1)}}@keyframes score-pop{0%{opacity:0;transform:scale(.3)}60%{opacity:1;transform:scale(1.18)}to{opacity:1;transform:scale(1)}}@keyframes score-float{0%{opacity:0;transform:translateY(0)}20%{opacity:1}to{opacity:0;transform:translateY(-90px)}}.scene--done{flex-direction:column;justify-content:center;align-items:center;gap:clamp(24px,5vmin,40px);animation:.6s cubic-bezier(.34,1.56,.64,1) both fade-bounce-in;display:flex}.done__title{color:var(--accent);letter-spacing:-.02em;margin:0;font-size:clamp(36px,9vmin,64px);font-weight:800}.done__score{flex-direction:column;align-items:center;gap:clamp(4px,1vmin,8px);display:flex}.done__score-label{text-transform:uppercase;letter-spacing:.12em;opacity:.6;font-size:clamp(14px,2vmin,18px)}.done__score-value{color:var(--accent);font-size:clamp(60px,14vmin,112px);font-weight:800;line-height:1}
