
:root{
  --bg:#ffffff; --card:#ffffff; --text:#111111; --muted:#555555; --border:#d9d9d9;
  --success:#1f7a3d; --danger:#b42318; --soft:#f7f7f7; --accent:#111111;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:"Tahoma","Segoe UI",Arial,sans-serif;background:#fff;color:#111;min-height:100vh}
.page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}
.box{width:min(760px,92vw);background:#fff;border:1px solid var(--border);border-radius:18px;padding:22px}
.title{font-size:25px;font-weight:800;text-align:center;margin:0 0 10px}
.subtitle{text-align:center;color:var(--muted);font-size:14px;line-height:1.9;margin:0 0 18px}
.home-links,.options,.count-grid,.stats-grid,.quick-grid{display:grid;gap:10px}
.count-grid{grid-template-columns:repeat(3,1fr);margin-top:10px}
.stats-grid{grid-template-columns:repeat(4,1fr);margin:12px 0}
.quick-grid{grid-template-columns:1fr 1fr}
.subject-block,.panel{border:1px solid var(--border);border-radius:12px;padding:12px;background:#fff}
.subject-name{font-size:17px;font-weight:800;margin-bottom:8px;text-align:center}
.nav-btn,.option-btn,.action-btn,.count-btn{
  width:100%;border:1px solid var(--border);background:#fff;color:#111;border-radius:12px;
  padding:13px 14px;font-family:inherit;font-size:14px;font-weight:700;cursor:pointer;text-align:right;
  text-decoration:none;display:block
}
.count-btn{text-align:center;font-size:13px;padding:11px 8px}
.nav-btn:hover,.option-btn:hover,.action-btn:hover,.count-btn:hover{background:var(--soft)}
.meta{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;color:var(--muted);font-size:13px;margin-bottom:10px}
.progress{height:7px;background:#efefef;border-radius:999px;overflow:hidden;margin-bottom:14px}
.progress-bar{height:100%;width:0%;background:#111}
.question{font-size:22px;font-weight:800;line-height:1.9;margin:10px 0 14px;text-align:right}
.option-btn.correct{border-color:var(--success);color:var(--success);background:#f6fbf7}
.option-btn.wrong{border-color:var(--danger);color:var(--danger);background:#fff7f7}
.feedback{display:none;margin-top:14px;border:1px solid var(--border);border-radius:12px;padding:14px;background:var(--soft)}
.feedback.show{display:block}
.feedback-title{font-size:16px;font-weight:800;margin-bottom:8px}
.feedback p{margin:0 0 10px;line-height:1.9;color:#111;font-size:14px}
.actions{display:flex;gap:10px;margin-top:14px}
.result-list{display:grid;gap:10px}
.result-item,.stat-card{border:1px solid var(--border);border-radius:12px;padding:12px;background:#fff;font-size:14px;line-height:1.9}
.stat-card{text-align:center}
.stat-card .big{font-size:24px;font-weight:800;display:block;margin-bottom:4px}
.note{font-size:12px;color:var(--muted);line-height:1.8;text-align:center;margin-top:10px}
.table-wrap{overflow:auto;margin-top:10px}
table{width:100%;border-collapse:collapse}
th,td{border:1px solid var(--border);padding:10px 8px;text-align:center;font-size:13px}
th{background:#f7f7f7}
.badge{display:inline-block;border:1px solid var(--border);border-radius:999px;padding:6px 10px;font-size:12px}
.level-A{color:#1f7a3d}.level-B{color:#2c5cc5}.level-C{color:#9a6b00}.level-D{color:#b42318}
@media (max-width:640px){
  .box{padding:16px}.title{font-size:21px}.question{font-size:19px}.actions{flex-direction:column}
  .count-grid,.stats-grid,.quick-grid{grid-template-columns:repeat(2,1fr)}
}


/* quiz page simplification */
.quiz-subtitle-hidden{display:none !important;}
.meta.compact-top{
  display:flex;
  justify-content:flex-start;
  gap:8px;
  flex-wrap:wrap;
  margin-bottom:12px;
}
.icon-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  border:1px solid var(--border);
  background:#f8f8f8;
  color:#111;
  border-radius:999px;
  padding:7px 11px;
  font-size:12px;
  font-weight:700;
}
.icon-chip .icon{
  font-size:13px;
  line-height:1;
}
.meta.secondary-hidden{
  display:none !important;
}
.question{
  margin-top:4px;
}


.home-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  margin-top:14px;
}
.subject-card-home{
  border:1px solid var(--border);
  border-radius:14px;
  padding:16px;
  background:#fff;
}
.subject-card-home h3{
  margin:0 0 10px;
  text-align:center;
  font-size:20px;
}
.field-label{
  font-size:13px;
  color:var(--muted);
  margin-bottom:6px;
  display:block;
}
.count-input{
  width:100%;
  border:1px solid var(--border);
  border-radius:12px;
  padding:12px 14px;
  font-family:inherit;
  font-size:14px;
  color:#111;
  background:#fff;
  margin-bottom:10px;
}
.helper-text{
  font-size:12px;
  color:var(--muted);
  line-height:1.8;
  margin:4px 0 10px;
  text-align:center;
}
.full-width{
  grid-column:1 / -1;
}
.dual-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  margin-top:14px;
}
@media (max-width:640px){
  .home-grid,.dual-actions{grid-template-columns:1fr}
}
