
/* ===== Unified control system v1: Prolog + Mission 1 ===== */
:root{
  --ctl-yellow-1:#ffe56b;
  --ctl-yellow-2:#ffc928;
  --ctl-yellow-shadow:#d6a200;
  --ctl-blue:#0e4e84;
  --ctl-blue-dark:#083a65;
  --ctl-blue-light:#eaf4fb;
  --ctl-border:#9fcff0;
  --ctl-text:#173f6b;
  --ctl-radius-pill:999px;
  --ctl-radius:18px;
}
.btn,
.big-action,
.prolog-open-button,
.enter-world,
#mission1Start,
.next-step,
.secondary-action,
.nav-button{
  font-family:inherit;
  font-weight:900;
  transition:transform .12s ease, box-shadow .12s ease, filter .12s ease, background .12s ease;
}
.btn:hover,
.big-action:hover,
.prolog-open-button:hover,
.enter-world:hover,
#mission1Start:hover,
.next-step:hover,
.secondary-action:hover,
.nav-button:hover{
  filter:brightness(1.03);
}
.btn:active,
.big-action:active,
.prolog-open-button:active,
.enter-world:active,
#mission1Start:active,
.next-step:active,
.secondary-action:active,
.nav-button:active{
  transform:translateY(2px);
}

/* Main CTA */
.big-action,
.prolog-open-button,
.enter-world,
#mission1Start,
.btn.primary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:64px;
  padding:16px 34px;
  border:0;
  border-radius:var(--ctl-radius-pill);
  background:linear-gradient(180deg,var(--ctl-yellow-1),var(--ctl-yellow-2));
  color:#4a3500;
  box-shadow:0 7px 0 var(--ctl-yellow-shadow),0 12px 22px rgba(0,0,0,.12);
  text-decoration:none;
  cursor:pointer;
  font-size:1.08rem;
}
.big-action:disabled,
.btn.primary:disabled{
  opacity:.45;
  cursor:not-allowed;
  box-shadow:none;
}

/* Secondary actions */
.btn.secondary,
.secondary-action{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:50px;
  padding:12px 24px;
  border:2px solid var(--ctl-border);
  border-radius:var(--ctl-radius);
  background:#fff;
  color:var(--ctl-text);
  box-shadow:0 4px 10px rgba(20,80,120,.08);
  text-decoration:none;
  cursor:pointer;
}

/* Map button */
.nav-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:0 18px;
  border-radius:18px;
  background:#fff;
  color:var(--ctl-text);
  border:1px solid #d4e7f5;
  box-shadow:0 4px 10px rgba(20,80,120,.12);
  text-decoration:none;
}

/* Header prev/next buttons */
.header-step-button,
#previousStep,
#followingStep{
  width:46px!important;
  height:46px!important;
  border-radius:50%!important;
  border:0!important;
  background:var(--ctl-blue)!important;
  color:#fff!important;
  box-shadow:0 4px 10px rgba(0,0,0,.18)!important;
  font-size:1.3rem!important;
  cursor:pointer!important;
}
.header-step-button:hover,
#previousStep:hover,
#followingStep:hover{
  background:var(--ctl-blue-dark)!important;
}
.header-step-button:disabled,
#previousStep:disabled,
#followingStep:disabled{
  opacity:.35!important;
  cursor:not-allowed!important;
}

/* Answer tiles */
.choice-grid button,
.scored button,
.activity-card button:not(.big-action):not(.btn):not(.header-step-button),
.mission-tile,
.answer-tile{
  border:2px solid var(--ctl-border);
  border-radius:16px;
  background:#fff;
  color:var(--ctl-text);
  box-shadow:0 3px 8px rgba(20,80,120,.06);
}
.choice-grid button:hover,
.scored button:hover,
.activity-card button:not(.big-action):not(.btn):not(.header-step-button):hover{
  border-color:#5eb2e7;
  transform:translateY(-1px);
}
.correct,
.is-correct,
button.correct{
  background:#e9fff1!important;
  border-color:#2ebd67!important;
}
.wrong,
.is-wrong,
button.wrong{
  background:#fff0f0!important;
  border-color:#e05a5a!important;
}

/* Keep start CTA consistent and centered */
#mission1Start,
.prolog-open-button,
.enter-world{
  width:min(650px,82%);
  margin:18px auto 22px;
}

/* Read-aloud stays compact */
button[id*="read"],
.read-button,
.tts-button{
  border-radius:14px!important;
  min-height:44px!important;
  padding:10px 16px!important;
}
