:root{
  --bg: #282a36;
  --card: #44475a;
  --muted: #6272a4;
  --accent: #bd93f9;
  --accent2: #50fa7b;
  --text: #f8f8f2;
  --glass: rgba(255,255,255,0.04);
}
* { box-sizing: border-box; }
body {
  margin:0; font-family: "Poppins", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  background: var(--bg); color:var(--text); -webkit-font-smoothing:antialiased;
}
h1,h2{ color:var(--accent); margin:12px 0;}
a{ color:inherit; }
button, select, input, textarea {
  border: none; outline:none;
  background: var(--card); color:var(--text);
  padding:10px 12px; border-radius:8px;
  box-shadow: 0 4px 14px rgba(0,0,0,0.35);
  transition: transform .14s ease, box-shadow .14s ease;
}
button:hover, select:hover { transform: translateY(-3px); box-shadow: 0 8px 20px rgba(0,0,0,0.45); }
.canvas-common { border-radius:10px; box-shadow: 0 6px 24px rgba(0,0,0,0.5); display:block; margin: 12px auto; }

/* controls / small text */
.label { font-size:14px; color:var(--muted); margin-right:8px; }
#menu { margin: 12px 0; display:inline-flex; gap:8px; align-items:center; background:var(--glass); padding:10px 14px; border-radius:10px; }

/* score/status text */
#score, #status, #result, .info { color: var(--accent2); font-weight:600; }

/* small helper */
.center { display:flex; justify-content:center; align-items:center; flex-direction:column; }