*{margin:0;padding:0;box-sizing:border-box}
html,body{width:100%;height:100%;overflow:hidden}
body{position:fixed;inset:0;display:flex;flex-direction:column;background:#1a1a2e;font-family:system-ui,-apple-system,sans-serif;user-select:none;-webkit-user-select:none;touch-action:none;overscroll-behavior:none}
canvas{display:block;flex:0 0 auto;margin:0 auto;cursor:pointer;touch-action:none}
.ui{flex:0 0 auto;text-align:center;padding:16px;color:#e0e0e0}
.ui h1{font-size:1.4rem;margin-bottom:4px;letter-spacing:2px}
.ui .score{font-size:1.1rem;color:#f6d55c}
.ui .hint{font-size:.8rem;color:#888;margin-top:6px}
@media(max-width:600px){
  .ui{padding:10px 8px 9px}
  .ui h1{font-size:clamp(1.05rem,5.5vw,1.4rem);letter-spacing:1px}
  .ui .score{font-size:1rem}
  .ui .hint{font-size:.72rem;margin-top:4px}
}
@media(max-height:520px){
  .ui{padding:6px 8px}
  .ui h1{font-size:1rem;margin-bottom:1px}
  .ui .score{font-size:.85rem}
  .ui .hint{display:none}
}