@import "https://fonts.googleapis.com/css2?family=Inter+Tight:wght@900&family=Inter:wght@300;400&family=JetBrains+Mono:wght@500&display=swap";:root{--bg-color:#000;--fg-color:#fff;--accent-color:#6366f1;--hairline:#ffffff26;--font-headline:"Inter Tight", sans-serif;--font-data:"JetBrains Mono", monospace;--font-body:"Inter", sans-serif}*{box-sizing:border-box;margin:0;padding:0}html,body{background-color:var(--bg-color);color:var(--fg-color);font-family:var(--font-body);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-user-select:none;user-select:none;touch-action:none;overscroll-behavior:none;width:100%;height:100%;position:fixed;overflow:hidden}.noise-overlay{pointer-events:none;z-index:9999;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");width:100vw;height:100vh;position:fixed;top:0;left:0}button{color:inherit;font:inherit;cursor:pointer;background:0 0;border:none;outline:none}.pill-button{border:1px solid var(--fg-color);font-family:var(--font-data);text-transform:uppercase;letter-spacing:.05em;border-radius:9999px;padding:.5rem 1.5rem;font-size:.875rem;transition:background-color .3s,color .3s}.pill-button:hover:not(:disabled){background-color:var(--fg-color);color:var(--bg-color)}.pill-button:disabled{opacity:.3;cursor:not-allowed}.app-container{flex-direction:column;width:100vw;height:100vh;padding:.5rem;display:flex;overflow:hidden}.app-header{border-bottom:.5px solid var(--hairline);width:100%;max-width:1000px;margin-bottom:1rem;margin-left:auto;margin-right:auto;padding-bottom:.5rem}.game-title{font-family:var(--font-headline);letter-spacing:-.02em;text-transform:uppercase;font-size:clamp(1.5rem,4vw,3rem);line-height:1}.game-area{flex-direction:column;flex:1;align-items:center;gap:1rem;min-height:0;display:flex}.hud-container{border-bottom:.5px solid var(--hairline);justify-content:space-between;align-items:flex-end;gap:.25rem;width:100%;max-width:1000px;padding-bottom:.5rem;display:flex}.hud-section{flex-direction:column;flex:1;gap:.125rem;min-width:0;display:flex}.hud-label{letter-spacing:.1em;color:#ffffff80;text-transform:uppercase;white-space:nowrap;align-items:center;gap:.25rem;font-size:clamp(.5rem,1.2vw,.75rem);display:flex}.combo-indicator{width:1.25em;height:1.25em;color:var(--fg-color);flex-shrink:0;display:inline-block}.combo-indicator-hidden{visibility:hidden}.combo-star{transform-origin:12px 12px;animation:.8s ease-in-out infinite alternate starPulse}.combo-spark{animation:1.2s ease-in-out infinite sparkBlink}.spark-1{transform-origin:6px 6px;animation-delay:0s}.spark-2{transform-origin:19px 7px;animation-delay:.4s}.spark-3{transform-origin:18px 20px;animation-delay:.8s}@keyframes starPulse{0%{opacity:.8;transform:scale(.85)}to{opacity:1;transform:scale(1.1)}}@keyframes sparkBlink{0%,to{opacity:0;transform:scale(0)}50%{opacity:1;transform:scale(1)}}.hud-value{font-family:var(--font-data);font-size:clamp(1rem,2.5vw,1.5rem);line-height:1}.grid-wrapper{flex:1;justify-content:center;align-items:center;width:100%;min-height:0;display:flex;position:relative}.grid-container{border:.5px solid var(--hairline);background-color:var(--bg-color);touch-action:none;flex-direction:column;display:flex}.grid-row{display:flex}.cell{border:.5px solid var(--hairline);width:clamp(1.5rem,8.333vw - 1px,3.5rem);height:clamp(1.5rem,8.333vw - 1px,3.5rem);font-family:var(--font-data);cursor:pointer;touch-action:none;justify-content:center;align-items:center;font-size:clamp(.8rem,2.5vw,1.25rem);transition:background-color .3s,color .3s;display:flex;position:relative;overflow:hidden}.cell-hinted{border-color:var(--accent-color);pointer-events:none;background-color:#6366f14d}.cell:hover{background-color:#ffffff1a}.cell-selected{background-color:var(--accent-color);color:var(--fg-color);border-color:var(--accent-color);z-index:1}.cell-selected:hover{background-color:var(--accent-color)}.cell-empty{pointer-events:none;background-color:#0000;border-color:#0000}.cell-burst{color:var(--fg-color);border-color:var(--hairline);pointer-events:none;background-color:#ffffff0a;animation:.5s ease-out forwards burstBaseFade;overflow:visible}.cell-burst:before{content:attr(data-removed-value);animation:.5s ease-out forwards burstValueFade}@keyframes burstValueFade{0%{content:attr(data-removed-value);opacity:1}80%{content:attr(data-removed-value);opacity:.35}to{content:"";opacity:0}}@keyframes burstBaseFade{0%{color:var(--fg-color);border-color:var(--hairline);background-color:#ffffff0f}65%{color:#ffffffbf;background-color:#ffffff08;border-color:#ffffff73}to{color:#ffffff2e;background-color:#fff0;border-color:#ffffff14}}.effect-flash{background-color:var(--fg-color);pointer-events:none;animation:.1s steps(2,end) forwards flashAnim;position:absolute;inset:0}@keyframes flashAnim{0%{opacity:1}50%{opacity:.5}to{opacity:0}}.effect-residue{border:1px solid var(--fg-color);opacity:.8;pointer-events:none;animation:.4s .1s forwards residueAnim;position:absolute;inset:0}@keyframes residueAnim{0%{opacity:.8;border-style:solid;transform:scale(1)}50%{opacity:.4;border-style:dashed;transform:scale(.95)}to{opacity:0;border-style:dotted;transform:scale(.9)}}.fragment{background-color:var(--fg-color);opacity:0;pointer-events:none;position:absolute}.f1{width:20%;height:20%;animation:.4s cubic-bezier(0,.9,.1,1) 50ms forwards frag1;top:10%;left:10%}.f2{width:30%;height:10%;animation:.35s cubic-bezier(0,.9,.1,1) 50ms forwards frag2;top:10%;left:50%}.f3{width:15%;height:25%;animation:.45s cubic-bezier(0,.9,.1,1) 50ms forwards frag3;top:10%;right:10%}.f4{width:10%;height:30%;animation:.4s cubic-bezier(0,.9,.1,1) 50ms forwards frag4;top:50%;right:10%}.f5{width:25%;height:15%;animation:.35s cubic-bezier(0,.9,.1,1) 50ms forwards frag5;bottom:10%;right:10%}.f6{width:20%;height:20%;animation:.45s cubic-bezier(0,.9,.1,1) 50ms forwards frag6;bottom:10%;left:50%}.f7{width:15%;height:15%;animation:.4s cubic-bezier(0,.9,.1,1) 50ms forwards frag7;bottom:10%;left:10%}.f8{width:30%;height:10%;animation:.35s cubic-bezier(0,.9,.1,1) 50ms forwards frag8;top:50%;left:10%}@keyframes frag1{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(-150%,-150%)}}@keyframes frag2{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(50%,-200%)}}@keyframes frag3{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(150%,-150%)}}@keyframes frag4{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(200%,50%)}}@keyframes frag5{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(150%,150%)}}@keyframes frag6{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(-50%,200%)}}@keyframes frag7{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(-150%,150%)}}@keyframes frag8{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(-200%,-50%)}}.timer-shake{color:#f33;animation:.5s cubic-bezier(.36,.07,.19,.97) infinite both shake}@keyframes shake{10%,90%{transform:translate(-1px)}20%,80%{transform:translate(2px)}30%,50%,70%{transform:translate(-2px)}40%,60%{transform:translate(2px)}}.combo-notification{pointer-events:none;z-index:10;flex-direction:column;align-items:center;animation:1s cubic-bezier(.1,.9,.2,1) forwards floatUp;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.combo-text{font-family:var(--font-headline);color:var(--accent-color);-webkit-text-stroke:2px var(--bg-color);font-size:4rem;line-height:1}@keyframes floatUp{0%{opacity:0;transform:translate(-50%,-30%)scale(.8)}20%{opacity:1;transform:translate(-50%,-50%)scale(1.1)}30%{transform:translate(-50%,-50%)scale(1)}80%{opacity:1;transform:translate(-50%,-70%)scale(1)}to{opacity:0;transform:translate(-50%,-80%)scale(.9)}}.start-screen{flex-direction:column;justify-content:center;align-items:center;gap:2rem;min-height:60vh;display:flex}.start-title{font-family:var(--font-headline);letter-spacing:-.06em;text-transform:uppercase;text-align:center;font-size:clamp(3rem,10vw,8rem);line-height:1}.start-subtitle{font-family:var(--font-data);letter-spacing:.3em;color:#ffffff80;margin-top:-1rem;font-size:1.5rem}.start-button{margin-top:2rem;padding:1.5rem 4rem;font-size:1.5rem;animation:2s ease-in-out infinite pulse}.start-copyright{font-family:var(--font-data);letter-spacing:.08em;color:#ffffff59;text-align:center;margin-top:1rem;font-size:.625rem}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}.game-over-overlay{z-index:100;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background-color:#000c;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:fixed;top:0;left:0}.game-over-modal{border:1px solid var(--fg-color);background-color:var(--bg-color);flex-direction:column;align-items:center;gap:2rem;padding:4rem;display:flex}.game-over-modal h2{font-family:var(--font-headline);letter-spacing:-.02em;font-size:3rem}.final-score{font-family:var(--font-data);font-size:2rem}.restart-button{margin-top:1rem;padding:1rem 3rem;font-size:1rem}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.timer-shake{animation:none}.combo-notification{opacity:1;transform:translate(-50%,-50%)scale(1);animation:none!important}.cell-burst{color:var(--fg-color);background-color:#ffffff0a;border-color:#ffffff8c;animation:none!important}.effect-flash{opacity:.35;animation:none!important}.effect-residue{opacity:.85;border-style:solid;transform:scale(1);animation:none!important}.fragment{opacity:.75;transform:none;animation:none!important}}@media (height<=500px) and (orientation:landscape){.app-container{padding:.25rem}.app-header{margin-bottom:.25rem;padding-bottom:.25rem}.game-title{font-size:1rem}.game-area{gap:.25rem}.hud-container{gap:.125rem;padding-bottom:.25rem}.hud-label{font-size:.5rem}.hud-value{font-size:.75rem}.combo-text{-webkit-text-stroke:1px var(--bg-color);font-size:1.5rem}.cell{width:clamp(1.2rem,3vw + .8rem,2.5rem);height:clamp(1.2rem,3vw + .8rem,2.5rem);font-size:clamp(.5rem,1vw + .3rem,.875rem)}.start-screen{gap:.5rem;min-height:40vh}.start-title{font-size:clamp(1.5rem,5vw,3rem)}.start-subtitle{font-size:.75rem}.start-button{margin-top:.5rem;padding:.5rem 1.5rem;font-size:.75rem}}@media (width<=768px){.app-container{padding:5px}.app-header{margin-bottom:.5rem;padding-bottom:.25rem}.game-title{font-size:1.5rem}.game-area{gap:.5rem}.hud-container{gap:.125rem;padding-bottom:.25rem}.hud-label{font-size:.5rem}.hud-value{font-size:.875rem}.combo-text{-webkit-text-stroke:1px var(--bg-color);font-size:2rem}.grid-wrapper{padding:0}.start-screen{gap:1rem;min-height:50vh}.start-title{font-size:clamp(2rem,8vw,4rem)}.start-subtitle{font-size:.875rem}.start-button{margin-top:1rem;padding:1rem 2rem;font-size:1rem}.game-over-modal{gap:1rem;padding:2rem}.game-over-modal h2{font-size:1.5rem}.final-score{font-size:1.25rem}.restart-button{padding:.75rem 2rem;font-size:.875rem}}
