.ky-wrap{display:flex;justify-content:center;align-items:flex-start;padding:16px;}
.ky-card{width:min(920px,100%);background:#0b0f14;border:1px solid #1b2430;border-radius:18px;box-shadow:0 10px 30px rgba(0,0,0,.35);color:#e7eef7;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;overflow:hidden}
.ky-header{padding:18px 18px 12px;border-bottom:1px solid #1b2430;background:linear-gradient(180deg,#101826,#0b0f14)}
.ky-title{font-size:24px;font-weight:900;letter-spacing:.2px}
.ky-sub{opacity:.8;margin-top:2px;font-size:13px}
.ky-stage{padding:18px}
.ky-hidden{display:none}
.ky-info{opacity:.9;margin-bottom:12px;line-height:1.45}
.ky-json-path{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:12px;opacity:.9}
.ky-topbar{display:flex;justify-content:space-between;gap:12px;margin-bottom:10px;opacity:.95;font-size:13px}
.ky-progress{font-weight:800}
.ky-timer{font-weight:800}
.ky-question{font-size:20px;line-height:1.45;margin:10px 0 14px;font-weight:900;color:#f3f7ff}
.ky-options{display:grid;grid-template-columns:1fr;gap:10px}
@media (min-width:720px){.ky-options{grid-template-columns:1fr 1fr}}
.ky-opt{
  border:1px solid #2b3b52;
  background:linear-gradient(180deg,#121c2b,#0f1724);
  border-radius:14px;
  padding:12px 12px;
  cursor:pointer;
  transition:transform .06s ease, border-color .15s ease, background .15s ease;
  display:flex;gap:10px;align-items:flex-start;
  color:#eef4ff;
  text-align:left;
}
.ky-opt:hover{transform:translateY(-1px);border-color:#4b6a92}
.ky-opt:disabled{cursor:not-allowed;opacity:.92}
.ky-opt-key{
  min-width:34px;height:34px;border-radius:12px;
  background:#0d1320;border:1px solid #2b3b52;
  display:flex;align-items:center;justify-content:center;
  font-weight:1000;
  color:#ffffff;
}
.ky-opt-text{flex:1;font-size:15px;line-height:1.35;color:#eef4ff}
.ky-opt.correct{border-color:#2aa74f;background:rgba(42,167,79,.18)}
.ky-opt.wrong{border-color:#e04b4b;background:rgba(224,75,75,.16)}
.ky-actions{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
.ky-btn{border:1px solid #2a3a50;background:#111a28;color:#e7eef7;border-radius:12px;padding:10px 14px;font-weight:900;cursor:pointer}
.ky-btn:disabled{opacity:.55;cursor:not-allowed}
.ky-btn-primary{background:#173152;border-color:#2d5385}
.ky-btn-danger{background:#2b1414;border-color:#6b2a2a}
.ky-mini{margin-top:10px;opacity:.92;font-size:13px;line-height:1.45}
.ky-result-title{font-size:20px;font-weight:1000;margin-bottom:12px}
.ky-result-grid{display:grid;grid-template-columns:1fr;gap:10px}
@media (min-width:640px){.ky-result-grid{grid-template-columns:1fr 1fr 1fr}}
.ky-result-box{border:1px solid #2b3b52;background:#0f1724;border-radius:14px;padding:12px}
.ky-result-label{opacity:.8;font-size:12px;font-weight:800}
.ky-result-value{font-size:24px;font-weight:1000;margin-top:4px;color:#f3f7ff}

/* --- Readability hotfix (v1.2.1) --- */
.ky-opt{ color:#f6f6f6; }
.ky-opt .ky-opt-text{ color:#f6f6f6 !important; }
.ky-opt .ky-opt-key{ color:#ffffff !important; }

/* When disabled after answering, DO NOT dim text */
.ky-opt:disabled{ opacity:1 !important; filter:none !important; }

/* Correct/Wrong: keep strong contrast and ensure child text inherits */
.ky-opt.correct{ color:#0a0a0a !important; }
.ky-opt.correct .ky-opt-text{ color:#0a0a0a !important; }
.ky-opt.correct .ky-opt-key{ color:#0a0a0a !important; }

.ky-opt.wrong{ color:#0a0a0a !important; }
.ky-opt.wrong .ky-opt-text{ color:#0a0a0a !important; }
.ky-opt.wrong .ky-opt-key{ color:#0a0a0a !important; }

/* Slightly lighten default option background */
.ky-opt{ background:#202020 !important; border-color:rgba(255,255,255,.14) !important; }

/* --- Answer highlight fix (v1.2.3) ---
   - Correct option stays GREEN
   - Wrong chosen option stays RED
   - Option text stays WHITE in all states
*/
.ky-opt,
.ky-opt .ky-opt-text,
.ky-opt .ky-opt-key{
  color:#ffffff !important;
}

/* Do not dim when disabled */
.ky-opt:disabled{
  opacity:1 !important;
  filter:none !important;
}

/* Ensure highlight colors are not overridden by other !important rules */
.ky-opt.correct{
  background:#1f8f3d !important;
  border-color:#1f8f3d !important;
}
.ky-opt.wrong{
  background:#c62828 !important;
  border-color:#c62828 !important;
}

/* Keep key badge readable on highlights */
.ky-opt.correct .ky-opt-key,
.ky-opt.wrong .ky-opt-key{
  background:rgba(0,0,0,.18) !important;
  border-color:rgba(255,255,255,.18) !important;
}