:root{--maroon:#990d12;--maroon-dark:#71080d;--red:#b20c13;--navy:#0b2760;--blue:#0059ad;--paper:#eeebd9;--white:#fff;--line:#d4c9a7;--muted:#6b675d;--green:#1b754d;--soft-yellow:#fff77b;--shadow:0 3px 10px rgba(36,25,10,.08)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Arial,Helvetica,sans-serif;color:#171717;background:#e8e5d6}button,input,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.5;cursor:not-allowed}.hidden{display:none!important}
.brand-band{height:112px;background:linear-gradient(180deg,#940c12 0 48px,#eee9dc 48px 100%);position:relative;border-bottom:4px solid #8d0e13}.stripes{height:48px;background:repeating-linear-gradient(to bottom,#69070b 0 2px,#b02a2d 2px 3px,#8f0b10 3px 7px);border-bottom:1px solid #d26969}.brand-inner{max-width:1440px;height:64px;margin:auto;display:flex;align-items:center;padding:0 28px;gap:22px}.brand-mark{font-size:32px;letter-spacing:4px;color:#a40e13;font-weight:800;font-family:Arial,Helvetica,sans-serif}.brand-mark span{font-weight:400;color:#315370;margin-left:5px;letter-spacing:1px}.brand-subtitle{font-family:Georgia,serif;font-size:13px;letter-spacing:1.2px;color:#175735;border-left:1px solid #a0a0a0;padding-left:20px;margin-top:9px}
.app-shell{max-width:1440px;margin:0 auto;padding:20px 22px 16px}.setup-screen>h1,.result-screen>h1,.exam-topline h1{text-align:center;margin:0;color:var(--navy);font:bold 24px Georgia,'Times New Roman',serif}.lead{text-align:center;color:#5c5a50;margin:9px 0 22px}.setup-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(310px,.85fr);gap:18px;align-items:stretch}.panel{background:#fff;border:1px solid #c8c1ac;box-shadow:var(--shadow)}.panel h2{font: bold 16px Georgia,'Times New Roman',serif;margin:0;padding:10px 12px;background:var(--maroon);color:white;border-bottom:2px solid #c8b786}.upload-panel,.config-panel{min-height:424px}.drop-zone{min-height:195px;margin:16px;border:2px dashed #bcb29a;background:#f8f6ed;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:9px;color:#3e3b35;text-align:center;cursor:pointer;transition:.15s border-color,.15s background}.drop-zone.dragging{border-color:var(--blue);background:#edf6ff}.drop-zone strong{font-size:18px;color:var(--navy)}.drop-zone>span:not(.file-glyph){font-size:13px;color:#767164}.file-glyph{display:grid;place-items:center;width:47px;height:54px;border:2px solid var(--maroon);color:var(--maroon);font-weight:bold;font-size:12px;position:relative;background:#fff}.file-glyph:after{content:'';position:absolute;right:-2px;top:-2px;border-width:0 0 12px 12px;border-style:solid;border-color:transparent transparent #d9d3c2 transparent}.drop-zone input{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}.file-info{margin:0 16px 12px;display:flex;gap:10px;align-items:center;font-size:13px;padding:10px;background:#f4f0e2;border:1px solid #d8cfb7;overflow-wrap:anywhere}.file-info strong{color:var(--navy)}.parse-status{margin:0 16px 12px;padding:10px;font-size:13px;background:#f2f5f8;border-left:3px solid #56768a}.parse-status.error{background:#fff0ef;border-color:var(--red);color:#8d080d}.parse-status.success{background:#edf7ef;border-color:var(--green);color:#205a38}.parse-summary{margin:0 16px 14px;border:1px solid #b9cfbd;background:#f3faf4;padding:12px;font-size:13px}.summary-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.summary-grid div{padding:7px 4px;text-align:center;border-right:1px solid #d1e0d3}.summary-grid div:last-child{border:0}.summary-grid strong{display:block;font-size:22px;color:var(--green)}.summary-grid span{font-size:11px;color:#625f56}.summary-note{margin:9px 0 0;line-height:1.45}.summary-note.error{color:#930d12}.button{border:1px solid #8a887f;padding:10px 15px;font-weight:bold;font-size:12px;background:linear-gradient(#fff,#e4e1d8);color:#232323;box-shadow:0 1px 2px rgba(0,0,0,.09);border-radius:1px;transition:filter .12s,transform .12s}.button:hover:not(:disabled){filter:brightness(.97)}.button:active:not(:disabled){transform:translateY(1px)}.button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid #1776be;outline-offset:2px}.button-primary{background:linear-gradient(#c31820,#990b12);color:#fff;border-color:#75070b}.button-start{background:linear-gradient(#166da6,#004d88);color:#fff;border:1px solid #003f72;font-size:13px;padding:14px}.button-start span{float:right;font-size:17px;line-height:11px}.button-light{color:#17406b;background:linear-gradient(#fff,#f1f1ec)}.button-submit{background:linear-gradient(#c31921,#97090e);color:#fff;font-size:14px;border-color:#6f080c}.full-width{display:block;width:calc(100% - 32px);margin:0 16px 14px}.config-panel>.field-label{display:block;font-weight:bold;margin:19px 18px 8px;font-size:13px}.duration-row{display:flex;align-items:center;gap:12px;margin:0 18px 17px}.duration-row input{width:118px;padding:9px;border:1px solid #9d9a8d;background:#fff}.duration-row span{color:#676358;font-size:13px}.section-rule{height:1px;background:#d6d0be;margin:0 18px 12px}.check-row{display:flex;gap:10px;align-items:flex-start;margin:13px 18px;cursor:pointer}.check-row input{width:16px;height:16px;margin:2px 0 0;accent-color:var(--blue)}.check-row strong,.check-row small,.privacy-note strong,.privacy-note small{display:block}.check-row strong{font-size:13px}.check-row small{font-size:12px;line-height:1.35;color:#706d61;margin-top:3px}.privacy-note{display:flex;gap:10px;align-items:flex-start;margin:19px 18px 14px;padding:11px;background:#f4f0e4;border-left:3px solid #9a8b64}.lock-icon{color:#8b0b10;font-size:19px}.privacy-note strong{font-size:12px}.privacy-note small{font-size:11px;color:#6b665a;line-height:1.4;margin-top:3px}.hint{text-align:center;font-size:12px;color:#777063;margin:0 18px 15px}.footer-note{text-align:center;font-size:11px;color:#777166;margin:20px 0 4px}
/* Exam view intentionally keeps the classic PMT-EMS-style desktop anatomy. */
.exam-screen{background:var(--paper);border:1px solid #c9c2ad}.exam-topline{padding:10px 12px 9px;border-bottom:1px solid #c9c2ad}.exam-topline h1{font-size:22px}.exam-meta{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:10px;padding:0 10px 10px;align-items:stretch}.session-meta{border:1px solid #d6cfbb;padding:7px;font-size:12px;color:var(--navy);min-height:72px}.session-meta strong{display:block;color:#201e19;font: bold 13px Georgia,serif;margin-bottom:13px}.session-meta p{margin:4px 0}.timer-box{padding:9px 4px 0;text-align:left;display:grid;grid-template-columns:auto auto;align-content:start;column-gap:10px;row-gap:7px}.timer-box>span{font-size:12px;align-self:center}.timer-box>strong{font:bold 22px 'Courier New',monospace;letter-spacing:1px;color:#0018ca;white-space:nowrap}.timer-box>small{grid-column:1/-1;font-size:12px}.timer-box.urgent>strong{color:#b0000b}.exam-layout{display:grid;grid-template-columns:minmax(0,1fr) 322px;gap:10px;padding:0 10px 10px}.question-area{min-height:490px;display:flex;flex-direction:column;box-shadow:none}.question-toolbar{height:32px;display:flex;align-items:center;justify-content:space-between;padding:5px 12px;border-bottom:1px solid #d5c9a8;background:#faf9f4;color:#1b3063;font-size:12px}.question-content{padding:15px 13px;flex:1;min-height:310px;background:#fff;overflow-wrap:anywhere}.question-content .question-label{display:block;color:#004db5;font-size:16px;margin-bottom:7px}.question-content .question-stem{font-size:15px;line-height:1.65;white-space:pre-line;color:#101010;margin:0 0 15px}.option-list{border-top:1px solid #dacda9}.option-row{display:grid;grid-template-columns:42px 23px minmax(0,1fr);gap:8px;align-items:start;padding:10px 8px;border-bottom:1px solid #dacda9;cursor:pointer;min-height:39px;font-size:14px;line-height:1.5}.option-row:hover{background:#f8f5e9}.option-row input{margin:4px 0 0;accent-color:#075eac}.option-label{color:#171717}.option-row.selected{background:#fffbd2}.option-row.correct{background:#e4f3e8;border-left:3px solid #237b40}.option-row.incorrect{background:#ffebeb;border-left:3px solid #b81420}.question-image-toggle{margin:13px 0 0;padding:8px 10px;color:#07539c;font-size:12px;border:1px solid #c9d9eb;background:#f3f8fc}.source-region{display:block;max-width:100%;margin-top:10px;border:1px solid #d6d1c6;background:#fff}.source-region img{display:block;width:100%;height:auto}.question-actions{display:flex;justify-content:space-between;gap:10px;padding:10px;border-top:1px solid #d1c7ad;background:#f0eddf}.move-buttons{display:flex;gap:7px}.exam-sidebar{display:flex;flex-direction:column;gap:8px;min-width:0}.student-panel{padding-bottom:8px;min-height:100px;box-shadow:none}.student-panel h2,.question-map h2{font: bold 14px Georgia,serif;background:transparent;color:#1a1a1a;border:0;padding:8px 9px}.student-panel{display:grid;grid-template-columns:70px minmax(0,1fr);column-gap:10px;align-items:center;padding:0 8px 9px}.student-panel h2{grid-column:1/-1;width:100%;border-bottom:1px solid #d8d2c2}.student-placeholder{height:62px;background:#fff;border:1px solid #ddd5c0;display:grid;place-items:center;font: bold 23px Georgia;color:#b6b2a5}.student-copy{display:flex;flex-direction:column;gap:6px;font-size:11px;overflow-wrap:anywhere}.student-copy strong{font-size:13px}.student-copy span{color:#666154}.question-map{flex:1;min-height:170px;box-shadow:none}.map-heading{border-bottom:1px solid #d5c9a8}.map-heading h2{padding-bottom:7px}.map-heading select{display:block;width:calc(100% - 16px);margin:0 8px 8px;padding:7px;border:1px solid #a59d89;background:#fff;font-size:12px}.map-legend{display:flex;gap:12px;flex-wrap:wrap;padding:7px 8px;font-size:10px;color:#625d50;border-bottom:1px solid #e1dac6}.map-legend span{display:flex;align-items:center;gap:4px}.map-legend i{width:10px;height:10px;border:1px solid #a6a08e;background:#fff}.map-legend .legend-current{background:#fff77b;border-color:#aca000}.map-legend .legend-answered{background:#d4e8f8;border-color:#76a9d4}.question-map-list{max-height:310px;overflow:auto;padding:4px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}.map-question{min-width:0;padding:7px 3px;background:#f6f2e5;border:1px solid #d1c7ad;color:#004db5;text-align:center;font-size:11px}.map-question.answered{background:#e1edf5;border-color:#9bbacf}.map-question.current{background:#fff77b;border:1px solid #c7b900;font-weight:bold;color:#101010}.map-question.flagged{box-shadow:inset 0 -3px #bf7410}.map-question.wrong{background:#ffe3e3;border-color:#c33}.exam-sidebar>.button{width:100%;margin:0}.exit-button{font-size:11px}.result-screen>h1{margin:4px 0 18px}.result-summary{max-width:850px;margin:0 auto;display:grid;grid-template-columns:210px 1fr;min-height:150px;box-shadow:none}.score-number{background:var(--maroon);color:white;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px}.score-number strong{font:bold 31px Georgia,serif}.score-number span{font-size:11px;letter-spacing:1px;margin-top:6px}.result-details{display:grid;grid-template-columns:repeat(3,1fr);align-items:center;padding:20px}.result-details div{display:flex;flex-direction:column;gap:10px;padding:0 14px;border-right:1px solid #d6cfbb}.result-details div:last-child{border:0}.result-details span{font-size:12px;color:#69655b}.result-details strong{font-size:18px;color:var(--navy)}.result-actions{display:flex;justify-content:center;gap:10px;margin:18px 0 26px;flex-wrap:wrap}.review-panel{margin-top:20px}.review-header{display:flex;align-items:center;justify-content:space-between;border-bottom:2px solid var(--maroon);margin-bottom:10px}.review-header h2{font: bold 18px Georgia,serif;color:var(--navy)}.review-layout .question-area{min-height:380px}.review-layout .question-content{min-height:260px}.review-option-feedback{font-size:12px;display:block;margin-top:3px;color:#6a6154}.review-explanation{background:#f8f5e9;border-left:3px solid #b5a56f;margin-top:14px;padding:10px 12px;font-size:13px;line-height:1.6;white-space:pre-line}.confirm-dialog{border:1px solid #85806f;padding:0;width:min(420px,calc(100% - 32px));box-shadow:0 12px 40px #0004}.confirm-dialog::backdrop{background:#0005}.confirm-dialog h2{font:bold 17px Georgia,serif;background:var(--maroon);color:#fff;padding:12px 16px;margin:0}.confirm-dialog p{padding:8px 16px 12px;font-size:14px}.dialog-actions{display:flex;justify-content:flex-end;gap:8px;padding:0 16px 16px}.toast{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:5;background:#222;color:white;padding:12px 16px;max-width:calc(100% - 24px);box-shadow:0 5px 20px #0003;font-size:13px}.toast.error{background:#8e0b12}
@media(max-width:900px){.setup-grid{grid-template-columns:1fr}.upload-panel,.config-panel{min-height:0}.exam-meta{grid-template-columns:1fr 260px}.exam-layout{grid-template-columns:minmax(0,1fr) 265px}.question-map-list{grid-template-columns:repeat(3,minmax(0,1fr))}.brand-inner{padding:0 16px}.app-shell{padding:15px}.result-summary{max-width:100%}}
@media(max-width:650px){.brand-band{height:91px}.brand-inner{height:43px;gap:10px;padding:0 12px}.brand-mark{font-size:23px;letter-spacing:2px}.brand-subtitle{font-size:9px;padding-left:9px;letter-spacing:.3px}.app-shell{padding:10px}.setup-screen>h1,.result-screen>h1,.exam-topline h1{font-size:18px;line-height:1.25}.lead{font-size:13px}.setup-grid{gap:12px}.exam-meta{grid-template-columns:1fr;padding:0 6px 7px;gap:5px}.session-meta{min-height:auto}.timer-box{grid-template-columns:auto auto;align-items:center;padding:4px 2px 7px}.timer-box>strong{font-size:20px}.exam-layout{display:flex;flex-direction:column;padding:0 6px 6px}.question-area{min-height:420px}.question-content{padding:12px 9px}.question-content .question-stem{font-size:14px}.option-row{grid-template-columns:26px 20px minmax(0,1fr);gap:5px;padding:9px 4px;font-size:13px}.question-actions{padding:7px;align-items:center}.move-buttons{gap:5px}.question-actions .button{padding:9px 8px;font-size:10px}.exam-sidebar{display:grid;grid-template-columns:1fr}.student-panel{display:none}.question-map-list{grid-template-columns:repeat(6,minmax(0,1fr));max-height:200px}.map-question{padding:8px 2px}.exam-sidebar>.button{width:100%}.result-summary{grid-template-columns:1fr}.score-number{padding:17px}.result-details{padding:13px 4px}.result-details div{padding:0 7px}.result-details strong{font-size:14px}.result-details span{font-size:11px}.result-actions .button{flex:1 1 40%;padding:11px 8px}.question-map{order:1}.exam-sidebar>.button{order:2}.question-map-list{max-height:190px}}

.image-caption{font-size:11px;color:#716b5d;padding:5px 7px;background:#f7f4e9}
/* Review rows have no radio input, so use a dedicated three-column layout. */
.review-layout .option-row{grid-template-columns:42px minmax(0,1fr) 20px;align-items:start}
.review-layout .review-option-feedback{display:block;white-space:normal;overflow-wrap:anywhere}
/* Long PDF names must not widen the exam canvas, especially on phones. */
.session-meta,.exam-layout>*{min-width:0}
.session-meta p,.question-toolbar span{overflow-wrap:anywhere;word-break:break-word;min-width:0}
@media(max-width:650px){.exam-meta>*{min-width:0;width:100%}.exam-layout>*{min-width:0;width:100%;max-width:100%}.question-toolbar{gap:6px;align-items:flex-start}.question-toolbar span:first-child{flex:1 1 160px}.question-toolbar span:last-child{flex:0 0 auto;white-space:nowrap}.exam-topline{padding:8px}.session-meta{width:100%}.exam-sidebar{width:100%}}
/* Vietnamese typography fix: use Windows UI fonts with reliable Vietnamese glyph metrics.
   Avoid Georgia fallback on headings, which can make stacked tone marks look detached. */
html, body { font-family: "Segoe UI", Tahoma, Arial, sans-serif; }
button, input, select, textarea { font-family: "Segoe UI", Tahoma, Arial, sans-serif; letter-spacing: normal; }
.brand-subtitle { font-family: "Segoe UI", Tahoma, Arial, sans-serif; letter-spacing: .4px; }
.setup-screen > h1, .result-screen > h1, .exam-topline h1,
.panel h2, .session-meta strong, .student-panel h2, .question-map h2,
.review-header h2, .confirm-dialog h2, .score-number strong, .student-placeholder {
  font-family: "Segoe UI", Tahoma, Arial, sans-serif;
  letter-spacing: normal;
  font-kerning: normal;
}
.setup-screen > h1, .result-screen > h1, .exam-topline h1 { line-height: 1.35; }
.panel h2 { line-height: 1.35; }

/* Optional random subset per attempt, kept as compact as the time control. */
.config-panel>.question-count-label{margin-top:4px}
.question-count-row{margin-bottom:5px}
.field-help{display:block;margin:-1px 18px 12px;color:#706d61;font-size:11px;line-height:1.4}

/* PMT-EMS-style answer sheet: question text on the left, answer controls only on the right. */
.exam-layout{grid-template-columns:minmax(0,1fr) minmax(310px,390px);align-items:start}
.question-source-options{border-top:1px solid var(--line);margin-top:16px}
.question-source-option{display:grid;grid-template-columns:34px minmax(0,1fr);gap:8px;align-items:start;padding:10px 8px;border-bottom:1px solid var(--line);font-size:14px;line-height:1.55;white-space:pre-wrap;overflow-wrap:anywhere}
.question-source-option strong{font-weight:400;color:#171717}
.answer-sheet-help{font-size:11px;color:#6b675d;padding:0 9px 8px;margin:0;line-height:1.45}
.question-map-list{display:flex;flex-direction:column;gap:0;max-height:min(58vh,620px);overflow:auto;padding:0;background:#fff}
.answer-sheet-question{display:grid;grid-template-columns:56px minmax(0,1fr) 48px;align-items:stretch;gap:5px;padding:5px 6px;border-bottom:1px solid #d8cfb8;background:#f7f3e6;min-width:0}
.answer-sheet-question:nth-child(even){background:#eeead9}
.answer-sheet-question.current{background:#fff8a8;box-shadow:inset 3px 0 #b20c13}
.answer-sheet-question.answered .answer-sheet-number{font-weight:700}
.answer-sheet-question.flagged{border-right:4px solid #c17b19}
.answer-sheet-number,.answer-sheet-jump{border:0;background:transparent;color:#004db5;text-decoration:underline;font-size:12px;text-align:left;padding:5px 2px;align-self:center;min-width:0}
.answer-sheet-jump{text-align:right;color:#77705f;text-decoration:none;font-size:10px}
.answer-sheet-choices{display:flex;justify-content:space-between;align-items:center;gap:3px;min-width:0}
.answer-choice{display:flex;align-items:center;justify-content:center;gap:3px;min-width:0;padding:4px 3px;font-size:12px;cursor:pointer;border:1px solid transparent;border-radius:2px}
.answer-choice input{margin:0;accent-color:#075eac;width:14px;height:14px;flex:0 0 auto}
.answer-choice span{min-width:9px}
.answer-choice.selected{background:#d7e9f7;border-color:#79a9cf;font-weight:700}
.answer-sheet-question.current .answer-choice.selected{background:#c3e0f6}
.map-legend .legend-flagged{background:#f7e1bb;border-color:#c17b19}
.question-map{min-height:0}
.exam-sidebar{position:sticky;top:8px}
@media(max-width:900px){.exam-layout{grid-template-columns:minmax(0,1fr) minmax(285px,340px)}.question-map-list{max-height:50vh}}
@media(max-width:650px){
  .exam-layout{display:flex;flex-direction:column;gap:10px}
  .question-area{order:0;min-height:0}
  .exam-sidebar{position:static;display:flex;flex-direction:column;order:1}
  .question-map{order:0}
  .question-map-list{max-height:42vh;border-top:1px solid var(--line)}
  .answer-sheet-question{grid-template-columns:58px minmax(0,1fr) 42px;padding:7px 6px}
  .answer-sheet-choices{gap:5px}
  .answer-choice{padding:5px 4px;font-size:13px;gap:4px}
  .answer-choice input{width:17px;height:17px}
  .answer-sheet-number{font-size:13px}
  .answer-sheet-jump{font-size:10px}
  .question-source-option{grid-template-columns:26px minmax(0,1fr);padding:9px 5px;font-size:14px}
  .question-actions{flex-wrap:wrap}
}

/* One-time offline preparation status */
.offline-prep{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin:8px 0 18px}
.engine-state{font-size:12px;line-height:1.45;padding:7px 10px;border-left:3px solid #b7a46c;background:#f5f0e2;color:#554e3b}
.engine-ready{border-left-color:#1b754d;background:#edf7ef;color:#205a38}
.engine-error{border-left-color:#b20c13;background:#fff0ef;color:#8d080d}
#prepare-offline-button{font-size:10px;padding:7px 10px}
.source-region-content{min-width:0}
.source-region{margin:10px 0 0;max-width:100%}
.source-region img{max-height:65vh;object-fit:contain;background:#fff}
@media(max-width:650px){.offline-prep{margin:6px 0 15px;gap:6px}.engine-state{font-size:11px;max-width:100%;overflow-wrap:anywhere}#prepare-offline-button{font-size:10px}}

.source-region-container{min-width:0;max-width:100%;} .source-region-container .field-help{margin:8px 0;padding:8px;border:1px solid #e0d7bf;background:#faf8f0;} .source-region img{max-width:100%;height:auto;object-fit:contain;}

/* Give the A/B/C/D response strip the whole row; the question number itself is the navigation link. */
.answer-sheet-question{grid-template-columns:58px minmax(0,1fr)}
.answer-sheet-choices{justify-content:space-around;gap:5px}
.answer-choice{flex:1 1 0}
@media(max-width:650px){.answer-sheet-question{grid-template-columns:58px minmax(0,1fr)}.answer-sheet-choices{gap:6px}.answer-choice{flex:1 1 0}}

.engine-warning{border-left-color:#bd7d13;background:#fff6e2;color:#68490d}