@import "https://fonts.googleapis.com/css2?family=Manrope:wght@500;600;700;800&display=swap";
:root{--bg:#eef6fb;--bg-soft:#f8fcff;--card:#fff;--line:#d6e4ee;--text:#162431;--muted:#607484;--brand:#0f7a8a;--brand-strong:#0b5c68;--good:#0f9f67;--bad:#cb4141;--warn:#b68323;--shadow:0 10px 28px #0d3d5621;--radius:18px}*{box-sizing:border-box}html,body{min-height:100%;margin:0;padding:0;overflow-x:hidden}body{color:var(--text);background:radial-gradient(1200px 500px at 10% -10%,#d2edf7 0%,#d2edf700 70%),radial-gradient(1000px 420px at 100% 0%,#d9f2e6 0%,#d9f2e600 70%),var(--bg);font-family:Manrope,Segoe UI,sans-serif}.app-shell{width:min(1120px,100%);margin:0 auto;padding:14px}.top-tabs{z-index:50;border:1px solid var(--line);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#ffffffdb;border-radius:14px;grid-template-columns:repeat(3,1fr);gap:8px;padding:8px;display:grid;position:sticky;top:0;box-shadow:0 4px 16px #0b253514}.top-tabs button{color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:10px;padding:12px 10px;font-weight:700}.top-tabs button.active{color:#fff;background:linear-gradient(145deg,#0f7a8a,#0a6674);box-shadow:0 8px 18px #0f7a8a52}.panel-stack{gap:14px;margin-top:12px;display:grid}.panel{border:1px solid var(--line);border-radius:var(--radius);background:var(--card);box-shadow:var(--shadow);padding:16px}.panel h2,.panel h3{margin:0 0 12px}.panel.compact{padding:14px}.field-grid{grid-template-columns:1fr;gap:10px;display:grid}label{color:#2a3e4d;gap:6px;font-weight:700;display:grid}input,select,button{font:inherit}input,select{border:1px solid var(--line);width:100%;color:var(--text);background:#f9fcff;border-radius:12px;padding:11px 12px}input:focus,select:focus{border-color:#69adc0;outline:none;box-shadow:0 0 0 3px #559db32e}.list-grid{grid-template-columns:1fr;gap:10px;display:grid}.row-card{border:1px solid var(--line);background:#fbfeff;border-radius:14px;padding:12px}.row-card.selected{background:linear-gradient(145deg,#f2fafc,#f8fdff);border-color:#76b2c2}.chapter-row-head{justify-content:space-between;align-items:center;gap:8px;display:flex}.topic-trigger{color:#21506a;background:#eef8fd;border:1px solid #c4d8e5;border-radius:10px;align-items:center;gap:6px;padding:8px 10px;display:inline-flex}.topic-count-badge{color:#fff;background:#0f7a8a;border-radius:999px;place-items:center;min-width:20px;height:20px;font-size:.72rem;font-weight:800;display:inline-grid}.checkbox-row{align-items:center;gap:10px;display:flex}.checkbox-row input{width:18px;height:18px}.inline-meta,.inline-actions{flex-wrap:wrap;align-items:center;gap:8px;margin-top:10px;display:flex}.inline-meta input[type=number]{width:108px}.command-grid{grid-template-columns:1fr;gap:10px;display:grid}.command-card{background:linear-gradient(145deg,#f8fcff,#eef7fb);border:1px solid #d9e7ef;border-radius:14px;padding:12px}.command-card h4{margin:0 0 8px}.stats-inline{flex-wrap:wrap;gap:10px;font-size:.9rem;display:flex}.progress-track{background:#deebf3;border-radius:999px;width:100%;height:10px;margin-top:8px;overflow:hidden}.progress-fill{background:linear-gradient(90deg,#0f7a8a,#0fa36d);border-radius:999px;height:100%;transition:width .25s}.footer-bar{justify-content:space-between;align-items:center;gap:12px;display:flex}button{color:#203240;cursor:pointer;background:#f4f9fc;border:1px solid #d1dee7;border-radius:11px;padding:10px 14px;font-weight:700}button.primary{background:linear-gradient(145deg,var(--brand),#0d7080);color:#fff;border-color:#0000;box-shadow:0 9px 22px #0f7a8a47}button:disabled{cursor:not-allowed;opacity:.6}.quiz-screen,.quiz-layout,.quiz-main{gap:12px;display:grid}.quiz-header{border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);background:#fff;justify-content:space-between;align-items:center;gap:10px;padding:14px;display:flex}.quiz-header p{color:var(--muted);margin:4px 0 0}.timer{color:#0d4d59;background:#ddf0f5;border-radius:999px;padding:8px 12px;font-weight:800}.quiz-meta{color:var(--muted);font-size:.92rem}.shortcut-row{flex-wrap:wrap;gap:8px;display:flex}.shortcut-pill{color:#305063;background:#f4fbff;border:1px solid #cfe0ea;border-radius:999px;padding:5px 10px;font-size:.78rem;font-weight:700}.question-card{border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);background:#fff;padding:16px}.question-html{line-height:1.65}.question-html,.explanation,.attempt-detail-card,.explain-box{overflow-wrap:anywhere}.question-html img,.explanation img,.explain-box img,.attempt-detail-card img{max-width:100%;height:auto;display:block}.question-html table,.explanation table,.explain-box table,.attempt-detail-card table{max-width:100%;display:block;overflow:auto}.answer-list{gap:8px;margin-top:14px;display:grid}.answer-btn{text-align:left;color:#1e313f;background:#f8fcff;border:1px solid #d8e5ee;border-radius:12px;width:100%}.answer-btn.selected{background:#edf8fc;border-color:#67a8bc}.answer-btn.correct{background:#eaf9f2;border-color:#85d0ae}.answer-btn.wrong{background:#fff1f1;border-color:#e5a9a9}.explanation{background:#fff7dd;border-left:4px solid #e1bd65;border-radius:10px;margin-top:12px;padding:10px 12px}.quiz-nav{justify-content:space-between;gap:8px;display:flex}.quiz-sidebar{border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);background:#fff;padding:12px}.quiz-sidebar-title{color:#1f3a4b;font-weight:800}.bubble-grid{grid-template-columns:repeat(auto-fill,minmax(42px,1fr));gap:8px;max-height:320px;margin-top:10px;display:grid;overflow:auto}.bubble-btn{color:#345162;background:#f5faff;border:1px solid #d6e2ea;border-radius:10px;min-height:40px;padding:8px 0;font-weight:800}.bubble-btn.answered{background:#eaf6fb;border-color:#9ec7d7}.bubble-btn.current{color:#fff;background:linear-gradient(145deg,#0f7a8a,#0b6170);border-color:#0000}.bubble-btn.flagged{box-shadow:inset 0 0 0 2px #f2b649}.result-card{border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);background:#fff;padding:14px}.result-actions{justify-content:flex-end;margin-top:12px;display:flex}.report-grid{grid-template-columns:1fr;gap:10px;margin-top:12px;display:grid}.report-panel{background:#fbfeff;border:1px solid #d7e4ed;border-radius:14px;padding:12px}.report-panel h4{margin:0 0 8px}.perf-list{gap:6px;max-height:220px;display:grid;overflow:auto}.perf-row{background:#f7fcff;border:1px solid #deebf2;border-radius:10px;justify-content:space-between;gap:10px;padding:8px 10px;display:flex}.perf-row strong{font-size:.88rem}.perf-row span{color:#375467;white-space:nowrap;font-weight:700}.report-filter-bar{flex-wrap:wrap;align-items:center;gap:8px;margin-top:12px;display:flex}.report-filter-bar input{flex:240px;min-width:240px}.report-question-list{gap:10px;margin-top:10px;display:grid}.report-question-card{background:#fbfeff;border:1px solid #d8e5ee;border-radius:14px;padding:12px}.report-question-card.ok{border-color:#afd7c1}.report-question-card.bad{border-color:#e6b9b9}.stats-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.stat-card{background:#fafdff;border:1px solid #d7e5ee;border-radius:14px;padding:12px}.stat-card.primary{background:linear-gradient(145deg,#e7f6fa,#f4fcff)}.stat-card.good{background:linear-gradient(145deg,#ebf9f1,#f8fffb)}.stat-card.bad{background:linear-gradient(145deg,#fff0f0,#fff9f9)}.stat-label{color:var(--muted);font-weight:600}.stat-value{margin-top:6px;font-size:1.3rem;font-weight:800}.state{border:1px solid var(--line);background:#fff;border-radius:14px;padding:12px}.state.error{color:#7d2f2f;background:#fff3f3;border-color:#eab6b6}.muted{color:var(--muted);margin:0}.attempt-card{border:1px solid var(--line);box-shadow:var(--shadow);background:#fff;border-radius:14px;padding:12px}.attempt-card h3{margin:0 0 6px}.attempt-card p{color:var(--muted);margin:0}.attempt-metrics{flex-wrap:wrap;gap:8px;margin-top:10px;display:flex}.attempt-metrics span{background:#f7fbfe;border:1px solid #d4e1ea;border-radius:999px;padding:4px 10px;font-size:.86rem}.score-chip{color:#0f6070;font-weight:800;background:#e8f5fa!important;border-color:#98c5d6!important}.modal-scrim{z-index:1000;background:#10212b94;place-items:center;padding:14px;display:grid;position:fixed;inset:0}.modal-card{background:#fff;border:1px solid #cedde8;border-radius:18px;width:min(980px,100%);max-height:calc(100vh - 28px);padding:14px;overflow:auto;box-shadow:0 24px 44px #0e243457}.modal-card.topic-modal{width:min(760px,100%)}.modal-head{justify-content:space-between;align-items:center;gap:8px;margin-bottom:10px;display:flex}.modal-head h2{margin:0}.icon-btn{color:#314654;background:#f2f7fb;border:1px solid #d7e1e8}.attempt-detail-list{gap:10px;display:grid}.topic-list{gap:10px;max-height:min(60vh,520px);margin-top:12px;display:grid;overflow:auto}.topic-row{border:1px solid var(--line);background:#fbfeff;border-radius:12px;padding:10px}.topic-row.selected{background:#f2fafd;border-color:#84bccc}.attempt-detail-card{background:#fbfeff;border:1px solid #d7e5ee;border-radius:14px;padding:12px}.attempt-detail-card.ok{border-color:#afd7c1}.attempt-detail-card.bad{border-color:#e6b9b9}.attempt-detail-head{justify-content:space-between;align-items:center;gap:8px;display:flex}.pill{border-radius:999px;padding:4px 10px;font-size:.78rem;font-weight:800}.pill.ok{color:#0f6f4b;background:#e4f6ee}.pill.bad{color:#923e3e;background:#fdeaea}.attempt-option-list{gap:6px;margin-top:10px;display:grid}.attempt-option{background:#f7fbff;border:1px solid #d5e1ea;border-radius:10px;justify-content:space-between;gap:8px;padding:9px 10px;display:flex}.attempt-option.correct{background:#edf9f3;border-color:#9ed4bb}.attempt-option.wrong{background:#fef2f2;border-color:#e2aaaa}.attempt-option em{color:#526370;font-size:.76rem;font-style:normal;font-weight:700}.explain-box{background:#fff9e8;border:1px solid #e1d4af;border-radius:10px;margin-top:10px;padding:8px 10px}.explain-box summary{cursor:pointer;font-weight:700}@media (min-width:760px){.app-shell{padding:20px}.field-grid,.list-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.stats-row{grid-template-columns:repeat(4,minmax(0,1fr))}.report-grid,.command-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.quiz-layout{grid-template-columns:minmax(0,1fr) 280px;align-items:start}.quiz-sidebar{position:sticky;top:74px}.topic-list{max-height:min(58vh,560px)}}@media (max-width:767.98px){.top-tabs{scrollbar-width:none;border-radius:12px;gap:6px;padding:6px;display:flex;overflow-x:auto}.top-tabs::-webkit-scrollbar{display:none}.top-tabs button{flex:none;min-width:110px;padding:10px 12px;font-size:.86rem}.app-shell{padding:10px}.chapter-row-head{flex-direction:column;align-items:flex-start}.topic-trigger{justify-content:space-between;width:100%}}@media (min-width:1040px){.field-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.list-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}