body{margin:0;padding:0;overflow:hidden;background-color:#fcfcfc;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;user-select:none;-webkit-user-select:none}#ui-layer{position:absolute;top:15%;text-align:center;pointer-events:none;z-index:10;width:100%}h1{font-size:2.5rem;color:#333;margin:0;font-weight:800;letter-spacing:-1px}p{font-size:1.2rem;color:#888;margin-top:10px}#score-display{font-size:4rem;font-weight:900;opacity:0;transition:opacity .3s ease,transform .3s cubic-bezier(.175,.885,.32,1.275);transform:scale(.5);margin-top:20px}.score-perfect{color:#2ecc71}.score-good{color:#f1c40f}.score-bad{color:#e74c3c}.rainbow-glow{animation:rainbow-text 4s ease infinite;text-shadow:0 0 10px rgba(255,255,255,.7)}@keyframes rainbow-text{0%{color:red;text-shadow:0 0 5px #ff0000}16%{color:#ff8000;text-shadow:0 0 5px #ff8000}33%{color:#ff0;text-shadow:0 0 5px #ffff00}50%{color:#0f0;text-shadow:0 0 5px #00ff00}66%{color:#00f;text-shadow:0 0 5px #0000ff}83%{color:#8000ff;text-shadow:0 0 5px #8000ff}to{color:red;text-shadow:0 0 5px #ff0000}}#reset-btn{pointer-events:auto;margin-top:20px;padding:10px 25px;font-size:1rem;border:none;border-radius:50px;background:#333;color:#fff;cursor:pointer;opacity:0;transition:opacity .3s;display:none}#reset-btn:hover{transform:scale(1.05)}canvas{position:absolute;top:0;left:0;cursor:crosshair}.helper-text{position:absolute;bottom:30px;color:#ccc;font-size:.9rem;pointer-events:none}