/* OMI Pro V27 — Learning Quality, single-icon footer, full discussion, gamification */
:root{--v27-gold:#b97908;--v27-purple:#6a51bd;--v27-red:#b44755;--v27-green:#08745c;--v27-blue:#177fab}

/* Footer contract: exactly Previous, Flag, Skip, Next; one icon each; one horizontal row. */
body.legacy-app .q-nav{
  display:flex!important;grid-template-columns:none!important;flex-wrap:nowrap!important;align-items:center!important;
  justify-content:stretch!important;gap:6px!important;width:min(680px,calc(100% - 10px))!important;
  padding:7px!important;overflow:visible!important;
}
body.legacy-app .q-nav .nav-mid{display:none!important}
body.legacy-app .q-nav button{
  display:grid!important;place-items:center!important;flex:1 1 25%!important;min-width:0!important;max-width:none!important;
  width:auto!important;height:48px!important;min-height:48px!important;padding:0!important;margin:0!important;
  font-size:25px!important;line-height:1!important;text-indent:0!important;letter-spacing:0!important;white-space:nowrap!important;
}
body.legacy-app .q-nav button::before,body.legacy-app .q-nav button::after{content:none!important;display:none!important}
body.legacy-app .q-nav #prevBtn{order:1!important}
body.legacy-app .q-nav #flagBtn{order:2!important}
body.legacy-app .q-nav #skipBtn{order:3!important;display:grid!important;background:linear-gradient(145deg,#f1ecff,#ded4fa)!important;color:#654db9!important;border-color:#d5caf3!important}
body.legacy-app .q-nav #nextBtn{order:4!important}
body.legacy-app .q-nav #checkBtn{display:none!important}
@media(max-width:390px){body.legacy-app .q-nav{gap:4px!important;padding:6px!important}body.legacy-app .q-nav button{font-size:23px!important;height:45px!important;min-height:45px!important}}

/* Discussion belongs to the question, never to the footer. */
.question-tools{display:flex;align-items:center;gap:10px;margin:16px 0 2px;padding-top:14px;border-top:1px solid var(--line)}
.question-tools #checkBtn,.discussion-btn{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;min-height:44px!important;
  padding:.7rem 1rem!important;border-radius:13px!important;border:1px solid color-mix(in srgb,var(--accent) 32%,var(--line))!important;
  background:color-mix(in srgb,var(--accent) 8%,var(--panel))!important;color:var(--accent)!important;font-size:.92rem!important;line-height:1.2!important;
  font-weight:850!important;box-shadow:none!important;text-indent:0!important;width:auto!important;max-width:100%!important;
}
.question-tools #checkBtn::before,.question-tools #checkBtn::after{display:none!important;content:none!important}
.question-tools #checkBtn:disabled{opacity:.48!important;cursor:not-allowed!important;filter:grayscale(.12)}
.question-tools #checkBtn:not(:disabled):active{transform:translateY(1px)}
.discussion-note{font-size:.78rem;color:var(--muted);line-height:1.35}
.full-discussion{margin-top:16px;border-radius:17px;padding:16px;background:color-mix(in srgb,var(--accent) 6%,var(--panel));border:1px solid color-mix(in srgb,var(--accent) 30%,var(--line))}
.full-discussion.wrong{background:color-mix(in srgb,var(--danger) 6%,var(--panel));border-color:color-mix(in srgb,var(--danger) 34%,var(--line))}
.full-discussion h3{font-size:1rem;margin:0 0 8px}.full-discussion p{margin:.45rem 0}.full-discussion .answer-key{font-weight:850;color:var(--accent)}
.full-discussion.wrong .answer-key{color:var(--danger)}
.full-discussion ol{margin:.55rem 0 .1rem;padding-left:1.35rem}.full-discussion li{margin:.45rem 0}
.option.v27-correct{border-color:var(--ok)!important;background:color-mix(in srgb,var(--ok) 10%,var(--panel))!important}
.option.v27-wrong{border-color:var(--danger)!important;background:color-mix(in srgb,var(--danger) 8%,var(--panel))!important}
.option.v27-locked{cursor:default!important;transform:none!important}

/* Compact learning-game HUD. It supplements learning modes and never blocks practice. */
.game-hud{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin:10px 0 4px;padding:8px;border:1px solid var(--line);border-radius:15px;background:color-mix(in srgb,var(--panel2) 76%,var(--panel));box-shadow:0 4px 14px rgba(26,58,49,.05)}
.game-hud.hidden,.game-history-panel.hidden{display:none!important}
.game-pill{display:inline-flex;align-items:center;gap:5px;min-height:32px;padding:5px 9px;border:1px solid var(--line);border-radius:999px;background:var(--panel);font-size:.78rem;white-space:nowrap}
.game-pill b{font-size:.83rem}.game-pill.level{color:var(--v27-green);font-weight:800}.game-pill.diamond{color:var(--v27-blue)}.game-pill.heart{color:var(--v27-red)}.game-pill.streak{color:var(--v27-gold)}.game-pill.xp{color:var(--v27-purple)}
.game-history-panel{margin:6px 0 14px;border:1px solid var(--line);border-radius:14px;background:var(--panel);overflow:hidden}
.game-history-panel summary{cursor:pointer;padding:9px 12px;font-size:.78rem;font-weight:800;color:var(--muted)}
.game-history-list{display:grid;gap:6px;padding:0 10px 10px;max-height:210px;overflow:auto}
.game-history-item{display:grid;grid-template-columns:1fr auto;gap:8px;padding:8px 9px;border-radius:10px;background:var(--panel2);font-size:.76rem;line-height:1.35}
.game-history-item small{display:block;color:var(--muted)}.game-history-item b{align-self:center;white-space:nowrap}
.game-result-card{margin-top:18px}.game-result-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.game-result-grid div{padding:10px;border:1px solid var(--line);border-radius:13px;background:var(--panel2);text-align:center}.game-result-grid b{display:block;font-size:1.15rem;color:var(--accent)}.game-result-grid span{font-size:.72rem;color:var(--muted)}
@media(max-width:560px){.question-tools{align-items:stretch;flex-direction:column}.question-tools #checkBtn{width:100%!important}.discussion-note{text-align:center}.game-hud{gap:5px;padding:7px}.game-pill{padding:4px 7px;font-size:.72rem}.game-result-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}