/* Student screens share the brand palette; grading and note data stay in the existing app. */
.student-page { background:var(--paper,#f4f5f8); }
.student-page [hidden] { display:none !important; }
.student-page .topbar { background:rgba(255,255,255,.96); }
.student-page .topbar .wrap { max-width:1180px; min-height:76px; height:auto; gap:22px; }
.student-page .student-wordmark { display:inline-flex; align-items:baseline; flex-shrink:0; gap:0; font:800 27px/1 var(--sans); letter-spacing:-1.6px; }
.student-wordmark > .brand-subject { color:var(--jumuk,#4260f5);font:inherit;letter-spacing:inherit;margin-left:7px; }
.student-wordmark small { font-size:9px; font-weight:700; letter-spacing:1.6px; margin-left:10px; }
.student-page .nav { display:flex; gap:28px; font-size:14px; font-weight:650; }
.student-page .nav a { padding:26px 0; white-space:nowrap; }
.student-page .nav a[aria-current="page"] { color:var(--jumuk,#4260f5); }
.student-main { padding:52px 0 80px; }
.student-page .student-shell { max-width:840px; }
.student-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:24px; margin-bottom:30px; }
.student-eyebrow { font-size:11px; font-weight:750; letter-spacing:.7px; color:var(--jumuk,#4260f5); margin:0 0 10px; }
.student-page .hw-title { font-family:var(--sans); font-size:clamp(30px,4.5vw,40px); line-height:1.22; letter-spacing:-1.4px; margin:0 0 10px; }
.student-intro { font-size:15px; color:var(--ink-soft); line-height:1.6; }
.student-shortcut { font-size:13px; font-weight:650; white-space:nowrap; padding:8px 0; }
.student-shortcut span { margin-left:8px; color:var(--jumuk,#4260f5); }
.student-steps { list-style:none; display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin:0 0 24px; }
.student-steps li { padding-bottom:13px; border-bottom:2px solid var(--line); color:#757a87; font-size:13px; font-weight:650; }
.student-steps li span { margin-right:8px; font-variant-numeric:tabular-nums; }
.student-steps li[aria-current="step"] { color:var(--jumuk,#4260f5); border-color:var(--jumuk,#4260f5); }
.student-page .student-work-card { background:#fff; padding:30px; border-radius:16px; box-shadow:0 5px 22px #13151a04; }
.student-card-heading { padding-bottom:22px; margin-bottom:24px; border-bottom:1px solid var(--line); }
.student-card-heading h2 { font-size:19px; letter-spacing:-.5px; line-height:1.5; margin:0 0 5px; }
.student-card-heading p { color:var(--ink-soft); font-size:13px; margin:0; }
.student-page .field label { font-family:var(--sans); font-size:13px; letter-spacing:0; color:var(--ink); }
.student-page .field input,.student-page .field select { min-height:48px; border:1px solid var(--line); background:#f8f9fb; font-size:15px; border-radius:9px; }
.student-page .field input:focus,.student-page .field select:focus { background:#fff; border-color:var(--jumuk,#4260f5); box-shadow:0 0 0 3px #4260f51a; }
.student-page .field select { max-width:100%; text-overflow:ellipsis; }
.student-page .hint { font-size:12px; line-height:1.65; color:var(--ink-soft); }
.student-page .tabs { border:0; background:#f0f2f6; border-radius:9px; padding:4px; gap:4px; width:100%; }
.student-page .tabs .tab { flex:1; min-height:42px; border:0; border-radius:6px; padding:9px 12px; font-size:13px; }
.student-page .tabs .tab + .tab { border:0; }
.student-page .tabs .tab.on { color:var(--jumuk,#4260f5); background:#fff; box-shadow:0 1px 5px #13151a0a; }
.student-page #omrWrap { padding-top:24px; border-top:1px solid var(--line); scroll-margin-top:100px; }
.student-answer-heading { display:flex; justify-content:space-between; gap:16px; align-items:flex-end; }
.student-selection { color:var(--ink-soft); font-size:12px; line-height:1.7; margin:0 0 7px; word-break:keep-all; }
.student-answer-heading h2 { font-size:20px; margin:0; letter-spacing:-.5px; }
#studentAnswerCount { color:var(--jumuk,#4260f5); font-size:12px; font-weight:700; white-space:nowrap; font-variant-numeric:tabular-nums; }
.student-progress { height:4px; background:#edf0f6; border-radius:10px; margin:16px 0 16px; overflow:hidden; }
.student-progress span { height:100%; width:0; display:block; background:var(--jumuk,#4260f5); transition:width .2s ease; }
.student-answer-help { margin:0 0 12px; color:var(--ink-soft); font-size:12px; line-height:1.7; word-break:keep-all; }
.student-page .omr { gap:0; }
.student-page .omr-row { grid-template-columns:52px minmax(0,1fr); gap:20px; padding:17px 0; border-bottom:1px solid #eef0f4; }
.student-page .omr-row .qno { font-family:var(--sans); color:#626a7b; font-size:14px; font-weight:650; font-variant-numeric:tabular-nums; }
.student-page .bubbles { gap:12px; min-width:0; }
.student-page .bubble { width:46px; height:46px; border-radius:9px; border:1px solid #e2e5ed; background:#fff; font-family:var(--sans); color:#4b5264; font-size:16px; font-weight:650; flex:0 1 46px; min-width:0; }
.student-page .bubble:hover { border-color:var(--jumuk,#4260f5); background:#f5f6ff; }
.student-page .bubble.on { color:#fff; background:var(--jumuk,#4260f5); border-color:var(--jumuk,#4260f5); transform:none; box-shadow:0 3px 8px #4260f522; }
.student-page .omr-row.is-missing { background:#fff6f5; border-radius:8px; }
.student-page .omr-row.is-missing .qno { color:#bc3c38; }
.student-page #submitBtn { min-height:52px; margin-top:8px; font-size:15px; }
.student-page .part-row input { min-height:42px; padding:7px 2px; }
.student-page .result { background:#f8f9fd; border:1px solid #dbe1fa; padding:26px; border-radius:12px; scroll-margin-top:100px; }
.student-result-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 0 15px; }
.student-result-label { margin:0; color:var(--jumuk,#4260f5); font-size:12px; font-weight:750; letter-spacing:.04em; }
.student-result-count { padding:4px 9px; border-radius:6px; color:#bc3c38; background:#ffebe9; font-size:12px; font-weight:700; }
.student-result-count.is-perfect { color:#237955; background:#e9f5ee; }
.student-page .result .score-big,.student-page .result #scoreLabel { font-family:var(--sans); font-size:52px; font-weight:750; letter-spacing:-2px; line-height:1.2; color:var(--ink); }
.student-page .result #scoreLabel > span { font-size:23px; font-weight:450; letter-spacing:-.5px; color:#767e8f; }
.student-page .result .wrong-list { font-size:15px; line-height:1.8; }
.student-page .result .wrong-list b { color:#bc3c38; }
.student-page .result .wrong-list .perfect-msg { color:#237955; }
.student-page .keep-box,.student-page .ask-box { background:#fff; border-radius:11px; padding:20px; }
.student-page .keep-box h4,.student-page .ask-box h4,.student-page .fb h4,.student-page .note-card .no,.student-page .ex-card .ex-h { font-family:var(--sans); }
.student-page .keep-chip { border-radius:7px; background:#fff; padding:9px 13px; }
.student-page .keep-chip.on { background:var(--jumuk,#4260f5); }
.student-page .keep-chip.done { background:#f0f8f4; }
.student-page .keep-form textarea,.student-page .ask-box textarea,.student-page .nb-note { background:#f8f9fb; border:1px solid var(--line); border-radius:8px; }
.student-page .msg.err { color:#bc3c38; background:#fff2f1; border-radius:8px; padding:12px 14px; }
.student-page .tool-stack { gap:12px; }
.student-page .tool-stack .faq-item { background:#fff; border-radius:12px; }
.student-page .faq-item summary,.student-page .tool-link { font-size:14px; padding:19px 22px; }
.student-page .faq-body { padding:0 22px 20px; }
.student-page .fb p,.student-page .fb li,.student-page .fb-tip p { line-height:1.9; }
.student-page .note-card,.student-page .ex-card { background:#f8f9fc; border-radius:9px; border-left-width:3px; }
.student-page #habitWrap { margin-top:28px; }
.student-page #habitWrap .habit-core { padding:4px 0 4px 18px; }
.student-page .song-card { background:linear-gradient(135deg,#161d36,#253272); }
.student-page .song-label,.student-page .song-note { color:#9baaff; }
.student-page .song-card::before { background:radial-gradient(circle at 85% 12%,#6680ff33,transparent 55%); }
.student-page footer { background:#fff; font-size:12px; }
.student-page .nb-gate { max-width:100%; background:#fff; padding:30px; border-radius:16px; }
.student-page #nbGuideBox { background:#fff; margin-bottom:22px; }
.student-page .nb-count { margin-bottom:16px; font-size:13px; }
.student-note-filters { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 22px; }
.student-note-filters button { font-family:var(--sans); font-size:13px; font-weight:650; border:1px solid var(--line); color:var(--ink-soft); background:#fff; border-radius:9px; padding:11px 14px; cursor:pointer; }
.student-note-filters button span { margin-left:7px; font-size:12px; font-variant-numeric:tabular-nums; }
.student-note-filters button[aria-pressed="true"] { border-color:var(--jumuk,#4260f5); color:var(--jumuk,#4260f5); background:#eef1ff; }
.student-page .nb-sec { font-family:var(--sans); font-size:15px; border:0; margin:0 0 12px; }
.student-page .nb-item { padding:24px; border:1px solid var(--line); background:#fff; border-radius:14px; margin-bottom:14px; }
.student-page .nb-item.resolved { opacity:1; border-style:solid; }
.student-page .nb-head { gap:12px; align-items:center; margin-bottom:10px; }
.student-page .nb-no { display:inline-flex; align-items:center; justify-content:center; padding:8px 12px; border-radius:8px; background:#eef1ff; color:var(--jumuk,#4260f5); font-family:var(--sans); font-weight:750; font-size:18px; }
.student-page .nb-item.resolved .nb-no { background:#eff8f3; color:#237955; }
.student-page .nb-src { flex:1; min-width:0; font-size:14px; font-weight:650; line-height:1.6; color:var(--ink); }
.student-page .nb-ans { font-size:13px; margin-bottom:16px; }
.student-page .nb-note { padding:13px; min-height:80px; }
.student-page .nb-acts { gap:8px; margin-top:12px; }
.student-page .nb-acts .btn { min-height:38px; border-radius:7px; }
.student-page .nb-acts .act-toggle { background:#eef1ff; color:var(--jumuk,#4260f5); border-color:#e0e5ff; }
.student-page .nb-acts .act-del { color:#777e8c; }
.student-page .nb-empty { background:#fff; border:1px solid var(--line); border-radius:14px; padding:40px 22px; line-height:1.8; }
@media (max-width:640px) {
  .student-page .topbar .wrap { min-height:68px; padding:0 20px; gap:14px; }
  .student-page .student-wordmark { font-size:24px; }
  .student-wordmark small { display:none; }
  .student-page .nav { gap:17px; font-size:12px; }
  .student-page .nav a { padding:23px 0; }
  .student-main { padding:30px 0 54px; }
  .student-page .student-shell { padding:0 20px; }
  .student-heading { margin-bottom:26px; gap:12px; }
  .student-page .hw-title { font-size:31px; }
  .student-intro { font-size:13px; }
  .student-shortcut { font-size:12px; }
  .student-shortcut span { margin-left:3px; }
  .student-steps { gap:10px; margin-bottom:20px; }
  .student-steps li { font-size:11px; padding-bottom:10px; }
  .student-steps li span { margin-right:4px; }
  .student-page .student-work-card,.student-page .nb-gate { padding:22px 18px; border-radius:13px; }
  .student-card-heading { padding-bottom:18px; margin-bottom:22px; }
  .student-card-heading h2 { font-size:17px; }
  .student-page .omr-row { grid-template-columns:35px minmax(0,1fr); gap:8px; padding:15px 0; }
  .student-page .bubbles { gap:6px; }
  .student-page .bubble { width:0; flex:1 1 0; max-width:46px; height:43px; border-radius:8px; font-size:15px; }
  .student-page .omr-row .qno { font-size:12px; }
  .student-answer-heading { gap:10px; }
  .student-answer-heading h2 { font-size:18px; }
  #studentAnswerCount { font-size:11px; }
  .student-page .result { margin-left:-5px; margin-right:-5px; padding:20px 16px; }
  .student-page .result #scoreLabel { font-size:46px; }
  .student-page .keep-box,.student-page .ask-box { padding:15px 13px; }
  .student-page .faq-item summary,.student-page .tool-link { padding:17px 18px; font-size:13px; }
  .student-page .faq-body { padding:0 18px 18px; }
  .student-page .nb-item { padding:19px 17px; }
  .student-note-filters { gap:7px; }
  .student-note-filters button { font-size:12px; padding:10px 11px; }
  .student-page .nb-acts .grow { display:none; }
  .student-page .nb-acts .act-msg { flex-basis:100%; }
}
@media (max-width:360px) {
  .student-page .topbar .wrap,.student-page .student-shell { padding-left:16px; padding-right:16px; }
  .student-page .nav { gap:14px; }
  .student-heading { align-items:flex-start; }
  .student-shortcut { margin-top:31px; }
  .student-page .student-work-card,.student-page .nb-gate { padding:20px 15px; }
  .student-page .bubbles { gap:5px; }
}

.student-page .footer-wordmark { font-size:20px;font-weight:800;letter-spacing:-.8px; }
@media(max-width:380px) {
  .student-page .student-wordmark { font-size:22px;letter-spacing:-1.2px; }
  .student-page .nav { gap:13px; }
}