﻿  :root{--bg:#f0f2ff;--paper:#ffffff;--ink:#1e1b4b;--ink-light:#4338ca;--ink-muted:#6b7280;--rule:#e0e7ff;--accent:#7c3aed;--accent2:#4f46e5;--accent3:#059669;--gold:#d97706;--correct:#059669;--wrong:#dc2626;--shadow:rgba(79,70,229,0.12);}
  *{margin:0;padding:0;box-sizing:border-box;}
  html,body{overflow-x:hidden;}
  body{font-family:'Source Sans 3',sans-serif;background:var(--bg);color:var(--ink);min-height:100vh;font-size:16px;line-height:1.6;}
  .page-wrap{max-width:900px;margin:0 auto;padding:0 24px 60px;overflow-x:hidden;}

  .site-header{background:linear-gradient(135deg,#4f46e5 0%,#7c3aed 60%,#0891b2 100%);border-radius:16px;padding:28px 32px 24px;margin-bottom:32px;display:flex;align-items:flex-end;justify-content:space-between;gap:20px;box-shadow:0 8px 32px rgba(79,70,229,0.3);}
  .province-tag{font-size:0.7rem;font-weight:700;letter-spacing:0.2em;text-transform:uppercase;color:rgba(255,255,255,0.75);margin-bottom:6px;}
  .site-title{font-family:'Playfair Display',serif;font-size:2rem;font-weight:700;color:#ffffff;line-height:1.1;}
  .site-subtitle{font-size:0.85rem;color:rgba(255,255,255,0.7);margin-top:4px;font-weight:300;}
  .header-crest{width:56px;height:56px;border:2px solid rgba(255,255,255,0.3);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.6rem;flex-shrink:0;background:rgba(255,255,255,0.15);backdrop-filter:blur(8px);}

  .setup-panel{background:var(--paper);border:1px solid var(--rule);border-radius:16px;padding:36px;box-shadow:0 4px 24px var(--shadow);}
  .panel-heading{font-family:'Playfair Display',serif;font-size:1.3rem;font-weight:600;color:var(--ink);margin-bottom:6px;}
  .panel-subhead{font-size:0.85rem;color:var(--ink-muted);margin-bottom:28px;font-weight:300;}
  .section-label{font-size:0.72rem;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;color:var(--accent2);margin-bottom:14px;padding-bottom:8px;border-bottom:2px solid var(--rule);}
  .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:20px;}
  .form-field{display:flex;flex-direction:column;gap:6px;}
  .form-field.span2{grid-column:1/-1;}
  .field-label{font-size:0.78rem;font-weight:600;letter-spacing:0.06em;text-transform:uppercase;color:var(--ink-muted);}
  .field-label span{font-weight:400;text-transform:none;letter-spacing:0;color:var(--ink-muted);font-size:0.75rem;}
  input[type="text"],input[type="password"],select{background:var(--bg);border:2px solid var(--rule);border-radius:10px;padding:11px 14px;color:var(--ink);font-family:'Source Sans 3',sans-serif;font-size:0.95rem;outline:none;transition:border-color 0.15s,box-shadow 0.15s;width:100%;}
  input:focus,select:focus{border-color:var(--accent2);box-shadow:0 0 0 4px rgba(79,70,229,0.12);background:var(--paper);}
  .api-row{display:flex;gap:8px;}
  .api-row input{font-family:'Source Code Pro',monospace;font-size:0.82rem;}
  .btn-eye{background:var(--bg);border:2px solid var(--rule);border-radius:10px;padding:0 12px;cursor:pointer;color:var(--ink-muted);font-size:0.9rem;transition:all 0.15s;}
  .btn-eye:hover{border-color:var(--accent2);color:var(--accent2);}
  hr.divider{border:none;border-top:2px solid var(--rule);margin:24px 0;}

  .units-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:24px;}
  .unit-chip{display:flex;align-items:center;gap:8px;background:var(--bg);border:2px solid var(--rule);border-radius:10px;padding:9px 12px;cursor:pointer;transition:all 0.15s;font-size:0.85rem;user-select:none;}
  .unit-chip:hover{border-color:var(--accent2);background:rgba(79,70,229,0.04);}
  .unit-chip input[type="checkbox"]{accent-color:var(--accent2);width:14px;height:14px;flex-shrink:0;cursor:pointer;}
  .unit-chip.checked{border-color:var(--accent2);background:rgba(79,70,229,0.08);color:var(--accent2);font-weight:600;}

  .btn-start{width:100%;padding:15px 24px;background:linear-gradient(135deg,#4f46e5,#7c3aed);border:none;border-radius:12px;color:white;font-family:'Source Sans 3',sans-serif;font-size:1rem;font-weight:700;letter-spacing:0.03em;cursor:pointer;transition:all 0.2s;margin-top:8px;box-shadow:0 4px 16px rgba(79,70,229,0.4);}
  .btn-start:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(79,70,229,0.5);}
  .btn-start:disabled{background:linear-gradient(135deg,#9ca3af,#6b7280);cursor:not-allowed;transform:none;box-shadow:none;}
  .error-box{background:#fef2f2;border:1px solid #fecaca;border-left:4px solid var(--wrong);border-radius:10px;padding:12px 16px;font-size:0.88rem;color:var(--wrong);margin-top:16px;display:none;}
  .error-box.show{display:block;}

  .loading-screen{display:none;text-align:center;padding:80px 0;}
  .loading-screen.show{display:block;animation:fadeIn 0.3s ease;}
  .loading-spinner{width:44px;height:44px;border:4px solid var(--rule);border-top-color:var(--accent2);border-radius:50%;animation:spin 0.9s linear infinite;margin:0 auto 24px;}
  .loading-title{font-family:'Playfair Display',serif;font-size:1.3rem;color:var(--ink);margin-bottom:8px;}
  .loading-sub{font-size:0.88rem;color:var(--ink-muted);font-weight:300;}

  .exam-booklet{display:none;}
  .exam-booklet.show{display:block;animation:fadeIn 0.4s ease;}
  .exam-top-bar{background:linear-gradient(135deg,#4f46e5,#7c3aed);color:white;padding:18px 28px;border-radius:16px 16px 0 0;display:flex;align-items:center;justify-content:space-between;font-size:0.82rem;font-weight:700;letter-spacing:0.05em;text-transform:uppercase;box-shadow:0 4px 16px rgba(79,70,229,0.3);}
  .exam-body{background:var(--paper);border:1px solid var(--rule);border-top:none;border-radius:0 0 16px 16px;box-shadow:0 4px 24px var(--shadow);}
  .exam-progress{padding:0 28px;border-bottom:1px solid var(--rule);}
  .progress-track{height:6px;background:var(--rule);border-radius:4px;overflow:hidden;margin:14px 0;}
  .progress-fill{height:100%;background:linear-gradient(90deg,#4f46e5,#7c3aed);border-radius:4px;transition:width 0.5s ease;}
  .question-wrap{padding:32px 28px;animation:slideIn 0.35s ease;}

  .q-type-badge{display:inline-flex;align-items:center;gap:6px;font-size:0.72rem;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;padding:5px 12px;border-radius:20px;margin-bottom:14px;}
  .q-type-badge.mc{background:rgba(79,70,229,0.1);color:var(--accent2);border:1px solid rgba(79,70,229,0.25);}
  .q-type-badge.nr{background:rgba(217,119,6,0.1);color:var(--gold);border:1px solid rgba(217,119,6,0.25);}
  .q-type-badge.sc{background:rgba(5,150,105,0.1);color:var(--accent3);border:1px solid rgba(5,150,105,0.25);}
  .q-unit-tag{font-size:0.75rem;color:var(--ink-muted);margin-bottom:12px;font-weight:500;}
  .q-header-row{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:20px;}
  .q-number-big{font-family:'Playfair Display',serif;font-size:0.85rem;color:var(--ink-muted);white-space:nowrap;padding-top:2px;}
  .q-stem{font-size:1.05rem;color:var(--ink);line-height:1.6;flex:1;}

  .source-box{background:linear-gradient(135deg,rgba(217,119,6,0.05),rgba(245,158,11,0.08));border:1px solid rgba(217,119,6,0.2);border-left:4px solid var(--gold);border-radius:12px;padding:18px 20px;margin-bottom:20px;}
  .source-label{font-size:0.7rem;font-weight:700;letter-spacing:0.15em;text-transform:uppercase;color:var(--gold);margin-bottom:10px;}
  .source-content{color:var(--ink);line-height:1.7;font-size:0.92rem;}
  .source-content.code{font-family:'Source Code Pro',monospace;font-size:0.85rem;background:white;padding:12px;border-radius:8px;margin-top:8px;white-space:pre-wrap;}

  .mc-options{display:flex;flex-direction:column;gap:10px;}
  .mc-option{display:flex;align-items:flex-start;background:var(--paper);border:2px solid var(--rule);border-radius:12px;cursor:pointer;transition:all 0.15s;text-align:left;color:var(--ink);font-family:'Source Sans 3',sans-serif;font-size:0.95rem;width:100%;overflow:hidden;}
  .mc-option:hover:not(:disabled){border-color:var(--accent2);background:rgba(79,70,229,0.04);transform:translateY(-1px);box-shadow:0 4px 12px rgba(79,70,229,0.1);}
  .opt-letter{padding:12px 14px;background:var(--bg);border-right:2px solid var(--rule);font-family:'Playfair Display',serif;font-weight:700;font-size:0.9rem;color:var(--ink-muted);min-width:48px;text-align:center;flex-shrink:0;transition:all 0.15s;}
  .opt-text{padding:12px 16px;line-height:1.5;flex:1;}
  .mc-option.correct{border-color:var(--correct);background:rgba(5,150,105,0.06);}
  .mc-option.correct .opt-letter{background:var(--correct);color:white;border-color:var(--correct);}
  .mc-option.wrong{border-color:var(--wrong);background:rgba(220,38,38,0.06);}
  .mc-option.wrong .opt-letter{background:var(--wrong);color:white;border-color:var(--wrong);}
  .mc-option:disabled{cursor:default;}
  .mc-option.selected{border-color:var(--accent2);background:rgba(79,70,229,0.08);color:var(--ink);}
  .mc-option.selected .opt-letter{background:var(--accent2);color:white;border-color:var(--accent2);}

  .nr-input-area{display:flex;flex-direction:column;gap:14px;}
  .nr-hint{font-size:0.82rem;color:var(--ink-muted);font-style:italic;}
  .nr-boxes{display:flex;gap:4px;align-items:center;}
  .nr-box{width:52px;height:56px;border:2px solid var(--rule);border-radius:10px;text-align:center;font-family:'Source Code Pro',monospace;font-size:1.4rem;font-weight:500;color:var(--ink);background:var(--paper);outline:none;transition:border-color 0.15s,box-shadow 0.15s;}
  .nr-box:focus{border-color:var(--accent2);box-shadow:0 0 0 4px rgba(79,70,229,0.12);}
  .nr-decimal{font-size:1.6rem;color:var(--ink-muted);font-weight:700;padding:0 2px;}
  .nr-labeled-box{display:flex;flex-direction:column;align-items:center;gap:4px;}
  .nr-box-label{font-size:0.85rem;font-weight:700;color:var(--accent2);font-family:'Source Code Pro',monospace;letter-spacing:0.05em;}
  .nr-matching-grid{display:flex;flex-direction:row;gap:20px;flex-wrap:wrap;}
  .nr-matching-col{display:flex;flex-direction:column;align-items:center;gap:6px;min-width:80px;max-width:140px;}
  .nr-matching-col .nr-box-label{font-size:1rem;font-weight:700;color:var(--accent2);font-family:'Source Code Pro',monospace;}
  .nr-matching-desc{font-size:0.82rem;color:var(--ink);line-height:1.4;text-align:center;}
  .nr-submit{align-self:flex-start;padding:10px 24px;background:linear-gradient(135deg,#d97706,#f59e0b);border:none;border-radius:10px;color:white;font-family:'Source Sans 3',sans-serif;font-size:0.9rem;font-weight:700;cursor:pointer;transition:all 0.15s;box-shadow:0 3px 10px rgba(217,119,6,0.35);}
  .nr-submit:hover{transform:translateY(-1px);box-shadow:0 5px 16px rgba(217,119,6,0.45);}
  .nr-submit:disabled{background:linear-gradient(135deg,#9ca3af,#6b7280);cursor:default;box-shadow:none;}
  .nr-feedback{font-size:0.9rem;font-weight:600;display:none;padding:10px 14px;border-radius:10px;}
  .nr-feedback.show{display:block;}
  .nr-feedback.correct{background:rgba(5,150,105,0.1);color:var(--correct);border:1px solid rgba(5,150,105,0.25);}
  .nr-feedback.wrong{background:rgba(220,38,38,0.1);color:var(--wrong);border:1px solid rgba(220,38,38,0.25);}

  .explanation-box{margin-top:18px;padding:16px 20px;background:linear-gradient(135deg,rgba(79,70,229,0.05),rgba(124,58,237,0.05));border:1px solid rgba(79,70,229,0.2);border-left:4px solid var(--accent2);border-radius:12px;font-size:0.92rem;color:var(--ink);line-height:1.75;display:none;}
  .explanation-box.show{display:block;animation:fadeIn 0.3s ease;}
  .explanation-box strong{color:var(--accent2);}

  .btn-next{margin-top:24px;padding:12px 32px;background:linear-gradient(135deg,#4f46e5,#7c3aed);border:none;border-radius:10px;color:white;font-family:'Source Sans 3',sans-serif;font-size:0.9rem;font-weight:700;cursor:pointer;transition:all 0.15s;display:none;float:right;box-shadow:0 3px 12px rgba(79,70,229,0.35);}
  .btn-next.show{display:inline-block;animation:fadeIn 0.3s ease;}
  .btn-next:hover{transform:translateY(-1px);box-shadow:0 5px 18px rgba(79,70,229,0.45);}
  .exam-nav{display:flex;align-items:center;justify-content:space-between;margin-top:28px;padding-top:16px;border-top:2px solid var(--rule);gap:12px;}
  .btn-nav{padding:10px 22px;border-radius:10px;border:2px solid var(--rule);background:var(--bg);color:var(--ink);font-family:'Source Sans 3',sans-serif;font-size:0.9rem;font-weight:600;cursor:pointer;transition:all 0.15s;}
  .btn-nav:hover:not(:disabled){border-color:var(--accent2);color:var(--accent2);background:rgba(79,70,229,0.04);}
  .btn-nav:disabled{opacity:0.35;cursor:default;}
  .btn-submit-exam{padding:10px 28px;border-radius:10px;border:none;background:linear-gradient(135deg,#059669,#10b981);color:white;font-family:'Source Sans 3',sans-serif;font-size:0.95rem;font-weight:700;cursor:pointer;transition:all 0.15s;box-shadow:0 3px 12px rgba(5,150,105,0.35);}
  .btn-submit-exam:hover{transform:translateY(-1px);box-shadow:0 5px 18px rgba(5,150,105,0.45);}
  .q-dots{display:flex;gap:5px;flex-wrap:wrap;justify-content:center;flex:1;}
  .q-dot{width:11px;height:11px;border-radius:50%;background:var(--rule);cursor:pointer;transition:all 0.15s;border:2px solid transparent;}
  .q-dot.answered{background:var(--accent2);}
  .q-dot.current{border-color:var(--ink);}
  .review-screen{display:none;animation:fadeIn 0.4s ease;}
  .review-screen.show{display:block;}
  .review-booklet{max-width:760px;margin:0 auto;padding:36px 0;}
  .review-q-block{margin-bottom:24px;padding:24px;background:var(--paper);border:1px solid var(--rule);border-radius:14px;border-left:5px solid var(--rule);box-shadow:0 2px 12px var(--shadow);}
  .review-q-block.correct{border-left-color:var(--correct);}
  .review-q-block.wrong{border-left-color:var(--wrong);}
  .review-q-result{font-size:0.8rem;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;margin-bottom:10px;}
  .review-q-result.correct{color:var(--correct);}
  .review-q-result.wrong{color:var(--wrong);}
  .review-option{display:flex;align-items:flex-start;gap:10px;padding:8px 12px;border-radius:10px;margin-top:6px;font-size:0.9rem;border:1px solid transparent;}
  .review-option.correct-ans{background:rgba(5,150,105,0.08);border-color:var(--correct);}
  .review-option.user-wrong{background:rgba(220,38,38,0.08);border-color:var(--wrong);}
  .review-explanation{margin-top:14px;padding:12px 16px;background:rgba(79,70,229,0.05);border-left:4px solid var(--accent2);border-radius:10px;font-size:0.88rem;line-height:1.75;color:var(--ink);}
  .review-score-summary{background:linear-gradient(135deg,#4f46e5,#7c3aed);border-radius:16px;padding:32px;text-align:center;margin-bottom:32px;color:white;box-shadow:0 8px 32px rgba(79,70,229,0.35);}
  .nr-save-hint{font-size:0.8rem;color:var(--ink-muted);margin-top:6px;}
  .clearfix::after{content:'';display:table;clear:both;}

  .results-screen{display:none;}
  .results-screen.show{display:block;animation:fadeIn 0.5s ease;}
  .results-booklet{background:var(--paper);border:1px solid var(--rule);border-radius:20px;overflow:hidden;box-shadow:0 8px 32px var(--shadow);}
  .results-header{padding:36px 36px 28px;border-bottom:1px solid var(--rule);text-align:center;background:linear-gradient(135deg,rgba(79,70,229,0.04),rgba(124,58,237,0.04));}
  .results-seal{width:80px;height:80px;background:linear-gradient(135deg,#4f46e5,#7c3aed);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:2rem;margin:0 auto 20px;box-shadow:0 6px 20px rgba(79,70,229,0.4);}
  .results-title{font-family:'Playfair Display',serif;font-size:1.8rem;font-weight:700;color:var(--ink);margin-bottom:6px;}
  .results-sub{font-size:0.9rem;color:var(--ink-muted);font-weight:300;}
  .results-score-row{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--rule);}
  .score-cell{padding:24px;text-align:center;border-right:1px solid var(--rule);}
  .score-cell:last-child{border-right:none;}
  .score-val{font-family:'Playfair Display',serif;font-size:2rem;font-weight:700;line-height:1;margin-bottom:6px;background:linear-gradient(135deg,#4f46e5,#7c3aed);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
  .score-key{font-size:0.72rem;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;color:var(--ink-muted);}
  .diploma-band{padding:20px 36px;background:rgba(79,70,229,0.03);border-bottom:1px solid var(--rule);display:flex;align-items:center;gap:16px;}
  .band-label{font-size:0.78rem;font-weight:600;letter-spacing:0.08em;text-transform:uppercase;color:var(--ink-muted);white-space:nowrap;}
  .band-bar{flex:1;height:10px;background:var(--rule);border-radius:5px;overflow:hidden;}
  .band-fill{height:100%;border-radius:5px;transition:width 1s ease;background:linear-gradient(90deg,#4f46e5,#7c3aed);}
  .band-pct{font-family:'Playfair Display',serif;font-size:1.1rem;font-weight:700;white-space:nowrap;color:var(--accent2);}
  .results-actions{padding:24px 36px;display:flex;gap:12px;justify-content:center;}
  .btn-action{padding:12px 28px;border-radius:12px;font-family:'Source Sans 3',sans-serif;font-size:0.9rem;font-weight:700;cursor:pointer;transition:all 0.15s;}
  .btn-action.primary{background:linear-gradient(135deg,#4f46e5,#7c3aed);border:none;color:white;box-shadow:0 4px 14px rgba(79,70,229,0.4);}
  .btn-action.primary:hover{transform:translateY(-1px);box-shadow:0 6px 20px rgba(79,70,229,0.5);}
  .btn-action.secondary{background:transparent;border:2px solid var(--rule);color:var(--ink-muted);}
  .btn-action.secondary:hover{border-color:var(--accent2);color:var(--accent2);}

  .site-footer{margin-top:40px;text-align:center;font-size:0.75rem;color:var(--ink-muted);border-top:2px solid var(--rule);padding-top:20px;font-weight:300;}

  /* KaTeX math rendering — keep equations on one line */
  .katex { font-size: 1em !important; white-space: nowrap; }
  .katex-display { margin: 0.4em 0; overflow-x: auto; }
  /* Allow text to wrap but keep each math expression intact */
  .q-stem, .opt-text, .source-content, .explanation-box {
    word-wrap: break-word;
    overflow-wrap: break-word;
  }
  .q-stem .katex, .opt-text .katex, .source-content .katex,
  .explanation-box .katex, .nr-hint .katex {
    white-space: nowrap;
    display: inline-block;
  }

  .q-graph{background:white;border:1px solid var(--rule);border-radius:4px;padding:12px;margin-bottom:18px;display:flex;justify-content:center;align-items:center;}
  .q-graph svg{max-width:100%;height:auto;display:block;}
  @keyframes fadeIn{from{opacity:0}to{opacity:1}}
  @keyframes slideIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
  @keyframes spin{to{transform:rotate(360deg)}}

  .subject-toggle{display:flex;gap:8px;margin-bottom:28px;background:var(--rule);border-radius:14px;padding:4px;}
  .subj-btn{flex:1;padding:11px;border:none;border-radius:11px;background:transparent;color:var(--ink-muted);font-family:'Source Sans 3',sans-serif;font-size:0.92rem;font-weight:600;cursor:pointer;transition:all 0.2s;}
  .subj-btn:hover{color:var(--ink);}
  .subj-btn.active{background:var(--paper);color:var(--accent2);box-shadow:0 2px 8px rgba(79,70,229,0.15);font-weight:700;}
  .grade-toggle{display:flex;gap:8px;margin-bottom:16px;background:var(--rule);border-radius:12px;padding:4px;}
  .grade-btn{flex:1;padding:9px;border:none;border-radius:9px;background:transparent;color:var(--ink-muted);font-family:'Source Sans 3',sans-serif;font-size:0.82rem;font-weight:700;cursor:pointer;transition:all 0.2s;letter-spacing:0.05em;text-transform:uppercase;}
  .grade-btn:hover{color:var(--ink);}
  .grade-btn.active{background:var(--paper);color:var(--accent3);box-shadow:0 2px 8px rgba(5,150,105,0.15);}

  .source-toggle-btn{display:inline-flex;align-items:center;gap:6px;font-size:0.72rem;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--gold);cursor:pointer;padding:4px 0;border:none;background:none;margin-bottom:4px;}
  .source-toggle-btn:hover{color:var(--ink);}
  .source-box.collapsed .source-content{display:none;}
  .source-box.collapsed{border-left-color:var(--rule);background:var(--bg);}
  .passage-label{font-size:0.7rem;font-weight:700;letter-spacing:0.15em;text-transform:uppercase;color:var(--ink-muted);margin-bottom:6px;}
  .q-type-badge.eng{background:rgba(5,150,105,0.1);color:var(--accent3);border:1px solid rgba(5,150,105,0.25);}

  .auth-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;background:linear-gradient(135deg,#4f46e5 0%,#7c3aed 50%,#0891b2 100%);}
  .auth-card{background:var(--paper);border:none;border-radius:20px;padding:40px;box-shadow:0 20px 60px rgba(0,0,0,0.25);width:100%;max-width:420px;}
  .auth-logo{font-family:'Playfair Display',serif;font-size:1.4rem;font-weight:700;color:var(--ink);margin-bottom:4px;}
  .auth-sub{font-size:0.82rem;color:var(--ink-muted);margin-bottom:28px;}
  .auth-tabs{display:flex;background:var(--bg);border-radius:12px;padding:4px;margin-bottom:24px;}
  .auth-tab{flex:1;padding:9px;background:none;border:none;border-radius:9px;font-family:'Source Sans 3',sans-serif;font-size:0.9rem;font-weight:600;color:var(--ink-muted);cursor:pointer;transition:all 0.2s;}
  .auth-tab.active{background:var(--paper);color:var(--accent2);box-shadow:0 2px 8px rgba(79,70,229,0.15);font-weight:700;}
  .auth-field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px;}
  .auth-field label{font-size:0.78rem;font-weight:600;letter-spacing:0.06em;text-transform:uppercase;color:var(--ink-muted);}
  .auth-field input,.auth-field select{background:var(--bg);border:2px solid var(--rule);border-radius:10px;padding:11px 14px;color:var(--ink);font-family:'Source Sans 3',sans-serif;font-size:0.95rem;outline:none;transition:border-color 0.15s,box-shadow 0.15s;}
  .auth-field input:focus,.auth-field select:focus{border-color:var(--accent2);box-shadow:0 0 0 4px rgba(79,70,229,0.12);}
  .btn-auth{width:100%;padding:14px;background:linear-gradient(135deg,#4f46e5,#7c3aed);border:none;border-radius:12px;color:white;font-family:'Source Sans 3',sans-serif;font-size:1rem;font-weight:700;cursor:pointer;margin-top:8px;transition:all 0.2s;box-shadow:0 4px 16px rgba(79,70,229,0.4);}
  .btn-auth:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(79,70,229,0.5);}
  .auth-error{font-size:0.85rem;color:var(--wrong);margin-top:10px;display:none;}
  .auth-error.show{display:block;}
  .user-bar{display:flex;align-items:center;justify-content:space-between;background:var(--paper);border:1px solid var(--rule);border-radius:14px;padding:10px 16px;margin-bottom:20px;font-size:0.82rem;box-shadow:0 2px 10px var(--shadow);}
  .user-bar-info{display:flex;align-items:center;gap:10px;color:var(--ink-muted);}
  .user-plan-badge{font-size:0.7rem;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;padding:4px 10px;border-radius:20px;background:rgba(79,70,229,0.1);color:var(--accent2);border:1px solid rgba(79,70,229,0.2);}
  .user-plan-badge.free{background:rgba(107,114,128,0.08);color:var(--ink-muted);border-color:var(--rule);}
  .btn-signout{background:none;border:1px solid var(--rule);border-radius:8px;padding:5px 12px;font-size:0.78rem;color:var(--ink-muted);cursor:pointer;font-family:'Source Sans 3',sans-serif;transition:all 0.15s;}
  .btn-signout:hover{border-color:var(--wrong);color:var(--wrong);}
  .rate-limit-bar{font-size:0.78rem;color:var(--ink-muted);margin-bottom:16px;}
  .rate-limit-bar span{font-weight:600;color:var(--accent2);}
  .btn-teacher{background:linear-gradient(135deg,#059669,#10b981);border:none;border-radius:10px;padding:8px 18px;font-size:0.88rem;color:white;cursor:pointer;font-family:'Source Sans 3',sans-serif;font-weight:700;transition:all 0.15s;display:none;letter-spacing:0.02em;box-shadow:0 3px 10px rgba(5,150,105,0.35);}
  .btn-teacher:hover{transform:translateY(-1px);box-shadow:0 5px 16px rgba(5,150,105,0.45);}
  .btn-teacher.active{box-shadow:inset 0 2px 4px rgba(0,0,0,0.15);}
  .teacher-panel{background:var(--paper);border:1px solid var(--rule);border-radius:16px;padding:36px;box-shadow:0 4px 24px var(--shadow);margin-bottom:24px;}
  .teacher-panel .panel-heading{font-family:'Playfair Display',serif;font-size:1.3rem;font-weight:600;color:var(--ink);margin-bottom:6px;}
  .teacher-panel .panel-subhead{font-size:0.85rem;color:var(--ink-muted);margin-bottom:28px;}
  .unit-spec-grid{display:grid;grid-template-columns:1fr auto auto;gap:0;border:2px solid var(--rule);border-radius:12px;overflow:hidden;margin-bottom:20px;}
  .unit-spec-header{background:var(--bg);padding:8px 14px;font-size:0.72rem;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--ink-muted);border-bottom:2px solid var(--rule);}
  .unit-spec-header.center{text-align:center;}
  .unit-spec-row{display:contents;}
  .unit-spec-row:not(:last-child) .unit-spec-cell{border-bottom:1px solid var(--rule);}
  .unit-spec-cell{padding:10px 14px;font-size:0.88rem;color:var(--ink);display:flex;align-items:center;}
  .unit-spec-cell.center{justify-content:center;}
  .unit-spec-input{width:52px;text-align:center;border:2px solid var(--rule);border-radius:8px;padding:5px;font-family:'Source Code Pro',monospace;font-size:0.9rem;color:var(--ink);background:var(--bg);outline:none;}
  .unit-spec-input:focus{border-color:var(--accent3);box-shadow:0 0 0 3px rgba(5,150,105,0.12);}
  .test-totals{font-size:0.85rem;color:var(--ink-muted);margin-bottom:20px;padding:12px 16px;background:rgba(79,70,229,0.04);border-radius:10px;border:1px solid rgba(79,70,229,0.15);}
  .test-totals span{font-weight:700;color:var(--accent2);}
  .btn-generate-test{width:100%;padding:15px 24px;background:linear-gradient(135deg,#059669,#10b981);border:none;border-radius:12px;color:white;font-family:'Source Sans 3',sans-serif;font-size:1rem;font-weight:700;cursor:pointer;transition:all 0.2s;margin-top:8px;box-shadow:0 4px 16px rgba(5,150,105,0.4);}
  .btn-generate-test:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(5,150,105,0.5);}
  .btn-generate-test:disabled{background:linear-gradient(135deg,#9ca3af,#6b7280);cursor:not-allowed;transform:none;box-shadow:none;}
  .saved-tests-list{display:flex;flex-direction:column;gap:10px;margin-top:16px;}
  .saved-test-card{background:var(--paper);border:1px solid var(--rule);border-radius:12px;padding:16px 20px;display:flex;align-items:center;justify-content:space-between;gap:16px;transition:box-shadow 0.15s;}
  .saved-test-card:hover{box-shadow:0 4px 16px var(--shadow);}
  .saved-test-info{flex:1;}
  .saved-test-title{font-weight:700;font-size:0.95rem;color:var(--ink);margin-bottom:3px;}
  .saved-test-meta{font-size:0.78rem;color:var(--ink-muted);}
  .saved-test-actions{display:flex;gap:8px;flex-shrink:0;flex-wrap:wrap;}
  .edit-test-overlay{position:fixed;inset:0;background:rgba(30,27,75,0.65);z-index:3000;display:none;align-items:center;justify-content:center;padding:16px;backdrop-filter:blur(4px);}
  .edit-test-overlay.show{display:flex;}
  .edit-test-modal{background:var(--paper);border-radius:20px;width:100%;max-width:700px;max-height:90vh;display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,0.25);overflow:hidden;}
  .edit-test-header{padding:20px 24px 16px;border-bottom:1px solid var(--rule);display:flex;align-items:center;justify-content:space-between;flex-shrink:0;}
  .edit-test-header h3{font-family:'Playfair Display',serif;font-size:1.15rem;margin:0;}
  .edit-test-body{overflow-y:auto;flex:1;padding:16px 24px;}
  .edit-q-row{display:flex;align-items:flex-start;gap:14px;padding:12px 0;border-bottom:1px solid var(--rule);}
  .edit-q-row:last-child{border-bottom:none;}
  .edit-q-num{font-size:0.78rem;font-weight:700;color:var(--ink-muted);min-width:26px;padding-top:2px;}
  .edit-q-body{flex:1;min-width:0;}
  .edit-q-meta{font-size:0.72rem;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:var(--accent2);margin-bottom:4px;}
  .edit-q-text{font-size:0.88rem;color:var(--ink);line-height:1.5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .edit-q-row{cursor:pointer;}
  .edit-q-row:hover:not(.edit-q-removed){background:var(--bg);border-radius:8px;margin:0 -8px;padding:12px 8px;}
  .edit-q-remove{flex-shrink:0;padding:5px 12px;background:none;border:1px solid var(--wrong);border-radius:8px;color:var(--wrong);font-size:0.78rem;font-weight:700;cursor:pointer;transition:background 0.15s;}
  .edit-q-remove:hover{background:var(--wrong);color:#fff;}
  .edit-q-removed{opacity:0.35;}
  .edit-q-removed .edit-q-remove{pointer-events:all;opacity:1;}
  .edit-test-footer{padding:16px 24px;border-top:1px solid var(--rule);display:flex;gap:10px;align-items:center;flex-shrink:0;}
  .edit-test-count{font-size:0.85rem;color:var(--ink-muted);flex:1;}
  .edit-detail-options{display:flex;flex-direction:column;gap:8px;margin-top:16px;}
  .edit-detail-option{padding:10px 14px;border:2px solid var(--rule);border-radius:10px;font-size:0.92rem;line-height:1.5;}
  .edit-detail-option.correct{border-color:var(--correct);background:rgba(5,150,105,0.07);color:var(--correct);font-weight:600;}
  .edit-detail-source{background:var(--bg);border-left:3px solid var(--accent2);border-radius:8px;padding:12px 16px;font-size:0.85rem;line-height:1.6;margin-bottom:14px;max-height:180px;overflow-y:auto;}
  .edit-detail-question{font-size:0.97rem;line-height:1.6;color:var(--ink);margin-bottom:4px;}
  .edit-detail-nr{margin-top:14px;font-size:0.9rem;color:var(--ink-muted);}
  .edit-detail-nr strong{color:var(--ink);}
  .btn-download{padding:6px 14px;background:linear-gradient(135deg,#4f46e5,#7c3aed);border:none;border-radius:8px;color:white;font-size:0.8rem;font-weight:700;cursor:pointer;font-family:'Source Sans 3',sans-serif;box-shadow:0 2px 8px rgba(79,70,229,0.3);}
  .btn-delete{padding:6px 14px;background:none;border:1px solid var(--rule);border-radius:8px;color:var(--ink-muted);font-size:0.8rem;cursor:pointer;font-family:'Source Sans 3',sans-serif;}
  .btn-delete:hover{border-color:var(--wrong);color:var(--wrong);}
  .teacher-loading{text-align:center;padding:20px;color:var(--ink-muted);font-size:0.88rem;}
  @media print{
    #auth-screen,#main-app{display:none!important;}
    #print-area{display:block!important;padding:20px;}
  }
  #print-area{display:none;}
  .print-header{margin-bottom:32px;}
  .print-title{font-size:1.4rem;font-weight:700;margin-bottom:16px;font-family:'Playfair Display',serif;}
  .print-info-row{display:flex;gap:40px;border-top:1px solid #000;padding-top:10px;font-size:0.9rem;}
  .print-info-field{flex:1;border-bottom:1px solid #000;padding-bottom:4px;}
  .print-info-label{font-size:0.75rem;margin-bottom:2px;color:#666;}
  .print-section-title{font-size:1rem;font-weight:700;margin:28px 0 12px;text-transform:uppercase;letter-spacing:0.05em;border-bottom:2px solid #000;padding-bottom:4px;page-break-after:avoid;break-after:avoid;}
  .print-question{margin-bottom:24px;page-break-inside:avoid;break-inside:avoid;}
  .print-q-num{font-weight:700;margin-bottom:6px;}
  .print-q-stem{margin-bottom:10px;line-height:1.6;}
  .print-options{margin-left:20px;display:flex;flex-direction:column;gap:4px;}
  .print-option{font-size:0.9rem;}
  .print-nr-boxes{display:flex;gap:4px;margin-top:8px;}
  .print-nr-box{width:40px;height:44px;border:2px solid #000;display:inline-block;}
  .print-answer-key{margin-top:40px;border-top:3px double #000;padding-top:20px;page-break-before:always;}
  .print-key-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:6px 16px;margin-top:12px;}
  .print-key-item{font-size:0.88rem;}
  .print-explanations{margin-top:40px;border-top:3px double #000;padding-top:20px;page-break-before:always;}
  .print-explanation-item{margin-bottom:18px;font-size:0.88rem;line-height:1.65;}
  .print-explanation-item strong{display:inline-block;margin-bottom:3px;}
  .print-source-box{background:#f5f5f5;border-left:3px solid #888;padding:10px 14px;margin-bottom:12px;font-size:0.85rem;line-height:1.6;}

  /* ── PRICING MODAL ── */
  .signin-popup-overlay{position:fixed;inset:0;background:rgba(30,27,75,0.6);z-index:2000;display:flex;align-items:center;justify-content:center;padding:16px;backdrop-filter:blur(4px);}
  .signin-popup-box{background:var(--paper);border-radius:20px;padding:36px 32px;max-width:360px;width:100%;text-align:center;box-shadow:0 20px 60px rgba(0,0,0,0.25);position:relative;}
  .signin-popup-close{position:absolute;top:12px;right:16px;background:none;border:none;font-size:1.4rem;color:var(--ink-muted);cursor:pointer;line-height:1;}
  .signin-popup-icon{font-size:2.2rem;margin-bottom:12px;}
  .signin-popup-title{font-family:'Playfair Display',serif;font-size:1.3rem;color:var(--ink);margin:0 0 8px;}
  .signin-popup-sub{font-size:0.88rem;color:var(--ink-muted);margin:0;}
  .forgot-link{display:block;text-align:right;font-size:0.82rem;color:var(--accent2);cursor:pointer;margin-top:4px;margin-bottom:8px;}
  .forgot-link:hover{text-decoration:underline;}
  .terms-check-row{display:flex;align-items:flex-start;gap:9px;font-size:0.82rem;color:var(--ink-muted);margin-bottom:14px;line-height:1.5;}
  .terms-check-row input[type=checkbox]{margin-top:2px;flex-shrink:0;accent-color:var(--accent2);width:15px;height:15px;cursor:pointer;}
  .terms-check-row a{color:var(--accent2);cursor:pointer;text-decoration:underline;}
  .terms-modal-overlay{position:fixed;inset:0;background:rgba(30,27,75,0.65);z-index:4000;display:flex;align-items:center;justify-content:center;padding:16px;backdrop-filter:blur(4px);}
  .terms-modal-box{background:var(--paper);border-radius:20px;max-width:680px;width:100%;max-height:88vh;display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,0.3);}
  .terms-modal-header{padding:24px 28px 16px;border-bottom:1px solid var(--rule);display:flex;align-items:center;justify-content:space-between;flex-shrink:0;}
  .terms-modal-header h3{font-family:'Playfair Display',serif;font-size:1.2rem;margin:0;}
  .terms-modal-close{background:none;border:none;font-size:1.4rem;cursor:pointer;color:var(--ink-muted);line-height:1;}
  .terms-modal-body{padding:24px 28px;overflow-y:auto;font-size:0.88rem;line-height:1.75;color:var(--ink);}
  .terms-modal-body h4{font-size:0.9rem;font-weight:700;margin:20px 0 6px;color:var(--ink);}
  .terms-modal-body h4:first-child{margin-top:0;}
  .terms-modal-body p{margin:0 0 10px;}
  .terms-modal-body ul{margin:0 0 10px;padding-left:20px;}
  .terms-modal-footer{padding:16px 28px;border-top:1px solid var(--rule);flex-shrink:0;}
  .terms-tab-btn{background:none;border:none;padding:8px 16px;font-size:0.85rem;font-weight:600;cursor:pointer;border-radius:8px;color:var(--ink-muted);}
  .terms-tab-btn.active{background:var(--accent2);color:#fff;}
  .reset-pw-overlay{position:fixed;inset:0;background:rgba(30,27,75,0.7);z-index:3000;display:flex;align-items:center;justify-content:center;padding:16px;backdrop-filter:blur(4px);}
  .reset-pw-box{background:var(--paper);border-radius:20px;padding:36px 32px;max-width:380px;width:100%;box-shadow:0 20px 60px rgba(0,0,0,0.3);}
  .pricing-overlay{position:fixed;inset:0;background:rgba(30,27,75,0.6);z-index:1000;display:none;align-items:center;justify-content:center;padding:16px;backdrop-filter:blur(4px);}
  .pricing-overlay.show{display:flex;}
  .pricing-modal{background:var(--paper);border:1px solid var(--rule);border-radius:20px;max-width:860px;width:100%;max-height:90vh;overflow-y:auto;padding:40px;position:relative;box-shadow:0 20px 60px rgba(0,0,0,0.2);}
  .pricing-modal-close{position:absolute;top:16px;right:20px;background:none;border:none;font-size:1.4rem;cursor:pointer;color:var(--ink-muted);line-height:1;}
  .pricing-modal h2{font-family:'Playfair Display',serif;font-size:1.6rem;font-weight:700;color:var(--ink);margin-bottom:6px;}
  .pricing-modal .pricing-sub{font-size:0.9rem;color:var(--ink-muted);margin-bottom:24px;}
  .billing-toggle{display:inline-flex;background:var(--bg);border-radius:12px;padding:4px;overflow:hidden;margin-bottom:28px;}
  .billing-toggle button{padding:7px 20px;border:none;background:none;cursor:pointer;font-family:'Source Sans 3',sans-serif;font-size:0.85rem;font-weight:600;color:var(--ink-muted);transition:all 0.15s;border-radius:9px;}
  .billing-toggle button.active{background:var(--paper);color:var(--accent2);box-shadow:0 2px 8px rgba(79,70,229,0.15);}
  .pricing-save-badge{display:inline-block;background:rgba(5,150,105,0.1);color:var(--accent3);font-size:0.72rem;font-weight:700;letter-spacing:0.08em;padding:3px 10px;border-radius:20px;margin-left:8px;vertical-align:middle;}
  .plan-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;}
  .plan-cards .plan-row{display:contents;}
  .plan-section-label{grid-column:1/-1;font-size:0.72rem;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;color:var(--ink-muted);padding-bottom:4px;border-bottom:2px solid var(--rule);margin-top:8px;}
  .plan-cards.has-org{grid-template-columns:repeat(2,1fr);}
  @media(min-width:700px){.plan-cards{grid-template-columns:repeat(2,1fr);}}
  .plan-card{border:2px solid var(--rule);border-radius:16px;padding:24px 20px;display:flex;flex-direction:column;gap:10px;position:relative;background:var(--paper);}
  .plan-card.featured{border-color:var(--accent2);box-shadow:0 4px 24px rgba(79,70,229,0.2);}
  .plan-card .plan-badge{position:absolute;top:-11px;left:50%;transform:translateX(-50%);background:linear-gradient(135deg,#4f46e5,#7c3aed);color:white;font-size:0.68rem;font-weight:700;letter-spacing:0.1em;padding:4px 14px;border-radius:20px;white-space:nowrap;box-shadow:0 3px 10px rgba(79,70,229,0.4);}
  .plan-card .plan-name{font-weight:700;font-size:1rem;color:var(--ink);}
  .plan-card .plan-price{font-family:'Playfair Display',serif;font-size:1.6rem;font-weight:700;color:var(--ink);line-height:1.1;}
  .plan-card .plan-price span{font-size:0.8rem;font-weight:400;color:var(--ink-muted);font-family:'Source Sans 3',sans-serif;}
  .plan-card .plan-per{font-size:0.78rem;color:var(--ink-muted);margin-top:-6px;}
  .plan-card .plan-features{list-style:none;padding:0;margin:8px 0 0;display:flex;flex-direction:column;gap:6px;font-size:0.83rem;color:var(--ink);flex:1;}
  .plan-card .plan-features li::before{content:'✓ ';color:var(--accent3);font-weight:700;}
  .plan-card .plan-features li.no::before{content:'✗ ';color:var(--ink-muted);}
  .plan-card .plan-features li.no{color:var(--ink-muted);}
  .plan-card .plan-cta{margin-top:12px;padding:11px;border-radius:10px;border:none;font-family:'Source Sans 3',sans-serif;font-size:0.88rem;font-weight:700;cursor:pointer;transition:all 0.15s;width:100%;}
  .plan-card .plan-cta.current{background:var(--bg);color:var(--ink-muted);cursor:default;border:2px solid var(--rule);}
  .plan-card .plan-cta.primary{background:linear-gradient(135deg,#4f46e5,#7c3aed);color:white;box-shadow:0 3px 12px rgba(79,70,229,0.35);}
  .plan-card .plan-cta.primary:hover{transform:translateY(-1px);box-shadow:0 5px 18px rgba(79,70,229,0.45);}
  .plan-card .plan-cta.secondary{background:linear-gradient(135deg,#059669,#10b981);color:white;box-shadow:0 3px 12px rgba(5,150,105,0.35);}
  .plan-card .plan-cta.secondary:hover{transform:translateY(-1px);box-shadow:0 5px 18px rgba(5,150,105,0.45);}
  .plan-card .plan-cta.school-cta{background:linear-gradient(135deg,#1e1b4b,#312e81);color:white;box-shadow:0 3px 12px rgba(30,27,75,0.35);}
  .plan-card .plan-cta.school-cta:hover{transform:translateY(-1px);}
  .seat-input-row{display:flex;align-items:center;gap:8px;margin-top:4px;}
  .seat-input-row input{width:70px;padding:6px 10px;border:2px solid var(--rule);border-radius:8px;font-size:0.9rem;text-align:center;font-family:'Source Sans 3',sans-serif;}
  .seat-input-row label{font-size:0.8rem;color:var(--ink-muted);}
  .seat-total{font-size:0.8rem;color:var(--ink-muted);margin-top:4px;min-height:1.2em;}
  .upgrade-link{display:inline-block;background:linear-gradient(135deg,#dc2626,#ef4444);color:white;font-weight:700;cursor:pointer;font-size:0.82rem;padding:6px 14px;border-radius:8px;margin-left:10px;letter-spacing:0.02em;box-shadow:0 2px 8px rgba(220,38,38,0.35);transition:all 0.15s;}
  .upgrade-link:hover{transform:translateY(-1px);box-shadow:0 4px 14px rgba(220,38,38,0.45);}
  .checkout-success-banner{background:rgba(5,150,105,0.08);border:1px solid rgba(5,150,105,0.3);border-radius:10px;padding:12px 16px;font-size:0.88rem;color:var(--correct);margin-bottom:16px;display:none;}
  .org-code-box{background:rgba(79,70,229,0.04);border:1px solid rgba(79,70,229,0.2);border-radius:12px;padding:14px 18px;margin-bottom:16px;display:none;}
  .org-code-box .org-code-label{font-size:0.72rem;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--ink-muted);margin-bottom:6px;}
  .org-code-box .org-code-value{font-family:monospace;font-size:1.5rem;font-weight:700;letter-spacing:0.2em;color:var(--accent2);cursor:pointer;}
  .org-code-box .org-code-hint{font-size:0.78rem;color:var(--ink-muted);margin-top:4px;}
  .join-code-divider{text-align:center;color:var(--ink-muted);font-size:0.8rem;margin:12px 0;}
  .main-tabs{background:var(--rule);border-radius:14px;padding:4px;margin-bottom:28px;display:none;gap:4px;}
  .main-tabs.visible{display:flex;}
  .main-tab{flex:1;padding:11px;background:none;border:none;border-radius:11px;font-family:'Source Sans 3',sans-serif;font-size:0.95rem;font-weight:600;color:var(--ink-muted);cursor:pointer;transition:all 0.2s;text-align:center;}
  .main-tab:hover{color:var(--ink);}
  .main-tab.active{background:var(--paper);color:var(--accent2);box-shadow:0 2px 10px rgba(79,70,229,0.15);font-weight:700;}

  @media(max-width:600px){
    /* Layout */
    .page-wrap{padding:0 12px 40px;}

    /* Header */
    .site-header{flex-direction:column;align-items:flex-start;gap:8px;padding:18px 16px;border-radius:12px;margin-bottom:16px;}
    .header-crest{display:none;}
    .site-title{font-size:1.4rem;}
    .site-subtitle{font-size:0.78rem;}

    /* User bar */
    .user-bar{flex-wrap:wrap;gap:6px;padding:8px 12px;}
    .user-bar-info{flex-wrap:wrap;gap:6px;}

    /* Subject toggle — 2×2 grid */
    .subject-toggle{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:20px;}
    .subj-btn{padding:9px 6px;font-size:0.84rem;}

    /* Grade toggle — smaller text for 3-button row */
    .grade-toggle{gap:4px;}
    .grade-btn{font-size:0.7rem;padding:8px 4px;letter-spacing:0.02em;}

    /* Setup panel */
    .setup-panel{padding:18px 14px;}
    .form-grid{grid-template-columns:1fr;}
    .units-grid{grid-template-columns:repeat(2,1fr);}

    /* Source box */
    .source-box{padding:12px 14px;}

    /* Exam */
    .exam-top-bar{flex-direction:column;gap:4px;text-align:center;padding:14px 16px;}
    .exam-progress{padding:0 14px;}
    .question-wrap{padding:18px 14px;}
    .exam-nav{gap:6px;}
    .btn-nav{padding:10px 14px;font-size:0.84rem;min-height:44px;}
    .btn-submit-exam{padding:10px 16px;font-size:0.85rem;min-height:44px;}
    .q-dots{gap:3px;}
    .q-dot{width:9px;height:9px;}

    /* NR inputs — larger tap targets */
    .nr-box{width:52px;height:62px;font-size:1.3rem;}
    .nr-matching-grid{gap:10px;}
    .nr-matching-col{min-width:60px;max-width:none;}

    /* Results */
    .results-score-row{grid-template-columns:repeat(2,1fr);}
    .score-cell:nth-child(2){border-right:none;}
    .score-cell:nth-child(3){border-top:1px solid var(--rule);}
    .score-cell{padding:16px 12px;}
    .score-val{font-size:1.6rem;}
    .results-header{padding:20px 16px;}
    .results-actions{flex-direction:column;padding:14px 16px;}
    .btn-action{width:100%;text-align:center;}
    .diploma-band{padding:12px 16px;gap:8px;flex-wrap:wrap;}
    .band-label{font-size:0.72rem;}

    /* Review */
    .review-booklet{padding:16px 0;}
    .review-q-block{padding:14px;}
    .review-score-summary{padding:18px 14px;}

    /* Teacher panel */
    .teacher-panel{padding:18px 14px;}
    .unit-spec-cell{font-size:0.8rem;padding:8px 10px;}
    .unit-spec-input{width:44px;}

    /* Saved test cards — stack title above buttons */
    .saved-test-card{flex-direction:column;align-items:flex-start;gap:10px;padding:14px 16px;}
    .saved-test-actions{flex-wrap:wrap;width:100%;gap:6px;}
    .btn-download{flex:1;min-width:calc(50% - 3px);text-align:center;padding:7px 8px;font-size:0.76rem;}

    /* Edit test modal — near full-screen on mobile */
    .edit-test-modal{max-height:95vh;border-radius:14px;}
    .edit-test-body{padding:12px 14px;}
    .edit-test-header{padding:16px 18px 12px;}

    /* Pricing modal */
    .pricing-modal{padding:24px 16px;}
    .plan-cards{grid-template-columns:1fr;}
    .plan-card[style*="grid-column"]{grid-column:1!important;}
    .billing-toggle button{padding:7px 12px;font-size:0.78rem;}

    /* Auth */
    .auth-card{padding:28px 18px;}
    .auth-tab{font-size:0.78rem;padding:8px 4px;}

    /* Classrooms */
    .cls-card,.asgn-card{padding:12px 14px;}
    .cls-card-actions,.asgn-card-right{flex-direction:column;gap:6px;}
    .cls-detail-header{flex-direction:column;gap:12px;}
    .cls-jc-box{margin-left:0;}
    .cls-results-grid{grid-template-columns:1fr;}
  }

  /* ═══════════════════════════════════════
     CLASSROOMS FEATURE
  ═══════════════════════════════════════ */
  .cls-panel{margin-top:0;}

  /* Classroom cards */
  .cls-card{background:var(--paper);border:1px solid var(--rule);border-radius:14px;padding:18px 22px;display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:12px;transition:all 0.15s;box-shadow:0 2px 8px var(--shadow);}
  .cls-card:hover{border-color:var(--accent2);box-shadow:0 4px 20px rgba(79,70,229,0.15);transform:translateY(-1px);}
  .cls-card-name{font-weight:700;font-size:1rem;color:var(--ink);margin-bottom:3px;}
  .cls-card-meta{font-size:0.8rem;color:var(--ink-muted);}
  .cls-card-actions{display:flex;gap:8px;flex-shrink:0;}
  .cls-badge{display:inline-block;font-size:0.72rem;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;padding:4px 10px;border-radius:20px;background:rgba(79,70,229,0.1);color:var(--accent2);border:1px solid rgba(79,70,229,0.2);margin-right:6px;}

  /* Join code display */
  .cls-jc-box{background:linear-gradient(135deg,rgba(79,70,229,0.06),rgba(124,58,237,0.06));border:1px solid rgba(79,70,229,0.2);border-radius:12px;padding:14px 18px;flex-shrink:0;min-width:160px;cursor:pointer;transition:all 0.15s;}
  .cls-jc-box:hover{border-color:var(--accent2);box-shadow:0 4px 12px rgba(79,70,229,0.15);}
  .cls-jc-label{font-size:0.68rem;font-weight:700;letter-spacing:0.15em;text-transform:uppercase;color:var(--accent2);margin-bottom:4px;}
  .cls-jc-value{font-family:'Source Code Pro',monospace;font-size:1.6rem;font-weight:700;letter-spacing:0.15em;background:linear-gradient(135deg,#4f46e5,#7c3aed);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1;}
  .cls-jc-hint{font-size:0.72rem;color:var(--ink-muted);margin-top:4px;}

  /* Classroom detail */
  .cls-detail-header{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:20px;}
  .cls-back-btn{background:none;border:none;color:var(--accent2);cursor:pointer;font-size:0.85rem;font-weight:700;padding:0 0 16px;font-family:'Source Sans 3',sans-serif;}
  .cls-back-btn:hover{text-decoration:underline;}

  /* Member rows */
  .member-row{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--rule);font-size:0.88rem;}
  .member-row:last-child{border-bottom:none;}
  .member-name{font-weight:600;color:var(--ink);}
  .member-meta{color:var(--ink-muted);font-size:0.78rem;}

  /* Assignment cards */
  .asgn-card{background:var(--paper);border:1px solid var(--rule);border-radius:12px;padding:14px 18px;display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:10px;transition:box-shadow 0.15s;}
  .asgn-card:hover{box-shadow:0 3px 12px var(--shadow);}
  .asgn-card-left{flex:1;}
  .asgn-card-title{font-weight:700;font-size:0.95rem;color:var(--ink);margin-bottom:3px;}
  .asgn-card-meta{font-size:0.78rem;color:var(--ink-muted);}
  .asgn-card-right{display:flex;gap:8px;flex-shrink:0;align-items:center;}
  .asgn-status{display:inline-block;font-size:0.72rem;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;padding:4px 10px;border-radius:20px;}
  .asgn-status.not-started{background:rgba(107,114,128,0.1);color:var(--ink-muted);}
  .asgn-status.overdue{background:rgba(220,38,38,0.1);color:var(--wrong);}
  .asgn-status.completed{background:rgba(5,150,105,0.1);color:var(--correct);}

  /* Teacher results */
  .cls-results-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;margin-bottom:24px;}
  .cls-stat-box{background:linear-gradient(135deg,rgba(79,70,229,0.06),rgba(124,58,237,0.06));border:1px solid rgba(79,70,229,0.15);border-radius:14px;padding:16px 16px;text-align:center;}
  .cls-stat-val{font-family:'Playfair Display',serif;font-size:1.8rem;font-weight:700;background:linear-gradient(135deg,#4f46e5,#7c3aed);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
  .cls-stat-label{font-size:0.75rem;color:var(--ink-muted);margin-top:2px;}
  .results-q-row{display:flex;align-items:center;gap:12px;padding:8px 0;border-bottom:1px solid var(--rule);font-size:0.85rem;}
  .results-q-row:last-child{border-bottom:none;}
  .results-q-num{font-weight:700;color:var(--ink);width:28px;flex-shrink:0;}
  .results-q-text{flex:1;color:var(--ink-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .results-q-pct{font-weight:700;width:48px;text-align:right;flex-shrink:0;color:var(--accent2);}
  .results-q-bar{height:7px;background:var(--rule);border-radius:4px;overflow:hidden;width:80px;flex-shrink:0;}
  .results-q-bar-fill{height:100%;background:linear-gradient(90deg,#059669,#10b981);border-radius:4px;}
  .student-result-row{display:flex;align-items:center;justify-content:space-between;padding:9px 0;border-bottom:1px solid var(--rule);font-size:0.88rem;}
  .student-result-row:last-child{border-bottom:none;}
  .results-q-row{cursor:pointer;border-radius:8px;transition:background 0.12s;}
  .results-q-row:hover{background:rgba(79,70,229,0.04);}
  .results-q-row.active{background:rgba(79,70,229,0.08);outline:2px solid rgba(79,70,229,0.25);}
  .qdetail-option{margin-bottom:12px;}
  .qdetail-option-header{display:flex;align-items:flex-start;gap:10px;margin-bottom:5px;}
  .qdetail-option-letter{font-weight:700;width:22px;flex-shrink:0;padding-top:1px;color:var(--accent2);}
  .qdetail-option-text{flex:1;font-size:0.92rem;line-height:1.55;}
  .qdetail-bar-wrap{height:9px;background:var(--rule);border-radius:5px;overflow:hidden;margin-left:32px;}
  .qdetail-bar-fill{height:100%;border-radius:5px;transition:width 0.35s ease;}
  .qdetail-bar-label{margin-left:32px;font-size:0.75rem;color:var(--ink-muted);margin-top:3px;}

  /* Assign-to-class modal */
  .cls-modal-overlay{position:fixed;inset:0;background:rgba(30,27,75,0.55);z-index:300;display:flex;align-items:center;justify-content:center;padding:20px;backdrop-filter:blur(4px);}
  .cls-modal-card{background:var(--paper);border-radius:18px;width:100%;max-width:500px;box-shadow:0 20px 60px rgba(0,0,0,0.2);overflow:hidden;}
  .cls-modal-header{background:linear-gradient(135deg,#4f46e5,#7c3aed);color:white;padding:18px 22px;display:flex;align-items:center;justify-content:space-between;}
  .cls-modal-title{font-family:'Playfair Display',serif;font-size:1.1rem;font-weight:600;}
  .cls-modal-close{background:none;border:none;color:rgba(255,255,255,0.7);font-size:1.2rem;cursor:pointer;padding:0;}
  .cls-modal-close:hover{color:white;}
  .cls-modal-body{padding:22px;}
  .cls-modal-footer{padding:16px 22px;border-top:1px solid var(--rule);display:flex;justify-content:flex-end;gap:8px;}
  .cls-checkbox-row{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--rule);cursor:pointer;}
  .cls-checkbox-row:last-child{border-bottom:none;}
  .cls-checkbox-row input[type="checkbox"]{accent-color:var(--accent2);width:16px;height:16px;flex-shrink:0;cursor:pointer;}
  .cls-checkbox-label{font-size:0.9rem;color:var(--ink);font-weight:600;}
  .cls-checkbox-sub{font-size:0.78rem;color:var(--ink-muted);}

  /* Assignment exam overlay */
  .asgn-exam-overlay{position:fixed;inset:0;background:var(--bg);z-index:200;overflow-y:auto;}
  .asgn-option-row{display:flex;align-items:flex-start;gap:12px;padding:12px 16px;border:2px solid var(--rule);border-radius:12px;cursor:pointer;margin-bottom:8px;transition:all 0.15s;}
  .asgn-option-row:hover{border-color:var(--accent2);background:rgba(79,70,229,0.04);transform:translateY(-1px);}
  .asgn-option-row.selected{border-color:var(--accent2);background:rgba(79,70,229,0.08);}
  .asgn-option-row.correct{border-color:var(--correct);background:rgba(5,150,105,0.08);}
  .asgn-option-row.wrong{border-color:var(--wrong);background:rgba(220,38,38,0.08);}
  .asgn-option-letter{font-weight:700;color:var(--accent2);flex-shrink:0;width:18px;}
  .asgn-nr-input{font-family:'Source Code Pro',monospace;font-size:1.1rem;padding:11px 14px;border:2px solid var(--rule);border-radius:10px;width:180px;background:var(--bg);color:var(--ink);outline:none;transition:border-color 0.15s;}
  .asgn-nr-input:focus{border-color:var(--accent2);box-shadow:0 0 0 4px rgba(79,70,229,0.12);}
  .asgn-explanation{background:rgba(5,150,105,0.05);border:1px solid rgba(5,150,105,0.2);border-left:4px solid var(--accent3);border-radius:12px;padding:14px 16px;margin-top:16px;font-size:0.88rem;color:var(--ink);line-height:1.6;}
  .asgn-explanation strong{color:var(--accent3);display:block;margin-bottom:6px;}
  .btn-cancel-exam{background:none;border:none;color:var(--ink-muted);cursor:pointer;font-size:0.85rem;font-family:'Source Sans 3',sans-serif;padding:12px 0;}
  .btn-cancel-exam:hover{color:var(--ink);}
  .asgn-results-summary{text-align:center;padding:32px 0 20px;}
  .asgn-score-big{font-family:'Playfair Display',serif;font-size:3rem;font-weight:700;background:linear-gradient(135deg,#4f46e5,#7c3aed);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
  .asgn-score-sub{font-size:0.9rem;color:var(--ink-muted);margin-top:4px;}

  /* Btn small */
  .btn-sm{padding:7px 14px;border-radius:9px;border:1px solid var(--rule);background:var(--bg);color:var(--ink);font-family:'Source Sans 3',sans-serif;font-size:0.82rem;font-weight:600;cursor:pointer;transition:all 0.15s;}
  .btn-sm:hover{border-color:var(--accent2);color:var(--accent2);}
  .btn-sm.danger:hover{border-color:var(--wrong);color:var(--wrong);}
  .btn-sm.primary{background:linear-gradient(135deg,#4f46e5,#7c3aed);color:white;border-color:transparent;box-shadow:0 3px 10px rgba(79,70,229,0.3);}
  .btn-sm.primary:hover{transform:translateY(-1px);box-shadow:0 5px 16px rgba(79,70,229,0.4);}
