:root{font-family:var(--font-body);line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{margin:0;padding:0;box-sizing:border-box}body{background:var(--color-bg)}#root{width:100%;min-height:100dvh}body:has(.app.projection){overflow:hidden}.counter-container{text-align:center;position:relative;z-index:10;width:100%}.app.projection .counter-container{margin:1vh 0 2vh}.counter-label{font-family:var(--font-display);font-weight:400;font-size:clamp(1.4rem,6.5vw,2rem);line-height:1.15;color:var(--color-text);margin-bottom:var(--space-3);position:relative;transition:opacity .5s ease;text-shadow:2px 2px 0 #000,0 0 24px rgba(245,240,230,.5)}.app.projection .counter-label{font-size:13vh;margin-bottom:2vh;text-shadow:3px 3px 0px #000,-1px -1px 0px #000,1px -1px 0px #000,-1px 1px 0px #000,0 0 30px rgba(245,240,230,.8)}.counter-label.out-of-candy{opacity:.5}.counter-label.out-of-candy:after{content:"";position:absolute;left:0;right:0;top:50%;height:3px;background:var(--color-alarm);box-shadow:0 0 10px #f00c;animation:strikethrough-grow .5s ease-out forwards}.app.projection .counter-label.out-of-candy:after{height:.5vh}@keyframes strikethrough-grow{0%{width:0;left:50%;right:50%}to{width:100%;left:0;right:0}}.counter-display{display:flex;justify-content:center;gap:var(--space-2)}.app.projection .counter-display{gap:2vh}.digit-container{background:linear-gradient(180deg,var(--color-panel) 0%,var(--color-panel-hi) 50%,var(--color-panel) 100%);border:3px solid var(--color-accent);border-radius:var(--radius-sm);width:clamp(64px,21vw,96px);height:clamp(88px,28vw,128px);position:relative;overflow:hidden;box-shadow:0 0 20px var(--color-accent-glow),inset 0 0 20px #00000080}.app.projection .digit-container{border-radius:1vh;width:15vh;height:20vh}.digit{font-family:var(--font-counter);font-size:clamp(72px,24vw,110px);line-height:clamp(88px,28vw,128px);color:var(--color-gold);font-variant-numeric:tabular-nums;transition:transform .6s;transform-style:preserve-3d;text-shadow:0 0 10px rgba(255,215,0,.8),0 0 20px var(--color-accent-glow)}.app.projection .digit{font-size:18vh;line-height:20vh;text-shadow:0 0 14px rgba(255,215,0,.95),0 0 31px rgba(255,215,0,.48),0 0 67px rgba(255,107,53,.39),0 0 134px rgba(255,107,53,.25)}.digit.flip{animation:flipAnimation .6s ease-in-out}@keyframes flipAnimation{0%{transform:perspective(400px) rotateX(0)}50%{transform:perspective(400px) rotateX(-90deg)}to{transform:perspective(400px) rotateX(0)}}.counter-display.animating .digit-container{animation:glow .6s ease-in-out}@keyframes glow{0%,to{box-shadow:0 0 20px #ff6b3580,inset 0 0 20px #00000080}50%{box-shadow:0 0 40px #ff6b35,0 0 60px #ffd70080,inset 0 0 20px #ff6b354d}}@media (prefers-reduced-motion: reduce){.digit.flip,.counter-display.animating .digit-container{animation:none}}.candy-progress-container{position:relative;width:100%;z-index:10;transition:all .5s ease}.app.projection .candy-progress-container{width:80%;max-width:800px;margin:1vh auto 3vh}.app.projection .candy-progress-container.empty{width:90%;max-width:1000px}.candy-header{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:var(--space-2);font-size:var(--text-lg);color:var(--color-gold);font-weight:700}.app.projection .candy-header{font-size:3.5vh;margin-bottom:1vh;text-shadow:2px 2px 0px #000,-1px -1px 0px #000}.candy-title{font-family:var(--font-display);font-weight:400;font-size:clamp(1.25rem,5.5vw,1.6rem);color:var(--color-accent);text-shadow:0 0 16px var(--color-accent-glow)}.app.projection .candy-title{font-size:7vh;text-shadow:3px 3px 0px #000,-1px -1px 0px #000,1px -1px 0px #000,-1px 1px 0px #000,0 0 30px rgba(255,107,53,.8)}.candy-count{font-family:var(--font-counter);font-size:var(--text-lg);color:var(--color-accent);font-variant-numeric:tabular-nums}.app.projection .candy-count{font-size:inherit}.progress-bar-outer{width:100%;height:26px;background:var(--color-panel);border:2px solid var(--color-wood);border-radius:var(--radius-md);overflow:hidden;position:relative;box-shadow:inset 0 0 14px #000c;transition:all .5s ease;margin:0 auto}.app.projection .progress-bar-outer{height:6vh;border-width:3px;border-radius:2vh;box-shadow:inset 0 0 20px #000c,0 0 15px #8b451380}.app.projection .progress-bar-outer.empty{height:10vh;width:150%;margin-left:-25%}.progress-bar-inner{height:100%;transition:width .5s ease,background .5s ease;position:relative;border-radius:var(--radius-md) 0 0 var(--radius-md);overflow:hidden}.progress-bar-inner.green{background:linear-gradient(90deg,var(--color-progress-ok),var(--color-progress-ok-2))}.progress-bar-inner.yellow{background:linear-gradient(90deg,var(--color-progress-warn),var(--color-progress-warn-2))}.progress-bar-inner.red{background:linear-gradient(90deg,var(--color-progress-crit),var(--color-progress-crit-2))}.progress-glow{position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);animation:shimmer 2s infinite}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.progress-bar-inner.critical{animation:pulse .5s infinite alternate}@keyframes pulse{0%{opacity:1}to{opacity:.6}}.empty-message{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-family:var(--font-display);font-size:clamp(1.1rem,5vw,1.6rem);font-weight:700;color:var(--color-alarm);letter-spacing:.1em;white-space:nowrap;z-index:100;text-shadow:0 0 20px rgba(255,0,0,1),0 0 40px rgba(255,0,0,.8),3px 3px 0px #000,-3px -3px 0px #000;animation:flash .3s infinite alternate}.app.projection .empty-message{font-size:7vh;animation:flash .3s infinite alternate,grow .5s ease-out}@keyframes flash{0%{opacity:1;transform:translate(-50%,-50%) scale(1)}to{opacity:.3;transform:translate(-50%,-50%) scale(1.05)}}@keyframes grow{0%{font-size:2.5vh}to{font-size:7vh}}.candy-icons{display:flex;justify-content:space-between;margin-top:var(--space-1);font-size:15px}.app.projection .candy-icons{margin-top:1vh;font-size:2.5vh}.candy-icon{transition:all .3s;filter:drop-shadow(0 0 8px rgba(255,215,0,.6))}.candy-icon.depleted{opacity:.2;filter:grayscale(100%);transform:scale(.8)}@media (prefers-reduced-motion: reduce){.progress-glow,.progress-bar-inner.critical,.empty-message{animation:none}}.stats-container{width:100%;display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-4);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-card)}.app.projection .stats-container{flex-direction:row;width:auto;gap:4vw;padding:1vh 2vw;background:#1a1a1acc;border:none;border-radius:1vh;box-shadow:none}.stat-item{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-sm)}.app.projection .stat-item{font-size:3vh}.stat-label{flex:1;color:var(--color-text-dim)}.app.projection .stat-label{flex:none}.stat-value{font-family:var(--font-counter);font-size:var(--text-lg);color:var(--color-gold);font-variant-numeric:tabular-nums}.app.projection .stat-value{font-size:3.5vh}.stat-value.highlight{color:var(--color-accent);animation:statPulse 2s infinite}@keyframes statPulse{0%,to{opacity:1}50%{opacity:.7}}@media (prefers-reduced-motion: reduce){.stat-value.highlight{animation:none}}.lightning-canvas{position:fixed;top:0;left:0;width:100vw;height:100vh;pointer-events:none;z-index:1;opacity:.9}.drooling-rain-container{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:1;overflow:hidden}.drooling-emoji{position:absolute;top:-100px;animation:droolFall linear forwards;filter:drop-shadow(0 0 10px rgba(255,200,0,.5));will-change:transform;opacity:0}@keyframes droolFall{0%{transform:translateY(0) translate(0) rotate(0) scale(1);opacity:0}10%{opacity:1}25%{transform:translateY(25vh) translate(calc(var(--sway-amount) * -1)) rotate(90deg) scale(1.1)}50%{transform:translateY(50vh) translate(var(--sway-amount)) rotate(180deg) scale(.9)}75%{transform:translateY(75vh) translate(calc(var(--sway-amount) * -.5)) rotate(270deg) scale(1.05);opacity:1}90%{opacity:.5}to{transform:translateY(calc(100vh + 100px)) translate(calc(var(--sway-amount) * .8)) rotate(360deg) scale(1);opacity:0}}.drooling-emoji:nth-child(2n){animation-name:droolFallAlt}@keyframes droolFallAlt{0%{transform:translateY(0) translate(0) rotate(0) scale(1);opacity:0}10%{opacity:1}25%{transform:translateY(25vh) translate(var(--sway-amount)) rotate(-90deg) scale(.95)}50%{transform:translateY(50vh) translate(calc(var(--sway-amount) * -1)) rotate(-180deg) scale(1.1)}75%{transform:translateY(75vh) translate(calc(var(--sway-amount) * .7)) rotate(-270deg) scale(.95);opacity:1}90%{opacity:.5}to{transform:translateY(calc(100vh + 100px)) translate(calc(var(--sway-amount) * -.5)) rotate(-360deg) scale(1);opacity:0}}@media (prefers-reduced-motion: reduce){.drooling-emoji{animation:simpleFall linear forwards}@keyframes simpleFall{0%{transform:translateY(0);opacity:0}10%{opacity:1}90%{opacity:1}to{transform:translateY(calc(100vh + 100px));opacity:0}}}.page-content{flex:1;width:100%;max-width:560px;margin:0 auto;padding-left:var(--space-4);padding-right:var(--space-4)}.game-zombie-rive{pointer-events:none}.game-zombie-rive canvas{width:100%!important;height:100%!important}.game-zombie-rive.projector{width:180px;height:220px}.game-zombie-rive.phone{width:100px;height:120px;position:absolute;top:10px;left:50%;transform:translate(-50%)}.game-zombie-rive.flip{transform:scaleX(-1)}.game-zombie-rive.phone.flip{transform:translate(-50%) scaleX(-1)}.stats-page{display:flex;flex-direction:column;gap:var(--space-4)}.card h3{margin-bottom:var(--space-4);font-size:var(--text-md);font-weight:600}.year-toggle{display:flex;gap:var(--space-3)}.year-btn{flex:1}.stats-total{text-align:center}.stats-total-label{font-size:var(--text-xs);letter-spacing:2px;text-transform:uppercase;color:var(--color-text-dim)}.stats-total-value{font-size:56px;margin:var(--space-2) 0 var(--space-3)}.badge-btn{min-height:44px;padding:var(--space-2) var(--space-4);font-size:var(--text-sm)}.badge-btn.copied{background:var(--color-success);border-color:var(--color-success);color:var(--color-bg)}.stats-empty{text-align:center;color:var(--color-text-dim)}.game-scores{display:flex;flex-wrap:wrap;gap:var(--space-3);justify-content:center}.game-score{flex:1;min-width:80px;padding:var(--space-3) var(--space-2);background:#ff6b351f;border:1px solid var(--color-accent);border-radius:var(--radius-sm);text-align:center}.game-score-value{font-size:var(--text-xl)}.game-score-time{font-size:11px;color:var(--color-text-dim);margin-top:var(--space-1)}.stats-vote-row{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:var(--space-2)}.vote-label{width:100%;text-align:center;font-size:var(--text-xs);letter-spacing:1px;text-transform:uppercase;color:var(--color-text-dim)}.vote-candy-btn{flex:1;min-height:44px;padding:var(--space-2) var(--space-3);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text);font-size:var(--text-sm);cursor:pointer}.vote-candy-btn.voted{background:var(--color-vote);border-color:var(--color-vote);color:#fff}.vote-candy-btn:disabled{cursor:default}.vote-recorded{width:100%;text-align:center;color:var(--color-vote);font-size:var(--text-xs)}.app{position:relative;width:100%;display:flex;flex-direction:column;align-items:center}.app.projection{width:100vw;height:100dvh;overflow:hidden;justify-content:center;background:url(/4140519.jpg) center center / cover no-repeat}.app.projection:before{content:"";position:absolute;inset:0;background:#0000004d;pointer-events:none}.app.projection:after{content:"";position:absolute;inset:0;background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%"><filter id="fog"><feTurbulence baseFrequency="0.01" numOctaves="2" /><feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"/></filter><rect width="100%" height="100%" filter="url(%23fog)" /></svg>');opacity:.3;pointer-events:none;animation:fogMove 30s ease-in-out infinite}@keyframes fogMove{0%,to{transform:translate(0) translateY(0)}33%{transform:translate(-5%) translateY(5%)}66%{transform:translate(5%) translateY(-5%)}}@media (prefers-reduced-motion: reduce){.app.projection:after{animation:none}}.main-content{width:100%;display:flex;flex-direction:column;align-items:center;gap:var(--space-4);position:relative;z-index:2}.app.projection .main-content{height:100%;gap:0}.viewer-controls{width:100%;display:flex;flex-direction:column;gap:var(--space-3)}.control-row{display:flex;gap:var(--space-3)}.control-btn{flex:1}.vote-row{display:flex;flex-wrap:wrap;gap:var(--space-2);align-items:center}.vote-title{width:100%;font-size:var(--text-xs);letter-spacing:1px;text-transform:uppercase;color:var(--color-text-dim)}.vote-btn{flex:1;min-height:44px;display:flex;align-items:center;justify-content:center;gap:var(--space-1);padding:var(--space-2) var(--space-3);background:var(--color-surface);color:var(--color-text);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--text-sm);cursor:pointer}.vote-btn.voted{background:var(--color-vote);border-color:var(--color-vote);color:#fff}.game-overlay{width:100vw;height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}.game-title{font-family:var(--font-display);font-weight:400;font-size:3rem;letter-spacing:1px;margin-bottom:var(--space-6);text-shadow:2px 2px 6px #000,0 0 30px var(--color-accent-glow)}.game-stage{width:100%;height:70vh;position:relative;display:flex;align-items:center;justify-content:center}.stage-left{position:absolute;left:5%}.stage-right{position:absolute;right:5%}.game-waiting{color:var(--color-text-dim);font-size:1.4rem}.game-page{display:flex;flex-direction:column;align-items:center;gap:var(--space-4)}.difficulty-row{display:flex;gap:var(--space-2)}.score-timer{width:100%;max-width:480px;display:flex;justify-content:space-between;align-items:baseline;font-size:var(--text-lg);font-weight:700}.touch-zones{display:flex;width:100%;max-width:480px;height:55vh;gap:var(--space-2)}.touch-zone{flex:1;background:#ffffff0a;border:2px dashed var(--color-border);border-radius:var(--radius-md);cursor:pointer;position:relative;overflow:hidden;touch-action:manipulation}.touch-zone:active{background:#ffffff1a}.final-score{display:flex;flex-direction:column;align-items:center;width:100%}.final-score h2{font-family:var(--font-display);font-weight:400;font-size:2.4rem;letter-spacing:1px;margin:var(--space-5) 0 var(--space-2);text-shadow:0 0 20px var(--color-accent-glow)}.final-score-value{font-size:clamp(6rem,34vw,10.5rem);text-shadow:0 0 34px rgba(255,215,0,.55),0 0 70px var(--color-accent-glow)}.final-score-caption{font-size:var(--text-xs);letter-spacing:2px;text-transform:uppercase;color:var(--color-text-dim);margin-top:var(--space-2)}.action-row{display:flex;flex-direction:column;gap:var(--space-3);width:100%;margin-top:var(--space-7)}
