/* ===== 看图识考点 · Learning Terminal extension ===== */
.visual-specialty-entry{
  position:relative;overflow:hidden;border-color:var(--lt-line-strong)!important;
  background:linear-gradient(105deg,rgba(56,196,184,.09),transparent)!important
}
.visual-specialty-entry::after{
  content:"VISUAL / 01";position:absolute;right:16px;top:12px;color:var(--lt-text-3);
  font:700 9px var(--font-metric);letter-spacing:.12em
}
.visual-specialty-entry .vs-entry-mark{
  display:inline-flex;width:auto;height:auto;padding:0;background:none;color:var(--lt-accent);
  font:800 11px var(--font-metric);letter-spacing:.08em
}
.visual-hub,.visual-practice{max-width:1120px;margin:0 auto;padding-bottom:54px;color:var(--lt-text)}
.visual-specialty-bar{border-left-color:var(--lt-accent)!important}

/* Hub: same information density and surfaces as the quiz center. */
.visual-hero{
  display:grid;grid-template-columns:minmax(0,1.25fr) minmax(290px,.75fr);
  gap:12px;margin:18px 0 20px
}
.visual-hero-copy,.visual-hero-stats{
  border:1px solid var(--lt-line);border-radius:12px;background:rgba(13,26,36,.82)
}
.visual-hero-copy{padding:25px 26px}
.visual-kicker{display:block;color:var(--lt-accent);font:700 10px var(--font-metric);letter-spacing:.14em}
.visual-hero h2{
  margin:8px 0 8px;color:var(--lt-text);font:700 clamp(26px,3.4vw,42px)/1 var(--font-display);
  letter-spacing:-.045em
}
.visual-hero p{max-width:620px;margin:0;color:var(--lt-text-2);font-size:13px;line-height:1.75}
.visual-hero-points{display:flex;flex-wrap:wrap;gap:7px;margin-top:17px}
.visual-hero-points span,.visual-relation-strip span{
  padding:5px 8px;border:1px solid var(--lt-line);border-radius:5px;
  background:rgba(255,255,255,.025);color:var(--lt-text-3);font:600 10px var(--font-ui)
}
.visual-hero-stats{display:grid;grid-template-columns:1fr 1fr;padding:7px}
.visual-hero-stat{
  display:flex;flex-direction:column;justify-content:flex-end;min-height:84px;padding:13px;
  border-right:1px solid var(--lt-line);border-bottom:1px solid var(--lt-line)
}
.visual-hero-stat:nth-child(2n){border-right:0}.visual-hero-stat:nth-child(n+3){border-bottom:0}
.visual-hero-stat strong{color:var(--lt-text);font:700 27px var(--font-metric)}
.visual-hero-stat span{margin-top:4px;color:var(--lt-text-3);font-size:10px}

.visual-mode-bar{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:0 0 17px;
  padding:6px;border:1px solid var(--lt-line);border-radius:12px;background:rgba(7,17,26,.72)
}
.visual-mode-bar button{
  min-height:48px;padding:8px 12px;border:1px solid transparent;border-radius:8px;
  background:transparent;color:var(--lt-text-3);cursor:pointer;text-align:left
}
.visual-mode-bar button:hover{background:rgba(255,255,255,.03);color:var(--lt-text)}
.visual-mode-bar button.on{
  border-color:var(--lt-line-strong);background:var(--lt-surface-2);color:var(--lt-text);
  box-shadow:inset 3px 0 var(--lt-accent)
}
.visual-mode-bar button b{display:block;font-size:12px}.visual-mode-bar button small{display:block;margin-top:3px;font-size:10px;color:inherit;opacity:.75}

.visual-group-bar{
  display:flex;gap:6px;overflow:auto;margin:0 0 14px;padding:5px;
  border:1px solid var(--lt-line);border-radius:10px;background:rgba(7,17,26,.55)
}
.visual-group-bar button{
  flex:0 0 auto;display:flex;align-items:baseline;gap:7px;padding:8px 10px;
  border:1px solid transparent;border-radius:7px;background:transparent;color:var(--lt-text-3);
  cursor:pointer;text-align:left
}
.visual-group-bar button:hover{background:rgba(255,255,255,.03);color:var(--lt-text)}
.visual-group-bar button.on{
  border-color:var(--lt-line-strong);background:var(--lt-surface-2);color:var(--lt-text);
  box-shadow:inset 0 -2px var(--vg,var(--lt-accent))
}
.visual-group-bar button b{font-size:11px}.visual-group-bar button small{font:700 9px var(--font-metric);opacity:.72}
.visual-hub-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}
.visual-group-label{
  grid-column:1/-1;display:flex;justify-content:space-between;align-items:end;
  margin-top:5px;padding:13px 2px 7px;border-bottom:1px solid var(--lt-line);
  color:var(--lt-text-3);font-size:10px
}
.visual-group-label b{color:var(--lt-text-2);font-size:13px}
.visual-object-card{
  position:relative;min-width:0;padding:0;overflow:hidden;border:1px solid var(--lt-line);
  border-radius:10px;background:var(--lt-surface);color:var(--lt-text);cursor:pointer;text-align:left;
  transition:border-color .18s,transform .18s,background .18s
}
.visual-object-card:hover{transform:translateY(-2px);border-color:var(--lt-line-strong);background:var(--lt-surface-2)}
.visual-object-visual{position:relative;display:block;overflow:hidden}
.visual-object-visual::after{
  content:"";position:absolute;inset:auto 0 0;height:42%;pointer-events:none;
  background:linear-gradient(transparent,rgba(4,12,17,.78))
}
.visual-object-visual img{
  display:block;width:100%;aspect-ratio:4/3;object-fit:cover;
  border-bottom:1px solid var(--lt-line);background:#08131b
}
.visual-object-visual>strong{
  position:absolute;z-index:1;left:11px;right:11px;bottom:10px;color:#fff;
  font:700 16px/1.2 var(--font-display);letter-spacing:-.02em;
  text-shadow:0 1px 8px rgba(0,0,0,.65)
}
.visual-card-source{
  position:absolute;z-index:2;left:9px;top:9px;padding:4px 6px;border:1px solid rgba(255,255,255,.24);
  border-radius:4px;background:rgba(7,17,26,.78);color:#d7e7e4;
  font:700 8px var(--font-metric);letter-spacing:.08em;backdrop-filter:blur(4px)
}
.visual-card-source.real{border-color:rgba(56,196,184,.5);color:#72dfd4}
.visual-object-copy{padding:11px 12px 13px}
.visual-object-copy b{display:block;color:var(--lt-text);font-size:14px}
.visual-object-copy span{display:block;margin-top:4px;color:var(--lt-text-3);font-size:10px;line-height:1.45}
.visual-object-copy em{
  display:inline-block;margin-top:8px;color:var(--lt-accent);font:600 9px var(--font-metric);
  letter-spacing:.035em;font-style:normal
}
.visual-progress-note{margin:18px 0 0;color:var(--lt-text-3);font-size:11px}
.visual-progress-note b{color:var(--lt-accent);font-weight:600}

/* Practice: image is evidence, options stay in the familiar quiz instrument. */
.visual-practice-top{
  display:flex;align-items:end;justify-content:space-between;gap:15px;margin:18px 0 12px
}
.visual-practice-top h2{margin:0;color:var(--lt-text);font:700 27px var(--font-display);letter-spacing:-.03em}
.visual-practice-top p{margin:5px 0 0;color:var(--lt-text-3);font-size:11px}
.visual-practice-score{text-align:right;color:var(--lt-text-3);font:600 10px var(--font-metric)}
.visual-practice-score b{color:var(--lt-text);font:700 20px var(--font-metric)}
.visual-progress-line{height:3px;margin-bottom:13px;overflow:hidden;background:rgba(139,167,177,.12)}
.visual-progress-line i{display:block;height:100%;background:var(--lt-accent);transition:width .2s}
.visual-question{
  display:grid;grid-template-columns:minmax(300px,.92fr) minmax(0,1.08fr);gap:0;
  overflow:hidden;border:1px solid var(--lt-line);border-radius:12px;
  background:linear-gradient(145deg,rgba(17,34,45,.98),rgba(10,23,33,.98))
}
.visual-question-media{position:relative;min-height:430px;overflow:hidden;background:#08131b;border-right:1px solid var(--lt-line)}
.visual-question-media img{display:block;width:100%;height:100%;min-height:430px;object-fit:cover}
.visual-media-stamp{
  position:absolute;left:13px;top:13px;padding:5px 7px;border:1px solid var(--lt-line-strong);
  border-radius:4px;background:rgba(7,17,26,.82);color:var(--lt-accent);
  font:700 8px var(--font-metric);letter-spacing:.12em
}
.visual-media-source{
  position:absolute;z-index:2;right:13px;top:13px;max-width:48%;overflow:hidden;text-overflow:ellipsis;
  padding:5px 7px;border:1px solid rgba(255,255,255,.22);border-radius:4px;
  background:rgba(7,17,26,.82);color:#d5e4e1;text-decoration:none;white-space:nowrap;
  font:600 8px var(--font-metric);letter-spacing:.035em
}
.visual-media-source:hover{border-color:var(--lt-accent);color:var(--lt-accent)}
.visual-media-name{
  position:absolute;z-index:1;left:13px;right:13px;bottom:14px;padding:10px 12px;
  border:1px solid rgba(255,255,255,.28);border-radius:8px;background:rgba(4,13,18,.76);
  color:#fff;font:700 20px/1.15 var(--font-display);letter-spacing:-.03em;
  text-shadow:0 1px 8px rgba(0,0,0,.55);backdrop-filter:blur(4px);transition:opacity .18s,filter .18s
}
.visual-media-name.is-hidden{opacity:0;filter:blur(8px);pointer-events:none}
.visual-question-copy{display:flex;flex-direction:column;min-width:0;padding:22px 23px 20px}
.visual-q-meta{display:flex;justify-content:space-between;gap:12px;color:var(--lt-text-3);font-size:9px}
.visual-q-meta b{color:var(--lt-accent);font:700 9px var(--font-metric);letter-spacing:.08em}
.visual-question-copy h3{margin:28px 0 20px;color:var(--lt-text);font-size:20px;line-height:1.55}
.visual-options{display:grid;gap:8px;margin-top:auto}
.visual-options button{
  display:grid;grid-template-columns:27px 1fr;gap:10px;align-items:center;min-height:47px;
  padding:10px 12px;border:1px solid var(--lt-line);border-radius:9px;
  background:rgba(255,255,255,.025);color:var(--lt-text);cursor:pointer;text-align:left;font-size:12px
}
.visual-options button:hover{border-color:var(--lt-line-strong);background:rgba(56,196,184,.05)}
.visual-options button.selected{border-color:#e5b65b;background:rgba(229,182,91,.09);box-shadow:inset 3px 0 #e5b65b}
.visual-options button.selected .k{background:#e5b65b;color:#211706}
.visual-options button .k{
  display:grid;place-items:center;width:24px;height:24px;border-radius:6px;
  background:rgba(255,255,255,.055);color:var(--lt-text-2);font:700 10px var(--font-metric)
}
.visual-options button.correct{border-color:rgba(56,196,184,.65);background:rgba(56,196,184,.09);box-shadow:inset 3px 0 var(--lt-accent)}
.visual-options button.correct .k{background:var(--lt-accent);color:#071a1b}
.visual-options button.wrong{border-color:rgba(223,106,96,.72);background:rgba(223,106,96,.08);box-shadow:inset 3px 0 var(--lt-danger)}
.visual-options button.wrong .k{background:var(--lt-danger);color:#fff}
.visual-options button:disabled{cursor:default}
.visual-feedback{
  margin-top:13px;padding:13px 14px;border-left:3px solid var(--lt-danger);
  border-radius:7px;background:rgba(223,106,96,.065)
}
.visual-feedback.good{border-left-color:var(--lt-accent);background:rgba(56,196,184,.06)}
.visual-feedback b{display:block;color:var(--lt-text);font-size:12px}
.visual-feedback p{margin:5px 0 0;color:var(--lt-text-2);font-size:11px;line-height:1.65}
.visual-feedback small{display:block;margin-top:8px;color:var(--lt-text-3);font-size:10px}
.visual-source-question{
  margin-top:11px;padding:11px 12px;border:1px solid var(--lt-line);
  border-radius:8px;background:rgba(255,255,255,.025)
}
.visual-source-question>span{
  display:block;color:var(--lt-accent);font:700 9px var(--font-metric);letter-spacing:.1em
}
.visual-source-question p{margin:5px 0 0;color:var(--lt-text-2);font-size:11px;line-height:1.55}
.visual-source-question small{display:block;margin-top:6px;color:var(--lt-text-3);font-size:10px}
.visual-quality-check{
  display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:11px;
  padding:10px 11px;border:1px dashed var(--lt-line);border-radius:8px;background:rgba(255,255,255,.018)
}
.visual-quality-check div{min-width:0}.visual-quality-check span{
  display:block;color:var(--lt-text-3);font:700 8px var(--font-metric);letter-spacing:.1em
}
.visual-quality-check b{display:block;margin-top:3px;color:var(--lt-text-2);font-size:10px}
.visual-quality-check button{
  flex:0 0 auto;padding:7px 9px;border:1px solid var(--lt-line-strong);border-radius:6px;
  background:transparent;color:var(--lt-accent);font:700 9px var(--font-ui);cursor:pointer
}
.visual-quality-check button:hover{border-color:var(--lt-accent);background:rgba(56,196,184,.06)}
.visual-report-overlay{
  position:fixed;inset:0;z-index:10020;display:grid;place-items:center;
  padding:24px;background:rgba(3,12,18,.76);backdrop-filter:blur(9px)
}
.visual-report-card{
  position:relative;width:min(590px,100%);box-sizing:border-box;padding:28px;
  border:1px solid var(--lt-line-strong);border-radius:14px;
  background:linear-gradient(145deg,#122630,#091821);box-shadow:0 30px 90px rgba(0,0,0,.45);
  color:var(--lt-text)
}
.visual-report-card>span{color:var(--lt-accent);font:700 9px var(--font-metric);letter-spacing:.14em}
.visual-report-card h3{margin:8px 0 10px;color:var(--lt-text);font:700 24px var(--font-display);letter-spacing:-.03em}
.visual-report-card>p{margin:0 0 17px;color:var(--lt-text-3);font-size:11px;line-height:1.65}
.visual-report-close{
  position:absolute;right:16px;top:12px;border:0;background:transparent;
  color:var(--lt-text-3);font-size:24px;cursor:pointer
}
.visual-report-context{
  display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px;
  padding:9px 10px;border-left:3px solid var(--lt-accent);background:rgba(56,196,184,.055)
}
.visual-report-context b{font-size:12px}.visual-report-context span{color:var(--lt-text-3);font:600 9px var(--font-metric)}
.visual-report-types{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:12px}
.visual-report-types input{position:absolute;opacity:0}
.visual-report-types span{
  display:block;padding:7px 10px;border:1px solid var(--lt-line);border-radius:6px;
  color:var(--lt-text-3);font-size:10px;cursor:pointer
}
.visual-report-types input:checked+span{
  border-color:var(--lt-accent);background:rgba(56,196,184,.09);color:var(--lt-accent)
}
.visual-report-card textarea{
  box-sizing:border-box;width:100%;min-height:112px;padding:12px 13px;
  border:1px solid var(--lt-line);border-radius:8px;resize:vertical;
  background:#07141c;color:var(--lt-text);font:12px/1.7 var(--font-ui)
}
.visual-report-card textarea:focus{outline:1px solid var(--lt-accent);border-color:var(--lt-accent)}
.visual-report-card form>button{
  width:100%;margin-top:12px;padding:11px;border:1px solid var(--lt-accent);
  border-radius:8px;background:var(--lt-accent);color:#071a1b;font:750 12px var(--font-ui);cursor:pointer
}
.visual-report-card form>button:disabled{opacity:.55;cursor:default}
.visual-report-status{min-height:19px;margin-top:7px;color:var(--lt-accent);font-size:10px}
.visual-relation-strip{display:flex;flex-wrap:wrap;gap:6px;margin-top:11px}
.visual-relation-locked{
  margin-top:11px;padding:9px 11px;border:1px dashed var(--lt-line);
  border-radius:7px;color:var(--lt-text-3);font-size:10px
}
.visual-question.visual-exam-first{display:grid}
.visual-exam-first .visual-question-copy{padding:27px 29px 24px}
.visual-exam-first .visual-question-copy h3{max-width:820px;margin:28px 0 22px;font-size:23px}
.visual-exam-first .visual-options{max-width:860px;margin-top:0}
.visual-memory-badge{
  position:absolute;z-index:2;left:13px;top:48px;padding:5px 7px;border:1px solid rgba(56,196,184,.48);
  border-radius:4px;background:rgba(7,17,26,.84);color:#72dfd4;font:700 8px var(--font-metric);letter-spacing:.08em
}
.visual-answer-notes{margin-top:13px;padding:12px 13px;border-left:3px solid var(--lt-accent);border-radius:7px;background:rgba(56,196,184,.06)}
.visual-answer-notes>span{display:block;color:var(--lt-accent);font:700 9px var(--font-metric);letter-spacing:.1em}
.visual-answer-notes p{margin:5px 0 0;color:var(--lt-text-2);font-size:11px;line-height:1.6}
.visual-answer-notes>small{display:block;margin-top:9px;color:var(--lt-text-3);font-size:9px}
.visual-answer-evidence{
  display:grid;grid-template-columns:minmax(250px,.72fr) minmax(0,1.28fr);gap:0;
  margin-top:14px;overflow:hidden;border:1px solid var(--lt-line);border-radius:10px;
  background:rgba(5,16,23,.56)
}
.visual-answer-evidence figure{position:relative;min-height:250px;margin:0;overflow:hidden;background:#08131b}
.visual-answer-evidence figure::after{content:"";position:absolute;inset:auto 0 0;height:45%;background:linear-gradient(transparent,rgba(2,9,13,.82));pointer-events:none}
.visual-answer-evidence figure>img{display:block;width:100%;height:100%;min-height:250px;object-fit:cover}
.visual-answer-evidence figure>strong{
  position:absolute;z-index:1;left:14px;right:14px;bottom:13px;color:#fff;
  font:700 21px var(--font-display);text-shadow:0 2px 9px rgba(0,0,0,.7)
}
.visual-answer-evidence>div{padding:20px 21px}
.visual-answer-evidence>div>span{color:var(--lt-accent);font:700 9px var(--font-metric);letter-spacing:.11em}
.visual-answer-evidence h4{margin:8px 0 7px;color:var(--lt-text);font:700 22px var(--font-display);letter-spacing:-.025em}
.visual-answer-evidence p{margin:0;color:var(--lt-text-2);font-size:11px;line-height:1.7}
.visual-answer-evidence>div>small{display:block;margin-top:13px;color:var(--lt-text-3);font-size:9px}
.visual-next{display:flex;justify-content:space-between;gap:9px;margin-top:11px}
.visual-next button{
  min-height:41px;padding:0 15px;border:1px solid var(--lt-line);border-radius:8px;
  background:rgba(255,255,255,.025);color:var(--lt-text-2);cursor:pointer
}
.visual-next button:hover{border-color:var(--lt-line-strong);color:var(--lt-text)}
.visual-next button.primary{border-color:var(--lt-accent);background:var(--lt-accent);color:#071a1b;font-weight:750}
.visual-next button:disabled{opacity:.35;cursor:default}

/* v2: a field-training lab, built around short repeatable sessions. */
.visual-lab-hero{
  display:grid;grid-template-columns:minmax(0,.92fr) minmax(420px,1.08fr);min-height:420px;
  margin:18px 0 38px;overflow:hidden;border:1px solid var(--lt-line);border-radius:14px;
  background:radial-gradient(circle at 72% 15%,rgba(56,196,184,.16),transparent 35%),#091923
}
.visual-lab-copy{position:relative;z-index:2;padding:45px 42px 38px}
.visual-lab-copy::before{
  content:"";position:absolute;left:21px;top:44px;width:3px;height:64px;background:var(--lt-accent)
}
.visual-lab-copy h2{
  margin:12px 0 17px;color:var(--lt-text);font:750 clamp(34px,4.8vw,62px)/.98 var(--font-display);
  letter-spacing:-.065em
}
.visual-lab-copy p{max-width:480px;margin:0;color:var(--lt-text-2);font-size:13px;line-height:1.85}
.visual-lab-copy>button{
  display:flex;align-items:center;justify-content:space-between;gap:20px;min-width:238px;margin-top:27px;
  padding:13px 15px;border:1px solid var(--lt-accent);border-radius:7px;background:var(--lt-accent);
  color:#061719;font:750 12px var(--font-ui);cursor:pointer;box-shadow:0 10px 30px rgba(56,196,184,.12)
}
.visual-lab-copy>button span{opacity:.62;font:700 9px var(--font-metric)}
.visual-lab-collage{position:relative;min-height:420px;overflow:hidden;background:linear-gradient(135deg,rgba(255,255,255,.015),transparent)}
.visual-lab-collage figure{position:absolute;margin:0;overflow:hidden;border:1px solid rgba(210,234,232,.3);background:#061219;box-shadow:0 25px 55px rgba(0,0,0,.32)}
.visual-lab-collage figure::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 55%,rgba(2,9,12,.75))}
.visual-lab-collage img{display:block;width:100%;height:100%;object-fit:cover}
.visual-lab-collage figcaption{position:absolute;z-index:1;left:10px;bottom:9px;color:#fff;font:700 9px var(--font-metric);letter-spacing:.1em}
.visual-lab-collage .shot-1{left:4%;top:9%;width:45%;height:58%;transform:rotate(-4deg)}
.visual-lab-collage .shot-2{right:4%;top:5%;width:45%;height:43%;transform:rotate(3deg)}
.visual-lab-collage .shot-3{right:9%;bottom:4%;width:49%;height:45%;transform:rotate(-2deg)}
.visual-lab-meter{
  position:absolute;z-index:3;left:7%;bottom:7%;display:flex;flex-direction:column;justify-content:flex-end;
  width:142px;height:112px;padding:13px;border:1px solid var(--lt-line-strong);background:rgba(6,20,27,.9);backdrop-filter:blur(7px)
}
.visual-lab-meter strong{color:var(--lt-accent);font:750 29px var(--font-metric)}
.visual-lab-meter strong small{color:var(--lt-text-3);font-size:12px}.visual-lab-meter span{margin-top:5px;color:var(--lt-text-2);font-size:10px}

.visual-route-section,.visual-deck-section,.visual-atlas-section{margin:0 0 38px}
:is(.visual-route-section,.visual-deck-section,.visual-atlas-section)>header{
  display:grid;grid-template-columns:180px 1fr;gap:20px;align-items:end;margin-bottom:13px;padding-bottom:11px;border-bottom:1px solid var(--lt-line)
}
:is(.visual-route-section,.visual-deck-section,.visual-atlas-section)>header>span{color:var(--lt-accent);font:700 9px var(--font-metric);letter-spacing:.12em}
:is(.visual-route-section,.visual-deck-section,.visual-atlas-section)>header b{color:var(--lt-text);font:700 18px var(--font-display)}
:is(.visual-route-section,.visual-deck-section,.visual-atlas-section)>header p{margin:4px 0 0;color:var(--lt-text-3);font-size:10px}
.visual-route-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.visual-route-card{
  --route:#38c4b8;position:relative;display:flex;flex-direction:column;min-height:218px;padding:16px;
  overflow:hidden;border:1px solid var(--lt-line);border-radius:10px;background:linear-gradient(155deg,rgba(255,255,255,.035),rgba(255,255,255,.01));
  color:var(--lt-text);cursor:pointer;text-align:left;transition:transform .2s,border-color .2s,background .2s;
  animation:visualLabRise .42s both
}
.visual-route-card:nth-child(2){animation-delay:.04s}.visual-route-card:nth-child(3){animation-delay:.08s}.visual-route-card:nth-child(4){animation-delay:.12s}.visual-route-card:nth-child(5){animation-delay:.16s}
.visual-route-card::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--route)}
.visual-route-card:hover{transform:translateY(-4px);border-color:var(--route);background:linear-gradient(155deg,color-mix(in srgb,var(--route) 9%,transparent),rgba(255,255,255,.012))}
.visual-route-card.amber{--route:#e5b65b}.visual-route-card.blue{--route:#69aee8}.visual-route-card.violet{--route:#9e8bd8}.visual-route-card.red{--route:#df6a60}
.visual-route-no{position:absolute;right:13px;top:12px;color:rgba(211,233,230,.16);font:800 31px var(--font-metric)}
.visual-route-card>small{color:var(--route);font:700 8px var(--font-metric);letter-spacing:.11em}
.visual-route-card>b{margin-top:22px;font:720 18px var(--font-display)}
.visual-route-card>p{margin:8px 0 14px;color:var(--lt-text-3);font-size:10px;line-height:1.6}
.visual-route-card>em{margin-top:auto;color:var(--lt-text-2);font:600 9px var(--font-metric);font-style:normal}
.visual-route-card>i{margin-top:11px;color:var(--route);font-size:10px;font-style:normal;font-weight:700}

.visual-deck-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.visual-deck-card{
  display:grid;grid-template-columns:132px 1fr;min-height:104px;padding:0;overflow:hidden;border:1px solid var(--lt-line);
  border-radius:9px;background:var(--lt-surface);color:var(--lt-text);cursor:pointer;text-align:left;transition:border-color .18s,transform .18s
}
.visual-deck-card:hover{transform:translateX(3px);border-color:var(--vg,var(--lt-accent))}
.visual-deck-thumbs{display:grid;grid-template-columns:repeat(3,1fr);height:100%;overflow:hidden;border-right:1px solid var(--lt-line)}
.visual-deck-thumbs img{width:100%;height:100%;min-height:104px;object-fit:cover;filter:saturate(.86)}
.visual-deck-copy{display:flex;flex-direction:column;justify-content:center;min-width:0;padding:13px}
.visual-deck-copy b{font-size:13px}.visual-deck-copy small{margin-top:5px;color:var(--lt-text-3);font-size:9px}.visual-deck-copy em{margin-top:10px;color:var(--vg,var(--lt-accent));font-size:9px;font-style:normal}
.visual-atlas-section .visual-hub-grid{margin-top:10px}

.visual-session-head{
  display:flex;align-items:end;justify-content:space-between;gap:16px;margin:18px 0 11px;padding:0 2px
}
.visual-session-head>div:first-child span{display:block;color:var(--lt-accent);font:700 9px var(--font-metric);letter-spacing:.12em}
.visual-session-head>div:first-child b{display:block;margin-top:4px;color:var(--lt-text);font:720 24px var(--font-display)}
.visual-session-metrics{display:flex;border:1px solid var(--lt-line);border-radius:8px;overflow:hidden;background:rgba(255,255,255,.018)}
.visual-session-metrics>span{min-width:74px;padding:8px 11px;border-right:1px solid var(--lt-line);text-align:right}.visual-session-metrics>span:last-child{border:0}
.visual-session-metrics small{display:block;color:var(--lt-text-3);font-size:8px}.visual-session-metrics b{display:block;margin-top:3px;color:var(--lt-text);font:700 15px var(--font-metric)}
.visual-question.clue-locked .visual-question-media img{filter:blur(13px) saturate(.35);transform:scale(1.06)}
.visual-clue-shield{
  position:absolute;z-index:3;inset:50% auto auto 50%;transform:translate(-50%,-50%);padding:9px 11px;
  border:1px solid var(--lt-line-strong);background:rgba(5,16,23,.86);color:var(--lt-text-2);font:700 9px var(--font-metric);letter-spacing:.08em
}
.visual-next>span{align-self:center;color:var(--lt-text-3);font:600 8px var(--font-metric);letter-spacing:.04em}

.visual-gallery-question{
  margin-top:13px;padding:22px;border:1px solid var(--lt-line);border-radius:12px;
  background:linear-gradient(150deg,rgba(17,34,45,.98),rgba(8,20,28,.98))
}
.visual-gallery-question h3{margin:15px 0 17px;color:var(--lt-text);font:700 23px var(--font-display);letter-spacing:-.025em}
.visual-gallery-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.visual-gallery-options button{
  position:relative;padding:0;overflow:hidden;border:1px solid var(--lt-line);border-radius:9px;background:#07131b;color:#fff;cursor:pointer;text-align:left;transition:transform .18s,border-color .18s
}
.visual-gallery-options button:hover{transform:translateY(-3px);border-color:var(--lt-line-strong)}
.visual-gallery-options img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}
.visual-gallery-options button>span{display:flex;align-items:center;gap:8px;min-height:38px;padding:7px 9px;color:var(--lt-text-2);font-size:10px}
.visual-gallery-options button i{display:grid;place-items:center;width:21px;height:21px;border-radius:4px;background:rgba(255,255,255,.07);font:700 9px var(--font-metric);font-style:normal}
.visual-gallery-options button.correct{border-color:var(--lt-accent);box-shadow:inset 0 0 0 2px var(--lt-accent)}
.visual-gallery-options button.correct>span{background:rgba(56,196,184,.12);color:var(--lt-accent)}
.visual-gallery-options button.wrong{border-color:var(--lt-danger);box-shadow:inset 0 0 0 2px var(--lt-danger)}
.visual-gallery-options button.wrong>span{background:rgba(223,106,96,.12);color:#f0aaa3}
.visual-gallery-options button:disabled{cursor:default}.visual-gallery-options button:disabled:hover{transform:none}

.visual-result-card{
  position:relative;max-width:850px;margin:38px auto;padding:42px;overflow:hidden;border:1px solid var(--lt-line-strong);
  border-radius:14px;background:radial-gradient(circle at 85% 12%,rgba(229,182,91,.12),transparent 34%),#0a1b25;color:var(--lt-text)
}
.visual-result-card::after{content:"SESSION";position:absolute;right:-8px;bottom:-25px;color:rgba(213,234,232,.035);font:900 100px var(--font-metric);letter-spacing:-.08em}
.visual-result-card>span{color:#e5b65b;font:700 9px var(--font-metric);letter-spacing:.13em}.visual-result-card.is-strong>span{color:var(--lt-accent)}
.visual-result-card h2{position:relative;z-index:1;max-width:650px;margin:12px 0 28px;font:750 clamp(28px,4vw,48px)/1.08 var(--font-display);letter-spacing:-.05em}
.visual-result-score{position:relative;z-index:1;display:grid;grid-template-columns:1.4fr repeat(3,1fr);border:1px solid var(--lt-line);border-radius:10px;overflow:hidden}
.visual-result-score>strong,.visual-result-score>div{display:flex;flex-direction:column;justify-content:center;min-height:118px;padding:16px;border-right:1px solid var(--lt-line)}
.visual-result-score>div:last-child{border:0}.visual-result-score>strong{color:var(--lt-accent);font:800 48px var(--font-metric)}.visual-result-score>strong small{font-size:18px}
.visual-result-score>div b{font:750 25px var(--font-metric)}.visual-result-score>div span{margin-top:5px;color:var(--lt-text-3);font-size:9px}
.visual-result-card>p{position:relative;z-index:1;margin:18px 0;color:var(--lt-text-3);font-size:11px}
.visual-result-actions{position:relative;z-index:1;display:flex;justify-content:flex-end;gap:8px}.visual-result-actions button{padding:10px 13px;border:1px solid var(--lt-line);border-radius:7px;background:transparent;color:var(--lt-text-2);cursor:pointer}.visual-result-actions button.primary{border-color:var(--lt-accent);background:var(--lt-accent);color:#061719;font-weight:750}
@keyframes visualLabRise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}

/* Day mode follows the project's paper-like quiz palette. */
html[data-theme="day"] body[data-view="quiz"] .visual-hub,
html[data-theme="day"] body[data-view="quiz"] .visual-practice{color:#17343a}
html[data-theme="day"] body[data-view="quiz"] :is(.visual-hero-copy,.visual-hero-stats,.visual-object-card){
  background:#fff;border-color:rgba(40,76,82,.14)
}
html[data-theme="day"] body[data-view="quiz"] .visual-hero h2,
html[data-theme="day"] body[data-view="quiz"] :is(.visual-hero-stat strong,.visual-object-copy b,.visual-practice-top h2,.visual-question-copy h3){color:#17343a}
html[data-theme="day"] body[data-view="quiz"] :is(.visual-hero p,.visual-object-copy span,.visual-practice-top p,.visual-practice-score,.visual-q-meta,.visual-feedback p){color:#657a7d}
html[data-theme="day"] body[data-view="quiz"] .visual-mode-bar{background:#f2f5f2;border-color:rgba(40,76,82,.14)}
html[data-theme="day"] body[data-view="quiz"] .visual-group-bar{background:#f2f5f2;border-color:rgba(40,76,82,.14)}
html[data-theme="day"] body[data-view="quiz"] .visual-mode-bar button{color:#657a7d}
html[data-theme="day"] body[data-view="quiz"] .visual-mode-bar button.on{background:#fff;color:#17343a;border-color:rgba(19,127,145,.35);box-shadow:inset 3px 0 #137f91}
html[data-theme="day"] body[data-view="quiz"] .visual-group-bar button{color:#657a7d}
html[data-theme="day"] body[data-view="quiz"] .visual-group-bar button.on{background:#fff;color:#17343a;border-color:rgba(19,127,145,.35)}
html[data-theme="day"] body[data-view="quiz"] .visual-question{background:#fff;border-color:rgba(40,76,82,.16)}
html[data-theme="day"] body[data-view="quiz"] .visual-options button{background:#fbfcfa;color:#17343a;border-color:rgba(40,76,82,.14)}
html[data-theme="day"] body[data-view="quiz"] .visual-next button{background:#fff;color:#657a7d;border-color:rgba(40,76,82,.14)}
html[data-theme="day"] body[data-view="quiz"] .visual-source-question,
html[data-theme="day"] body[data-view="quiz"] .visual-relation-locked{background:#f7faf7;border-color:rgba(40,76,82,.14)}
html[data-theme="day"] body[data-view="quiz"] .visual-source-question p{color:#435d61}
html[data-theme="day"] body[data-view="quiz"] .visual-answer-evidence{background:#f7faf7;border-color:rgba(40,76,82,.14)}
html[data-theme="day"] body[data-view="quiz"] .visual-answer-evidence h4{color:#17343a}
html[data-theme="day"] body[data-view="quiz"] .visual-answer-evidence p{color:#657a7d}
html[data-theme="day"] body[data-view="quiz"] .visual-answer-notes{background:#f0f8f5;border-color:#137f91}
html[data-theme="day"] body[data-view="quiz"] .visual-answer-notes p{color:#435d61}
html[data-theme="day"] body[data-view="quiz"] .visual-report-card{background:#fff;color:#17343a;border-color:rgba(40,76,82,.22)}
html[data-theme="day"] body[data-view="quiz"] .visual-report-card h3{color:#17343a}
html[data-theme="day"] body[data-view="quiz"] .visual-report-card textarea{background:#f7faf7;color:#17343a;border-color:rgba(40,76,82,.18)}
html[data-theme="day"] body[data-view="quiz"] :is(.visual-lab-hero,.visual-gallery-question,.visual-result-card){background:#fff;color:#17343a;border-color:rgba(40,76,82,.17)}
html[data-theme="day"] body[data-view="quiz"] :is(.visual-lab-copy h2,.visual-route-card,.visual-deck-card,.visual-gallery-question h3,.visual-session-head>div:first-child b,.visual-result-card h2){color:#17343a}
html[data-theme="day"] body[data-view="quiz"] :is(.visual-route-card,.visual-deck-card){background:#fff;border-color:rgba(40,76,82,.14)}
html[data-theme="day"] body[data-view="quiz"] :is(.visual-route-card>p,.visual-lab-copy p,.visual-deck-copy small,.visual-result-card>p){color:#657a7d}
html[data-theme="day"] body[data-view="quiz"] :is(.visual-route-section,.visual-deck-section,.visual-atlas-section)>header b{color:#17343a}
html[data-theme="day"] body[data-view="quiz"] .visual-session-metrics{background:#fff;border-color:rgba(40,76,82,.14)}
html[data-theme="day"] body[data-view="quiz"] .visual-session-metrics b{color:#17343a}
html[data-theme="day"] body[data-view="quiz"] .visual-result-score{border-color:rgba(40,76,82,.14)}
html[data-theme="day"] body[data-view="quiz"] .visual-result-score>strong,
html[data-theme="day"] body[data-view="quiz"] .visual-result-score>div{border-color:rgba(40,76,82,.14)}

@media(max-width:900px){
  .visual-hero{grid-template-columns:1fr}.visual-hub-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .visual-lab-hero{grid-template-columns:1fr}.visual-lab-collage{min-height:340px}.visual-route-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.visual-route-card:first-child{grid-column:1/-1;min-height:170px}.visual-deck-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .visual-gallery-options{grid-template-columns:repeat(2,minmax(0,1fr))}
  .visual-question{grid-template-columns:1fr}.visual-question-media{min-height:auto;border-right:0;border-bottom:1px solid var(--lt-line)}
  .visual-question-media img{height:auto;min-height:0;aspect-ratio:4/3}
  .visual-answer-evidence{grid-template-columns:1fr 1.25fr}
}
@media(max-width:560px){
  .visual-mode-bar{grid-template-columns:1fr 1fr}.visual-hub-grid{gap:7px}
  .visual-lab-hero{margin-top:12px}.visual-lab-copy{padding:30px 20px 26px}.visual-lab-copy::before{display:none}.visual-lab-copy h2{font-size:39px}.visual-lab-collage{min-height:285px}
  :is(.visual-route-section,.visual-deck-section,.visual-atlas-section)>header{grid-template-columns:1fr;gap:7px}.visual-route-grid{grid-template-columns:1fr 1fr}.visual-route-card{min-height:190px;padding:14px}.visual-route-card:first-child{min-height:160px}
  .visual-deck-grid{grid-template-columns:1fr}.visual-deck-card{grid-template-columns:112px 1fr}.visual-deck-thumbs img{min-height:94px}
  .visual-hero-copy{padding:20px}.visual-object-copy{padding:9px 10px 11px}
  .visual-object-copy b{font-size:13px}.visual-object-copy span{font-size:9px}
  .visual-practice-top h2{font-size:23px}.visual-question-copy{padding:18px 13px 15px}
  .visual-question-copy h3{margin:22px 0 17px;font-size:18px}.visual-q-meta span{max-width:58%;text-align:right}
  .visual-session-head{align-items:stretch;flex-direction:column}.visual-session-metrics{display:grid;grid-template-columns:repeat(3,1fr)}.visual-session-metrics>span{min-width:0;text-align:left}
  .visual-gallery-question{padding:14px}.visual-gallery-question h3{font-size:20px}.visual-gallery-options{gap:6px}.visual-gallery-options button>span{padding:6px;font-size:9px}
  .visual-next{display:grid;grid-template-columns:1fr 1fr}.visual-next>span{display:none}.visual-result-card{margin:18px 0;padding:25px 17px}.visual-result-score{grid-template-columns:1fr 1fr}.visual-result-score>strong,.visual-result-score>div{min-height:90px;border-bottom:1px solid var(--lt-line)}.visual-result-score>div:nth-child(2){border-right:0}.visual-result-score>div:nth-child(n+3){border-bottom:0}.visual-result-actions{display:grid;grid-template-columns:1fr 1fr}.visual-result-actions .primary{grid-column:1/-1}
  .visual-object-visual>strong{left:9px;bottom:8px;font-size:14px}
  .visual-media-name{left:10px;right:10px;bottom:11px;padding:8px 10px;font-size:17px}
  .visual-quality-check{align-items:flex-start}.visual-report-card{padding:23px 17px}
  .visual-report-context{align-items:flex-start;flex-direction:column;gap:4px}
  .visual-exam-first .visual-question-copy{padding:19px 14px 16px}.visual-exam-first .visual-question-copy h3{font-size:19px}
  .visual-answer-evidence{grid-template-columns:1fr}.visual-answer-evidence figure{min-height:220px}.visual-answer-evidence figure>img{min-height:220px}.visual-answer-evidence>div{padding:17px 15px}
}
@media(prefers-reduced-motion:reduce){.visual-route-card{animation:none;transition:none}.visual-gallery-options button{transition:none}}
