/* Study Hub — shared styles (hub + grade pages)
   Friendly, bright, big tap targets for iPad. */
:root{
  --bg:#f4f7fb; --card:#ffffff; --ink:#1f2937; --muted:#6b7280;
  --brand:#4f46e5; --brand-soft:#eef2ff; --line:#e5e7eb;
  --sci:#0ea5e9;  --sci-soft:#e0f2fe;
  --math:#f59e0b; --math-soft:#fef3c7;
  --eng:#8b5cf6;  --eng-soft:#ede9fe;
  --his:#ef4444;  --his-soft:#fee2e2;
  --good:#16a34a; --good-soft:#dcfce7;
}
*{box-sizing:border-box}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:"Nunito","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:18px;line-height:1.5;
}
.wrap{max-width:760px;margin:0 auto;padding:20px 16px 56px}
header.hub{text-align:center;margin:10px 0 24px}
header.hub .big-emoji{font-size:3rem;line-height:1}
header.hub h1{margin:8px 0 4px;font-size:2rem;font-weight:800}
header.hub p{margin:0;color:var(--muted)}
a{color:var(--brand);text-decoration:none}
.back{display:inline-block;margin-bottom:14px;font-weight:700;font-size:.95rem}
.back:hover{text-decoration:underline}

/* Student cards on the hub */
.students{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:560px){.students{grid-template-columns:1fr}}
a.student{
  display:block;background:var(--card);border-radius:20px;padding:26px 20px;
  text-align:center;border:3px solid transparent;color:var(--ink);
  box-shadow:0 2px 10px rgba(0,0,0,.06);transition:transform .12s,border-color .12s;
}
a.student:active{transform:scale(.97)}
a.student:hover{border-color:var(--brand)}
.student .face{font-size:3.4rem;line-height:1}
.student h2{margin:10px 0 2px;font-size:1.5rem;font-weight:800}
.student p{margin:0;color:var(--muted);font-weight:700}
.student .go{display:inline-block;margin-top:14px;background:var(--brand);color:#fff;
  font-weight:800;border-radius:12px;padding:10px 22px;font-size:1.05rem}

/* Subject sections on grade pages */
.subject{background:var(--card);border-radius:20px;box-shadow:0 2px 10px rgba(0,0,0,.06);
  margin-bottom:18px;overflow:hidden}
.subject-head{display:flex;align-items:center;gap:12px;padding:16px 20px;color:#fff}
.subject-head .ico{font-size:1.8rem}
.subject-head h2{margin:0;font-size:1.3rem;font-weight:800;flex:1}
.subject-head .n{font-size:.85rem;font-weight:800;background:rgba(255,255,255,.25);
  border-radius:99px;padding:4px 12px}
.subject.science .subject-head{background:var(--sci)}
.subject.math    .subject-head{background:var(--math)}
.subject.english .subject-head{background:var(--eng)}
.subject.history .subject-head{background:var(--his)}
.subject .body{padding:14px 18px 18px}

/* Quiz rows */
.quiz-row{display:flex;align-items:center;gap:14px;border:2px solid var(--line);
  border-radius:14px;padding:14px 16px;margin-top:10px;flex-wrap:wrap}
.quiz-row .info{flex:1;min-width:180px}
.quiz-row .t{font-weight:800;font-size:1.05rem}
.quiz-row .d{color:var(--muted);font-size:.9rem}
.badge{font-size:.85rem;font-weight:800;border-radius:99px;padding:5px 12px;white-space:nowrap}
.badge.score{background:var(--good-soft);color:var(--good)}
.badge.new{background:var(--brand-soft);color:var(--brand)}
.start{background:var(--brand);color:#fff;font-weight:800;border-radius:12px;
  padding:11px 20px;font-size:1rem;white-space:nowrap}
.start:active{transform:scale(.96)}
.soon{color:var(--muted);text-align:center;padding:14px 8px 8px;font-weight:700}
.soon .e{font-size:1.6rem;display:block;margin-bottom:4px}

footer{margin-top:28px;text-align:center;color:var(--muted);font-size:.85rem}