/* Luna's Games — shared look. One bright theme on purpose (kids' arcade). */
[hidden]{display:none!important}
@font-face{font-family:"Baloo 2";font-style:normal;font-weight:400 800;font-display:swap;src:url("fonts/baloo2.woff2") format("woff2")}
:root{
  --sky:#8fd3ff; --sky2:#d9f1ff; --ink:#24315e; --ink-soft:#5a6690;
  --pink:#ff6fae; --pink-dark:#c73f80; --gold:#ffc83d; --gold-dark:#d99a00;
  --green:#7bdc6b; --orange:#ffb03d; --purple:#b98cff;
  --btn:#5b6cff; --btn-dark:#3341b8; --panel:#ffffff;
  --font:"Baloo 2","Comic Sans MS","Trebuchet MS",system-ui,sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{background:var(--sky2);color:var(--ink);font-family:var(--font);
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));
  -webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
body.lg-game{overflow:hidden;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
.lg-app{height:100%;display:flex;flex-direction:column;gap:10px;padding-block:10px;max-width:560px;margin:0 auto}
.lg-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.lg-back{display:inline-flex;align-items:center;gap:4px;text-decoration:none;color:var(--ink);background:var(--panel);
  border-radius:999px;padding:4px 14px 4px 10px;font-weight:800;box-shadow:0 2px 0 rgba(36,49,94,.15)}
.lg-back:focus-visible{outline:3px solid var(--ink);outline-offset:2px}
.lg-title{margin:0;font-size:1.45rem;font-weight:800;line-height:1;flex:1 0 auto;white-space:nowrap}
.lg-title span{color:var(--pink)}
@media (max-width:420px){.lg-title{font-size:1.15rem}.lg-chip{padding:3px 9px}}
.lg-stats{display:flex;gap:8px;flex-wrap:wrap}
.lg-chip{background:var(--panel);border-radius:999px;padding:3px 12px;font-weight:800;font-size:1rem;
  box-shadow:0 2px 0 rgba(36,49,94,.15);font-variant-numeric:tabular-nums;white-space:nowrap}
.lg-chip small{font-weight:600;opacity:.7;margin-right:4px;font-size:.72rem;letter-spacing:.06em;text-transform:uppercase}
.lg-field{flex:1;min-height:0;position:relative;display:flex;justify-content:center;align-items:center}
.lg-field canvas{display:block;border-radius:22px;box-shadow:0 6px 0 rgba(36,49,94,.18);background:var(--sky);touch-action:none;max-width:100%}
.lg-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;
  background:rgba(217,241,255,.35);border-radius:22px;z-index:5}
.lg-card{background:var(--panel);border-radius:22px;padding:18px 22px;box-shadow:0 6px 0 rgba(36,49,94,.18);max-width:310px;margin:0 12px}
.lg-card h2{margin:0 0 4px;font-size:1.7rem;line-height:1.1;text-wrap:balance}
.lg-card p{margin:0 0 14px;font-size:1.05rem;line-height:1.35}
.lg-go{font-family:var(--font);font-weight:800;font-size:1.45rem;border:0;border-radius:999px;padding:10px 30px;
  background:var(--pink);color:#fff;box-shadow:0 5px 0 var(--pink-dark);cursor:pointer}
.lg-go:active{transform:translateY(3px);box-shadow:0 2px 0 var(--pink-dark)}
.lg-go:focus-visible,.lg-btn:focus-visible{outline:4px solid var(--ink);outline-offset:3px}
.lg-btn{font-family:var(--font);font-weight:800;font-size:1.2rem;border:0;border-radius:18px;padding:12px 18px;
  background:var(--btn);color:#fff;box-shadow:0 5px 0 var(--btn-dark);cursor:pointer;touch-action:none}
.lg-btn:active,.lg-btn.on{transform:translateY(3px);box-shadow:0 2px 0 var(--btn-dark)}
.lg-controls{display:flex;gap:12px}
.lg-controls .lg-btn{flex:1}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}
