:root{--bg:#06070b;--text:#ced6e0;}
html,body{height:100%;margin:0;overflow:hidden;background:var(--bg);font-family:system-ui,-apple-system,sans-serif;touch-action:none;user-select:none;-webkit-user-select:none;}
canvas{display:block;width:100%;height:100%;cursor:grab;}
canvas:active{cursor:grabbing;}
#title{position:absolute;top:38%;width:100%;text-align:center;font-size:clamp(2.2rem,7vw,4.5rem);font-weight:800;letter-spacing:-0.03em;color:#fff;pointer-events:none;z-index:2;transition:opacity 0.5s ease;text-shadow:0 8px 32px rgba(255,68,68,0.25);}
#ui{position:absolute;bottom:2.5rem;width:100%;pointer-events:none;text-align:center;z-index:2;}
#hint{font-size:0.9rem;letter-spacing:0.05em;color:rgba(255,255,255,0.35);transition:opacity 0.4s;text-shadow:0 1px 4px rgba(0,0,0,0.8);}
#stats{margin-top:0.5rem;height:10px;font-variant-numeric:tabular-nums;font-size:0.7rem;color:rgba(255,255,255,0.2);}
#pause-layer{position:absolute;inset:0;background:rgba(4,4,12,0.75);display:flex;align-items:center;justify-content:center;z-index:10;opacity:0;pointer-events:none;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);transition:opacity 0.3s ease;}
.toast{background:#fff;color:#111;padding:0.6rem 1.4rem;border-radius:2rem;font-weight:600;font-size:0.9rem;cursor:pointer;transform:scale(0.9);opacity:0;transition:all 0.3s cubic-bezier(0.34,1.56,0.64,1);box-shadow:0 4px 20px rgba(0,0,0,0.4);}
:active .toast{transform:scale(1.05);opacity:1;}