/* ========== CSS Variables ========== */
:root {
    --primary: #4F46E5; --primary-light: #6366F1; --primary-dark: #4338CA; --primary-bg: #EEF2FF;
    --success: #059669; --success-bg: #ECFDF5;
    --danger: #DC2626; --danger-bg: #FEF2F2;
    --warning: #D97706; --warning-bg: #FFFBEB;
    --gray-50: #F9FAFB; --gray-100: #F3F4F6; --gray-200: #E5E7EB; --gray-300: #D1D5DB;
    --gray-400: #9CA3AF; --gray-500: #6B7280; --gray-600: #4B5563; --gray-700: #374151; --gray-800: #1F2937; --gray-900: #111827;
    --shadow-sm: 0 1px 2px rgba(0,0,0,0.05); --shadow: 0 1px 3px rgba(0,0,0,0.1),0 1px 2px rgba(0,0,0,0.06);
    --shadow-md: 0 4px 6px -1px rgba(0,0,0,0.1); --shadow-lg: 0 10px 15px -3px rgba(0,0,0,0.1);
    --radius: 8px; --radius-lg: 12px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;background:var(--gray-50);color:var(--gray-800);line-height:1.6;min-height:100vh}

/* Header */
.header{background:white;border-bottom:1px solid var(--gray-200);position:sticky;top:0;z-index:100;box-shadow:var(--shadow-sm)}
.header-inner{max-width:1280px;margin:0 auto;padding:0 16px;display:flex;align-items:center;justify-content:space-between;height:64px;gap:10px}
.nav-tabs{display:flex;gap:2px;min-width:0}
.nav-tab{display:flex;align-items:center;gap:5px;padding:7px 11px;border:none;background:transparent;color:var(--gray-500);font-size:13px;font-weight:500;cursor:pointer;border-radius:var(--radius);transition:all .2s;white-space:nowrap}
.nav-tab:hover{background:var(--gray-100);color:var(--gray-700)}
.nav-tab.active{background:var(--primary-bg);color:var(--primary)}

/* Main */
.main-content{max-width:1280px;margin:0 auto;padding:24px}
.tab-content{display:none;animation:tabFadeIn .35s ease}
.tab-content.active{display:block}
@keyframes tabFadeIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}

/* Card */
.card{background:white;border-radius:var(--radius-lg);box-shadow:var(--shadow);padding:24px;border:1px solid var(--gray-200)}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 20px;font-size:14px;font-weight:500;border:1px solid transparent;border-radius:var(--radius);cursor:pointer;transition:all .2s}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn-primary{background:var(--primary);color:white}
.btn-primary:hover:not(:disabled){background:var(--primary-dark)}
.btn-outline{background:white;color:var(--gray-700);border-color:var(--gray-300)}
.btn-outline:hover:not(:disabled){background:var(--gray-50);border-color:var(--gray-400)}
.btn-danger{background:var(--danger);color:white}
.btn-danger:hover:not(:disabled){background:#B91C1C}
.btn-lg{padding:14px 32px;font-size:16px}
.btn-sm{padding:6px 12px;font-size:13px}

/* Forms */
.form-group{margin-bottom:16px}
.form-group label{display:block;font-size:13px;font-weight:600;color:var(--gray-700);margin-bottom:6px}
.form-group input,.form-group select,.form-group textarea{width:100%;padding:10px 12px;font-size:14px;border:1px solid var(--gray-300);border-radius:var(--radius);background:white;color:var(--gray-800);transition:border-color .2s,box-shadow .2s;font-family:inherit}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(79,70,229,.1)}
.form-group textarea{resize:vertical;min-height:60px}
.form-row{display:flex;gap:16px}
.form-row .form-group{flex:1}
.form-actions{display:flex;gap:12px;margin-top:20px}
.optional{color:var(--gray-400);font-weight:400;font-size:12px}
.radio-group{display:flex;flex-direction:column;gap:8px}
.radio-label{display:flex;align-items:center;gap:8px;padding:10px 14px;border:1px solid var(--gray-200);border-radius:var(--radius);cursor:pointer;font-size:14px;transition:all .2s}
.radio-label:hover{border-color:var(--primary-light);background:var(--primary-bg)}
.radio-label input[type=radio]{width:auto;accent-color:var(--primary)}

/* Badges */
.badge{display:inline-flex;padding:2px 10px;font-size:12px;font-weight:600;border-radius:20px}
.badge-subject{background:var(--primary-bg);color:var(--primary)}
.badge-topic{background:var(--gray-100);color:var(--gray-600)}
.badge-difficulty{background:var(--warning-bg);color:var(--warning)}
.badge-source{background:#EDE9FE;color:#6D28D9}
.badge-module{background:#D1FAE5;color:#065F46}
.badge-img-pending{background:var(--warning-bg);color:var(--warning);cursor:pointer}
.badge-img-pending:hover{background:var(--warning);color:white}
.badge-img-done{background:var(--success-bg);color:var(--success)}
.badge-dup{background:#FEE2E2;color:#B91C1C;cursor:pointer;border:1px solid #FCA5A5;flex-shrink:0;animation:dupPulse 2s ease-in-out infinite}
.badge-dup:hover{background:#B91C1C;color:#fff}
@keyframes dupPulse{0%,100%{box-shadow:0 0 0 0 rgba(185,28,28,.35)}50%{box-shadow:0 0 0 4px rgba(185,28,28,0)}}

/* Bank date divider — separates question batches by the date they were added */
.bank-date-divider{display:flex;align-items:center;gap:10px;margin:16px 0 10px}
.bank-date-divider::before,.bank-date-divider::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,transparent,var(--gray-300),transparent)}
.bank-date-divider-label{font-size:12px;font-weight:700;color:var(--primary);background:var(--primary-bg);padding:3px 14px;border-radius:20px;white-space:nowrap;letter-spacing:.3px}
.bank-date-divider:first-child{margin-top:4px}

/* Practice Setup */
.practice-setup{display:flex;justify-content:center;padding-top:40px}
.setup-card{max-width:520px;width:100%}
.setup-card h2{font-size:24px;margin-bottom:8px}
.setup-desc{color:var(--gray-500);margin-bottom:24px}
.setup-form .form-group{margin-bottom:20px}
.setup-form .btn{width:100%;margin-top:8px}

/* Quiz */
.quiz-container{max-width:760px;margin:0 auto;position:relative}
/* Control Bar */
.quiz-control-bar{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;background:white;border:1px solid var(--gray-200);border-radius:var(--radius-lg);margin-bottom:12px;box-shadow:var(--shadow-sm)}
.quiz-control-left,.quiz-control-right{display:flex;gap:8px}
.quiz-timer{display:flex;align-items:center;gap:6px;font-size:18px;font-weight:700;color:var(--gray-700);font-variant-numeric:tabular-nums;font-family:'SF Mono','Cascadia Code','Consolas',monospace}
.quiz-timer.warning{color:var(--warning)}
.quiz-timer.danger{color:var(--danger)}
.timer-ms{font-size:14px;font-weight:500;min-width:42px;display:inline-block}
/* Pause Overlay */
.pause-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(255,255,255,.95);z-index:50;border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;border:1px solid var(--gray-200)}
.pause-overlay-content{text-align:center;padding:40px}
.pause-icon{font-size:48px;margin-bottom:12px}
.pause-overlay-content h2{font-size:20px;margin-bottom:8px;color:var(--gray-800)}
.pause-overlay-content p{font-size:14px;color:var(--gray-500);margin-bottom:20px}
.quiz-header{display:flex;align-items:center;gap:20px;margin-bottom:20px}
.quiz-progress{flex:1}
.progress-text{font-size:14px;font-weight:600;color:var(--gray-600);display:block;margin-bottom:8px}
.progress-bar{height:6px;background:var(--gray-200);border-radius:3px;overflow:hidden}
.progress-fill{height:100%;background:linear-gradient(90deg,var(--primary),var(--primary-light));border-radius:3px;transition:width .3s}


/* Question Card */
.question-card{margin-bottom:16px}
.question-meta{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap}
.question-image-container{margin-bottom:16px;text-align:center}
.question-image-container img{max-width:100%;max-height:300px;border-radius:var(--radius);border:1px solid var(--gray-200)}
.question-text{font-size:17px;font-weight:500;color:var(--gray-800);line-height:1.7;margin-bottom:20px;white-space:pre-wrap}
/* Per-question timer */
.question-timer{display:flex;align-items:center;gap:6px;font-size:16px;font-weight:700;font-variant-numeric:tabular-nums;font-family:'SF Mono','Cascadia Code','Consolas',monospace;margin-bottom:12px;padding:6px 12px;border-radius:var(--radius);background:var(--gray-50);border:1px solid var(--gray-200);justify-content:space-between}
.question-timer .qt-label{font-size:12px;font-weight:500;color:var(--gray-500)}
.question-timer .qt-time{font-size:16px;font-weight:700}
.question-timer .qt-time.tg-green{color:var(--success)}
.question-timer .qt-time.tg-yellow{color:var(--warning)}
.question-timer .qt-time.tg-red{color:var(--danger)}

/* Options */
.options-list{display:flex;flex-direction:column;gap:10px}
.option-item{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;border:2px solid var(--gray-200);border-radius:var(--radius);cursor:pointer;transition:all .2s;position:relative;background:white}
.option-item:hover{border-color:var(--primary-light);background:var(--primary-bg)}
.option-item.selected{border-color:var(--primary);background:var(--primary-bg)}
.option-item.correct{border-color:var(--success);background:var(--success-bg)}
.option-item.wrong{border-color:var(--danger);background:var(--danger-bg)}
.option-item.correct::after,.option-item.wrong::after{position:absolute;right:14px;top:50%;transform:translateY(-50%);font-weight:700;font-size:18px}
.option-item.correct::after{content:'\2713';color:var(--success)}
.option-item.wrong::after{content:'\2717';color:var(--danger)}
.option-letter{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;flex-shrink:0;background:var(--gray-100);color:var(--gray-600)}
.option-item.selected .option-letter{background:var(--primary);color:white}
.option-item.correct .option-letter{background:var(--success);color:white}
.option-item.wrong .option-letter{background:var(--danger);color:white}
.option-text{font-size:15px;line-height:1.5;padding-top:5px;word-break:break-word}
.option-image{max-width:100%;max-height:120px;border-radius:4px;margin-top:4px}

/* Feedback */
.feedback-area{margin-bottom:16px}
.feedback-content{padding:16px;border-radius:var(--radius);font-size:15px;font-weight:500}
.feedback-content.correct-feedback{background:var(--success-bg);color:#065F46;border:1px solid #A7F3D0}
.feedback-content.wrong-feedback{background:var(--danger-bg);color:#991B1B;border:1px solid #FECACA}
.feedback-content .explanation{margin-top:8px;font-size:13px;font-weight:400;opacity:.85}

/* Quiz Actions */
.quiz-actions{display:flex;justify-content:center;gap:12px;margin-top:16px}

/* Answer Sheet */
.answer-sheet{margin-top:24px}
.answer-sheet h3{font-size:16px;font-weight:600;margin-bottom:12px}
.answer-grid{display:flex;flex-wrap:wrap;gap:8px}
.answer-sheet-item{width:38px;height:38px;display:flex;align-items:center;justify-content:center;border:2px solid var(--gray-300);border-radius:var(--radius);font-size:13px;font-weight:600;cursor:pointer;transition:all .2s;background:white}
.answer-sheet-item:hover{border-color:var(--primary)}
.answer-sheet-item.answered{background:var(--primary);color:white;border-color:var(--primary)}
.answer-sheet-item.current{border-color:var(--primary);box-shadow:0 0 0 2px rgba(79,70,229,.3)}

/* Results */
.practice-result{display:flex;justify-content:center;padding-top:20px}
.result-card{max-width:700px;width:100%;text-align:center}
.result-icon{font-size:64px;margin-bottom:8px}
.result-card h2{font-size:24px;margin-bottom:24px}
.result-stats{display:flex;justify-content:center;gap:32px;margin-bottom:24px}
.stat-item{text-align:center}
.stat-value{display:block;font-size:28px;font-weight:700;color:var(--primary)}
.stat-label{font-size:13px;color:var(--gray-500)}
.result-review{margin-bottom:24px;text-align:left;max-height:360px;overflow-y:auto}
.review-item{padding:12px;border-radius:var(--radius);margin-bottom:8px;display:flex;align-items:flex-start;gap:12px}
.review-item.review-correct{background:var(--success-bg)}
.review-item.review-wrong{background:var(--danger-bg)}
.review-number{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:white;flex-shrink:0}
.review-correct .review-number{background:var(--success)}
.review-wrong .review-number{background:var(--danger)}
.review-info{flex:1;font-size:13px;line-height:1.5}
.review-info .your-answer{color:var(--gray-600)}
.review-info .correct-answer{color:var(--success);font-weight:600}
.result-actions{display:flex;justify-content:center;gap:12px}

/* Bank Layout */
.bank-layout{display:flex;gap:24px;align-items:flex-start}
.bank-sidebar{width:420px;flex-shrink:0;position:sticky;top:88px;max-height:calc(100vh - 110px);overflow-y:auto}
.bank-main{flex:1;min-width:0}

/* Upload Zone */
.ocr-section{margin-bottom:20px}
.upload-zone,.pdf-upload-zone{border:2px dashed var(--gray-300);border-radius:var(--radius-lg);padding:24px;text-align:center;cursor:pointer;transition:all .2s;background:var(--gray-50)}
.upload-zone:hover,.pdf-upload-zone:hover{border-color:var(--primary);background:var(--primary-bg)}
.upload-zone svg,.pdf-upload-zone svg{display:block;margin:0 auto 8px}
.upload-zone p,.pdf-upload-zone p{font-size:14px;font-weight:500;color:var(--gray-600)}
.upload-zone span,.pdf-upload-zone span{font-size:12px;color:var(--gray-400)}
.upload-preview{text-align:center;padding:12px;background:var(--gray-50);border-radius:var(--radius);margin-bottom:16px;border:1px solid var(--gray-200)}
.upload-preview img{max-width:100%;max-height:160px;border-radius:4px}
.upload-preview .preview-actions{margin-top:8px;display:flex;gap:8px;justify-content:center}
.ocr-progress,.pdf-progress{text-align:center;padding:24px}
.spinner{width:32px;height:32px;border:3px solid var(--gray-200);border-top-color:var(--primary);border-radius:50%;animation:spin .8s linear infinite;margin:0 auto 12px}
@keyframes spin{to{transform:rotate(360deg)}}
.ocr-progress p,.pdf-progress p{font-size:14px;color:var(--gray-600);margin-bottom:4px}
.ocr-progress span,.pdf-progress span{font-size:12px;color:var(--gray-400)}
.pdf-extracted-text{width:100%;min-height:120px;font-size:13px;padding:8px;border:1px solid var(--gray-300);border-radius:var(--radius);font-family:monospace;margin-top:8px}

/* Bank Toolbar */
.bank-toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;flex-wrap:wrap;gap:12px}
.bank-toolbar h2{font-size:18px}
.bank-filters{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.bank-filters select,.bank-filters input{padding:6px 10px;font-size:13px;border:1px solid var(--gray-300);border-radius:var(--radius)}
.bank-filters input{width:160px}
.bank-filters .btn{margin-left:0}

/* Bank card list */
.bank-list-wrap{overflow-y:auto;max-height:calc(100vh - 240px)}
.bank-card{border:1px solid var(--gray-200);border-radius:var(--radius);background:var(--card-bg);margin-bottom:8px;overflow:hidden;transition:box-shadow .2s, border-color .2s}
.bank-card:hover{box-shadow:0 2px 12px rgba(0,0,0,.06);border-color:var(--gray-300)}
.bank-card-header{display:flex;align-items:center;gap:12px;padding:14px 16px;cursor:pointer;user-select:none;transition:background .15s}
.bank-card-header:hover{background:var(--primary-bg)}
.bank-card-check{flex-shrink:0}
.bank-card-check input{width:16px;height:16px;cursor:pointer}
.bank-card-summary{flex:1;display:flex;align-items:center;gap:8px;min-width:0;overflow:hidden}
.bank-card-id{font-size:12px;font-weight:700;color:var(--gray-400);min-width:36px}
.bank-card-question{flex:1;font-size:13px;color:var(--gray-700);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.bank-card-question .katex{font-size:0.85em}
.bank-card-meta{display:flex;align-items:center;gap:8px;flex-shrink:0}
.bank-card-meta .correct-badge{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:var(--success-bg);color:var(--success);font-weight:700;font-size:12px}
.bank-card-diff{font-size:11px;font-weight:600;padding:2px 8px;border-radius:10px}
.diff-easy{background:#dcfce7;color:#166534}
.diff-medium{background:#fef3c7;color:#92400e}
.diff-hard{background:#fee2e2;color:#991b1b}
.bank-card-arrow{font-size:16px;color:var(--gray-400);transition:transform .2s;flex-shrink:0}
.bank-card-header:hover .bank-card-arrow{color:var(--primary);transform:translateX(3px)}
.empty-cell{text-align:center;color:var(--gray-400);padding:40px 12px}

/* Range Select highlights */
.bank-card.range-start{border-color:var(--primary);box-shadow:0 0 0 2px rgba(79,70,229,.2)}
.bank-card.range-start .bank-card-id{color:var(--primary)}
.bank-card.range-end{border-color:var(--primary);box-shadow:0 0 0 2px rgba(79,70,229,.2)}
.bank-card.range-end .bank-card-id{color:var(--primary)}
.bank-card.range-middle{border-color:var(--primary-light);background:var(--primary-bg)}

/* Question Card Navigator - Full Screen Page */
#cardNavPage{position:fixed!important;top:0!important;left:0!important;right:0!important;bottom:0!important;width:100vw!important;height:100vh!important;z-index:9999!important;background:#05060F!important;overflow:hidden!important}
#flashcardPage{position:fixed!important;top:0!important;left:0!important;right:0!important;bottom:0!important;width:100vw!important;height:100vh!important;z-index:9999!important;background:#05060F!important;overflow:hidden!important}
.card-nav-page-layout{display:flex;flex-direction:column;height:100vh;width:100vw}
.card-nav-page-header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;border-bottom:1px solid var(--gray-200);background:var(--card-bg);flex-shrink:0}
.card-nav-page-title{font-size:20px;font-weight:700;color:var(--text)}
.card-nav-page-indicator{font-size:16px;font-weight:600;color:var(--primary);background:var(--primary-bg);padding:6px 16px;border-radius:20px}
.card-nav-page-body{flex:1;overflow-y:auto;padding:40px 60px;display:flex;justify-content:center;align-items:flex-start}
.card-nav-page-content{width:100%;max-width:900px}
.card-nav-page-footer{display:flex;justify-content:center;align-items:center;gap:40px;padding:20px 24px;border-top:1px solid var(--gray-200);background:var(--card-bg);flex-shrink:0}
.card-nav-page-btn{min-width:140px;padding:12px 24px;font-size:15px}
.card-nav-page-btn span{font-size:18px}
.card-nav-page-actions{display:flex;gap:12px;padding:16px 24px;border-top:1px solid var(--gray-100);background:var(--gray-50);justify-content:center;flex-shrink:0}
.card-nav-page-actions .btn{min-width:160px;padding:12px 24px;font-size:14px}

/* Single question card inside navigator */
.q-card-single{background:var(--card-bg);border:1px solid var(--gray-200);border-radius:16px;overflow:hidden;box-shadow:0 4px 20px rgba(0,0,0,0.08)}
.q-card-single-header{display:flex;align-items:center;gap:12px;padding:20px 24px;background:var(--gray-50);border-bottom:1px solid var(--gray-200)}
.q-card-single-id{font-size:16px;font-weight:700;color:var(--primary);min-width:50px}
.q-card-single-badges{display:flex;gap:8px;flex-wrap:wrap;flex:1}
.q-card-single-body{padding:32px 24px}
.q-card-single-question{font-size:18px;line-height:1.8;color:var(--text);margin-bottom:28px;word-break:break-word}
.q-card-single-question .katex{font-size:1em}
.q-card-single-options{display:grid;gap:12px}
.q-card-option{display:flex;align-items:flex-start;gap:12px;padding:16px 20px;border:1px solid var(--gray-200);border-radius:10px;font-size:15px;line-height:1.6;transition:all .15s}
.q-card-option.correct{background:var(--success-bg);border-color:var(--success);font-weight:600}
.q-card-option-letter{font-weight:700;color:var(--gray-500);min-width:24px}
.q-card-option.correct .q-card-option-letter{color:var(--success)}
.q-card-single-detail{margin-top:28px;padding-top:24px;border-top:1px solid var(--gray-200);display:flex;flex-direction:column;gap:16px}
.q-card-detail-row{display:flex;gap:16px;align-items:flex-start;font-size:14px}
.q-card-detail-label{font-weight:600;color:var(--gray-500);min-width:100px;text-transform:uppercase;font-size:12px;letter-spacing:.3px;padding-top:2px}
.q-card-detail-value{flex:1;color:var(--gray-700);line-height:1.7}
.q-card-detail-value .katex{font-size:0.95em}

/* Light theme adjustments */
[data-theme="light"] #cardNavPage{background:#F3F5FA}
[data-theme="light"] #flashcardPage{background:#F3F5FA}
[data-theme="light"] .card-nav-page-header,[data-theme="light"] .card-nav-page-footer{background:#fff}
[data-theme="light"] .q-card-single{background:#fff}

/* ===== Homework mode ===== */
.hw-date-group{margin-bottom:22px}
.hw-date-title{font-size:14px;font-weight:700;color:var(--gray-500);text-transform:uppercase;letter-spacing:.4px;margin-bottom:10px;display:flex;align-items:center;gap:8px}
.hw-date-title .badge{background:var(--primary-bg);color:var(--primary);border-radius:20px;padding:2px 10px;font-size:12px}
.hw-card{border:1px solid var(--gray-200);border-radius:var(--radius);background:var(--card-bg);margin-bottom:10px;overflow:hidden;transition:box-shadow .2s;position:relative}
.hw-card:hover{box-shadow:0 4px 16px rgba(0,0,0,.08)}
/* Homework: finished stamp (green, right side) */
.hw-stamp{position:absolute;top:50%;right:18px;transform:translateY(-50%) scale(0) rotate(-15deg);z-index:3;
  padding:4px 14px;border-radius:6px;border:2.5px solid rgba(57,255,20,.85);
  background:rgba(57,255,20,.1);color:var(--success);font-size:11px;font-weight:900;letter-spacing:2px;
  box-shadow:0 0 10px rgba(57,255,20,.4),0 0 20px rgba(57,255,20,.15),inset 0 0 8px rgba(57,255,20,.08);
  animation:hw-stamp-pop .6s cubic-bezier(.34,1.56,.64,1) forwards;pointer-events:none}
.hw-stamp span{line-height:1;text-shadow:0 0 6px rgba(57,255,20,.5)}
@keyframes hw-stamp-pop{0%{transform:translateY(-50%) scale(0) rotate(-30deg);opacity:0}
  50%{transform:translateY(-50%) scale(1.2) rotate(-10deg);opacity:1}
  70%{transform:translateY(-50%) scale(.9) rotate(-18deg)}
  100%{transform:translateY(-50%) scale(1) rotate(-15deg);opacity:1}}
.hw-card-head{display:flex;align-items:center;gap:12px;padding:14px 16px;cursor:pointer;user-select:none}
.hw-card-head:hover{background:var(--gray-50)}
.hw-card-open{border-color:var(--primary)}
.hw-card-name{font-size:15px;font-weight:700;color:var(--text)}
.hw-card-meta{font-size:12px;color:var(--gray-400);margin-top:2px}
.hw-card-actions{display:flex;gap:6px;flex-shrink:0}
.hw-card-body{border-top:1px solid var(--gray-200);padding:10px 16px;background:var(--primary-bg);animation:hwBodySlide .3s ease}
@keyframes hwBodySlide{from{opacity:0;max-height:0;padding-top:0;padding-bottom:0}to{opacity:1;max-height:2000px;padding-top:10px;padding-bottom:16px}}
/* Homework: Finished / Attempted badges */
.hw-finished-badge{display:inline-flex;align-items:center;gap:4px;margin-left:10px;padding:2px 10px;border-radius:20px;font-size:11px;font-weight:700;letter-spacing:.3px;
  background:rgba(57,255,20,.12);color:var(--success);border:1px solid rgba(57,255,20,.3);vertical-align:middle;
  animation:hwBadgePop .5s cubic-bezier(.34,1.56,.64,1) forwards}
.hw-attempted-badge{display:inline-flex;align-items:center;margin-left:10px;padding:2px 10px;border-radius:20px;font-size:11px;font-weight:600;
  background:rgba(0,229,255,.08);color:var(--neon-cyan);border:1px solid rgba(0,229,255,.2);vertical-align:middle}
.hw-card-finished{border-color:rgba(57,255,20,.35)!important;box-shadow:0 0 12px rgba(57,255,20,.08)}
@keyframes hwBadgePop{0%{transform:scale(0);opacity:0}60%{transform:scale(1.15)}100%{transform:scale(1);opacity:1}}
.hw-q-row{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid var(--gray-200);border-radius:8px;background:var(--card-bg);margin-bottom:6px;font-size:13px}
.hw-q-no{width:24px;height:24px;flex-shrink:0;border-radius:50%;background:var(--primary);color:#fff;font-size:12px;font-weight:700;display:inline-flex;align-items:center;justify-content:center}
.hw-q-text{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text)}
.hw-q-stats{font-size:11px;color:var(--gray-400);white-space:nowrap;flex-shrink:0}
.hw-q-answer{flex-shrink:0;font-weight:700;color:var(--success);min-width:20px;text-align:center}

/* Pagination */
.pagination{display:flex;justify-content:center;gap:8px;margin-top:20px}
.pagination button{padding:6px 14px;border:1px solid var(--gray-300);border-radius:var(--radius);background:white;font-size:14px;cursor:pointer;transition:all .2s}
.pagination button:hover{background:var(--gray-50)}
.pagination button.active{background:var(--primary);color:white;border-color:var(--primary)}
.page-sep{display:flex;align-items:center;padding:0 4px;color:var(--gray-500);font-size:14px;user-select:none}
.page-more-wrap{position:relative;display:inline-flex}
.page-more-btn{padding:6px 10px;border:1px solid var(--gray-300);border-radius:var(--radius);background:white;font-size:14px;cursor:pointer;transition:all .2s;letter-spacing:2px}
.page-more-btn:hover{background:var(--gray-50)}
.page-dropdown{display:none;position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);background:white;border:1px solid var(--gray-200);border-radius:var(--radius);box-shadow:0 4px 20px rgba(0,0,0,.12);padding:6px;z-index:100;max-height:220px;overflow-y:auto;min-width:60px;text-align:center}
.page-dropdown.open{display:flex;flex-direction:column;gap:4px}
.page-dropdown button{padding:4px 12px;border:none;border-radius:4px;background:transparent;font-size:13px;cursor:pointer;transition:all .15s;color:var(--gray-700)}
.page-dropdown button:hover{background:var(--gray-100);color:var(--primary)}
.page-dropdown button.active{background:var(--primary);color:white}

/* Stats */
.stats-dashboard{display:flex;gap:16px;margin-bottom:8px}
.stat-card{flex:1;background:var(--gray-50);border-radius:var(--radius-lg);padding:20px;text-align:center;border:1px solid var(--gray-200)}
.stat-card-value{display:block;font-size:28px;font-weight:700;color:var(--primary)}
.stat-card-label{font-size:13px;color:var(--gray-500);margin-top:4px}

/* Toast */
.toast-container{position:fixed;bottom:24px;right:24px;z-index:1000;display:flex;flex-direction:column;gap:8px}
.toast{padding:12px 20px;border-radius:var(--radius);font-size:14px;font-weight:500;box-shadow:var(--shadow-lg);animation:slideIn .3s ease;max-width:360px}
@keyframes slideIn{from{transform:translateX(100%);opacity:0}to{transform:translateX(0);opacity:1}}
.toast-success{background:var(--success);color:white}
.toast-error{background:var(--danger);color:white}
.toast-info{background:var(--primary);color:white}

/* AI Settings */
.ai-settings-btn{font-size:12px;padding:4px 10px;cursor:pointer;color:var(--gray-500);background:transparent;border:1px dashed var(--gray-300);border-radius:var(--radius);margin-top:8px;width:100%}
.ai-settings-btn:hover{border-color:var(--primary);color:var(--primary);background:var(--primary-bg)}
.ai-settings-panel{background:var(--gray-50);border:1px solid var(--gray-200);border-radius:var(--radius);padding:12px;margin-top:8px;font-size:13px}
.ai-settings-panel label{font-size:12px;font-weight:600;color:var(--gray-600);display:block;margin-bottom:4px;margin-top:8px}
.ai-settings-panel label:first-child{margin-top:0}
.ai-settings-panel input,.ai-settings-panel select{width:100%;padding:6px 8px;font-size:12px;border:1px solid var(--gray-300);border-radius:4px;font-family:inherit}
.ai-status{font-size:12px;padding:4px 8px;border-radius:4px;margin-top:6px}
.ai-status.success{background:var(--success-bg);color:#065F46}
.ai-status.error{background:var(--danger-bg);color:#991B1B}
.ai-status.pending{background:var(--primary-bg);color:var(--primary)}

/* Modal */
.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.5);z-index:200;display:flex;align-items:center;justify-content:center}
.modal-content{background:white;border-radius:var(--radius-lg);padding:24px;max-width:700px;width:90%;max-height:80vh;overflow-y:auto;box-shadow:var(--shadow-lg)}
.modal-content h2{font-size:18px;margin-bottom:12px}
.modal-content .form-group{margin-bottom:12px}
.modal-content .modal-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:16px}

/* Hidden */
.hidden{display:none!important}

/* Responsive */
@media(max-width:1150px){
    .nav-tab{padding:6px 8px;font-size:11px;letter-spacing:.3px;gap:4px}
    .nav-tab svg{width:14px;height:14px}
    .header-user{gap:6px}
    .header-inner{padding:0 10px}
}
@media(max-width:900px){
    .bank-layout{flex-direction:column}
    .bank-sidebar{width:100%;position:static;max-height:none}
    .form-row{flex-direction:column;gap:0}
    .header-inner{flex-direction:column;height:auto;padding:10px 12px;gap:8px}
    .nav-tabs{width:100%;justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:2px}
    .nav-tabs::-webkit-scrollbar{display:none}
    .nav-tab{flex-shrink:0}
    .header-user{width:100%;justify-content:center}
    .result-stats{gap:16px}
    .stats-dashboard{flex-direction:column}
    .bank-toolbar{flex-direction:column;align-items:flex-start}
    .bank-filters{flex-wrap:wrap;width:100%}
    .bank-filters input{flex:1}
}

/* ==================== CYBERPUNK NEON OVERRIDE ==================== */
:root{
    --primary:#00E5FF; --primary-light:#7DF9FF; --primary-dark:#00B8D4; --primary-bg:rgba(0,229,255,.10);
    --success:#39FF14; --success-bg:rgba(57,255,20,.10);
    --danger:#FF3B6B; --danger-bg:rgba(255,59,107,.10);
    --warning:#FFB300; --warning-bg:rgba(255,179,0,.10);
    --gray-50:#0A0C1B; --gray-100:#10132B; --gray-200:#1C2040; --gray-300:#2A2F5C; --gray-400:#5A6090;
    --gray-500:#8A90C0; --gray-600:#A5ABD8; --gray-700:#C6CBEF; --gray-800:#E3E6FF; --gray-900:#F0F2FF;
    --shadow-sm:none; --shadow:none; --shadow-md:0 0 20px rgba(0,229,255,.10); --shadow-lg:0 0 40px rgba(168,85,247,.16);
    --radius:8px; --radius-lg:14px;
    --neon-cyan:#00E5FF; --neon-purple:#A855F7; --neon-green:#39FF14;
}
body{background:#05060F;color:var(--gray-800);font-family:'Rajdhani','Share Tech Mono','Segoe UI','PingFang SC','Microsoft YaHei',sans-serif}
h1,h2,h3,.logo,.stat-value,.result-card h2,.setup-card h2{font-family:'Orbitron','Rajdhani',sans-serif;letter-spacing:1px}
h2{color:#fff;text-shadow:0 0 16px rgba(0,229,255,.35)}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:#0A0C1B}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#00B8D4,#7C3AED);border-radius:5px;border:2px solid #0A0C1B}

/* --- Background layer (static) --- */
.cyber-bg{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:
    radial-gradient(1200px 700px at 15% -10%,rgba(168,85,247,.18),transparent 60%),
    radial-gradient(1000px 620px at 110% 18%,rgba(0,229,255,.14),transparent 60%),
    radial-gradient(900px 700px at 50% 120%,rgba(57,255,20,.07),transparent 60%),
    #05060F}
.grid-layer{position:absolute;inset:-60%;background-image:linear-gradient(rgba(0,229,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(0,229,255,.05) 1px,transparent 1px);background-size:56px 56px;-webkit-mask-image:radial-gradient(ellipse at center,black 25%,transparent 72%);mask-image:radial-gradient(ellipse at center,black 25%,transparent 72%)}
.scanlines-layer{position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(0,229,255,.03) 0 1px,transparent 1px 3px);mix-blend-mode:screen}
.vignette{position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 55%,rgba(2,3,10,.8) 100%)}

/* --- Header --- */
.header{background:rgba(10,12,27,.72);backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);border-bottom:1px solid rgba(0,229,255,.25);box-shadow:0 0 30px rgba(0,229,255,.08)}
.header::after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:2px;background:linear-gradient(90deg,transparent,#00E5FF,#A855F7,#39FF14,transparent);opacity:.85;pointer-events:none}
.nav-tab{color:#fff;font-family:'Rajdhani',sans-serif;font-weight:600;letter-spacing:.6px;text-transform:uppercase;font-size:12px;border:1px solid transparent}
.nav-tab:hover{color:var(--neon-cyan);background:rgba(0,229,255,.08);border-color:rgba(0,229,255,.3)}
.nav-tab.active{background:rgba(0,229,255,.12);color:var(--neon-cyan);border-color:rgba(0,229,255,.5);box-shadow:0 0 18px rgba(0,229,255,.25),inset 0 0 14px rgba(0,229,255,.12)}

/* --- Card (glassmorphism) --- */
.card{position:relative;background:linear-gradient(160deg,rgba(16,19,43,.72),rgba(10,12,27,.6));backdrop-filter:blur(16px) saturate(130%);-webkit-backdrop-filter:blur(16px) saturate(130%);border:1px solid rgba(0,229,255,.18);box-shadow:0 0 24px rgba(0,229,255,.07),0 0 60px rgba(168,85,247,.06),inset 0 0 44px rgba(0,229,255,.03),inset 0 1px 0 rgba(255,255,255,.05)}
.card::after{content:'';position:absolute;top:0;left:10%;right:10%;height:1px;background:linear-gradient(90deg,transparent,rgba(0,229,255,.7),rgba(168,85,247,.7),transparent);pointer-events:none;opacity:.6}
.setup-desc{color:var(--gray-500)}

/* --- Buttons --- */
.btn{font-family:'Rajdhani',sans-serif;font-weight:700;letter-spacing:1px;text-transform:uppercase;border-radius:6px}
.btn-primary{background:linear-gradient(135deg,#00E5FF,#7C3AED);color:#fff;border:1px solid rgba(255,255,255,.25);box-shadow:0 0 16px rgba(0,229,255,.35),0 0 40px rgba(124,58,237,.25)}
.btn-primary:hover:not(:disabled){background:linear-gradient(135deg,#7DF9FF,#A855F7);box-shadow:0 0 26px rgba(0,229,255,.55),0 0 60px rgba(168,85,247,.4);transform:translateY(-1px)}
.btn-primary:disabled{filter:grayscale(.7) brightness(.6)}
.btn-outline{background:rgba(16,19,43,.5);color:var(--neon-cyan);border-color:rgba(0,229,255,.35);box-shadow:inset 0 0 12px rgba(0,229,255,.06)}
.btn-outline:hover:not(:disabled){background:rgba(0,229,255,.1);border-color:var(--neon-cyan);box-shadow:0 0 14px rgba(0,229,255,.35);color:#fff}
.btn-danger{background:linear-gradient(135deg,#FF3B6B,#7C3AED);color:#fff;border:1px solid rgba(255,59,107,.5);box-shadow:0 0 16px rgba(255,59,107,.3)}
.btn-danger:hover:not(:disabled){background:linear-gradient(135deg,#FF6B8D,#A855F7);box-shadow:0 0 24px rgba(255,59,107,.5)}

/* --- Forms --- */
.form-group label{color:var(--gray-600);font-family:'Rajdhani',sans-serif;letter-spacing:.8px;text-transform:uppercase;font-size:12px}
.form-group input,.form-group select,.form-group textarea{background:rgba(10,12,27,.65);color:var(--gray-800);border:1px solid rgba(0,229,255,.22);font-family:'Share Tech Mono','Consolas',monospace}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--neon-cyan);box-shadow:0 0 0 3px rgba(0,229,255,.12),0 0 18px rgba(0,229,255,.22);background:rgba(8,10,22,.92)}
.form-group select option{background:#10132B;color:var(--gray-800)}
.optional{color:var(--gray-500)}
.radio-label{background:rgba(10,12,27,.4);border:1px solid rgba(0,229,255,.2);color:var(--gray-700)}
.radio-label:hover{border-color:var(--neon-purple);background:rgba(168,85,247,.1);box-shadow:0 0 12px rgba(168,85,247,.22)}
.radio-label input[type=radio]{accent-color:var(--neon-cyan)}

/* --- Badges --- */
.badge{font-family:'Share Tech Mono',monospace;letter-spacing:1px;border:1px solid transparent}
.badge-subject{background:rgba(0,229,255,.12);color:var(--neon-cyan);border-color:rgba(0,229,255,.4);box-shadow:0 0 10px rgba(0,229,255,.18)}
.badge-topic{background:rgba(168,85,247,.12);color:#C084FC;border-color:rgba(168,85,247,.4);box-shadow:0 0 10px rgba(168,85,247,.18)}
.badge-difficulty{background:rgba(255,179,0,.1);color:var(--warning);border-color:rgba(255,179,0,.35)}
.badge-source{background:rgba(57,255,20,.1);color:var(--neon-green);border-color:rgba(57,255,20,.35)}
.badge-module{background:rgba(168,85,247,.16);color:#D8B4FE;border-color:rgba(168,85,247,.4)}

/* --- Control bar / timer / progress --- */
.quiz-control-bar{background:rgba(10,12,27,.7);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(0,229,255,.2);box-shadow:0 0 18px rgba(0,229,255,.08)}
.quiz-timer{color:var(--neon-cyan);text-shadow:0 0 10px rgba(0,229,255,.7);font-family:'Share Tech Mono','Consolas',monospace}
.quiz-timer.warning{color:var(--warning);text-shadow:0 0 10px rgba(255,179,0,.8)}
.quiz-timer.danger{color:var(--danger);text-shadow:0 0 12px rgba(255,59,107,.9)}
.timer-ms{color:var(--gray-400)}
.progress-text{color:var(--gray-500);font-family:'Share Tech Mono',monospace;letter-spacing:1px}
.progress-bar{background:rgba(0,229,255,.08);border:1px solid rgba(0,229,255,.15);box-shadow:inset 0 0 8px rgba(0,0,0,.5)}
.progress-fill{background:linear-gradient(90deg,#00E5FF,#7C3AED);box-shadow:0 0 12px rgba(0,229,255,.6)}

/* --- Questions --- */
.question-timer{background:rgba(10,12,27,.6);border:1px solid rgba(0,229,255,.18);font-family:'Share Tech Mono',monospace;color:var(--gray-700)}
.qt-label{color:var(--gray-500)}
.qt-time.tg-green{color:var(--neon-green);text-shadow:0 0 8px rgba(57,255,20,.6)}
.qt-time.tg-yellow{color:var(--warning);text-shadow:0 0 8px rgba(255,179,0,.6)}
.qt-time.tg-red{color:var(--danger);text-shadow:0 0 8px rgba(255,59,107,.7)}
.question-text{color:var(--gray-800)}
.question-image-container img{border-color:rgba(0,229,255,.25);box-shadow:0 0 20px rgba(0,229,255,.12)}

/* --- Options --- */
.option-item{background:rgba(12,14,32,.55);border:1px solid rgba(0,229,255,.22);box-shadow:inset 0 0 20px rgba(0,229,255,.04)}
.option-item:hover{border-color:var(--neon-cyan);background:rgba(0,229,255,.09);box-shadow:0 0 14px rgba(0,229,255,.22)}
.option-item.selected{border-color:var(--neon-cyan);background:rgba(0,229,255,.13);box-shadow:0 0 16px rgba(0,229,255,.35),inset 0 0 20px rgba(0,229,255,.08)}
.option-item.correct{border-color:var(--neon-green);background:rgba(57,255,20,.1);box-shadow:0 0 16px rgba(57,255,20,.3)}
.option-item.wrong{border-color:var(--danger);background:rgba(255,59,107,.1);box-shadow:0 0 16px rgba(255,59,107,.3)}
.option-item.correct::after{content:'\2713';color:var(--neon-green)}
.option-item.wrong::after{content:'\2717';color:var(--danger)}
.option-letter{background:rgba(0,229,255,.1);color:var(--neon-cyan);border:1px solid rgba(0,229,255,.3);font-family:'Orbitron',sans-serif}
.option-item.selected .option-letter{background:var(--neon-cyan);color:#05060F;box-shadow:0 0 12px rgba(0,229,255,.7)}
.option-item.correct .option-letter{background:var(--neon-green);color:#05060F;box-shadow:0 0 12px rgba(57,255,20,.7)}
.option-item.wrong .option-letter{background:var(--danger);color:#fff;box-shadow:0 0 12px rgba(255,59,107,.7)}
.option-text{color:var(--gray-700)}

/* --- Feedback --- */
.feedback-content.correct-feedback{background:rgba(57,255,20,.1);color:#C6FFC6;border:1px solid rgba(57,255,20,.45);box-shadow:0 0 18px rgba(57,255,20,.2)}
.feedback-content.wrong-feedback{background:rgba(255,59,107,.1);color:#FFC2D1;border:1px solid rgba(255,59,107,.45);box-shadow:0 0 18px rgba(255,59,107,.2)}

/* --- Pause overlay --- */
.pause-overlay{background:rgba(6,8,18,.88);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(0,229,255,.25)}
.pause-overlay-content h2{color:#fff;text-shadow:0 0 14px rgba(0,229,255,.8)}
.pause-overlay-content p{color:var(--gray-400)}
.pause-icon{filter:drop-shadow(0 0 10px rgba(0,229,255,.8))}

/* --- Answer sheet --- */
.answer-sheet h3{color:#fff;letter-spacing:1px}
.answer-sheet-item{background:rgba(12,14,32,.5);border:1px solid rgba(0,229,255,.25);color:var(--gray-400);font-family:'Share Tech Mono',monospace}
.answer-sheet-item:hover{border-color:var(--neon-cyan);box-shadow:0 0 10px rgba(0,229,255,.3)}
.answer-sheet-item.answered{background:linear-gradient(135deg,rgba(0,229,255,.25),rgba(124,58,237,.25));color:#fff;border-color:var(--neon-cyan);box-shadow:0 0 12px rgba(0,229,255,.4)}
.answer-sheet-item.current{border-color:var(--neon-purple);box-shadow:0 0 0 2px rgba(168,85,247,.4),0 0 14px rgba(168,85,247,.35)}

/* --- Results --- */
.result-icon{filter:drop-shadow(0 0 16px rgba(0,229,255,.6))}
.result-card h2{color:#fff;text-shadow:0 0 18px rgba(0,229,255,.7)}
.stat-value{color:var(--neon-cyan);text-shadow:0 0 14px rgba(0,229,255,.7);font-family:'Orbitron',sans-serif}
.stat-label{color:var(--gray-500)}
.review-item.review-correct{background:rgba(57,255,20,.09);border:1px solid rgba(57,255,20,.25)}
.review-item.review-wrong{background:rgba(255,59,107,.09);border:1px solid rgba(255,59,107,.25)}
.review-correct .review-number{background:var(--neon-green);color:#05060F;box-shadow:0 0 10px rgba(57,255,20,.6)}
.review-wrong .review-number{background:var(--danger);box-shadow:0 0 10px rgba(255,59,107,.6)}
.review-info{color:var(--gray-600)}
.review-info .your-answer{color:var(--gray-400)}
.review-info .correct-answer{color:var(--neon-green)}

/* --- Upload zone --- */
.upload-zone,.pdf-upload-zone{background:rgba(10,12,27,.45);border:2px dashed rgba(0,229,255,.3)}
.upload-zone:hover,.pdf-upload-zone:hover{border-color:var(--neon-cyan);background:rgba(0,229,255,.07);box-shadow:0 0 20px rgba(0,229,255,.15)}
.upload-zone p,.pdf-upload-zone p{color:var(--gray-600)}
.upload-zone span,.pdf-upload-zone span{color:var(--gray-500)}
.upload-preview{background:rgba(10,12,27,.5);border-color:rgba(0,229,255,.2)}
.spinner{border-color:rgba(0,229,255,.15);border-top-color:var(--neon-cyan);box-shadow:0 0 12px rgba(0,229,255,.2)}
.ocr-progress p,.pdf-progress p{color:var(--gray-500)}
.ocr-progress span,.pdf-progress span{color:var(--gray-500)}
.pdf-extracted-text{background:rgba(10,12,27,.6);border-color:rgba(0,229,255,.2);color:var(--gray-700)}

/* --- Question bank list --- */
.bank-toolbar h2{color:#fff;text-shadow:0 0 10px rgba(0,229,255,.4)}
.bank-filters select,.bank-filters input{background:rgba(10,12,27,.65);color:var(--gray-700);border:1px solid rgba(0,229,255,.2)}
.bank-filters select option{background:#10132B}
.bank-table th{color:var(--gray-400);border-bottom:2px solid rgba(0,229,255,.25);background:rgba(10,12,27,.5);letter-spacing:1.5px}
.bank-table td{color:var(--gray-600);border-bottom:1px solid rgba(0,229,255,.1)}
.bank-table tbody tr:hover{background:rgba(0,229,255,.04)}
.bank-table tbody tr.bank-row:hover{background:rgba(0,229,255,.08)}
.bank-table .empty-cell{color:var(--gray-500)}
.bank-table .correct-badge{background:rgba(57,255,20,.12);color:var(--neon-green);box-shadow:0 0 10px rgba(57,255,20,.3)}
.pagination button{background:rgba(12,14,32,.6);border:1px solid rgba(0,229,255,.25);color:var(--gray-500);font-family:'Share Tech Mono',monospace}
.pagination button:hover{background:rgba(0,229,255,.1);color:var(--neon-cyan)}
.pagination button.active{background:linear-gradient(135deg,rgba(0,229,255,.85),rgba(124,58,237,.85));color:#fff;border-color:transparent;box-shadow:0 0 14px rgba(0,229,255,.5)}
.page-sep{color:var(--gray-500)}
.page-more-btn{background:rgba(12,14,32,.6);border:1px solid rgba(0,229,255,.25);color:var(--gray-500);font-family:'Share Tech Mono',monospace}
.page-more-btn:hover{background:rgba(0,229,255,.1);color:var(--neon-cyan)}
.page-dropdown{background:rgba(10,12,27,.95);border:1px solid rgba(0,229,255,.2);box-shadow:0 4px 24px rgba(0,0,0,.5)}
.page-dropdown button{color:var(--gray-400)}
.page-dropdown button:hover{background:rgba(0,229,255,.1);color:var(--neon-cyan)}
.page-dropdown button.active{background:linear-gradient(135deg,rgba(0,229,255,.85),rgba(124,58,237,.85));color:#fff}

/* --- Stats cards --- */
.stat-card{background:rgba(10,12,27,.5);border:1px solid rgba(0,229,255,.18)}
.stat-card-value{color:var(--neon-cyan);text-shadow:0 0 14px rgba(0,229,255,.6)}
.stat-card-label{color:var(--gray-500)}

/* --- Toast --- */
.toast{font-family:'Rajdhani',sans-serif;font-weight:700;letter-spacing:.5px;border:1px solid;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.toast-success{background:rgba(57,255,20,.16);color:var(--neon-green);border-color:rgba(57,255,20,.5);box-shadow:0 0 20px rgba(57,255,20,.3)}
.toast-error{background:rgba(255,59,107,.16);color:#FF8099;border-color:rgba(255,59,107,.5);box-shadow:0 0 20px rgba(255,59,107,.3)}
.toast-info{background:rgba(0,229,255,.16);color:var(--neon-cyan);border-color:rgba(0,229,255,.5);box-shadow:0 0 20px rgba(0,229,255,.3)}

/* --- AI panel --- */
.ai-settings-btn{color:var(--gray-500);border:1px dashed rgba(0,229,255,.3)}
.ai-settings-btn:hover{border-color:var(--neon-cyan);color:var(--neon-cyan);background:rgba(0,229,255,.08)}
.ai-settings-panel{background:rgba(10,12,27,.6);border-color:rgba(0,229,255,.2)}
.ai-settings-panel label{color:var(--gray-500)}
.ai-settings-panel input,.ai-settings-panel select{background:rgba(8,10,22,.8);color:var(--gray-700);border-color:rgba(0,229,255,.2)}
.ai-status.success{background:rgba(57,255,20,.12);color:var(--neon-green)}
.ai-status.error{background:rgba(255,59,107,.12);color:#FF8099}
.ai-status.pending{background:rgba(0,229,255,.12);color:var(--neon-cyan)}

/* --- Modal --- */
.modal-overlay{background:rgba(4,6,14,.8);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.modal-content{background:linear-gradient(160deg,rgba(16,19,43,.92),rgba(10,12,27,.85));border:1px solid rgba(0,229,255,.25);box-shadow:0 0 40px rgba(0,229,255,.15),0 0 80px rgba(168,85,247,.12)}
.modal-content h2{color:#fff;text-shadow:0 0 12px rgba(0,229,255,.6)}

/* ==================== DAY MODE (light theme) ==================== */
/* Toggle button (works in both themes) */
.theme-toggle{display:flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:8px;cursor:pointer;flex-shrink:0;background:rgba(0,229,255,.06);border:1px solid rgba(0,229,255,.3);color:var(--neon-cyan);transition:all .2s}
.theme-toggle:hover{background:rgba(0,229,255,.12);box-shadow:0 0 14px rgba(0,229,255,.3)}
.theme-toggle .icon-moon{display:none}
.theme-toggle.dark-mode .icon-sun{display:block}
.theme-toggle.dark-mode .icon-moon{display:none}
.theme-toggle:not(.dark-mode) .icon-sun{display:none}
.theme-toggle:not(.dark-mode) .icon-moon{display:block}

/* Activate when <html data-theme="light"> */
:root[data-theme="light"]{
    --primary:#0891B2; --primary-light:#22D3EE; --primary-dark:#0E7490; --primary-bg:rgba(8,145,178,.08);
    --success:#059669; --success-bg:rgba(5,150,105,.1);
    --danger:#DC2626; --danger-bg:rgba(220,38,38,.08);
    --warning:#D97706; --warning-bg:rgba(217,119,6,.1);
    --gray-50:#F9FAFB; --gray-100:#F3F4F6; --gray-200:#E5E7EB; --gray-300:#D1D5DB;
    --gray-400:#9CA3AF; --gray-500:#6B7280; --gray-600:#4B5563; --gray-700:#374151; --gray-800:#1F2937; --gray-900:#111827;
    --shadow-sm:0 1px 2px rgba(0,0,0,0.05); --shadow:0 1px 3px rgba(0,0,0,0.1),0 1px 2px rgba(0,0,0,0.06);
    --shadow-md:0 4px 6px -1px rgba(0,0,0,0.1); --shadow-lg:0 10px 15px -3px rgba(0,0,0,0.1);
    --neon-cyan:#0891B2; --neon-purple:#7C3AED; --neon-green:#059669;
}
[data-theme="light"] body{background:#F3F5FA;color:var(--gray-800)}
[data-theme="light"] h2{color:var(--gray-900);text-shadow:none}
[data-theme="light"] ::-webkit-scrollbar-track{background:#E5E7EB}
[data-theme="light"] ::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#0891B2,#7C3AED);border:2px solid #E5E7EB}

/* Background layers hidden in day mode */
[data-theme="light"] .cyber-bg{display:none}

/* Header */
[data-theme="light"] .header{background:rgba(255,255,255,.88);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid var(--gray-200);box-shadow:var(--shadow-sm)}
[data-theme="light"] .header::after{opacity:.25}
[data-theme="light"] .logo{color:var(--gray-900);text-shadow:none}
[data-theme="light"] .nav-tab{color:var(--gray-600)}
[data-theme="light"] .nav-tab:hover{color:var(--neon-purple);background:var(--gray-100);border-color:transparent}
[data-theme="light"] .nav-tab.active{background:var(--primary-bg);color:var(--primary-dark);border-color:transparent;box-shadow:none}
[data-theme="light"] .theme-toggle{background:#fff;border:1px solid var(--gray-300);color:var(--gray-600)}
[data-theme="light"] .theme-toggle:hover{border-color:var(--neon-cyan);color:var(--primary-dark);background:var(--primary-bg);box-shadow:none}

/* Cards */
[data-theme="light"] .card{background:#fff;backdrop-filter:none;-webkit-backdrop-filter:none;border:1px solid var(--gray-200);box-shadow:var(--shadow)}
[data-theme="light"] .card::after{opacity:.3}

/* Buttons */
[data-theme="light"] .btn-primary{background:linear-gradient(135deg,#0E7490,#7C3AED);color:#fff;border:1px solid rgba(0,0,0,.08);box-shadow:0 4px 14px rgba(14,116,144,.25)}
[data-theme="light"] .btn-primary:hover:not(:disabled){background:linear-gradient(135deg,#0891B2,#8B5CF6);box-shadow:0 6px 20px rgba(8,145,178,.35);transform:translateY(-1px)}
[data-theme="light"] .btn-primary:disabled{filter:grayscale(.7) opacity(.6)}
[data-theme="light"] .btn-outline{background:#fff;color:var(--primary-dark);border-color:var(--gray-300);box-shadow:none}
[data-theme="light"] .btn-outline:hover:not(:disabled){background:var(--primary-bg);border-color:var(--neon-cyan);color:var(--primary-dark);box-shadow:0 2px 8px rgba(8,145,178,.2)}
[data-theme="light"] .btn-danger{background:linear-gradient(135deg,#DC2626,#7C3AED);color:#fff;border:1px solid transparent;box-shadow:0 4px 14px rgba(220,38,38,.25)}

/* Forms */
[data-theme="light"] .form-group label{color:var(--gray-600)}
[data-theme="light"] .form-group input,[data-theme="light"] .form-group select,[data-theme="light"] .form-group textarea{background:#fff;color:var(--gray-800);border:1px solid var(--gray-300)}
[data-theme="light"] .form-group input:focus,[data-theme="light"] .form-group select:focus,[data-theme="light"] .form-group textarea:focus{border-color:var(--neon-cyan);box-shadow:0 0 0 3px rgba(8,145,178,.12);background:#fff}
[data-theme="light"] .form-group select option{background:#fff;color:var(--gray-800)}
[data-theme="light"] .radio-label{background:#fff;border:1px solid var(--gray-200);color:var(--gray-700)}
[data-theme="light"] .radio-label:hover{border-color:var(--neon-purple);background:var(--primary-bg);box-shadow:none}

/* Badges */
[data-theme="light"] .badge-subject{background:var(--primary-bg);color:var(--primary-dark);border-color:transparent;box-shadow:none}
[data-theme="light"] .badge-topic{background:rgba(124,58,237,.1);color:#6D28D9;border-color:transparent;box-shadow:none}
[data-theme="light"] .badge-difficulty{background:var(--warning-bg);color:var(--warning);border-color:transparent;box-shadow:none}
[data-theme="light"] .badge-source{background:rgba(5,150,105,.1);color:var(--success);border-color:transparent;box-shadow:none}
[data-theme="light"] .badge-module{background:rgba(124,58,237,.12);color:#6D28D9;border-color:transparent;box-shadow:none}

/* Control bar / timer / progress */
[data-theme="light"] .quiz-control-bar{background:rgba(255,255,255,.92);backdrop-filter:none;-webkit-backdrop-filter:none;border:1px solid var(--gray-200);box-shadow:var(--shadow-sm)}
[data-theme="light"] .quiz-timer{color:var(--primary-dark);text-shadow:none}
[data-theme="light"] .quiz-timer.warning{color:var(--warning);text-shadow:none}
[data-theme="light"] .quiz-timer.danger{color:var(--danger);text-shadow:none}
[data-theme="light"] .timer-ms{color:var(--gray-500)}
[data-theme="light"] .progress-bar{background:var(--gray-100);border:1px solid var(--gray-200);box-shadow:none}
[data-theme="light"] .progress-fill{background:linear-gradient(90deg,#0891B2,#7C3AED);box-shadow:none}

/* Questions */
[data-theme="light"] .question-timer{background:var(--gray-50);border:1px solid var(--gray-200);color:var(--gray-600)}
[data-theme="light"] .qt-time.tg-green{color:var(--success);text-shadow:none}
[data-theme="light"] .qt-time.tg-yellow{color:var(--warning);text-shadow:none}
[data-theme="light"] .qt-time.tg-red{color:var(--danger);text-shadow:none}
[data-theme="light"] .question-text{color:var(--gray-800)}
[data-theme="light"] .question-image-container img{border-color:var(--gray-300);box-shadow:var(--shadow-sm)}

/* Options */
[data-theme="light"] .option-item{background:#fff;border:1px solid var(--gray-200);box-shadow:none}
[data-theme="light"] .option-item:hover{border-color:var(--neon-cyan);background:var(--primary-bg);box-shadow:0 2px 8px rgba(8,145,178,.15)}
[data-theme="light"] .option-item.selected{border-color:var(--neon-cyan);background:rgba(8,145,178,.1);box-shadow:0 0 0 2px rgba(8,145,178,.25)}
[data-theme="light"] .option-item.correct{border-color:var(--success);background:rgba(5,150,105,.08)}
[data-theme="light"] .option-item.wrong{border-color:var(--danger);background:rgba(220,38,38,.08)}
[data-theme="light"] .option-item.correct::after{color:var(--success)}
[data-theme="light"] .option-item.wrong::after{color:var(--danger)}
[data-theme="light"] .option-letter{background:var(--primary-bg);color:var(--primary-dark);border:1px solid rgba(8,145,178,.3)}
[data-theme="light"] .option-item.selected .option-letter{background:var(--primary-dark);color:#fff;box-shadow:none}
[data-theme="light"] .option-item.correct .option-letter{background:var(--success);color:#fff;box-shadow:none}
[data-theme="light"] .option-item.wrong .option-letter{background:var(--danger);color:#fff;box-shadow:none}
[data-theme="light"] .option-text{color:var(--gray-700)}

/* Feedback */
[data-theme="light"] .feedback-content.correct-feedback{background:var(--success-bg);color:#065F46;border:1px solid rgba(5,150,105,.4);box-shadow:none}
[data-theme="light"] .feedback-content.wrong-feedback{background:var(--danger-bg);color:#B91C1C;border:1px solid rgba(220,38,38,.4);box-shadow:none}

/* Pause overlay */
[data-theme="light"] .pause-overlay{background:rgba(255,255,255,.94);backdrop-filter:none;-webkit-backdrop-filter:none;border:1px solid var(--gray-200)}
[data-theme="light"] .pause-overlay-content h2{color:var(--gray-900);text-shadow:none}
[data-theme="light"] .pause-overlay-content p{color:var(--gray-600)}
[data-theme="light"] .pause-icon{filter:none}

/* Answer sheet */
[data-theme="light"] .answer-sheet h3{color:var(--gray-900)}
[data-theme="light"] .answer-sheet-item{background:#fff;border:1px solid var(--gray-200);color:var(--gray-600)}
[data-theme="light"] .answer-sheet-item:hover{border-color:var(--neon-cyan);box-shadow:0 2px 8px rgba(8,145,178,.15)}
[data-theme="light"] .answer-sheet-item.answered{background:linear-gradient(135deg,rgba(8,145,178,.14),rgba(124,58,237,.14));color:var(--gray-900);border-color:var(--neon-cyan);box-shadow:none}
[data-theme="light"] .answer-sheet-item.current{border-color:var(--neon-purple);box-shadow:0 0 0 2px rgba(124,58,237,.3)}

/* Results */
[data-theme="light"] .result-icon{filter:none}
[data-theme="light"] .result-card h2{color:var(--gray-900);text-shadow:none}
[data-theme="light"] .stat-value{color:var(--primary-dark);text-shadow:none}
[data-theme="light"] .review-item.review-correct{background:var(--success-bg);border:1px solid rgba(5,150,105,.25)}
[data-theme="light"] .review-item.review-wrong{background:var(--danger-bg);border:1px solid rgba(220,38,38,.25)}
[data-theme="light"] .review-correct .review-number{background:var(--success);color:#fff;box-shadow:none}
[data-theme="light"] .review-wrong .review-number{background:var(--danger);box-shadow:none}
[data-theme="light"] .review-info .your-answer{color:var(--gray-600)}
[data-theme="light"] .review-info .correct-answer{color:var(--success)}

/* Upload zone */
[data-theme="light"] .upload-zone,[data-theme="light"] .pdf-upload-zone{background:#fff;border:2px dashed var(--gray-300)}
[data-theme="light"] .upload-zone:hover,[data-theme="light"] .pdf-upload-zone:hover{border-color:var(--neon-cyan);background:var(--primary-bg);box-shadow:none}
[data-theme="light"] .upload-zone p,[data-theme="light"] .pdf-upload-zone p{color:var(--gray-600)}
[data-theme="light"] .upload-zone span,[data-theme="light"] .pdf-upload-zone span{color:var(--gray-500)}
[data-theme="light"] .upload-preview{background:#fff;border-color:var(--gray-200)}
[data-theme="light"] .spinner{border-color:var(--gray-200);border-top-color:var(--neon-cyan);box-shadow:none}
[data-theme="light"] .ocr-progress p,[data-theme="light"] .pdf-progress p{color:var(--gray-600)}
[data-theme="light"] .ocr-progress span,[data-theme="light"] .pdf-progress span{color:var(--gray-600)}
[data-theme="light"] .pdf-extracted-text{background:var(--gray-50);border-color:var(--gray-200);color:var(--gray-700)}

/* Question bank list */
[data-theme="light"] .bank-toolbar h2{color:var(--gray-900);text-shadow:none}
[data-theme="light"] .bank-filters select,[data-theme="light"] .bank-filters input{background:#fff;color:var(--gray-700);border:1px solid var(--gray-300)}
[data-theme="light"] .bank-filters select option{background:#fff}
[data-theme="light"] .bank-table th{color:var(--gray-600);border-bottom:2px solid var(--gray-300);background:var(--gray-50);letter-spacing:1.5px}
[data-theme="light"] .bank-table td{color:var(--gray-700);border-bottom:1px solid var(--gray-100)}
[data-theme="light"] .bank-table tbody tr:hover{background:var(--gray-50)}
[data-theme="light"] .bank-table tbody tr.bank-row:hover{background:var(--primary-bg)}
[data-theme="light"] .bank-table .empty-cell{color:var(--gray-500)}
[data-theme="light"] .bank-table .correct-badge{background:var(--success-bg);color:var(--success);box-shadow:none}
[data-theme="light"] .pagination button{background:#fff;border:1px solid var(--gray-200);color:var(--gray-500)}
[data-theme="light"] .pagination button:hover{background:var(--primary-bg);color:var(--primary-dark)}
[data-theme="light"] .pagination button.active{background:linear-gradient(135deg,rgba(8,145,178,.9),rgba(124,58,237,.9));color:#fff;border-color:transparent;box-shadow:none}
[data-theme="light"] .page-more-btn{background:#fff;border:1px solid var(--gray-200);color:var(--gray-500)}
[data-theme="light"] .page-more-btn:hover{background:var(--primary-bg);color:var(--primary-dark)}
[data-theme="light"] .page-dropdown{background:#fff;border:1px solid var(--gray-200);box-shadow:0 4px 16px rgba(0,0,0,.1)}
[data-theme="light"] .page-dropdown button{color:var(--gray-600)}
[data-theme="light"] .page-dropdown button:hover{background:var(--primary-bg);color:var(--primary-dark)}
[data-theme="light"] .page-dropdown button.active{background:linear-gradient(135deg,rgba(8,145,178,.9),rgba(124,58,237,.9));color:#fff}

/* Stats cards */
[data-theme="light"] .stat-card{background:#fff;border:1px solid var(--gray-200)}
[data-theme="light"] .stat-card-value{color:var(--primary-dark);text-shadow:none}

/* Toast */
[data-theme="light"] .toast-success{background:#fff;color:var(--success);border-color:rgba(5,150,105,.45);box-shadow:var(--shadow-md)}
[data-theme="light"] .toast-error{background:#fff;color:var(--danger);border-color:rgba(220,38,38,.45);box-shadow:var(--shadow-md)}
[data-theme="light"] .toast-info{background:#fff;color:var(--primary-dark);border-color:rgba(8,145,178,.45);box-shadow:var(--shadow-md)}

/* AI panel */
[data-theme="light"] .ai-settings-btn{color:var(--gray-500);border:1px dashed var(--gray-300)}
[data-theme="light"] .ai-settings-btn:hover{border-color:var(--neon-cyan);color:var(--primary-dark);background:var(--primary-bg)}
[data-theme="light"] .ai-settings-panel{background:#fff;border-color:var(--gray-200)}
[data-theme="light"] .ai-settings-panel label{color:var(--gray-600)}
[data-theme="light"] .ai-settings-panel input,[data-theme="light"] .ai-settings-panel select{background:#fff;color:var(--gray-700);border-color:var(--gray-300)}
[data-theme="light"] .ai-status.success{background:var(--success-bg);color:var(--success)}
[data-theme="light"] .ai-status.error{background:var(--danger-bg);color:var(--danger)}
[data-theme="light"] .ai-status.pending{background:var(--primary-bg);color:var(--primary-dark)}

/* Modal */
[data-theme="light"] .modal-overlay{background:rgba(15,23,42,.4);backdrop-filter:none;-webkit-backdrop-filter:none}
[data-theme="light"] .modal-content{background:#fff;border:1px solid var(--gray-200);box-shadow:var(--shadow-lg)}
[data-theme="light"] .modal-content h2{color:var(--gray-900);text-shadow:none}

/* ==================== Custom confirm dialog ====================
   Replaces native confirm(), which is unreliable inside embedded webviews
   (it may return false without ever showing the dialog). */
.confirm-mask{position:fixed;inset:0;background:rgba(0,0,0,.55);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;z-index:9999}
.confirm-box{background:linear-gradient(160deg,rgba(16,19,43,.96),rgba(10,12,27,.9));border:1px solid var(--neon-cyan);border-radius:var(--radius);padding:20px;max-width:420px;width:90%;box-shadow:0 0 30px rgba(0,229,255,.25);animation:confirm-in .18s ease}
@keyframes confirm-in{from{transform:scale(.96);opacity:0}to{transform:scale(1);opacity:1}}
.confirm-msg{color:#F0F2FF;font-size:15px;line-height:1.5;margin:0 0 18px}
.confirm-actions{display:flex;justify-content:flex-end;gap:8px}
[data-theme="light"] .confirm-box{background:#fff;border-color:var(--gray-300);box-shadow:var(--shadow-lg)}
[data-theme="light"] .confirm-msg{color:var(--gray-800)}

/* ==================== Account login / register ==================== */
.header-user{display:flex;align-items:center;gap:8px;flex-shrink:0}
.user-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;font-size:13px;font-weight:600;color:var(--neon-green);background:rgba(57,255,20,.08);border:1px solid rgba(57,255,20,.35);border-radius:20px;white-space:nowrap}
.auth-modal{max-width:420px}
.auth-tabs{display:flex;gap:4px;margin:4px 0 16px;padding:4px;background:rgba(10,12,27,.6);border:1px solid rgba(0,229,255,.15);border-radius:var(--radius)}
.auth-tab-btn{flex:1;padding:8px;border:none;background:transparent;color:var(--gray-400);font-size:13px;font-weight:600;cursor:pointer;border-radius:6px;transition:all .2s}
.auth-tab-btn:hover{color:var(--gray-700)}
.auth-tab-btn.active{background:rgba(0,229,255,.14);color:var(--neon-cyan);box-shadow:0 0 12px rgba(0,229,255,.2)}
.auth-note{font-size:12.5px;color:var(--gray-400);line-height:1.5;margin:0 0 14px}
.auth-error{background:rgba(255,70,90,.12);border:1px solid rgba(255,70,90,.4);color:var(--danger);font-size:13px;padding:8px 12px;border-radius:var(--radius);margin-bottom:12px}
.auth-label{display:block;font-size:12px;font-weight:600;color:var(--gray-400);margin:0 0 4px;text-transform:uppercase;letter-spacing:.4px}
.auth-input{width:100%;box-sizing:border-box;padding:9px 12px;font-size:14px;margin-bottom:12px;border:1px solid var(--gray-300);border-radius:var(--radius);background:rgba(10,12,27,.65);color:var(--gray-700);transition:border-color .2s, box-shadow .2s}
.auth-input:focus{outline:none;border-color:var(--neon-cyan);box-shadow:0 0 0 3px rgba(0,229,255,.15)}
.auth-submit{width:100%;margin-top:4px}
[data-theme="light"] .auth-tabs{background:var(--gray-100);border-color:var(--gray-200)}
[data-theme="light"] .auth-tab-btn.active{background:var(--primary-bg);color:var(--primary-dark);box-shadow:none}
[data-theme="light"] .auth-input{background:#fff;color:var(--gray-800);border:1px solid var(--gray-300)}
[data-theme="light"] .user-badge{color:var(--success);background:var(--success-bg);border-color:rgba(5,150,105,.4)}

/* ==================== Dashboard ==================== */
.dash-hero{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:16px;
    background:linear-gradient(135deg,rgba(10,12,27,.92),rgba(28,32,64,.88));
    border:1px solid rgba(0,229,255,.3);border-radius:var(--radius-lg);padding:26px 30px;
    box-shadow:0 0 34px rgba(0,229,255,.12),inset 0 0 60px rgba(168,85,247,.06)}
.dash-hero::before{content:"";position:absolute;inset:0;background:radial-gradient(600px 160px at 12% -20%,rgba(0,229,255,.16),transparent 60%),radial-gradient(500px 180px at 88% 120%,rgba(168,85,247,.18),transparent 60%);pointer-events:none}
.dash-hero-text{position:relative;z-index:1}
.dash-hero-text h1{font-size:26px;margin:0 0 4px;color:#F0F2FF;text-shadow:0 0 18px rgba(0,229,255,.45)}
.dash-hero-text h1 span{color:var(--neon-green,#39FF14);text-shadow:0 0 16px rgba(57,255,20,.55)}
.dash-hero-text p{margin:0;font-size:13.5px;color:var(--gray-400)}

/* streak flame */
.dash-hero-right{position:relative;z-index:1;display:flex;align-items:center;gap:16px}

/* exam countdown */
.exam-countdown{display:flex;align-items:center;gap:10px;padding:10px 18px;
    background:rgba(10,12,27,.6);border:1px solid rgba(0,229,255,.3);border-radius:14px;
    box-shadow:0 0 20px rgba(0,229,255,.15)}
.exam-cd-icon{font-size:24px;line-height:1;filter:drop-shadow(0 0 6px rgba(0,229,255,.6))}
.exam-cd-body{display:flex;flex-direction:column;gap:1px}
.exam-cd-title{font-size:10px;letter-spacing:1px;text-transform:uppercase;color:var(--gray-400)}
.exam-cd-time{font-size:15px;font-weight:800;color:var(--neon-cyan,#00E5FF);text-shadow:0 0 10px rgba(0,229,255,.4);font-variant-numeric:tabular-nums}

.dash-streak{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:120px;padding:12px 22px;
    background:rgba(10,12,27,.6);border:1px solid rgba(255,64,129,.35);border-radius:16px;box-shadow:0 0 26px rgba(255,64,129,.25)}
.streak-flame{font-size:30px;line-height:1;animation:streak-flicker 2.2s ease-in-out infinite;filter:drop-shadow(0 0 8px rgba(255,140,0,.8))}
.streak-flame-off{animation:none;filter:grayscale(.9) brightness(.7)}
@keyframes streak-flicker{0%,100%{transform:scale(1) rotate(-2deg)}50%{transform:scale(1.14) rotate(2deg)}}
.streak-num{font-size:34px;font-weight:800;line-height:1.05;color:#FF5E7A;background:linear-gradient(180deg,#FFC36B,#FF5E7A);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 12px rgba(255,94,122,.5))}
.streak-label{font-size:11px;letter-spacing:1.2px;text-transform:uppercase;color:var(--gray-400);margin-top:2px}
.streak-makeup-link{font-size:11px;color:var(--warning);cursor:pointer;margin-top:6px;opacity:.85;transition:opacity .2s;text-align:center}
.streak-makeup-link:hover{opacity:1;text-decoration:underline}

/* stat cards with glow */
.dash-stats{margin-bottom:16px}
.glow-cyan{--glow:rgba(0,229,255,.4);border-color:rgba(0,229,255,.35)!important}
.glow-green{--glow:rgba(57,255,20,.35);border-color:rgba(57,255,20,.32)!important}
.glow-purple{--glow:rgba(168,85,247,.4);border-color:rgba(168,85,247,.35)!important}
.glow-gold{--glow:rgba(255,170,0,.4);border-color:rgba(255,170,0,.32)!important}
.dash-stats .stat-card{position:relative;background:rgba(16,19,43,.7);border:1px solid rgba(255,255,255,.08);box-shadow:0 0 18px var(--glow);transition:transform .2s,box-shadow .2s}
.dash-stats .stat-card:hover{transform:translateY(-3px);box-shadow:0 6px 26px var(--glow)}
.dash-stats .stat-card-value{color:#F0F2FF;text-shadow:0 0 14px var(--glow)}

/* heatmap */
.dash-heatmap-card{margin-bottom:16px;background:rgba(10,12,27,.82);border:1px solid rgba(0,229,255,.18)}
.dash-section-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.dash-section-head h2{margin:0;font-size:17px;color:#E8EBFF}
.dash-sub{font-size:12px;color:var(--gray-400)}
.hm-wrap{position:relative;padding-top:18px}
.hm-months{position:relative;height:14px;margin:0 0 4px 34px}
.hm-months span{position:absolute;top:0;font-size:10px;color:var(--gray-400);transform:translateX(-8%);white-space:nowrap}
.hm-body{display:flex;gap:8px}
.hm-days{display:flex;flex-direction:column;justify-content:space-between;width:26px;padding:1px 0;font-size:10px;color:var(--gray-400);text-align:right}
.hm-grid{display:grid;grid-template-rows:repeat(7,16px);grid-auto-flow:column;gap:4px;flex:1}
.hm-cell{height:16px;border-radius:3px;background:rgba(255,255,255,.07)}
.hm-l1{background:rgba(0,229,255,.32)!important}
.hm-l2{background:rgba(0,229,255,.62)!important;box-shadow:0 0 6px rgba(0,229,255,.35)}
.hm-l3{background:rgba(57,255,20,.5)!important;box-shadow:0 0 6px rgba(57,255,20,.3)}
.hm-l4{background:rgba(168,85,247,.75)!important;box-shadow:0 0 8px rgba(168,85,247,.55)}
.hm-today{outline:1.5px solid rgba(255,255,255,.75);outline-offset:1px}
.hm-future{opacity:.25}
.hm-exam{outline:2px solid #FF5E7A;outline-offset:1px;box-shadow:0 0 10px rgba(255,94,122,.5)!important}
.hm-legend{display:flex;align-items:center;gap:4px;justify-content:flex-end;margin-top:10px;font-size:11px;color:var(--gray-400)}
.hm-legend i{width:10px;height:10px;border-radius:2px;display:inline-block}
.hm-legend .hm-l0{background:rgba(255,255,255,.07)}
.hm-legend .hm-l1{background:rgba(0,229,255,.32)}
.hm-legend .hm-l2{background:rgba(0,229,255,.62)}
.hm-legend .hm-l3{background:rgba(57,255,20,.5)}
.hm-legend .hm-l4{background:rgba(168,85,247,.75)}
/* Heatmap stamp: appears on today's cell when all check-in tasks confirmed */
.hm-complete{position:relative}
.hm-stamp{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(0) rotate(-180deg);width:18px;height:18px;border-radius:50%;
  background:radial-gradient(circle,rgba(0,229,255,.95),rgba(0,180,220,.9));
  border:1.5px solid rgba(255,255,255,.85);display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:10px;font-weight:900;z-index:2;
  box-shadow:0 0 8px rgba(0,229,255,.7),0 0 16px rgba(0,229,255,.3);
  animation:hm-stamp-pop .6s cubic-bezier(.34,1.56,.64,1) forwards}
.hm-stamp span{line-height:1}
.hm-complete::after{content:'';position:absolute;inset:-3px;border-radius:4px;
  border:1.5px solid rgba(0,229,255,.5);animation:hm-stamp-ring .8s ease-out forwards;pointer-events:none}
@keyframes hm-stamp-pop{0%{transform:translate(-50%,-50%) scale(0) rotate(-180deg);opacity:0}
  60%{transform:translate(-50%,-50%) scale(1.25) rotate(10deg);opacity:1}
  80%{transform:translate(-50%,-50%) scale(.92) rotate(-5deg)}
  100%{transform:translate(-50%,-50%) scale(1) rotate(0deg);opacity:1}}
@keyframes hm-stamp-ring{0%{opacity:0;transform:scale(.5)}30%{opacity:1}100%{opacity:0;transform:scale(1.3)}}
/* Heatmap: clickable incomplete cells */
.hm-clickable{cursor:pointer;transition:transform .15s,box-shadow .15s}
.hm-clickable:hover{transform:scale(1.35);z-index:3;box-shadow:0 0 8px rgba(255,255,255,.3)}
/* Heatmap: make-up stamp (amber/orange) */
.hm-madeup{position:relative}
.hm-makeup-stamp{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(0) rotate(-180deg);width:18px;height:18px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,170,0,.95),rgba(220,140,0,.9));
  border:1.5px solid rgba(255,255,255,.85);display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:10px;font-weight:900;z-index:2;
  box-shadow:0 0 8px rgba(255,170,0,.7),0 0 16px rgba(255,170,0,.3);
  animation:hm-stamp-pop .6s cubic-bezier(.34,1.56,.64,1) forwards}
.hm-madeup::after{content:'';position:absolute;inset:-3px;border-radius:4px;
  border:1.5px dashed rgba(255,170,0,.5);animation:hm-stamp-ring .8s ease-out forwards;pointer-events:none}
/* Make-up completion celebration pulse */
.hm-makeup-celebrate{animation:hm-makeup-pulse 2.4s ease-in-out;z-index:5}
@keyframes hm-makeup-pulse{
  0%{transform:scale(1);box-shadow:0 0 0 rgba(255,170,0,0)}
  15%{transform:scale(1.8);box-shadow:0 0 18px rgba(255,170,0,.8),0 0 36px rgba(255,170,0,.4)}
  30%{transform:scale(1.3);box-shadow:0 0 10px rgba(255,170,0,.5)}
  45%{transform:scale(1.6);box-shadow:0 0 14px rgba(255,170,0,.6)}
  60%{transform:scale(1.2);box-shadow:0 0 6px rgba(255,170,0,.3)}
  100%{transform:scale(1);box-shadow:0 0 0 rgba(255,170,0,0)}}

/* two-column row */
.dash-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.dash-grid-2 .card{background:rgba(10,12,27,.82);border:1px solid rgba(0,229,255,.18)}

/* subject bars */
.dash-subj{margin-bottom:14px}
.dash-subj:last-child{margin-bottom:0}
.dash-subj-row{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:5px}
.dash-subj-name{font-size:13.5px;font-weight:600;color:#E8EBFF}
.dash-subj-num{font-size:12px;color:var(--gray-400)}
.dash-bar{height:8px;background:rgba(255,255,255,.07);border-radius:99px;overflow:hidden}
.dash-bar-fill{height:100%;border-radius:99px;background:linear-gradient(90deg,var(--neon-cyan,#00E5FF),var(--neon-green,#39FF14));box-shadow:0 0 10px rgba(0,229,255,.5);transition:width .6s ease}

/* sparkline */
.dash-spark-head{display:flex;justify-content:space-between;font-size:12.5px;color:var(--gray-400);margin-bottom:8px}
.dash-spark-head b{color:#E8EBFF}
.trend-up{color:var(--neon-green,#39FF14)!important}
.trend-down{color:#FF5E7A!important}
.dash-spark{width:100%;height:110px;display:block}
.dash-avg-line{stroke:rgba(255,255,255,.25);stroke-width:1;stroke-dasharray:3 4}
.dash-dot{fill:var(--neon-cyan,#00E5FF);stroke:rgba(10,12,27,.9);stroke-width:1;transition:r .15s}
.dash-spark:hover .dash-dot:hover{r:4}
.dash-spark-dates{display:flex;justify-content:space-between;font-size:11px;color:var(--gray-400);margin-top:6px}
.dash-nodata{color:var(--gray-400);font-size:13.5px;margin:0;padding:18px 0;text-align:center}
.dash-empty{text-align:center;padding:50px 24px}

/* Quick Review card */
.dash-review-card .dash-sub{margin-top:2px}
.dash-review-card .btn-primary{box-shadow:0 0 14px rgba(0,229,255,.25)}

/* Wrong book: date-grouped + mastery */
.wb-date-group{border:1px solid var(--gray-200);border-radius:var(--radius);margin-bottom:8px;overflow:hidden}
.wb-date-head{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;background:var(--gray-50);cursor:pointer;user-select:none}
.wb-date-group:hover{border-color:rgba(0,229,255,.4)}
.wb-caret{transition:transform .2s;color:var(--gray-400);font-size:12px}
.wb-date-body{padding:4px 12px 8px}
.wb-date-body .review-item,
.wb-date-body div[onclick^="viewWrongQuestion"]{font-size:12px}

/* History type badge */
.hist-type-badge{display:inline-block;padding:2px 8px;border-radius:999px;font-size:12px;font-weight:600;
    color:var(--hc);background:color-mix(in srgb, var(--hc) 14%, transparent);border:1px solid color-mix(in srgb, var(--hc) 40%, transparent);white-space:nowrap}
[data-theme="light"] .hist-type-badge{color:var(--hc);background:color-mix(in srgb, var(--hc) 10%, transparent)}

/* heatmap cells in light theme */
[data-theme="light"] .dash-hero{background:linear-gradient(135deg,#fff,#F3F4F6);border-color:var(--gray-200);box-shadow:var(--shadow-lg)}
[data-theme="light"] .dash-hero-text h1{color:var(--gray-900);text-shadow:none}
[data-theme="light"] .dash-hero-text h1 span{color:var(--primary);text-shadow:none}
[data-theme="light"] .dash-heatmap-card,[data-theme="light"] .dash-grid-2 .card{background:#fff;border-color:var(--gray-200)}
[data-theme="light"] .dash-section-head h2{color:var(--gray-900)}
[data-theme="light"] .dash-stats .stat-card{background:#fff;border-color:var(--gray-200)!important;box-shadow:0 0 14px rgba(0,0,0,.06)}
[data-theme="light"] .dash-stats .stat-card-value{color:var(--gray-900);text-shadow:none}
[data-theme="light"] .streak-num{background:linear-gradient(180deg,#FF8A3C,#E11D48);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:none}
[data-theme="light"] .dash-streak{background:var(--gray-50);border-color:#FCA5A5;box-shadow:0 2px 10px rgba(225,29,72,.15)}
[data-theme="light"] .exam-countdown{background:var(--gray-50);border-color:var(--gray-200);box-shadow:0 2px 10px rgba(0,0,0,.06)}
[data-theme="light"] .exam-cd-time{color:var(--primary-dark,#0E7490);text-shadow:none}
[data-theme="light"] .exam-cd-icon{filter:none}
[data-theme="light"] .dash-checkin-card{background:#fff;border-color:var(--gray-200)}
[data-theme="light"] .dash-checkin-card.checkin-all-done{border-color:var(--success);box-shadow:0 0 18px rgba(5,150,105,.12)}
[data-theme="light"] .checkin-card-title{color:var(--gray-900)}
[data-theme="light"] .checkin-count{color:var(--gray-900)}
[data-theme="light"] .checkin-progress-bar{background:var(--gray-100)}
[data-theme="light"] .checkin-progress-fill{background:linear-gradient(90deg,var(--primary-light),var(--primary));box-shadow:none}
[data-theme="light"] .checkin-progress-fill.checkin-progress-done{background:linear-gradient(90deg,var(--success),#34D399);box-shadow:none}
[data-theme="light"] .checkin-task-row{background:#FAFAFA;border-color:var(--gray-200)}
[data-theme="light"] .checkin-task-row.checkin-task-done{border-color:var(--success);background:var(--success-bg)}
[data-theme="light"] .checkin-task-name{color:var(--gray-800)}
[data-theme="light"] .checkin-complete-msg{color:var(--success);text-shadow:none}
[data-theme="light"] .checkin-reflection{background:#F0FAFF;border-color:#B9E6F2}
[data-theme="light"] .checkin-reflection-textarea{background:#fff;border-color:var(--gray-200);color:var(--gray-800)}
[data-theme="light"] .checkin-reflection-textarea:focus{border-color:var(--primary)}
[data-theme="light"] .dash-reflections-card{background:#fff;border-color:#E3D0F7}
[data-theme="light"] .reflections-head{background:#FDF7FF;color:var(--gray-700)}
[data-theme="light"] .reflections-head:hover{background:#F3E8FF}
[data-theme="light"] .reflection-text{color:var(--gray-600)}
[data-theme="light"] .dash-subj-name,[data-theme="light"] .dash-spark-head b{color:var(--gray-800)}
[data-theme="light"] .hm-cell{background:#EBEDF0}
[data-theme="light"] .hm-l1{background:#9BE9A8!important}
[data-theme="light"] .hm-l2{background:#40C463!important;box-shadow:none}
[data-theme="light"] .hm-l3{background:#30A14E!important;box-shadow:none}
[data-theme="light"] .hm-l4{background:#216E39!important;box-shadow:none}
[data-theme="light"] .hm-legend .hm-l0{background:#EBEDF0}
[data-theme="light"] .hm-legend .hm-l1{background:#9BE9A8}
[data-theme="light"] .hm-legend .hm-l2{background:#40C463}
[data-theme="light"] .hm-legend .hm-l3{background:#30A14E}
[data-theme="light"] .hm-legend .hm-l4{background:#216E39}
[data-theme="light"] .dash-bar{background:var(--gray-100)}
[data-theme="light"] .dash-bar-fill{background:linear-gradient(90deg,var(--primary-light),var(--primary-dark))}
[data-theme="light"] .dash-avg-line{stroke:var(--gray-300)}
[data-theme="light"] .hm-today{outline:1.5px solid var(--gray-800);outline-offset:1px}
[data-theme="light"] .hm-future{opacity:.2}
[data-theme="light"] .hm-exam{outline:2px solid #E11D48;box-shadow:0 0 8px rgba(225,29,72,.3)!important}
[data-theme="light"] .hm-stamp{background:radial-gradient(circle,rgba(0,180,220,.9),rgba(0,140,180,.95));
  box-shadow:0 0 6px rgba(0,180,220,.5),0 0 14px rgba(0,180,220,.2)}
[data-theme="light"] .hm-complete::after{border-color:rgba(0,180,220,.4)}
[data-theme="light"] .hm-makeup-stamp{background:radial-gradient(circle,rgba(210,140,0,.95),rgba(180,110,0,.9));
  box-shadow:0 0 6px rgba(210,140,0,.5),0 0 14px rgba(210,140,0,.2)}
[data-theme="light"] .hm-madeup::after{border-color:rgba(210,140,0,.4)}
/* Light theme: homework badges */
[data-theme="light"] .hw-finished-badge{background:rgba(34,197,94,.1);color:#16a34a;border-color:rgba(34,197,94,.3)}
[data-theme="light"] .hw-attempted-badge{background:rgba(0,180,220,.08);color:#0e7490;border-color:rgba(0,180,220,.2)}
[data-theme="light"] .hw-card-finished{border-color:rgba(34,197,94,.3)!important;box-shadow:0 0 8px rgba(34,197,94,.06)}
[data-theme="light"] .hw-stamp{border-color:rgba(34,197,94,.7);background:rgba(34,197,94,.08);color:#16a34a;
  box-shadow:0 0 8px rgba(34,197,94,.3),0 0 16px rgba(34,197,94,.1),inset 0 0 6px rgba(34,197,94,.05)}
[data-theme="light"] .hw-stamp span{text-shadow:0 0 4px rgba(34,197,94,.3)}
[data-theme="light"] .hw-card-body{background:rgba(0,100,200,.03)}

/* ==================== Make-up Overlays ==================== */
.mu-overlay{position:fixed;inset:0;z-index:1000;background:rgba(5,6,15,.96);display:flex;align-items:center;justify-content:center}
.mu-overlay-inner{width:100%;max-width:720px;max-height:90vh;display:flex;flex-direction:column;background:rgba(12,14,28,.95);border:1px solid rgba(0,229,255,.2);border-radius:var(--radius);box-shadow:0 0 40px rgba(0,229,255,.1)}
.mu-overlay-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px;border-bottom:1px solid rgba(255,255,255,.08)}
.mu-overlay-head h2{font-size:18px}
.mu-overlay-body{flex:1;overflow-y:auto;padding:20px}
.mu-overlay-foot{padding:14px 20px;border-top:1px solid rgba(255,255,255,.08);text-align:center}
/* Interview rows */
.mu-iv-row{display:flex;gap:10px;align-items:flex-start;margin-bottom:14px}
.mu-iv-row .mu-iv-q{width:100%;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:6px;padding:8px 10px;color:var(--text);font-size:13px}
.mu-iv-row .mu-iv-s{width:100%;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:6px;padding:8px 10px;color:var(--text);font-size:13px;resize:vertical}
.mu-iv-row .mu-iv-q:focus,.mu-iv-row .mu-iv-s:focus{outline:none;border-color:var(--neon-cyan)}
/* Practice options */
.mu-opt{padding:10px 14px;border-radius:8px;border:1.5px solid rgba(255,255,255,.12);cursor:pointer;transition:all .15s;font-size:14px;background:rgba(255,255,255,.03)}
.mu-opt:hover{border-color:rgba(0,229,255,.4);background:rgba(0,229,255,.06)}
.mu-opt-selected{border-color:var(--neon-cyan)!important;background:rgba(0,229,255,.12)!important;box-shadow:0 0 10px rgba(0,229,255,.2)}
.mu-opt-correct{border-color:var(--success)!important;background:rgba(57,255,20,.15)!important}
.mu-opt-wrong{border-color:#ff4444!important;background:rgba(255,68,68,.12)!important}
.mu-prac-question{font-size:16px;line-height:1.6}
/* Module card hover */
.mu-mod-card:not([onclick]){cursor:default}
.mu-mod-card[onclick]:hover{border-color:rgba(0,229,255,.35)!important;background:rgba(0,229,255,.06)!important;transform:translateX(4px);transition:all .2s}
/* Light theme */
[data-theme="light"] .mu-overlay{background:rgba(240,242,248,.97)}
[data-theme="light"] .mu-overlay-inner{background:#fff;border-color:var(--gray-200)}
[data-theme="light"] .mu-overlay-head{border-color:var(--gray-200)}
[data-theme="light"] .mu-overlay-foot{border-color:var(--gray-200)}
[data-theme="light"] .mu-iv-row .mu-iv-q,[data-theme="light"] .mu-iv-row .mu-iv-s{background:var(--gray-50);border-color:var(--gray-200);color:var(--text)}
[data-theme="light"] .mu-opt{border-color:var(--gray-200);background:var(--gray-50)}

/* ==================== Interview Prep ==================== */
.dash-interview{margin-top:16px;background:rgba(10,12,27,.82);border:1px solid rgba(168,85,247,.25)}
.iv-status{margin-bottom:12px}
.iv-status-warn{background:rgba(255,170,0,.1);border:1px solid rgba(255,170,0,.4);color:#FFC36B;font-size:13px;padding:9px 13px;border-radius:var(--radius);box-shadow:0 0 14px rgba(255,170,0,.12)}
.iv-status-ok{background:rgba(57,255,20,.08);border:1px solid rgba(57,255,20,.35);color:var(--neon-green);font-size:13px;padding:9px 13px;border-radius:var(--radius);box-shadow:0 0 14px rgba(57,255,20,.1)}
.iv-streak{display:inline-flex;align-items:center;gap:3px;font-size:14px;font-weight:600;padding:3px 10px;border-radius:999px;
    background:rgba(255,170,0,.14);border:1px solid rgba(255,170,0,.4);color:#FFC36B;cursor:help;margin-left:auto}
.iv-streak b{color:#FFC36B;font-size:15px}
.iv-tabs{display:flex;gap:4px;margin-bottom:14px;padding:4px;background:rgba(10,12,27,.6);border:1px solid rgba(168,85,247,.2);border-radius:var(--radius)}
.iv-tab{flex:1;padding:8px;border:none;background:transparent;color:var(--gray-400);font-size:13px;font-weight:600;cursor:pointer;border-radius:6px;transition:all .2s;white-space:nowrap}
.iv-tab:hover{color:var(--gray-700)}
.iv-tab.active{background:rgba(168,85,247,.18);color:#D8B4FE;box-shadow:0 0 12px rgba(168,85,247,.25)}
.iv-hint{font-size:12.5px;color:var(--gray-400);margin:0 0 12px;line-height:1.5}
.iv-row{display:flex;gap:10px;margin-bottom:10px;padding:10px 12px;background:rgba(16,19,43,.55);border:1px solid rgba(255,255,255,.07);border-radius:10px;transition:border-color .2s}
.iv-row:focus-within{border-color:rgba(168,85,247,.5);box-shadow:0 0 12px rgba(168,85,247,.15)}
.iv-row-head{flex-shrink:0;width:34px;height:34px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;border-radius:8px;background:rgba(168,85,247,.18);color:#D8B4FE;border:1px solid rgba(168,85,247,.35)}
.iv-row-fields{flex:1;display:flex;flex-direction:column;gap:7px;min-width:0}
.iv-q,.iv-s{width:100%;box-sizing:border-box;padding:8px 11px;font-size:13.5px;border:1px solid var(--gray-300);border-radius:8px;background:rgba(10,12,27,.65);color:var(--gray-700);transition:border-color .2s,box-shadow .2s;font-family:inherit}
.iv-q:focus,.iv-s:focus{outline:none;border-color:var(--neon-purple,#A855F7);box-shadow:0 0 0 3px rgba(168,85,247,.15)}
.iv-s{resize:vertical;min-height:38px}
.iv-save-row{display:flex;align-items:center;gap:12px;margin-top:12px}
.iv-saved-tip{font-size:13px;color:var(--neon-green)}

/* input pager (2 pages × 5 questions) */
.iv-pager{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 12px}
.iv-page-btn{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;font-size:12.5px;font-weight:600;border-radius:8px;border:1px solid var(--gray-300);background:rgba(16,19,43,.55);color:var(--gray-500);cursor:pointer;transition:all .2s;font-family:inherit}
.iv-page-btn:hover{border-color:rgba(168,85,247,.5);color:var(--gray-700)}
.iv-page-btn.active{border-color:var(--neon-purple,#A855F7);background:rgba(168,85,247,.18);color:#D8B4FE;box-shadow:0 0 10px rgba(168,85,247,.2)}
.iv-page-btn.filled .iv-page-count{color:var(--neon-green)}
.iv-page-count{font-size:11px;color:var(--gray-400)}

/* unified today's checklist banner */
.today-banner{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:rgba(16,19,43,.55);border:1px solid rgba(255,255,255,.08);border-radius:var(--radius);padding:10px 14px;margin-bottom:14px}
.today-banner.all-done{border-color:rgba(57,255,20,.35);box-shadow:0 0 14px rgba(57,255,20,.08)}
.today-banner-title{font-size:13.5px;font-weight:700;color:var(--gray-700)}
.today-chip{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;font-weight:600;padding:4px 11px;border-radius:999px;background:rgba(255,170,0,.12);border:1px solid rgba(255,170,0,.35);color:#FFC36B}
.today-chip.done{background:rgba(57,255,20,.1);border-color:rgba(57,255,20,.35);color:var(--neon-green)}
.today-banner-note{font-size:11.5px;color:var(--gray-400);margin-left:auto}

/* ==================== Check-in Module ==================== */
.dash-checkin-card{position:relative;overflow:hidden;margin-bottom:16px;
    background:rgba(10,12,27,.82);border:1px solid rgba(0,229,255,.18);transition:border-color .4s,box-shadow .4s}
.dash-checkin-card.checkin-all-done{border-color:rgba(57,255,20,.45);box-shadow:0 0 28px rgba(57,255,20,.15)}

/* confetti container */
.checkin-confetti{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:10}

/* confetti particle */
.confetti-particle{position:absolute;top:-10px;left:var(--x);width:var(--size);height:var(--size);
    background:var(--color);border-radius:2px;opacity:0;
    animation:confetti-fall var(--dur) ease-out var(--delay) forwards}
@keyframes confetti-fall{
    0%{transform:translateY(0) rotate(0deg);opacity:1}
    80%{opacity:1}
    100%{transform:translateY(320px) rotate(var(--rot));opacity:0}
}

/* header row */
.checkin-top{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px}
.checkin-left{display:flex;align-items:center;gap:14px}
.checkin-medal{font-size:36px;line-height:1;filter:drop-shadow(0 0 10px rgba(255,200,0,.4));transition:transform .3s}
.checkin-medal-pulse{animation:medal-pulse 1.2s ease-in-out 3}
@keyframes medal-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.25) rotate(8deg)}}
.checkin-card-title{font-size:17px;margin:0;color:#E8EBFF}
.checkin-medal-name{font-size:12px;font-weight:700;letter-spacing:.5px}

.checkin-right{text-align:center}
.checkin-count{font-size:28px;font-weight:800;color:#E8EBFF;line-height:1}
.checkin-count span{font-size:16px;color:var(--gray-400);font-weight:600}
.checkin-count-label{font-size:10px;text-transform:uppercase;letter-spacing:1px;color:var(--gray-400);margin-top:2px}

/* progress bar */
.checkin-progress-wrap{margin-bottom:14px}
.checkin-progress-bar{height:8px;background:rgba(255,255,255,.08);border-radius:99px;overflow:hidden}
.checkin-progress-fill{height:100%;border-radius:99px;
    background:linear-gradient(90deg,var(--neon-cyan,#00E5FF),var(--neon-green,#39FF14));
    box-shadow:0 0 10px rgba(0,229,255,.4);transition:width .6s ease}
.checkin-progress-fill.checkin-progress-done{
    background:linear-gradient(90deg,var(--neon-green,#39FF14),#4ADE80);
    box-shadow:0 0 14px rgba(57,255,20,.5)}

/* task list */
.checkin-task-list{display:flex;flex-direction:column;gap:6px}
.checkin-task-row{display:flex;align-items:center;gap:10px;padding:9px 13px;
    background:rgba(16,19,43,.55);border:1px solid rgba(255,255,255,.07);border-radius:10px;
    transition:all .25s}
.checkin-task-row.checkin-task-done{border-color:rgba(57,255,20,.3);background:rgba(57,255,20,.06)}
.checkin-task-status{font-size:16px;line-height:1;flex-shrink:0}
.checkin-task-name{font-size:13.5px;font-weight:600;color:#E8EBFF;flex:1}
.checkin-task-detail{font-size:12px;color:var(--gray-400);white-space:nowrap}
.checkin-signin-btn,.checkin-confirm-btn{margin-left:auto;flex-shrink:0}

/* completion message */
.checkin-complete-msg{text-align:center;padding:12px 0 4px;font-size:15px;font-weight:700;
    color:var(--neon-green,#39FF14);text-shadow:0 0 14px rgba(57,255,20,.3);
    animation:complete-fade-in .6s ease}
@keyframes complete-fade-in{0%{opacity:0;transform:translateY(8px)}100%{opacity:1;transform:translateY(0)}}

/* reflection textarea (inside check-in card) */
.checkin-reflection{margin-top:14px;padding:14px;background:rgba(0,229,255,.04);border:1px solid rgba(0,229,255,.15);border-radius:10px}
.checkin-reflection-title{font-size:12px;font-weight:700;color:var(--gray-400);margin-bottom:8px;text-transform:uppercase;letter-spacing:.5px}
.checkin-reflection-textarea{width:100%;min-height:72px;max-height:160px;padding:10px 12px;font-size:13.5px;font-family:inherit;color:#E8EBFF;background:rgba(10,12,27,.6);border:1px solid rgba(0,229,255,.2);border-radius:8px;resize:vertical;outline:none;transition:border-color .2s;line-height:1.5}
.checkin-reflection-textarea:focus{border-color:var(--neon-cyan,#00E5FF)}
.checkin-reflection-textarea::placeholder{color:var(--gray-500)}
.checkin-reflection-footer{display:flex;align-items:center;justify-content:space-between;margin-top:8px;gap:8px}
.checkin-reflection-counter{font-size:11px;color:var(--gray-500)}

/* past reflections card */
.dash-reflections-card{margin-bottom:16px;background:rgba(10,12,27,.82);border:1px solid rgba(168,85,247,.18);border-radius:12px;overflow:hidden}
.reflections-head{display:flex;align-items:center;gap:10px;padding:12px 16px;cursor:pointer;background:rgba(168,85,247,.06);font-size:14px;font-weight:700;color:var(--gray-300);user-select:none;transition:background .2s}
.reflections-head:hover{background:rgba(168,85,247,.12)}
.reflections-count{font-size:11px;font-weight:800;color:var(--neon-purple,#A855F7);background:rgba(168,85,247,.15);padding:2px 8px;border-radius:99px;border:1px solid rgba(168,85,247,.3)}
.reflections-arrow{margin-left:auto;font-size:12px;color:var(--gray-400);transition:transform .2s}
.reflections-body{padding:0 16px 14px}
.reflection-entry{padding:10px 0;border-bottom:1px solid rgba(255,255,255,.05)}
.reflection-entry:last-child{border-bottom:none}
.reflection-date{font-size:11px;font-weight:700;color:var(--neon-purple,#A855F7);margin-bottom:4px;text-transform:uppercase;letter-spacing:.4px}
.reflection-text{font-size:13.5px;color:var(--gray-500);line-height:1.6;white-space:pre-wrap;word-break:break-word}

/* records edit + edit modal fields */
.iv-rec-actions{display:flex;gap:6px;flex-shrink:0}
.iv-edit-field{margin-bottom:4px}

/* review items */
.iv-review-item{margin-bottom:12px;padding:12px 14px;background:rgba(16,19,43,.55);border:1px solid rgba(0,229,255,.16);border-radius:10px;transition:border-color .2s}
.iv-review-item:hover{border-color:rgba(0,229,255,.4);box-shadow:0 0 14px rgba(0,229,255,.1)}
.iv-review-head{display:flex;align-items:center;gap:8px;margin-bottom:7px}
.iv-review-num{font-weight:800;font-size:12px;color:var(--neon-cyan);background:rgba(0,229,255,.12);padding:2px 8px;border-radius:99px;border:1px solid rgba(0,229,255,.3)}
.iv-review-date{font-size:11.5px;color:var(--gray-400)}
.iv-review-q{font-size:14px;color:#E8EBFF;line-height:1.55;margin-bottom:9px}

/* records */
.iv-rec-item{margin-bottom:8px}
.iv-rec-date{display:flex;align-items:center;gap:10px;padding:10px 12px;background:rgba(16,19,43,.55);border:1px solid rgba(255,255,255,.07);border-radius:10px;cursor:pointer;font-size:13.5px;font-weight:600;color:#E8EBFF;transition:all .2s;user-select:none}
.iv-rec-date:hover{border-color:rgba(168,85,247,.5);box-shadow:0 0 12px rgba(168,85,247,.15)}
.iv-rec-count{margin-left:auto;font-size:11.5px;font-weight:500;color:var(--gray-400)}
.iv-rec-arrow{transition:transform .2s;color:var(--gray-400)}
.iv-rec-open{transform:rotate(180deg)}
.iv-rec-body{padding:8px 4px 12px}
.iv-rec-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 12px;border-left:2px solid rgba(168,85,247,.5);margin-bottom:6px}
.iv-rec-q{font-size:13.5px;color:var(--gray-600);line-height:1.5}

/* daily mental math */
.mm-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.mm-progress{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--gray-400)}
.mm-timer{font-size:26px;font-weight:800;letter-spacing:2px;color:var(--neon-cyan);font-family:'Share Tech Mono',monospace}
.mm-timer.mm-danger{color:var(--danger);animation:simTimerPulse 1s infinite}
.mm-dots{display:flex;gap:6px;justify-content:center;margin-bottom:6px}
.mm-dot{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.15)}
.mm-dot-done{background:var(--neon-green);border-color:var(--neon-green)}
.mm-dot-cur{background:var(--neon-cyan);border-color:var(--neon-cyan);box-shadow:0 0 8px rgba(0,229,255,.6)}
.mm-question{font-size:34px;font-weight:800;letter-spacing:1px;text-align:center;margin:16px 0;color:#E8EBFF}
.mm-answer-row{display:flex;gap:10px;justify-content:center;align-items:center}
.mm-input{width:220px;padding:11px 14px;font-size:20px;font-weight:700;text-align:center;font-family:'Share Tech Mono',monospace;
    background:rgba(10,12,27,.7);border:1px solid rgba(0,229,255,.35);border-radius:var(--radius);color:#E8EBFF;outline:none}
.mm-input:focus{border-color:var(--neon-cyan);box-shadow:0 0 12px rgba(0,229,255,.25)}
.mm-input:disabled{opacity:.55}
.mm-feedback{min-height:26px;margin-top:10px;text-align:center;font-size:14px;font-weight:600}
.mm-fb-ok{color:var(--neon-green)}
.mm-fb-bad{color:var(--danger)}
.mm-fb-warn{color:var(--warning)}
.mm-result{text-align:center;padding:8px 0}
.mm-result-score{font-size:46px;font-weight:800;letter-spacing:2px}
.mm-score-good{color:var(--neon-green);text-shadow:0 0 18px rgba(57,255,20,.35)}
.mm-score-bad{color:var(--danger)}
.mm-result-msg{font-size:15px;color:var(--gray-500);margin:8px 0 4px}

/* collapsible date groups in math records */
.mm-day-group{border:1px solid rgba(255,255,255,.08);border-radius:8px;overflow:hidden}
.mm-day-head{display:flex;align-items:center;gap:8px;padding:8px 12px;cursor:pointer;background:rgba(255,255,255,.04);transition:background .15s;font-size:13px;color:var(--gray-500)}
.mm-day-head:hover{background:rgba(255,255,255,.08)}
.mm-day-arrow{font-size:11px;color:var(--gray-400);transition:transform .2s}
.mm-day-body{padding:4px 10px 8px}
[data-theme="light"] .mm-day-group{border-color:var(--gray-200)}
[data-theme="light"] .mm-day-head{background:var(--gray-50);color:var(--gray-600)}
[data-theme="light"] .mm-day-head:hover{background:var(--gray-100)}

/* analysis modal */
.iv-analysis-modal{max-width:560px}
.iv-analysis-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:var(--gray-400);margin:0 0 6px}
.iv-analysis-question{font-size:15px;color:#E8EBFF;line-height:1.6;padding:12px 14px;background:rgba(0,229,255,.06);border:1px solid rgba(0,229,255,.25);border-radius:10px;margin-bottom:16px;white-space:pre-wrap;word-break:break-word}
.iv-analysis-summary{font-size:14px;color:var(--gray-500);line-height:1.65;padding:12px 14px;background:rgba(168,85,247,.07);border:1px solid rgba(168,85,247,.3);border-radius:10px;white-space:pre-wrap;word-break:break-word}

/* light theme */
[data-theme="light"] .dash-interview{background:#fff;border-color:var(--gray-200)}
[data-theme="light"] .iv-status-warn{background:var(--warning-bg,#FFF7E6);border-color:#F59E0B;color:#B45309}
[data-theme="light"] .iv-status-ok{background:var(--success-bg);border-color:var(--success);color:var(--success-dark,#047857)}
[data-theme="light"] .iv-streak{background:var(--warning-bg,#FFF7E6);border-color:#F59E0B;color:#B45309;margin-left:auto}
[data-theme="light"] .iv-streak b{color:#B45309}
[data-theme="light"] .iv-tabs{background:var(--gray-100);border-color:var(--gray-200)}
[data-theme="light"] .iv-tab.active{background:#F3E8FF;color:var(--purple-dark,#7E22CE);box-shadow:none}
[data-theme="light"] .iv-row,[data-theme="light"] .iv-review-item,[data-theme="light"] .iv-rec-date{background:#FAFAFA;border-color:var(--gray-200)}
[data-theme="light"] .iv-page-btn{background:#FAFAFA;border-color:var(--gray-200);color:var(--gray-600)}
[data-theme="light"] .iv-page-btn.active{background:#F3E8FF;border-color:#D8B4FE;color:var(--purple-dark,#7E22CE)}
[data-theme="light"] .today-banner{background:#FAFAFA;border-color:var(--gray-200)}
[data-theme="light"] .today-banner-title{color:var(--gray-800)}
[data-theme="light"] .today-chip{background:var(--warning-bg,#FFF7E6);border-color:#F59E0B;color:#B45309}
[data-theme="light"] .today-chip.done{background:var(--success-bg);border-color:var(--success);color:var(--success-dark,#047857)}
[data-theme="light"] .today-banner.all-done{border-color:var(--success)}
[data-theme="light"] .iv-q,[data-theme="light"] .iv-s{background:#fff;color:var(--gray-800);border:1px solid var(--gray-300)}
[data-theme="light"] .iv-q:focus,.iv-s:focus{border-color:var(--purple,#8B5CF6);box-shadow:0 0 0 3px rgba(139,92,246,.12)}
[data-theme="light"] .iv-row-head{background:#F3E8FF;color:var(--purple-dark,#7E22CE);border-color:#D8B4FE}
[data-theme="light"] .iv-review-q,[data-theme="light"] .iv-rec-date,[data-theme="light"] .iv-analysis-question{color:var(--gray-800)}
[data-theme="light"] .iv-review-num{color:var(--primary-dark);background:var(--primary-bg);border-color:var(--primary-light)}
[data-theme="light"] .iv-rec-row{border-left-color:var(--purple,#8B5CF6)}
[data-theme="light"] .iv-analysis-summary{background:var(--purple-bg,#F5F3FF);border-color:#C4B5FD;color:var(--gray-700)}
[data-theme="light"] .dash-mathtask{background:#fff;border-color:var(--gray-200)}
[data-theme="light"] .mm-question{color:var(--gray-800)}
[data-theme="light"] .mm-input{background:#fff;color:var(--gray-800);border-color:var(--gray-300)}
[data-theme="light"] .mm-input:focus{border-color:var(--primary,#06B6D4);box-shadow:0 0 0 3px rgba(6,182,212,.12)}
[data-theme="light"] .mm-timer{color:var(--primary-dark,#0E7490)}
[data-theme="light"] .mm-dot{background:var(--gray-100);border-color:var(--gray-300)}
[data-theme="light"] .mm-dot-done{background:var(--success);border-color:var(--success)}
[data-theme="light"] .mm-dot-cur{background:var(--primary,#06B6D4);border-color:var(--primary,#06B6D4);box-shadow:none}

@media (max-width:760px){
    .dash-hero{flex-direction:column;text-align:center;padding:22px}
    .dash-hero-right{justify-content:center;flex-wrap:wrap}
    .dash-grid-2{grid-template-columns:1fr}
    .iv-row{flex-direction:column}
    .checkin-top{flex-direction:column;align-items:flex-start;gap:10px}
    .checkin-right{text-align:left}
}

/* =========================================================
   Pearson VUE Simulated Exam Styles
   ========================================================= */

/* Sim Exam container — full viewport, no page padding */
.sim-exam{
    position:fixed;inset:0;z-index:200;
    display:flex;flex-direction:column;
    background:#f0f0f0;color:#1a1a1a;
    font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;
}
.sim-exam.hidden{display:none!important}

/* ---- Header bar ---- */
.sim-exam-header{
    display:flex;align-items:center;justify-content:space-between;
    background:#2b579a;color:#fff;
    padding:0 20px;height:48px;flex-shrink:0;
    border-bottom:2px solid #1a3a6a;
}
.sim-exam-header-left{flex:1}
.sim-exam-title{font-size:14px;font-weight:600;letter-spacing:.3px}
.sim-exam-header-center{flex:2;text-align:center}
.sim-exam-question-counter{font-size:15px;font-weight:700}
.sim-exam-header-right{flex:1;display:flex;justify-content:flex-end}
.sim-exam-timer{
    display:flex;align-items:center;gap:6px;
    background:rgba(255,255,255,.15);
    padding:6px 14px;border-radius:4px;
    font-size:16px;font-weight:700;font-variant-numeric:tabular-nums;
}
.sim-exam-timer.warning{background:rgba(255,165,0,.3)}
.sim-exam-timer.danger{background:rgba(220,38,38,.4);animation:simTimerPulse 1s infinite}
@keyframes simTimerPulse{0%,100%{opacity:1}50%{opacity:.7}}

/* ---- Body: full-width question area ---- */
.sim-exam-body{display:flex;flex:1;overflow:hidden}
.sim-exam-body-full .sim-exam-question-area{flex:1}

/* Question area */
.sim-exam-question-area{
    flex:1;display:flex;flex-direction:column;
    padding:20px 24px;overflow-y:auto;
}
.sim-exam-question-card{
    background:#fff;border-radius:6px;
    box-shadow:0 1px 4px rgba(0,0,0,.1);
    padding:24px 28px;flex:1;position:relative;
}
/* Card header: title left, flag button right */
.sim-exam-card-header{
    display:flex;align-items:center;justify-content:space-between;
    margin-bottom:16px;
}
.sim-exam-card-title{
    font-size:13px;color:#888;font-weight:500;
}
.sim-exam-flag-btn{
    padding:6px 14px;font-size:13px;font-weight:600;
    border:2px solid #e8a020;border-radius:4px;
    background:#fff;color:#e8a020;cursor:pointer;
    transition:all .15s;
}
.sim-exam-flag-btn:hover{background:#e8a020;color:#fff}
.sim-exam-flag-btn.flagged{background:#e8a020;color:#fff}

.sim-exam-question-text{
    font-size:16px;line-height:1.7;color:#1a1a1a;
    margin-bottom:24px;white-space:pre-wrap;word-break:break-word;
}
.sim-exam-options-list{
    display:flex;flex-direction:column;gap:10px;
}
.sim-exam-option{
    display:flex;align-items:flex-start;gap:12px;
    padding:12px 16px;border:2px solid #d0d0d0;border-radius:6px;
    cursor:pointer;transition:all .15s;
    background:#fafafa;
}
.sim-exam-option:hover{border-color:#2b579a;background:#f0f4ff}
.sim-exam-option.selected{border-color:#2b579a;background:#e8eef8}
.sim-exam-option-letter{
    display:inline-flex;align-items:center;justify-content:center;
    width:28px;height:28px;border-radius:50%;
    background:#e0e0e0;color:#333;font-weight:700;font-size:13px;
    flex-shrink:0;
}
.sim-exam-option.selected .sim-exam-option-letter{
    background:#2b579a;color:#fff;
}
.sim-exam-option-text{
    font-size:15px;line-height:1.6;color:#1a1a1a;
    padding-top:3px;
}

/* ---- Bottom nav bar: End Exam (far left) | Previous + Navigator (center) | Next (right) ---- */
.sim-exam-nav-bar{
    display:flex;justify-content:space-between;align-items:center;
    margin-top:16px;gap:12px;flex-shrink:0;
}
.sim-nav-bar-right{display:flex;gap:10px;align-items:center;margin-left:auto}
.sim-nav-btn{
    padding:10px 22px;font-size:14px;font-weight:600;
    border:2px solid #2b579a;border-radius:4px;
    background:#fff;color:#2b579a;cursor:pointer;
    transition:all .15s;white-space:nowrap;
}
.sim-nav-btn:hover{background:#2b579a;color:#fff}
.sim-nav-btn:disabled{opacity:.4;cursor:not-allowed}
.sim-nav-btn:disabled:hover{background:#fff;color:#2b579a}
.sim-nav-btn-end{border-color:#DC2626;color:#DC2626}
.sim-nav-btn-end:hover{background:#DC2626;color:#fff}
.sim-nav-btn-navigator{border-color:#555;color:#333}
.sim-nav-btn-navigator:hover{background:#333;color:#fff}
.sim-nav-btn-next{background:#2b579a;color:#fff}
.sim-nav-btn-next:hover{background:#1a3a6a}
.sim-nav-btn-submit{background:#16a34a;color:#fff;border-color:#16a34a}
.sim-nav-btn-submit:hover{background:#15803d;border-color:#15803d}

/* ---- Navigator popup overlay ---- */
.sim-nav-popup-overlay{
    position:fixed;inset:0;z-index:300;
    background:rgba(0,0,0,.45);
    display:flex;align-items:flex-end;justify-content:flex-end;
    padding:20px;
}
.sim-nav-popup-overlay.hidden{display:none!important}

.sim-nav-popup{
    background:#fff;border-radius:8px;
    box-shadow:0 8px 32px rgba(0,0,0,.25);
    width:480px;max-height:70vh;
    display:flex;flex-direction:column;
    overflow:hidden;
}
.sim-nav-popup-header{
    display:flex;align-items:center;justify-content:space-between;
    padding:14px 18px;background:#2b579a;color:#fff;
    font-size:15px;font-weight:700;flex-shrink:0;
}
.sim-nav-popup-close{
    background:none;border:none;color:#fff;font-size:18px;
    cursor:pointer;padding:2px 6px;border-radius:4px;
}
.sim-nav-popup-close:hover{background:rgba(255,255,255,.2)}

/* Scrollable list body */
.sim-nav-popup-body{
    overflow-y:auto;flex:1;
    padding:0;
}

/* Table header */
.sim-nav-table-header{
    display:grid;
    grid-template-columns:70px 1fr 70px;
    padding:10px 18px;
    background:#f5f5f5;border-bottom:2px solid #ddd;
    font-size:12px;font-weight:700;color:#555;
    text-transform:uppercase;letter-spacing:.5px;
    position:sticky;top:0;z-index:1;
}
/* Table rows */
.sim-nav-row{
    display:grid;
    grid-template-columns:70px 1fr 70px;
    padding:10px 18px;
    border-bottom:1px solid #eee;
    font-size:14px;align-items:center;
    transition:background .1s;
}
.sim-nav-row:hover{background:#f0f4ff}
.sim-nav-row.row-current{background:#e8eef8}
.sim-nav-row.row-current:hover{background:#dce4f5}

/* Column 1: question number link */
.sim-nav-qnum{
    font-weight:700;color:#2b579a;cursor:pointer;
    text-decoration:underline;
}
.sim-nav-qnum:hover{color:#1a3a6a}

/* Column 2: state badge */
.sim-nav-state{font-size:13px;font-weight:600}
.sim-nav-state.state-complete{color:#059669}
.sim-nav-state.state-incomplete{color:#D97706}
.sim-nav-state.state-unseen{color:#9CA3AF}

/* Column 3: flag */
.sim-nav-flag{font-size:14px;text-align:center}

/* Submit button in popup footer */
.sim-nav-popup-footer{
    padding:12px 18px;border-top:1px solid #e0e0e0;flex-shrink:0;
}
.sim-nav-submit-btn{
    width:100%;padding:12px;font-size:14px;font-weight:700;
    background:#2b579a;color:#fff;border:none;border-radius:4px;
    cursor:pointer;transition:background .15s;
}
.sim-nav-submit-btn:hover{background:#1a3a6a}

/* Responsive */
@media (max-width:600px){
    .sim-nav-popup{width:100%;max-height:80vh}
    .sim-exam-nav-bar{flex-wrap:wrap;gap:8px}
    .sim-nav-bar-right{order:3;width:100%;justify-content:center}
}
/* ============================================================
   PS Prep tab (Oxford Physics PS — First Principles Reference)
   Converted from PS/physics_ps_reference.html. All original
   component classes (.sidebar, .hero, .concept-card, ...) are
   scoped under #tab-psprep, and the original custom properties
   (--bg-primary, --accent, ...) are re-mapped to platform tokens
   so the page follows the day / night theme automatically.
   Layout: CSS grid with a sticky sidebar — no position:fixed
   inside the (display:none) tab container, per containment rules.
   ============================================================ */

/* --- Theme token mapping (dark = default cyberpunk palette) --- */
#tab-psprep{
    --bg-primary:transparent;
    --bg-secondary:rgba(16,19,43,.55);
    --bg-card:rgba(16,19,43,.72);
    --bg-hover:rgba(0,229,255,.08);
    --accent:var(--neon-cyan);
    --accent-soft:rgba(0,229,255,.10);
    --accent-glow:rgba(0,229,255,.40);
    --text-primary:var(--gray-800);
    --text-secondary:var(--gray-500);
    --text-muted:var(--gray-400);
    --border:rgba(0,229,255,.15);
    --success:var(--neon-green);
    --warning:var(--warning);
    --danger:var(--danger);
}
[data-theme="light"] #tab-psprep{
    --bg-primary:transparent;
    --bg-secondary:#fff;
    --bg-card:#fff;
    --bg-hover:rgba(8,145,178,.08);
    --accent:#0E7490;
    --accent-soft:rgba(8,145,178,.10);
    --accent-glow:rgba(8,145,178,.35);
    --text-primary:#1F2937;
    --text-secondary:#4B5563;
    --text-muted:#6B7280;
    --border:#E5E7EB;
    --success:#059669;
    --warning:#D97706;
    --danger:#DC2626;
}

/* --- Grid shell: sticky sidebar + content column --- */
#tab-psprep.active{display:grid;grid-template-columns:300px minmax(0,1fr);gap:0 2.5rem}
#tab-psprep .ps-main-content{margin-left:0;min-height:auto}
#tab-psprep footer{grid-column:1 / -1}

/* Reading progress bar — fixed under the sticky platform header.
   Because it lives inside the tab, it is only rendered while the
   PS tab is active (display:none containment hides it otherwise). */
#tab-psprep .ps-progress-bar{position:fixed;top:64px;left:0;right:0;height:3px;background:rgba(148,163,184,.15);z-index:90}
#tab-psprep .ps-progress-fill{height:100%;background:linear-gradient(90deg,var(--accent),var(--success));width:0%;transition:width .1s ease}

/* --- Sidebar (sticky, scrolls with page inside its column) --- */
#tab-psprep .sidebar{position:sticky;top:80px;height:calc(100vh - 80px);width:auto;background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-lg);overflow-y:auto;padding:1.5rem 0;margin-top:1rem}
#tab-psprep .sidebar-header{padding:0 1.5rem 1.5rem;border-bottom:1px solid var(--border);margin-bottom:1rem}
#tab-psprep .sidebar-title{font-size:1.1rem;font-weight:700;color:var(--accent);letter-spacing:-.02em}
#tab-psprep .sidebar-subtitle{font-size:.75rem;color:var(--text-secondary);margin-top:.3rem}
#tab-psprep .nav-list{list-style:none;padding:0 .75rem}
#tab-psprep .nav-item{margin:.15rem 0}
#tab-psprep .nav-link{display:block;padding:.65rem .9rem;color:var(--text-secondary);text-decoration:none;border-radius:8px;font-size:.88rem;transition:all .2s ease;border-left:3px solid transparent;border-bottom:none}
#tab-psprep .nav-link:hover{border-bottom:none;background:var(--bg-hover);color:var(--text-primary);border-left-color:var(--accent)}
#tab-psprep .nav-link.active{background:var(--bg-hover);color:var(--accent);border-left-color:var(--accent)}
#tab-psprep .nav-section{font-weight:600;color:var(--text-primary);font-size:.8rem;text-transform:uppercase;letter-spacing:.05em;margin:1rem .9rem .5rem}
#tab-psprep .nav-toggle{display:none}

/* --- Hero --- */
#tab-psprep .hero{padding:3rem 2rem;border-bottom:1px solid var(--border);background:linear-gradient(135deg,var(--bg-secondary) 0%,var(--bg-primary) 100%);border-radius:var(--radius-lg)}
#tab-psprep .hero h1{font-size:2.2rem;font-weight:800;letter-spacing:-.03em;margin-bottom:1rem;background:linear-gradient(135deg,var(--text-primary) 0%,var(--accent) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
#tab-psprep .hero p{font-size:1.1rem;color:var(--text-secondary);max-width:800px}
#tab-psprep .hero-tags{margin-top:1rem}

/* --- Sections --- */
#tab-psprep .section{padding:2.5rem 0;border-bottom:1px solid var(--border);scroll-margin-top:80px}
#tab-psprep .hero{scroll-margin-top:80px}
#tab-psprep .section-title{font-size:1.8rem;font-weight:700;margin-bottom:.5rem;color:var(--text-primary);text-shadow:none}
#tab-psprep .section-intro{color:var(--text-secondary);font-size:1.02rem;max-width:850px;margin-bottom:2rem}

/* --- Concept cards --- */
#tab-psprep .concept-card{background:var(--bg-card);border:1px solid var(--border);border-radius:16px;padding:1.75rem;margin-bottom:1.5rem;transition:all .25s ease}
[data-theme="dark"] #tab-psprep .concept-card:hover{border-color:var(--accent-glow);box-shadow:0 4px 24px rgba(2,8,23,.6)}
[data-theme="light"] #tab-psprep .concept-card:hover{box-shadow:var(--shadow-md)}
#tab-psprep .concept-header{display:flex;align-items:flex-start;gap:1rem;margin-bottom:1rem}
#tab-psprep .concept-number{display:inline-flex;align-items:center;justify-content:center;min-width:2rem;height:2rem;padding:0 .4rem;background:var(--accent-soft);color:var(--accent);border-radius:8px;font-weight:700;font-size:.85rem;flex-shrink:0}
#tab-psprep .concept-title{font-size:1.25rem;font-weight:700;color:var(--text-primary)}
#tab-psprep .intuition{background:var(--accent-soft);border-left:4px solid var(--accent);padding:1rem 1.25rem;border-radius:0 12px 12px 0;color:var(--text-primary);font-style:italic;margin-bottom:1.25rem}
#tab-psprep .content-block{margin-bottom:1.25rem}
#tab-psprep .content-block h4{color:var(--accent);font-size:.95rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;margin-bottom:.6rem}
#tab-psprep .content-block p,#tab-psprep .content-block li{color:var(--text-secondary);font-size:.96rem}
#tab-psprep .content-block ul{padding-left:1.5rem}
#tab-psprep .content-block li{margin-bottom:.4rem}

/* --- PS links / interview boxes / formulas --- */
#tab-psprep .ps-link{background:rgba(251,191,36,.08);border:1px solid rgba(251,191,36,.25);border-radius:12px;padding:1rem 1.25rem;margin-top:1rem}
#tab-psprep .ps-link h4{color:var(--warning);font-size:.85rem;text-transform:uppercase;letter-spacing:.06em;margin-bottom:.5rem}
#tab-psprep .ps-link p{color:var(--text-secondary);font-size:.92rem}
#tab-psprep .ps-quote{font-style:italic;color:var(--warning);opacity:.9}
#tab-psprep .interview-box{background:rgba(52,211,153,.08);border:1px solid rgba(52,211,153,.25);border-radius:12px;padding:1rem 1.25rem;margin-top:1rem}
[data-theme="light"] #tab-psprep .interview-box{background:rgba(5,150,105,.07);border-color:rgba(5,150,105,.25)}
#tab-psprep .interview-box h4{color:var(--success);font-size:.85rem;text-transform:uppercase;letter-spacing:.06em;margin-bottom:.5rem}
#tab-psprep .interview-box p{color:var(--text-secondary);font-size:.92rem}
#tab-psprep .formula-box{background:var(--bg-secondary);border:1px solid var(--border);border-radius:12px;padding:1.25rem;margin:1rem 0;overflow-x:auto}
#tab-psprep .formula-box p{text-align:center;color:var(--text-primary)}
#tab-psprep .two-col{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
#tab-psprep .tag{display:inline-block;padding:.25rem .6rem;background:var(--accent-soft);color:var(--accent);border-radius:20px;font-size:.75rem;font-weight:600;margin-right:.4rem;margin-bottom:.4rem}
#tab-psprep .checklist{list-style:none}
#tab-psprep .checklist li{padding:.5rem 0;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:.75rem;color:var(--text-secondary)}
#tab-psprep .checklist li:before{content:"□";color:var(--accent);font-weight:700}
#tab-psprep .ps-footer{padding:2rem 1rem;border-top:1px solid var(--border);color:var(--text-muted);font-size:.85rem;text-align:center}

/* In-page links */
#tab-psprep a{color:var(--accent);text-decoration:none;border-bottom:1px solid transparent;transition:all .2s ease}
#tab-psprep a:hover{color:var(--accent);border-bottom-color:var(--accent)}

/* --- Mobile / narrow-screen LaTeX fixes ---
   KaTeX display math never shrinks: a long equation is wider than a
   phone screen and would blow up the grid column (a grid item defaults
   to min-width:auto). Three defences, scoped to this tab only:
     1. every grid/flex wrapper can shrink below its content (min-width:0)
     2. wide display formulas scroll horizontally inside their own box
     3. KaTeX's default 1.21em font is scaled down on phones so more
        formulas simply fit without any scroll            */
#tab-psprep .section,
#tab-psprep .concept-card,
#tab-psprep .content-block,
#tab-psprep .intuition,
#tab-psprep .ps-link,
#tab-psprep .interview-box,
#tab-psprep .two-col > *,
#tab-psprep .formula-box{min-width:0}
#tab-psprep .katex-display{overflow-x:auto;overflow-y:hidden;max-width:100%;-webkit-overflow-scrolling:touch;padding:2px 0}
#tab-psprep .katex-display > .katex{white-space:nowrap}
#tab-psprep .katex{max-width:100%}

/* --- Responsive: sidebar becomes a drawer --- */
@media (max-width:900px){
    #tab-psprep.active{grid-template-columns:minmax(0,1fr)}
    /* FAB at the bottom-right: the platform header becomes a multi-row
       column block below 900px, so its height is no longer the fixed 64px
       the old top:74px offset assumed. Anchoring to the bottom avoids
       overlapping the tabs entirely. */
    #tab-psprep .nav-toggle{display:block;position:fixed;bottom:1.25rem;right:1rem;top:auto;left:auto;z-index:1001;background:var(--bg-card);border:1px solid var(--border);color:var(--accent);padding:.65rem 1.05rem;border-radius:10px;cursor:pointer;font-weight:600;box-shadow:0 4px 18px rgba(2,8,23,.45)}
    #tab-psprep .sidebar{position:fixed;left:0;top:0;width:300px;height:100vh;margin:0;border-radius:0;transform:translateX(-100%);transition:transform .3s ease;z-index:1000}
    #tab-psprep .sidebar.open{transform:translateX(0)}
    #tab-psprep .hero{padding:2.5rem 1.25rem 2rem}
    #tab-psprep .hero h1{font-size:1.8rem}
    #tab-psprep .section{padding:2rem 1.25rem}
    #tab-psprep .ps-main-content{padding:0 .5rem 2rem}
    /* reading progress bar assumed a 64px header too — hide it on phones */
    #tab-psprep .ps-progress-bar{display:none}
}
@media (max-width:1024px){
    #tab-psprep .two-col{grid-template-columns:1fr}
}
@media (max-width:600px){
    #tab-psprep .katex{font-size:.98em}
    #tab-psprep .katex-display{font-size:.85em}
    #tab-psprep .concept-card{padding:1.25rem}
    #tab-psprep .hero{padding:2.5rem 1rem 1.5rem}
    #tab-psprep .hero h1{font-size:1.6rem}
    #tab-psprep .section{padding:1.5rem 0}
    #tab-psprep .formula-box{padding:.9rem}
}

/* ==================== daily graph sketch ==================== */
.sk-question{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.sk-tag{font-size:11px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--neon-cyan);background:rgba(0,229,255,.12);border:1px solid rgba(0,229,255,.3);padding:2px 9px;border-radius:99px}
.sk-date{font-size:11.5px;color:var(--gray-400)}
.sk-latex{font-size:21px;color:#E8EBFF;padding:18px 10px;background:rgba(0,229,255,.06);border:1px solid rgba(0,229,255,.25);border-radius:var(--radius);margin-bottom:12px;overflow-x:auto}
.sk-latex .katex-display{margin:0}
.sk-canvas{display:block;max-width:600px;width:100%;height:auto;background:rgba(10,12,27,.55);border:1px solid rgba(0,229,255,.25);border-radius:var(--radius)}
.sk-hints{margin-top:12px;padding:12px 14px;background:rgba(168,85,247,.07);border:1px solid rgba(168,85,247,.3);border-radius:10px}
.sk-hints-title{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:var(--gray-400)}
.sk-hints ul{margin:8px 0 0;padding-left:18px;display:flex;flex-direction:column;gap:5px}
.sk-hints li{font-size:13px;color:var(--gray-600);line-height:1.55}
.sk-upload{margin-top:14px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 14px;background:rgba(16,19,43,.55);border:1px dashed rgba(0,229,255,.35);border-radius:10px}
.sk-upload-title{font-size:12px;font-weight:700;color:var(--gray-500)}
.sk-thumb{width:72px;height:54px;object-fit:cover;border-radius:8px;border:1px solid rgba(0,229,255,.35);cursor:pointer;transition:transform .2s}
.sk-thumb:hover{transform:scale(1.06)}
.sk-upload-btns{display:flex;gap:6px}
.sk-upload-note{font-size:11.5px;color:var(--gray-400)}
.sk-rec-latex{font-size:13.5px;color:var(--gray-600);margin-bottom:6px}
.sk-rec-thumb{width:64px;height:48px;object-fit:cover;border-radius:6px;border:1px solid rgba(0,229,255,.3);cursor:pointer;transition:transform .2s}
.sk-rec-thumb:hover{transform:scale(1.05)}
.sk-view-img{max-width:100%;max-height:70vh;border-radius:10px;border:1px solid rgba(0,229,255,.3)}
.sk-img-grid{display:flex;flex-wrap:wrap;gap:8px;width:100%}
.sk-img-slot{position:relative;display:inline-block}
.sk-img-slot .sk-thumb{display:block}
.sk-img-rm{position:absolute;top:-6px;right:-6px;width:20px;height:20px;border-radius:50%;background:var(--danger,#EF4444);color:#fff;border:none;font-size:14px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;opacity:.85;transition:opacity .15s}
.sk-img-rm:hover{opacity:1}
.sk-viewer-wrap{display:flex;align-items:center;justify-content:center;gap:10px;text-align:center}
.sk-view-nav{width:36px;height:36px;border-radius:50%;border:1px solid rgba(0,229,255,.35);background:rgba(16,19,43,.6);color:var(--neon-cyan,#00E5FF);font-size:22px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .2s,border-color .2s;padding:0}
.sk-view-nav:hover{background:rgba(0,229,255,.15);border-color:var(--neon-cyan,#00E5FF)}
.sk-rec-grid{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}

/* graph sketch — reasoning section */
.sk-reasoning{margin-top:12px;padding:12px 14px;background:rgba(0,229,255,.05);border:1px solid rgba(0,229,255,.2);border-radius:10px}
.sk-reasoning-title{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:var(--gray-400)}
.sk-reasoning ul{margin:8px 0 0;padding-left:18px;display:flex;flex-direction:column;gap:5px}
.sk-reasoning li{font-size:13px;color:var(--gray-600);line-height:1.6}

/* graph sketch — variants collapsible */
.sk-variants{margin-top:12px;border:1px solid rgba(168,85,247,.25);border-radius:10px;overflow:hidden}
.sk-variants-head{display:flex;align-items:center;gap:8px;padding:10px 14px;cursor:pointer;background:rgba(168,85,247,.08);font-size:13px;font-weight:600;color:var(--gray-500);transition:background .2s;user-select:none}
.sk-variants-head:hover{background:rgba(168,85,247,.15)}
.sk-variants-arrow{font-size:11px;color:var(--gray-400);transition:transform .2s}
.sk-variants-body{padding:8px 14px 12px}
.sk-variant-item{display:flex;flex-wrap:wrap;align-items:flex-start;gap:6px 10px;padding:8px 10px;margin-bottom:6px;background:rgba(16,19,43,.45);border:1px solid rgba(255,255,255,.07);border-radius:8px;transition:border-color .2s}
.sk-variant-item:hover{border-color:rgba(168,85,247,.3)}
.sk-var-plot-btn{margin-left:auto;flex-shrink:0}
.sk-var-canvas{display:block;max-width:600px;width:100%;height:auto;margin-top:8px;background:rgba(10,12,27,.55);border:1px solid rgba(168,85,247,.25);border-radius:8px}
.sk-variant-num{font-size:11px;font-weight:800;color:var(--neon-purple);background:rgba(168,85,247,.15);padding:2px 7px;border-radius:99px;border:1px solid rgba(168,85,247,.3);flex-shrink:0}
.sk-variant-label{font-size:14px;color:#E8EBFF;flex:1;min-width:200px}
.sk-variant-hints{width:100%;font-size:12px;color:var(--gray-500);line-height:1.55;margin-top:2px;padding-left:4px}
.sk-variant-hints div{margin-bottom:2px}

/* graph sketch — records row */
.sk-rec-row{display:flex;align-items:center;gap:10px;margin-top:6px}
.sk-rec-actions{display:flex;gap:6px}

/* graph sketch — light theme additions */
[data-theme="light"] .sk-reasoning{background:#F0FAFF;border-color:#B9E6F2}
[data-theme="light"] .sk-variants{border-color:#E3D0F7}
[data-theme="light"] .sk-variants-head{background:#FDF7FF;color:var(--gray-700)}
[data-theme="light"] .sk-variants-head:hover{background:#F3E8FF}
[data-theme="light"] .sk-variant-item{background:#FAFAFA;border-color:var(--gray-200)}
[data-theme="light"] .sk-variant-label{color:var(--gray-800)}

/* ==================== daily journal tasks (physics olympiad + research) ==================== */
.jr-textarea{width:100%;box-sizing:border-box;padding:10px 12px;font-size:13.5px;line-height:1.6;border:1px solid var(--gray-300);border-radius:8px;background:rgba(10,12,27,.65);color:var(--gray-700);font-family:inherit;resize:vertical;transition:border-color .2s,box-shadow .2s}
.jr-textarea:focus{outline:none;border-color:rgba(168,85,247,.5);box-shadow:0 0 0 3px rgba(168,85,247,.15)}
.jr-rec-text{font-size:13.5px;color:var(--gray-600);line-height:1.6;white-space:pre-wrap;word-break:break-word;margin-bottom:8px}
.jr-rec-line{font-size:13px;color:var(--gray-600);line-height:1.6;padding:2px 0}
.jr-rec-line b{color:var(--neon-cyan,#00E5FF);margin-right:6px}
[data-theme="light"] .jr-textarea{background:#fff;border-color:var(--gray-200);color:var(--gray-800)}
[data-theme="light"] .jr-textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(0,102,255,.1)}
[data-theme="light"] .jr-rec-text,[data-theme="light"] .jr-rec-line{color:var(--gray-700)}
[data-theme="light"] .jr-rec-line b{color:#0E7490}
/* clean read-only preview shown after submit (journal + graph sketch) */
.jr-preview{border:1px solid rgba(168,85,247,.35);background:rgba(168,85,247,.06);border-radius:10px;padding:14px 16px;margin-top:4px}
.jr-preview-tag{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.4px;color:#22c55e;background:rgba(34,197,94,.12);border:1px solid rgba(34,197,94,.4);border-radius:999px;padding:2px 10px;margin-bottom:10px}
.jr-preview-actions{margin-top:12px;display:flex;justify-content:flex-end}
[data-theme="light"] .jr-preview{background:#FAF8FF;border-color:#E3D0F7}
[data-theme="light"] .jr-preview-tag{color:#15803d;background:#F0FDF4;border-color:#BBF7D0}
/* per-problem photo bar (olympiad rows + edit modal) */
.jr-pimgs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:8px}
.jr-pimg{position:relative;display:inline-block}
.jr-pimg-add{flex:0 0 auto}

/* graph sketch — light theme */
[data-theme="light"] .sk-tag{background:#E0F7FE;border-color:#7DD3FC;color:#0369A1}
[data-theme="light"] .sk-latex{background:#F0FAFF;border-color:#B9E6F2;color:var(--gray-800)}
[data-theme="light"] .sk-canvas{background:#FAFCFF;border-color:var(--gray-200)}
[data-theme="light"] .sk-var-canvas{background:#FAFCFF;border-color:#E3D0F7}
[data-theme="light"] .sk-hints{background:#FDF7FF;border-color:#E3D0F7}
[data-theme="light"] .sk-upload{background:#FAFAFA;border-color:#93C5FD}
[data-theme="light"] .sk-thumb{border-color:#7DD3FC}
[data-theme="light"] .sk-rec-thumb{border-color:#B9E6F2}
[data-theme="light"] .sk-view-img{border-color:var(--gray-200)}
[data-theme="light"] .sk-img-rm{background:#DC2626}
[data-theme="light"] .sk-view-nav{background:#F0FAFF;border-color:var(--gray-300);color:var(--primary)}
[data-theme="light"] .sk-view-nav:hover{background:#E0F7FE}

/* ==================== Role-gated read-only bank (student accounts) ====================
   Students (body[data-role="student"]) see the shared question bank but cannot
   edit it: the add/edit sidebar, import & delete controls and selection
   checkboxes are hidden. The Assignment tab is hidden via JS (core.js). */
body[data-role="student"] .bank-sidebar{display:none}
body[data-role="student"] #btnDeleteSelected,
body[data-role="student"] #btnRangeSelect,
body[data-role="student"] #btnAddToHomework,
body[data-role="student"] #btnImportBank,
body[data-role="student"] #btnCardEdit,
body[data-role="student"] #btnCardDelete,
body[data-role="student"] .bank-card-check{display:none !important}
body[data-role="student"] .bank-layout{display:block}
body[data-role="student"] .bank-main{width:100%}