/* Owner-approved Dola Academy visual standard, 2026-10-03.
   Shared by every Academy screen; see docs/visual-standard.md. */
html[data-academy-design] {
  color-scheme: dark;
  --academy-bg:#061426; --academy-panel:#10243b; --academy-ink:#f4f8ff;
  --academy-muted:#b9cee5; --academy-line:#537496; --academy-gold:#efd18c;
  --academy-blue:#68bcff; --ink:#f4f8ff; --line:#3b5775;
  --academy-glass:linear-gradient(135deg,#142c45f5,#08182cf5);
  --academy-metal:linear-gradient(170deg,#fff0c1 0%,#efd18c 18%,#c99435 75%,#f7d789 100%);
  --academy-electric:linear-gradient(170deg,#a4ddff 0%,#418eff 35%,#125bd1 80%,#408cff 100%);
}
html[data-academy-design] body,
html[data-academy-design] body.academy-immersive {
  color:var(--academy-ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;
  background:linear-gradient(100deg,#041122f5,#07192ceb),url('training/house-construction-cutaway.png') center top/cover fixed!important;
  min-height:100svh;line-height:1.6;
}
html[data-academy-design] body.academy-immersive::before{display:none}
html[data-academy-design] header {
  min-height:88px;height:auto;padding:8px max(24px,calc((100vw - 1320px)/2));
  background:linear-gradient(110deg,#07172a,#102b46 65%,#061324);
  border-bottom:1px solid #6388b3;box-shadow:0 8px 32px #0005,inset 0 -1px 0 #d4e8ff18;
}
html[data-academy-design] header .brand{font-size:1rem;letter-spacing:.17em;gap:18px}
html[data-academy-design] header .brand>span{font-size:1rem}
html[data-academy-design] .env{color:#dfedff;background:#10253b;border-color:#8b7852;font-size:.8rem}
html[data-academy-design] .wrap{max-width:1320px;padding:32px 24px 64px}
html[data-academy-design] h1{font-size:clamp(2rem,4vw,3.2rem);line-height:1.14;letter-spacing:-.035em;color:#f7fbff;margin:.25em 0 .45em}
html[data-academy-design] h2{font-size:clamp(1.4rem,2.25vw,1.9rem);line-height:1.25;letter-spacing:-.02em;color:#f7fbff}
html[data-academy-design] h3{font-size:1.2rem;line-height:1.35;color:#f7fbff}
html[data-academy-design] .eyebrow{color:var(--academy-gold);font-size:.875rem;letter-spacing:.15em}
html[data-academy-design] .small{font-size:.9375rem;color:var(--academy-muted)}
html[data-academy-design] a{color:#a4d5ff;text-underline-offset:4px}
html[data-academy-design] .brand{color:white}
html[data-academy-design] .hero{padding:32px;background:linear-gradient(90deg,#07182cf5,#0a213be6 55%,#0a1c2c77),url('dola-academy-training-hero.png') right center/cover;border:1px solid #6888a7;border-radius:18px;box-shadow:inset 0 1px 0 #fff4,0 16px 40px #0004}
html[data-academy-design] .hero h1{font-size:clamp(2rem,4vw,3.3rem)}
html[data-academy-design] .hero p{color:#dbeaff}
html[data-academy-design] .card,
html[data-academy-design] .required-library,
html[data-academy-design] .optional-library,
html[data-academy-design] .video-card,
html[data-academy-design] .onboarding-intro{
  background:var(--academy-glass);color:var(--academy-ink);border:1px solid #6487aa99;border-radius:16px;
  box-shadow:inset 0 1px 0 #eef8ff33,0 12px 30px #0004;padding:26px;
}
html[data-academy-design] .card p,
html[data-academy-design] .video-card p,
html[data-academy-design] .learner-hub>.small{color:var(--academy-muted)}
html[data-academy-design] .learner-hub{padding:0;background:transparent;border:0;overflow:visible;color:var(--academy-ink)}
html[data-academy-design] .learner-hub::after{display:none}
html[data-academy-design] .learner-hub>h1{margin:0 0 8px}
html[data-academy-design] .workspace-intro{font-size:1.25rem;color:#b8d9fa;margin:0 0 22px}
html[data-academy-design] .academy-choices{margin:24px 0;gap:22px}
html[data-academy-design] .learner-hub .academy-choice{padding:26px 30px;border:1px solid #e6c174;border-top:2px solid #ffe4a6;border-radius:16px;background:linear-gradient(105deg,#251f15ed,#122039e8),url('dola-academy-training-hero.png') center/cover;box-shadow:inset 0 1px 0 #fff5,0 0 16px #edc57920}
html[data-academy-design] .learner-hub .academy-choice h2{font-size:clamp(1.45rem,2.5vw,2.1rem);margin:0 0 10px}
html[data-academy-design] .learner-hub .academy-choice.path-online{border-color:#8bcaff;background:linear-gradient(105deg,#092743f2,#112840dc),url('training/house-construction-cutaway.png') center/cover;box-shadow:inset 0 1px 0 #fff6,0 0 18px #1c92ff25}
html[data-academy-design] .path-online .eyebrow{color:#a7d8ff}
html[data-academy-design] .course-section-title{border-bottom:1px solid #52739677;padding-bottom:14px;margin:28px 0 0}
html[data-academy-design] .learner-hub .grid{gap:22px;margin:20px 0 28px}
html[data-academy-design] .learner-hub .course-card{gap:0;padding:24px;border-top:3px solid var(--course);overflow:hidden}
html[data-academy-design] .course-card>h2{font-size:1.65rem;margin:8px 0}
html[data-academy-design] .course-card>.eyebrow{font-size:.875rem;color:#d3e4f6}
html[data-academy-design] .course-hud{--course:#e8c37a;--course-deep:#9a6c1f}
html[data-academy-design] .course-property{--course:#71beff;--course-deep:#155bd1}
html[data-academy-design] .course-hud::before,
html[data-academy-design] .course-property::before{content:'';display:block;height:140px;margin:-24px -24px 22px;border-bottom:1px solid #5d81a5;background:linear-gradient(0deg,#102137bb,transparent),url('dola-academy-training-hero.png') right 55%/cover}
html[data-academy-design] .course-property::before{background-image:linear-gradient(0deg,#102137bb,transparent),url('training/house-construction-cutaway.png');background-position:center 35%}
html[data-academy-design] .button,
html[data-academy-design] .learner-hub .button{
  min-height:48px;padding:13px 18px;font-size:1rem;line-height:1.4;font-weight:700;white-space:normal;
  color:#081a2c;border:1px solid #ffe6a8;border-radius:10px;background:var(--academy-metal);
  box-shadow:inset 0 1px 0 #fff9,0 4px 14px #0004;text-decoration:none;
  transition:box-shadow .16s,border-color .16s,transform .16s;
}
html[data-academy-design][data-learning-path="online"] .button:not(.secondary):not(:disabled){background:var(--academy-electric);border-color:#a4dbff;color:white}
html[data-academy-design] .button:hover:not(:disabled){box-shadow:inset 0 1px 0 #fff9,0 0 20px #73bcff33;transform:translateY(-1px)}
html[data-academy-design] .button.secondary,
html[data-academy-design] .learner-hub .button.secondary,
html[data-academy-design] .learner-hub .recognition-open,
html[data-academy-design] .learner-hub .studio-open{background:linear-gradient(135deg,#203650,#0b1a2c)!important;border-color:#6a8cac!important;color:#f2f8ff!important;box-shadow:inset 0 1px 0 #fff3!important}
html[data-academy-design] .learner-hub .academy-open{background:var(--academy-metal)!important;color:#07182c!important;border-color:#ffe0a0!important}
html[data-academy-design] .learner-hub .path-online .academy-open{background:var(--academy-electric)!important;color:#fff!important;border-color:#a2d9ff!important}
html[data-academy-design] .learner-hub .course-actions{gap:10px;padding-top:14px}
html[data-academy-design] .learner-hub .course-actions .button{display:flex;align-items:center;gap:16px;text-align:left;padding:15px;min-height:72px}
html[data-academy-design] .action-number{flex:0 0 42px;font-size:1.45rem;color:#acd9ff;border-right:1px solid #738aa7;font-variant-numeric:tabular-nums}
html[data-academy-design] .course-hud .action-number{color:#f0ce83}
html[data-academy-design] .course-actions small{display:block;font-size:.9375rem;font-weight:400;margin-top:3px}
html[data-academy-design] .learner-hub .course-actions .course-open{background:var(--academy-electric)!important;color:white!important;border-color:#95d6ff!important;margin-top:0}
html[data-academy-design] .learner-hub .course-hud .course-actions .course-open{background:var(--academy-metal)!important;color:#061629!important;border-color:#ffe4a3!important}
html[data-academy-design] .course-open .action-number{color:inherit;border-color:currentColor}
html[data-academy-design] button:disabled{background:#17283c!important;color:#9bafc5!important;border:1px solid #425a74!important;box-shadow:none!important;opacity:1;cursor:not-allowed;transform:none}
html[data-academy-design] :is(button,a,input,select,textarea):focus-visible{outline:3px solid #ffe199;outline-offset:4px}
html[data-academy-design] .notice,
html[data-academy-design] .learner-hub .notice{background:linear-gradient(110deg,#172d43,#0b1e34);color:#d9e9fb;border:1px solid #6087ad;border-left:3px solid var(--academy-gold);border-radius:12px;padding:20px 22px;font-size:1rem;line-height:1.65;box-shadow:inset 0 1px 0 #fff2}
html[data-academy-design] .learner-hub .notice .button{margin-left:auto}
html[data-academy-design] .learning-layout{max-width:940px;margin:auto}
html[data-academy-design] .lesson{max-width:940px}
html[data-academy-design] .lesson>p{font-size:1.08rem;line-height:1.85;color:#d0dfef}
html[data-academy-design] .steps{gap:9px}
html[data-academy-design] .step,
html[data-academy-design] .path-step,
html[data-academy-design] .library-badge,
html[data-academy-design] .module-num{background:#132b43;border:1px solid #527292;color:#d6e8fb;font-size:.875rem}
html[data-academy-design] .step.on,html[data-academy-design] .path-step.active{background:linear-gradient(120deg,#1b5995,#16314e);color:#fff;border-color:#8dcfff;box-shadow:0 0 14px #188bff22}
html[data-academy-design] .path-step.ready{color:#0b1a2c;background:var(--academy-metal)}
html[data-academy-design] .guide-panel,
html[data-academy-design] .learning-feedback{background:#112a42;color:#dfedff;border:1px solid #58799b;border-left:4px solid #89c8ff;border-radius:12px;padding:20px}
html[data-academy-design] .guide-panel a,
html[data-academy-design] .text-resource{color:#acdcff}
html[data-academy-design] .choice,
html[data-academy-design] .role{background:linear-gradient(120deg,#162e47,#0c1e32);color:#eaf3ff;border:1px solid #5a7d9e;min-height:52px;font-size:1rem;padding:15px;border-radius:10px}
html[data-academy-design] .choice.selected,
html[data-academy-design] .role.selected{background:#163e65;border-color:#9bd8ff;box-shadow:inset 0 0 0 1px #9bd8ff}
html[data-academy-design] input,
html[data-academy-design] textarea,
html[data-academy-design] select{max-width:100%;background:#07192b;color:#edf6ff;border:1px solid #7090b2;border-radius:8px;padding:12px;font:inherit;min-height:48px}
html[data-academy-design] textarea{width:100%}
html[data-academy-design] input::placeholder,html[data-academy-design] textarea::placeholder{color:#a9c0d9}
html[data-academy-design] .reader-controls label{font-size:.875rem;color:#bcd2e8}
html[data-academy-design] .reader-controls select{background:#081b2e;color:white;border-color:#678bab;font-size:1rem;min-height:48px}
html[data-academy-design] .score,
html[data-academy-design] .learning-feedback.is-correct,
html[data-academy-design] .module.done .module-num,
html[data-academy-design] .path-step.complete{background:#123e33;color:#d0ffe8;border-color:#66c99f}
html[data-academy-design] .learning-feedback.needs-review{background:#462d1c;color:#fff0d6;border-color:#e2b074}
html[data-academy-design] .video-slot{background:linear-gradient(120deg,#12345b,#081a2e);border:1px solid #789bbd;box-shadow:inset 0 1px 0 #fff3}
html[data-academy-design] .resource-row span{color:#b9cee5}
html[data-academy-design] .training-card.complete{border-top-color:#64d5a2}
html[data-academy-design] .readiness-continue.ready{background:linear-gradient(140deg,#21684f,#114333)!important;color:#e2ffef!important;border-color:#76d9ae!important}
html[data-academy-design] .recognition-shell,
html[data-academy-design] .academy-immersive .recognition-shell{background:transparent;backdrop-filter:none;border:0;box-shadow:none;max-width:1020px}
html[data-academy-design] .academy-immersive .recognition-card{background:var(--academy-glass);border:1px solid #7f9fbe;border-top:3px solid #efd18c;box-shadow:inset 0 1px 0 #fff5,0 18px 42px #0005;backdrop-filter:none}
html[data-academy-design] .recognition-phase{color:#f0d18e;font-size:.875rem}
html[data-academy-design] .recognition-card h2{font-size:1.3rem}
html[data-academy-design] .recognition-clue{background:#152e47;color:#fff;border:1px solid #607f9f;border-left:4px solid #efd18c;font-size:1.2rem}
html[data-academy-design] .recognition-clue-label{color:#c3e4ff;font-size:.875rem}
html[data-academy-design] .recognition-clue p{color:#edf5ff}
html[data-academy-design] .recognition-mode{background:#172f47;color:#e6f4ff;border-color:#6d90b0;font-size:.875rem}
html[data-academy-design] .recognition-mode.photo{background:#153e35;color:#c7ffe8;border-color:#72bc9b}
html[data-academy-design] .recognition-mode.verbal{background:#403522;color:#ffe7b2;border-color:#b79b63}
html[data-academy-design] .academy-immersive .recognition-choice{background:linear-gradient(135deg,#1a314a,#0e2036);color:#f0f7ff;border:1px solid #6588ab;font-size:1.05rem;min-height:52px;box-shadow:inset 0 1px 0 #fff2}
html[data-academy-design] .academy-immersive .recognition-choice:not(:disabled):hover{background:#244564;box-shadow:0 0 16px #70bfff22;border-color:#b3deff}
html[data-academy-design] .academy-immersive .recognition-choice.correct:disabled{background:#123f33!important;color:#d7ffeb!important;border-color:#65d19c!important}
html[data-academy-design] .academy-immersive .recognition-choice:disabled:not(.correct){background:#432126!important;color:#ffe1e3!important;border-color:#da8890!important}
html[data-academy-design] .recognition-result.good{background:#143b32;color:#d6ffed;border-color:#79c29c;box-shadow:none}
html[data-academy-design] .recognition-result.bad{background:#42212a;color:#ffe3e7;border:1px solid #d48a99}
html[data-academy-design] .recognition-celebration-title{color:#c1f7db}
html[data-academy-design] .recognition-result p{color:inherit}
html[data-academy-design] .recognition-answer{background:#0b2031;color:#dbeaff;border-color:#78bfff}
html[data-academy-design] .academy-immersive .recognition-image{background:#e8eef4;border:2px solid #739abb;max-height:38svh;object-fit:contain}
html[data-academy-design] .link{color:#c4e4ff!important;min-height:44px}
html[data-academy-design] .certificate{border:2px solid #d5b878;background:linear-gradient(145deg,#142b44,#081b2c);padding:40px}
html[data-academy-design] .certificate h1{color:#ffe3a8}
@media(max-width:700px){
  html[data-academy-design] header{padding:8px 16px;gap:10px;min-height:80px}
  html[data-academy-design] header .brand>span{font-size:.875rem;letter-spacing:.1em}
  html[data-academy-design] .wrap{padding:24px 16px 48px}
  html[data-academy-design] .card,html[data-academy-design] .learner-hub .academy-choice{padding:22px 18px}
  html[data-academy-design] .course-hud::before,html[data-academy-design] .course-property::before{margin:-22px -18px 18px;height:120px}
  html[data-academy-design] .action-number{flex-basis:36px;font-size:1.25rem}
  html[data-academy-design] .learner-hub .course-actions .button{gap:12px;padding:13px}
  html[data-academy-design] .learner-hub .notice .button{margin:8px 0 0;width:100%}
  html[data-academy-design] .required-library,html[data-academy-design] .optional-library{padding:18px 14px}
  html[data-academy-design] .module{grid-template-columns:36px minmax(0,1fr)}
  html[data-academy-design] .hero{padding:24px}
  html[data-academy-design] .certificate{padding:24px}
}
@media(prefers-reduced-motion:reduce){html[data-academy-design] *,html[data-academy-design] *::before{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
@media print{
  html[data-academy-design]{color-scheme:light}
  html[data-academy-design] body{background:#fff!important;color:#111!important}
  html[data-academy-design] .certificate,html[data-academy-design] .certificate *{background:#fff!important;color:#111!important;border-color:#999!important;box-shadow:none!important;text-shadow:none!important}
}

/* Learning hierarchy: look at the question, choose an answer, then continue. */
html[data-academy-design] .academy-immersive .recognition-card{
  background:linear-gradient(135deg,#14283f,#0b1b2f);border-color:#58718b;border-top-color:#d4b572;
}
html[data-academy-design] .recognition-clue{
  background:linear-gradient(120deg,#fff4d3,#f2dc9d);color:#172b42;
  border:1px solid #ffe5a5;border-left:6px solid #d6a128;
  box-shadow:inset 0 1px 0 #fff,0 5px 18px #0003;
  padding:20px 22px;margin:12px 0 22px;border-radius:12px;
}
html[data-academy-design] .recognition-clue-label{color:#6a4812;font-size:.875rem;letter-spacing:.1em;margin-bottom:8px}
html[data-academy-design] .recognition-clue p{color:#142940;font-size:clamp(1.15rem,1.8vw,1.4rem);font-weight:750;line-height:1.55}
html[data-academy-design] .answer-section-title{display:flex;align-items:center;gap:10px;color:#c4e5ff;margin:0 0 12px;font-size:1.05rem}
html[data-academy-design] .answer-section-title>span{display:grid;place-items:center;width:30px;height:30px;background:#213f5d;border:1px solid #80b2db;border-radius:50%;font-size:.875rem}
html[data-academy-design] .academy-immersive .recognition-choices{gap:12px;margin:0 0 18px}
html[data-academy-design] .academy-immersive .recognition-choice{
  display:flex;align-items:center;gap:16px;min-height:64px;padding:13px 16px;
  background:linear-gradient(120deg,#f0f8ff,#dceaf7);color:#15314e;
  border:2px solid #aecce6;border-radius:11px;box-shadow:inset 0 1px 0 #fff,0 3px 8px #0002;
  font-size:1.1rem;text-align:left;
}
html[data-academy-design] .answer-letter{display:grid;place-items:center;flex:0 0 36px;height:36px;background:#123c66;color:#fff;border-radius:8px;font-size:1rem;font-weight:800}
html[data-academy-design] .answer-copy{flex:1;min-width:0}
html[data-academy-design] .answer-state{display:block;font-size:.9rem;line-height:1.4;margin-top:4px;font-weight:700}
html[data-academy-design] .academy-immersive .recognition-choice:not(:disabled):hover{background:#c8e8ff;color:#0d2b49;border-color:#68baff;box-shadow:0 0 0 2px #5bb7ff44;transform:none}
html[data-academy-design] .academy-immersive .recognition-choice:focus-visible{outline:3px solid #ffd365;outline-offset:4px;background:#d5edff;color:#0d2b49}
html[data-academy-design] .academy-immersive .recognition-choice:disabled:not(.correct):not(.wrong){background:#dce5ee!important;color:#44596e!important;border-color:#a1b1c2!important;opacity:1!important}
html[data-academy-design] .academy-immersive .recognition-choice.correct:disabled{background:#d7f4e5!important;color:#104b36!important;border:2px solid #46b786!important}
html[data-academy-design] .academy-immersive .recognition-choice.wrong:disabled{background:#ffe1dc!important;color:#742d2a!important;border:2px solid #db776d!important}
html[data-academy-design] .recognition-choice.correct .answer-letter{background:#176f50;color:#fff}
html[data-academy-design] .recognition-choice.wrong .answer-letter{background:#9b4038;color:#fff}
html[data-academy-design] .recognition-choice:disabled:not(.correct):not(.wrong) .answer-letter{background:#62768b}
html[data-academy-design] .recognition-actions .skip-question{
  background:transparent!important;color:#bfcee0!important;border:1px solid #627a94!important;
  box-shadow:none!important;font-weight:500;min-height:44px;padding:9px 16px;
}
html[data-academy-design] .recognition-actions .next-question{
  background:var(--academy-electric)!important;color:#fff!important;border-color:#aadfff!important;
  box-shadow:inset 0 1px 0 #fff6,0 4px 18px #267fdb44!important;min-height:52px;
}
/* The same visual reading order applies to course and final-exam questions. */
html[data-academy-design] .question>strong{
  display:block;padding:18px 20px;margin:4px 0 16px;border-radius:10px;
  background:linear-gradient(120deg,#fff4d3,#f2dc9d);color:#142940;border-left:5px solid #d6a128;
  font-size:1.125rem;line-height:1.6;
}
html[data-academy-design] .question>.choice{
  background:linear-gradient(120deg,#f0f8ff,#dceaf7);color:#15314e;border:2px solid #afcbe3;
  min-height:58px;padding:15px 18px;margin:10px 0;
}
html[data-academy-design] .question>.choice:hover{background:#cfeaff;border-color:#69b9f5}
html[data-academy-design] .question>.choice.selected{background:#bee3ff;color:#113153;border-color:#3185c5;box-shadow:inset 0 0 0 1px #3185c5}
html[data-academy-design] .evidence button{background:linear-gradient(120deg,#eaf6ff,#d3e6f6);color:#12314f;border:2px solid #9fc8e9}
html[data-academy-design] .evidence button .small{color:#183d60}
html[data-academy-design] .evidence button.selected{outline:3px solid #81c9ff;outline-offset:3px;background:#c0e5ff}
@media(max-width:700px){
  html[data-academy-design] .recognition-clue{padding:17px 16px}
  html[data-academy-design] .academy-immersive .recognition-choice{gap:12px;padding:12px;min-height:62px}
  html[data-academy-design] .recognition-clue p{font-size:1.15rem}
}

.recognition-filters{display:flex;gap:14px;flex-wrap:wrap;padding:14px;background:#eef5ff;color:#152d45;border-radius:12px;margin:14px 0}.recognition-filters label{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.recognition-filters select{font:inherit;padding:10px;max-width:100%;background:white;color:#152d45}.recognition-filters small{width:100%}.recognition-sources{padding:16px;margin-top:16px;background:#edf4ff;color:#152d45;border-radius:12px}.recognition-sources a{color:#124d80!important;text-decoration:underline}.recognition-sources summary{cursor:pointer;font-weight:700}
