.welcome-container{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:20px;background:linear-gradient(135deg,#667eea,#764ba2)}.welcome-content{background:#fff;border-radius:16px;padding:40px 30px;max-width:80%;box-shadow:0 20px 60px #0000004d;animation:slideIn .5s ease-out}.welcome-title{text-align:center;font-size:2.5rem;margin-bottom:30px;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:700}.welcome-stats{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-bottom:30px}.stat-box{display:flex;flex-direction:column;align-items:center;padding:10px;background:#f5f5f5;border-radius:12px;border:2px solid #e0e0e0}.stat-label{font-size:.75rem;color:#666;margin-bottom:6px;text-transform:uppercase;font-weight:600;letter-spacing:.5px}.stat-value{font-size:1.5rem;font-weight:700;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.instructions{margin-bottom:30px;padding:20px;background:#f9f9f9;border-radius:12px;border-left:4px solid #667eea}.instructions h2{font-size:1.1rem;margin-bottom:12px;color:#333}.instructions ul{list-style:none;font-size:.9rem;color:#666;line-height:1.6}.instructions li{margin-bottom:8px;padding-left:20px;position:relative}.instructions li:before{content:"●";position:absolute;left:0;color:#667eea}.play-button{width:100%;padding:15px;font-size:1.1rem;font-weight:700;color:#fff;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:12px;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease;box-shadow:0 4px 15px #667eea66;outline:none;-webkit-tap-highlight-color:transparent}.play-button:hover,.play-button:active{transform:translateY(-2px);box-shadow:0 6px 20px #667eea99}.play-button:focus{outline:none}@media (max-width: 480px){.welcome-content{padding:30px 20px}.welcome-title{font-size:2rem}.instructions{padding:15px}.instructions h2{font-size:1rem}.instructions ul{font-size:.85rem}}.gameplay-container{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:10px;background:linear-gradient(135deg,#667eea,#764ba2)}.game-viewport{position:relative;background:linear-gradient(180deg,#e3f2fd,#f3e5f5);border-radius:16px;box-shadow:0 20px 60px #0000004d;overflow:hidden;cursor:pointer;user-select:none;touch-action:none}.game-background{position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent,transparent 1px,rgba(0,0,0,.03) 1px,rgba(0,0,0,.03) 2px);pointer-events:none}.game-canvas{position:absolute;bottom:0;left:0}.score-display{position:absolute;top:5px;right:5px;font-size:1.5rem;font-weight:700;color:#333;background:#ffffffe6;padding:10px 20px;border-radius:8px;box-shadow:0 4px 12px #0000001a;z-index:10}.score-label{color:#666}.score-value{background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.tap-indicator{position:absolute;bottom:20px;left:50%;transform:translate(-50%);font-size:1rem;color:#999;background:#ffffffe6;padding:10px 20px;border-radius:20px;font-weight:600;z-index:10;animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:.8}50%{opacity:1}}@media (max-width: 480px){.score-display{font-size:1.2rem;top:15px;right:15px;padding:8px 16px}.tap-indicator{font-size:.9rem;padding:8px 16px}}.result-container{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:20px;background:linear-gradient(135deg,#667eea,#764ba2);animation:slideIn .5s ease-out}.result-content{background:#fff;border-radius:16px;padding:40px 30px;max-width:400px;box-shadow:0 20px 60px #0000004d;text-align:center}.result-title{font-size:2rem;margin-bottom:30px;color:#333;font-weight:700}.result-title.record{background:linear-gradient(135deg,#f093fb,#f5576c);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:bounce .6s ease-out}@keyframes bounce{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.score-display-large{display:flex;flex-direction:column;align-items:center;margin-bottom:30px;padding:30px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:12px;color:#fff}.final-score-label{font-size:1rem;opacity:.9;margin-bottom:10px;text-transform:uppercase;letter-spacing:1px}.final-score-value{font-size:3.5rem;font-weight:700}.score-comparison{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-bottom:30px}.comparison-item{display:flex;flex-direction:column;align-items:center;padding:15px;background:#f5f5f5;border-radius:12px;border:2px solid #e0e0e0}.comparison-label{font-size:.85rem;color:#666;margin-bottom:8px;text-transform:uppercase;font-weight:600;letter-spacing:.5px}.comparison-value{font-size:2rem;font-weight:700;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.celebration-message{padding:15px;margin-bottom:30px;background:#fff3cd;border-left:4px solid #ffc107;border-radius:8px;color:#856404;font-weight:500}.comparison-message{padding:15px;margin-bottom:30px;background:#e3f2fd;border-left:4px solid #2196f3;border-radius:8px;color:#1565c0;font-weight:500}.result-buttons{display:grid;grid-template-columns:1fr 1fr;gap:12px}.button{padding:12px;font-size:1rem;font-weight:700;border:none;border-radius:12px;cursor:pointer;transition:transform .2s,box-shadow .2s}.replay-button{color:#fff;background:linear-gradient(135deg,#667eea,#764ba2);box-shadow:0 4px 15px #667eea66}.replay-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #667eea99}.home-button{color:#667eea;background:transparent;border:2px solid #667eea}.home-button:hover{background:#f5f5f5;transform:translateY(-2px)}.button:active{transform:translateY(0)}@media (max-width: 480px){.result-content{padding:30px 20px}.result-title{font-size:1.7rem}.final-score-value{font-size:2.8rem}.result-buttons{grid-template-columns:1fr}}.app-container{width:100%;height:100%;min-height:100vh}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html,body,#root{width:100%;height:100%}*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;outline:none}*:focus{outline:none}button:focus,button:active{outline:none;-webkit-tap-highlight-color:transparent}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh;display:flex;align-items:center;justify-content:center;-webkit-user-select:none;-webkit-touch-callout:none}#root,html,body{width:100%;height:100%}@keyframes slideIn{0%{transform:translate(-100px)}to{transform:translate(0)}}@keyframes slideOut{0%{transform:translate(0)}to{transform:translate(100px)}}@keyframes fall{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(400px)}}@keyframes wobble{0%,to{transform:rotate(0)}25%{transform:rotate(1deg)}75%{transform:rotate(-1deg)}}.block-falling{animation:fall .8s ease-in forwards}.stack-wobble{animation:wobble .3s ease-in-out}
