:root{
  --green:#075f50;--green-dark:#04463d;--green-soft:#e1f2ed;--purple:#95108d;--purple-dark:#6d0b67;
  --purple-soft:#f7e9f5;--gold:#d9a031;--ink:#183a34;--muted:#647873;--paper:#f5f8f7;--card:#fff;
  --line:#d6e5e1;--success:#16795a;--danger:#ad2f43;--warning:#a76d00;--shadow:0 18px 50px rgba(4,70,61,.12);
  --radius:20px;--tap:48px;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;line-height:1.58}
button,input,textarea,select{font:inherit}button{min-height:var(--tap);touch-action:manipulation}.skip-link{position:absolute;left:-9999px;top:8px;background:#fff;padding:.7rem 1rem;z-index:999}.skip-link:focus{left:8px}
.app-shell{min-height:100vh;display:grid;grid-template-columns:286px minmax(0,1fr)}.sidebar{position:sticky;top:0;height:100vh;overflow:auto;background:linear-gradient(180deg,var(--green),var(--green-dark));padding:1rem;color:#fff;z-index:40}.school-logo{background:#fff;border-radius:16px;padding:.65rem;margin-bottom:1rem}.school-logo img{display:block;width:100%;height:auto}.nav-heading{margin:1rem .25rem .4rem;color:#c9e7df;font-weight:900;font-size:.77rem;letter-spacing:.14em}.nav-button{width:100%;border:1px solid rgba(255,255,255,.28);background:transparent;color:#fff;border-radius:13px;padding:.72rem .8rem;display:flex;align-items:center;gap:.72rem;text-align:left;font-weight:850;margin:.42rem 0;cursor:pointer}.nav-button:hover,.nav-button:focus-visible{background:rgba(255,255,255,.1)}.nav-button.active{background:linear-gradient(135deg,var(--purple),var(--purple-dark));border-color:#edb7e9}.nav-button.locked{opacity:.54}.nav-icon{width:31px;height:31px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.14);flex:none}.nav-meta{margin-left:auto;font-size:.8rem}.sidebar-help{margin-top:1.2rem;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.06);border-radius:15px;padding:.95rem}.sidebar-help p{font-size:.86rem;color:#dcece8;margin:.35rem 0}
.main-area{min-width:0}.topbar{position:sticky;top:0;z-index:30;min-height:94px;background:rgba(255,255,255,.95);backdrop-filter:blur(12px);border-bottom:2px solid var(--purple);display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:1rem;padding:.7rem 1.3rem}.brand-title{text-align:center}.brand-title h1{margin:0;color:var(--green);font-size:clamp(1.25rem,2.2vw,2rem)}.brand-title p{margin:.05rem 0;color:var(--purple);font-weight:850}.top-actions{display:flex;gap:.45rem}.icon-button{border:1px solid var(--line);background:#fff;color:var(--green);border-radius:12px;padding:.55rem .75rem;font-weight:850;cursor:pointer}.icon-button:hover{background:var(--purple-soft);color:var(--purple)}.mobile-only{display:none}
.hero{background:#fff;display:grid;grid-template-columns:minmax(340px,.8fr) minmax(500px,1.3fr);min-height:515px;overflow:hidden}.hero-copy{padding:3rem 1.7rem 2rem 2.5rem;align-self:center}.eyebrow{display:inline-block;background:var(--purple-soft);color:var(--purple);padding:.35rem .7rem;border-radius:999px;text-transform:uppercase;font-size:.75rem;font-weight:950;letter-spacing:.08em}.hero h2{font-size:clamp(2.6rem,5vw,5.2rem);line-height:1.01;color:var(--green);margin:.75rem 0}.hero p{font-size:1.1rem;color:#3c534d}.hero-list{display:grid;gap:.45rem;margin:1rem 0}.hero-list span::before{content:"✦";color:var(--purple);margin-right:.65rem}.hero-visual{position:relative;display:flex;align-items:center;justify-content:center;background:#fff}.hero-visual img{width:100%;height:100%;object-fit:contain}.hero-visual::after{content:"";position:absolute;left:-2%;right:-2%;bottom:-15px;height:70px;background:linear-gradient(175deg,transparent 0 35%,var(--green) 36% 43%,var(--purple) 44% 53%,#fff 54%)}
.primary,.secondary,.ghost{border-radius:12px;padding:.75rem 1rem;font-weight:900;cursor:pointer}.primary{border:0;background:linear-gradient(135deg,var(--purple),var(--purple-dark));color:#fff}.secondary{border:1px solid var(--line);background:#fff;color:var(--green)}.ghost{border:1px dashed var(--green);background:transparent;color:var(--green)}.button-row{display:flex;gap:.65rem;flex-wrap:wrap;margin-top:1rem}
.page-pad{padding:1.2rem}.dashboard-layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:1rem}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:1rem;box-shadow:0 8px 24px rgba(4,70,61,.06)}.card h2,.card h3{color:var(--green);margin:.05rem 0 .75rem}.chapter-grid{display:grid;grid-template-columns:repeat(4,minmax(180px,1fr));gap:.8rem}.chapter-card{border:1px solid var(--line);background:#fff;border-radius:16px;padding:.95rem;cursor:pointer;transition:.2s;position:relative}.chapter-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.chapter-card.locked{opacity:.58;cursor:not-allowed}.chapter-icon{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;background:var(--green-soft);font-size:1.6rem}.chapter-card h3{font-size:1rem;margin:.55rem 0 .2rem}.chapter-card p{font-size:.84rem;color:var(--muted);margin:0}.progress{height:9px;background:#ece8ec;border-radius:999px;overflow:hidden}.progress span{display:block;height:100%;background:linear-gradient(90deg,var(--green),var(--purple));width:0}.metric{display:flex;justify-content:space-between;padding:.62rem 0;border-bottom:1px solid var(--line)}.metric strong{color:var(--purple)}.badge-list{display:flex;gap:.5rem;flex-wrap:wrap}.badge{border-radius:999px;padding:.42rem .65rem;background:#eee;color:#6e7774;font-weight:800;font-size:.82rem}.badge.earned{background:linear-gradient(135deg,var(--green-soft),var(--purple-soft));color:var(--purple);border:1px solid #dab1d7}.resource-strip{display:grid;grid-template-columns:repeat(4,1fr);background:#fff;border-top:1px solid var(--line)}.resource-button{border:0;border-right:1px solid var(--line);background:#fff;padding:1.1rem;display:flex;gap:.65rem;align-items:center;text-align:left;color:var(--ink);cursor:pointer}.resource-button b{color:var(--purple)}
.chapter-shell{max-width:1500px;margin:auto;display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:1rem}.chapter-main,.chapter-side{display:grid;gap:1rem;align-content:start}.chapter-banner{background:linear-gradient(110deg,#fff,var(--purple-soft));border:1px solid var(--line);border-radius:20px;padding:1.2rem;display:flex;justify-content:space-between;gap:1rem;box-shadow:var(--shadow)}.chapter-title{display:flex;gap:1rem}.chapter-number{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:var(--purple);color:#fff;font-size:1.5rem;font-weight:950;flex:none}.chapter-banner h2{margin:.1rem 0;color:var(--green);font-size:clamp(1.8rem,3.5vw,3rem)}.learning-goals{margin:.5rem 0 0;padding-left:1.2rem}.tabs{display:flex;gap:.35rem;overflow:auto;border:1px solid var(--line);background:#fff;border-radius:15px;padding:.35rem}.tab-button{border:0;background:#fff;color:var(--green);font-weight:850;border-radius:10px;padding:.6rem .85rem;white-space:nowrap;cursor:pointer}.tab-button.active{background:var(--purple-soft);color:var(--purple)}.tab-panel{display:none}.tab-panel.active{display:block}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.term{background:var(--green-soft);color:var(--green);font-weight:900;border-radius:6px;padding:.05rem .3rem}.callout{border-left:5px solid var(--purple);background:#fbf3fa;border-radius:12px;padding:.85rem .95rem;margin:.8rem 0}.callout.support{border-left-color:var(--green);background:#eaf7f3}.callout.challenge{border-left-color:var(--gold);background:#fff7e7}.diagram{background:#f8fbfa;border:1px solid var(--line);border-radius:15px;padding:.8rem;overflow:auto}.side-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:1rem}.side-card h3{color:var(--green);margin:.05rem 0 .7rem}.phrase-list{padding-left:1.15rem}.phrase-list li{margin:.42rem 0}.content-section h3{color:var(--green)}.content-section h4{color:var(--purple);margin-bottom:.3rem}.process-flow{display:grid;grid-template-columns:repeat(6,1fr);gap:.55rem;align-items:stretch}.process-step{border:1px solid var(--line);background:#fff;border-radius:14px;padding:.75rem;text-align:center;position:relative}.process-step:not(:last-child)::after{content:"→";position:absolute;right:-.52rem;top:42%;z-index:2;color:var(--purple);font-weight:950}.process-step button{border:0;background:transparent;color:var(--green);font-weight:900;cursor:pointer}.example-table{width:100%;border-collapse:collapse}.example-table th,.example-table td{padding:.65rem;border-bottom:1px solid var(--line);vertical-align:top}.example-table th{text-align:left;color:var(--green)}
.flashcards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.75rem}.flashcard{min-height:190px;perspective:900px;cursor:pointer}.flash-inner{height:100%;min-height:190px;position:relative;transform-style:preserve-3d;transition:.5s}.flashcard.flipped .flash-inner{transform:rotateY(180deg)}.flash-front,.flash-back{position:absolute;inset:0;backface-visibility:hidden;border:1px solid var(--line);border-radius:14px;padding:.85rem;display:grid;place-items:center;text-align:center;background:#fff}.flash-front b{font-size:1.12rem;color:var(--green)}.flash-back{transform:rotateY(180deg);background:var(--green-soft)}.german{margin-top:.7rem;padding-top:.65rem;border-top:1px solid rgba(7,95,80,.22);color:var(--purple);font-weight:850}.example{font-size:.84rem;color:#3e5851;margin-top:.5rem}.quiz-question{border:1px solid var(--line);border-radius:14px;padding:.85rem;margin:.75rem 0}.quiz-question p{font-weight:850}.option{display:block;padding:.5rem;border-radius:9px}.option:hover{background:var(--green-soft)}.feedback{padding:.7rem;border-radius:10px;margin-top:.65rem}.feedback.good{background:#e6f6ef;color:var(--success)}.feedback.bad{background:#faeaed;color:var(--danger)}.solution{display:none;border-left:4px solid var(--gold);background:#fff6dd;padding:.7rem;margin-top:.65rem}.teacher-mode .solution{display:block}.sort-zone{min-height:95px;border:2px dashed var(--line);border-radius:14px;padding:.7rem}.drag-item{display:inline-block;padding:.55rem .7rem;border-radius:10px;background:var(--purple-soft);color:var(--purple);font-weight:850;margin:.25rem;cursor:grab;user-select:none}.prompt-box{background:var(--purple-soft);border:1px solid #e0b9dc;border-radius:13px;padding:.85rem}.prompt-actions{display:flex;gap:.5rem;flex-wrap:wrap}.prompt-chip{border:1px solid #ddb6d9;background:#fff;color:var(--purple);border-radius:999px;padding:.45rem .65rem;cursor:pointer}.prompt-output{white-space:pre-wrap;background:#fff;border:1px solid var(--line);border-radius:12px;padding:.8rem;margin-top:.75rem}.teacher-panel{border:2px solid var(--gold);background:#fffaf0}.teacher-actions{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}.teacher-note{font-size:.83rem;color:var(--muted)}
.modal-backdrop{position:fixed;inset:0;background:rgba(5,35,31,.58);display:grid;place-items:center;padding:1rem;z-index:100}.modal-backdrop[hidden]{display:none}.modal{width:min(760px,100%);max-height:88vh;overflow:auto;background:#fff;border-radius:20px;box-shadow:var(--shadow);padding:1rem}.modal-head{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}.toast{position:fixed;right:1rem;bottom:1rem;background:var(--green-dark);color:#fff;padding:.8rem 1rem;border-radius:12px;opacity:0;transform:translateY(20px);transition:.25s;z-index:120}.toast.show{opacity:1;transform:translateY(0)}
.dark{--paper:#10231f;--card:#17332d;--ink:#f2faf7;--muted:#b9cbc6;--line:#31544c;--green-soft:#173f36;--purple-soft:#3c213b}.dark .topbar,.dark .hero,.dark .resource-strip,.dark .resource-button,.dark .card,.dark .side-card,.dark .chapter-banner,.dark .tabs,.dark .tab-button,.dark .process-step,.dark .flash-front,.dark .prompt-output,.dark .modal{background:#17332d;color:var(--ink)}.dark .hero p{color:#c8d8d4}
@media(max-width:1180px){.chapter-grid{grid-template-columns:repeat(2,1fr)}.hero{grid-template-columns:1fr}.hero-visual{min-height:430px}.dashboard-layout,.chapter-shell{grid-template-columns:1fr}.chapter-side{grid-template-columns:repeat(2,1fr)}.process-flow{grid-template-columns:repeat(3,1fr)}}
@media(max-width:820px){.app-shell{grid-template-columns:1fr}.sidebar{position:fixed;left:-310px;width:286px;transition:.25s}.sidebar.open{left:0}.mobile-only{display:inline-flex}.topbar{grid-template-columns:auto 1fr auto}.desktop-label{display:none}.hero-copy{padding:2rem 1.2rem}.hero h2{font-size:3rem}.page-pad{padding:.75rem}.chapter-side{grid-template-columns:1fr}.grid-2,.grid-3{grid-template-columns:1fr}.resource-strip{grid-template-columns:1fr 1fr}.process-flow{grid-template-columns:1fr 1fr}.process-step:not(:last-child)::after{display:none}}
@media(max-width:540px){.brand-title p{display:none}.hero h2{font-size:2.45rem}.hero-visual{min-height:300px}.chapter-grid{grid-template-columns:1fr}.resource-strip{grid-template-columns:1fr}.teacher-actions{grid-template-columns:1fr}.process-flow{grid-template-columns:1fr}}
@media print{.sidebar,.topbar,.tabs,.chapter-side,.button-row,.resource-strip{display:none!important}.app-shell{display:block}.tab-panel{display:block!important}.page-pad{padding:0}.card{box-shadow:none;break-inside:avoid}.solution{display:block}}

/* Module 2: eye and retina */
.layer-stack{display:grid;gap:.45rem;margin-top:1rem}.eye-layer{display:flex;justify-content:space-between;gap:1rem;border-radius:12px;padding:.75rem 1rem;color:#fff}.eye-layer span{font-size:.9rem}.sclera-layer{background:#54766f}.choroid-layer{background:#9b188c}.retina-layer{background:#d5a12d;color:#2f2a1c}
.eye-explorer{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(270px,.65fr);gap:1rem;align-items:start}.eye-svg-wrap{background:linear-gradient(145deg,#eef9f6,#fff7fb);border:1px solid var(--line);border-radius:18px;padding:.6rem}.eye-svg{width:100%;height:auto;display:block}.eye-hotspot{fill:#fff;stroke:var(--purple);stroke-width:7;cursor:pointer;transition:.18s}.eye-hotspot:hover,.eye-hotspot.active{fill:var(--gold);stroke:var(--green);r:20}.anatomy-info{min-height:180px;background:var(--green-soft);border-left:5px solid var(--green);border-radius:14px;padding:1rem}.anatomy-info h4{font-size:1.35rem;margin:.25rem 0;color:var(--green)}.anatomy-buttons{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.75rem}.anatomy-chip{border:1px solid var(--line);background:#fff;color:var(--green);border-radius:999px;padding:.42rem .62rem;font-weight:800;cursor:pointer}.anatomy-chip.active{background:var(--purple);color:#fff;border-color:var(--purple)}
.retina-diagram{display:grid;grid-template-columns:100px repeat(4,minmax(140px,1fr));gap:.45rem;align-items:stretch;margin:1rem 0;overflow:auto}.retina-arrow{display:grid;place-items:center;color:var(--purple);font-weight:950;font-size:1.05rem}.retina-column{min-height:180px;border-radius:14px;padding:.75rem;display:flex;flex-direction:column;justify-content:center;text-align:center;border:1px solid var(--line)}.retina-column span{font-size:.83rem;margin-top:.4rem}.retina-column.ganglion{background:#dff3fb}.retina-column.bipolar{background:#e8f6ee}.retina-column.receptors{background:#fff0bd}.retina-column.pigment{background:#503348;color:#fff}.receptor-card{border:1px solid var(--line);border-radius:16px;padding:1rem;background:#fff}.receptor-icon{height:95px;width:55px;margin:0 auto .5rem;position:relative}.rod-icon{background:linear-gradient(#8ebf9f,#256757);border-radius:22px 22px 8px 8px}.rod-icon:after{content:"";position:absolute;width:18px;height:42px;background:#256757;left:18px;bottom:-30px;border-radius:7px}.cone-icon{background:linear-gradient(#d78fcc,#8f177f);clip-path:polygon(25% 0,75% 0,100% 100%,0 100%)}.cone-icon:after{content:"";position:absolute;width:18px;height:40px;background:#8f177f;left:18px;bottom:-28px;border-radius:7px}.blindspot-lab{margin-top:1rem;padding:1rem;border:1px dashed var(--purple);border-radius:15px;background:#fffafd}.blindspot-field{height:150px;position:relative;background:#fff;border:1px solid var(--line);border-radius:12px;margin:.75rem 0;overflow:hidden}.fixation{position:absolute;left:15%;top:45%;font-size:2rem;color:var(--green)}.blind-dot{position:absolute;left:72%;top:46%;font-size:1.6rem;color:var(--purple);transition:left .15s}.blindspot-lab input[type=range]{width:min(420px,100%)}.match-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(180px,260px);gap:.75rem;align-items:center;padding:.7rem 0;border-bottom:1px solid var(--line)}.match-row select{padding:.6rem;border:1px solid var(--line);border-radius:10px;background:#fff}.science-textarea{width:100%;min-height:150px;border:1px solid var(--line);border-radius:13px;padding:.8rem;font:inherit;resize:vertical}
.dark .eye-svg-wrap,.dark .receptor-card,.dark .blindspot-field,.dark .blindspot-lab,.dark .anatomy-chip,.dark .match-row select{background:#17332d;color:var(--ink)}
@media(max-width:900px){.eye-explorer{grid-template-columns:1fr}.retina-diagram{grid-template-columns:80px repeat(4,160px)}}
@media(max-width:600px){.layer-stack .eye-layer{display:block}.eye-layer span{display:block;margin-top:.25rem}.match-row{grid-template-columns:1fr}.retina-diagram{grid-template-columns:70px repeat(4,150px)}}

/* Module 2 realistic Anatomy Explorer update */
.worksheet-task{display:grid;grid-template-columns:auto 1fr;gap:1rem;align-items:start;border:2px solid var(--gold);background:linear-gradient(135deg,#fffaf0,#fff)}
.worksheet-task h3{margin:.2rem 0;color:var(--green)}
.worksheet-icon{width:58px;height:58px;border-radius:16px;display:grid;place-items:center;font-size:1.65rem;background:var(--purple-soft)}
.worksheet-steps{display:flex;flex-wrap:wrap;gap:.45rem;margin:.75rem 0}
.worksheet-steps span{padding:.35rem .6rem;border-radius:999px;background:var(--green-soft);color:var(--green);font-weight:850;font-size:.86rem}
.iserv-link{display:inline-flex;text-decoration:none;width:max-content}
.realistic-explorer{grid-template-columns:minmax(0,1.5fr) minmax(290px,.5fr)}
.eye-image-wrap{background:linear-gradient(145deg,#f5faf8,#fff7fb);border:1px solid var(--line);border-radius:18px;padding:.65rem}
.eye-image-stage{position:relative;overflow:hidden;border-radius:13px;background:#fff}
.realistic-eye-image{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:contain}
.eye-image-hotspots{position:absolute;inset:0;pointer-events:none}
.eye-image-hotspot{position:absolute;transform:translate(-50%,-50%);border:0;background:transparent;pointer-events:auto;cursor:pointer;padding:0;z-index:2}
.eye-image-hotspot>span{display:block;width:19px;height:19px;border-radius:50%;background:#fff;border:4px solid var(--purple);box-shadow:0 2px 9px rgba(0,0,0,.28);transition:.18s}
.eye-image-hotspot small{position:absolute;left:50%;top:25px;transform:translateX(-50%);padding:.18rem .4rem;border-radius:7px;background:rgba(255,255,255,.94);color:var(--green);font-weight:850;white-space:nowrap;opacity:0;transition:.18s;box-shadow:0 2px 8px rgba(0,0,0,.15)}
.eye-image-hotspot:hover>span,.eye-image-hotspot:focus-visible>span,.eye-image-hotspot.active>span{background:var(--gold);border-color:var(--green);transform:scale(1.25)}
.eye-image-hotspot:hover small,.eye-image-hotspot:focus-visible small,.eye-image-hotspot.active small{opacity:1}
.image-caption{font-size:.82rem;color:var(--muted);margin:.55rem .25rem .1rem}
.dark .worksheet-task,.dark .eye-image-wrap,.dark .eye-image-stage{background:#17332d;color:var(--ink)}
@media(max-width:900px){.realistic-explorer{grid-template-columns:1fr}}
@media(max-width:600px){.worksheet-task{grid-template-columns:1fr}.worksheet-icon{width:48px;height:48px}.eye-image-hotspot small{display:none}.eye-image-hotspot>span{width:16px;height:16px;border-width:3px}}

/* Module 2 anatomy explorer correction and classroom tasks */
.worksheet-list{display:grid;gap:.45rem;margin:.75rem 0}
.worksheet-list>div{padding:.65rem .8rem;border:1px solid var(--line);border-radius:12px;background:#fff}
.model-task{display:grid;grid-template-columns:auto 1fr;gap:1rem;align-items:start;border:2px solid #8fc8b2;background:linear-gradient(135deg,#eefaf5,#fff)}
.model-task-icon{width:58px;height:58px;border-radius:16px;display:grid;place-items:center;font-size:1.75rem;background:var(--green-soft)}
.model-task h3{margin:.2rem 0;color:var(--green)}
.model-task ol{margin:.7rem 0;padding-left:1.35rem}
.model-task li{margin:.32rem 0}
.anatomy-explorer-card{overflow:visible}
.realistic-explorer{grid-template-columns:minmax(0,2.15fr) minmax(285px,.65fr);align-items:start}
.eye-image-wrap{padding:.8rem}
.eye-image-stage{width:100%;min-height:0;overflow:visible}
.realistic-eye-image{display:block;width:100%;height:auto;max-height:none;aspect-ratio:auto;object-fit:initial}
.eye-image-hotspot>span{width:21px;height:21px;border-width:4px}
.eye-image-hotspot small{font-size:.78rem;top:27px}
.dark .worksheet-list>div,.dark .model-task{background:#17332d;color:var(--ink)}
@media(max-width:1050px){.realistic-explorer{grid-template-columns:1fr}.eye-image-wrap{max-width:none}.eye-image-hotspot small{display:none}}
@media(max-width:600px){.model-task{grid-template-columns:1fr}.model-task-icon{width:48px;height:48px}.eye-image-wrap{padding:.35rem}.eye-image-hotspot>span{width:17px;height:17px;border-width:3px}}

/* Module 2: thin callout-line anatomy explorer */
.eye-labelled-stage{position:relative;width:100%;aspect-ratio:1000/540;min-height:520px;background:#fff;border-radius:14px;overflow:hidden}
.eye-labelled-stage .realistic-eye-image{position:absolute;left:22%;top:7%;width:75%;height:auto;max-height:86%;object-fit:contain;object-position:center;z-index:1}
.eye-callout-overlay{position:absolute;inset:0;width:100%;height:100%;z-index:2;overflow:visible}
.eye-callout{cursor:pointer;outline:none}
.eye-callout line{stroke:#173b63;stroke-width:1.45;vector-effect:non-scaling-stroke;transition:.18s}
.eye-callout circle{fill:#173b63;stroke:#fff;stroke-width:1.2;vector-effect:non-scaling-stroke;transition:.18s}
.eye-callout text{fill:#17233d;font-size:15px;font-weight:750;paint-order:stroke;stroke:#fff;stroke-width:3px;stroke-linejoin:round;transition:.18s;user-select:none}
.eye-callout:hover line,.eye-callout:focus-visible line,.eye-callout.active line{stroke:var(--purple);stroke-width:2.3}
.eye-callout:hover circle,.eye-callout:focus-visible circle,.eye-callout.active circle{fill:var(--gold);stroke:var(--purple);r:5}
.eye-callout:hover text,.eye-callout:focus-visible text,.eye-callout.active text{fill:var(--purple)}
.dark .eye-labelled-stage{background:#f8fbfa}
@media(max-width:1150px){.eye-labelled-stage{min-height:470px}.eye-callout text{font-size:14px}}
@media(max-width:760px){.eye-labelled-stage{min-height:360px;aspect-ratio:4/3}.eye-labelled-stage .realistic-eye-image{left:8%;top:14%;width:88%;max-height:72%}.eye-callout-overlay{display:none}.image-caption:after{content:" On smaller screens, use the structure buttons below the diagram."}.realistic-explorer{grid-template-columns:1fr}}

/* Module 2: numbered Anatomy Explorer */
.anatomy-video-task{display:grid;grid-template-columns:auto 1fr;gap:1rem;align-items:start;border:2px solid #9e86d8;background:linear-gradient(135deg,#f7f3ff,#fff)}
.video-task-icon{width:58px;height:58px;border-radius:16px;display:grid;place-items:center;background:var(--purple);color:#fff;font-size:1.25rem;font-weight:900}
.anatomy-video-task h3{margin:.2rem 0;color:var(--purple)}
.video-link{display:inline-flex;text-decoration:none;margin-top:.35rem}
.numbered-anatomy-card{overflow:hidden}
.numbered-anatomy-heading{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;margin-bottom:1rem}
.numbered-anatomy-heading h3{margin:.2rem 0}
.score-chip{min-width:105px;padding:.6rem .8rem;border-radius:14px;background:var(--purple-soft);text-align:center;color:var(--purple)}
.score-chip span{display:block;font-size:.76rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em}.score-chip strong{font-size:1.25rem}
.numbered-anatomy-layout{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(300px,.55fr);gap:1.1rem;align-items:start}
.numbered-eye-figure{margin:0;background:#fff;border:1px solid var(--line);border-radius:16px;padding:.65rem;overflow:hidden}
.numbered-eye-figure img{display:block;width:100%;height:auto;min-height:390px;object-fit:contain}
.numbered-eye-figure figcaption{font-size:.84rem;color:var(--muted);padding:.55rem .35rem .1rem}
.number-matching{border:1px solid var(--line);border-radius:16px;padding:1rem;background:linear-gradient(150deg,#fbfffd,#fff8fd)}
.number-matching h4{margin:0 0 .65rem;color:var(--green);font-size:1.1rem}
.number-match-row{display:grid;grid-template-columns:38px minmax(0,1fr) 28px;gap:.5rem;align-items:center;padding:.42rem 0;border-bottom:1px solid var(--line)}
.number-match-row select{min-width:0;width:100%;padding:.52rem .55rem;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--ink);font:inherit}
.number-pill{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:#086b50;color:#fff;font-weight:950}
.match-status{font-size:1.15rem;font-weight:950;text-align:center}.number-match-row.correct .match-status{color:#118149}.number-match-row.incorrect .match-status{color:#b8274d}
.number-match-row.correct select{border-color:#36a96a;background:#effbf4}.number-match-row.incorrect select{border-color:#d65a78;background:#fff4f6}
.teacher-only-answer{display:none;grid-column:2/4;color:var(--muted)}.teacher-mode .teacher-only-answer{display:block}
.dark .anatomy-video-task,.dark .number-matching{background:#17332d;color:var(--ink)}.dark .numbered-eye-figure{background:#fff}.dark .number-match-row select{background:#213f38;color:#fff}
@media(max-width:1000px){.numbered-anatomy-layout{grid-template-columns:1fr}.numbered-eye-figure img{min-height:0}.number-matching{max-width:700px}}
@media(max-width:600px){.anatomy-video-task{grid-template-columns:1fr}.numbered-anatomy-heading{display:block}.score-chip{margin-top:.75rem;width:max-content}.number-match-row{grid-template-columns:34px minmax(0,1fr) 24px}.numbered-eye-figure{padding:.25rem}}

/* Expanded Retina learning section */
.retina-hero-card{overflow:hidden}.retina-section-heading{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start}.retina-section-heading .score-chip{max-width:320px}.retina-main-figure{margin:1rem 0 0}.retina-main-figure img{display:block;width:100%;max-height:720px;object-fit:contain;border-radius:16px;border:1px solid var(--line);background:#fff}.retina-main-figure figcaption{font-size:.88rem;color:var(--muted);margin-top:.55rem}.retina-focus-controls{display:flex;flex-wrap:wrap;gap:.55rem;margin:1rem 0}.retina-focus-button{border:1px solid var(--line);background:#fff;border-radius:999px;padding:.62rem .88rem;font:inherit;font-weight:800;color:var(--green);cursor:pointer}.retina-focus-button:hover,.retina-focus-button.active{background:var(--purple);border-color:var(--purple);color:#fff}.retina-pathway{display:grid;gap:.5rem;margin-top:.75rem}.retina-pathway button{display:flex;align-items:center;gap:.7rem;text-align:left;border:1px solid var(--line);border-radius:12px;padding:.65rem .8rem;background:#fff;font:inherit;cursor:pointer}.retina-pathway button span{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#efe5f4;color:var(--purple);font-weight:900}.retina-pathway button.active{border-color:var(--purple);box-shadow:0 0 0 3px #9b188c22;background:#fff8ff}.retina-pathway.reverse button.active{border-color:var(--green);box-shadow:0 0 0 3px #176c5b22;background:#f5fffb}.retina-compare-table{display:grid;grid-template-columns:minmax(130px,.8fr) repeat(2,minmax(180px,1fr));border:1px solid var(--line);border-radius:14px;overflow:auto;margin:1rem 0}.compare-head,.compare-cell{padding:.75rem;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.compare-head{font-weight:950;background:#f3eaf6;color:var(--purple)}.compare-cell.feature{font-weight:850;background:#f8fbfa}.retina-match-row.correct{background:#eefbf5}.retina-match-row.incorrect{background:#fff1f1}
@media(max-width:750px){.retina-section-heading{display:block}.retina-section-heading .score-chip{margin-top:.75rem;display:block}.retina-main-figure img{max-height:none}.retina-compare-table{grid-template-columns:130px repeat(2,190px)}}

/* Module 3: Accommodation */
.accommodation-banner{background:linear-gradient(135deg,rgba(0,91,76,.1),rgba(147,18,139,.1))}
.lead{font-size:1.08rem;color:var(--muted)}
.mechanism-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.8rem;margin:1rem 0}
.mechanism-grid article{border:1px solid var(--line);border-radius:16px;padding:1rem;text-align:center;background:var(--surface-2)}
.mechanism-icon{display:grid;place-items:center;margin:auto;width:48px;height:48px;border-radius:50%;background:rgba(147,18,139,.1);color:var(--purple);font-size:1.5rem}
.focus-rule{display:flex;flex-wrap:wrap;gap:.55rem;align-items:center;justify-content:center;padding:1.4rem;border-radius:18px;background:linear-gradient(135deg,rgba(0,112,91,.08),rgba(147,18,139,.08));font-weight:700}
.concept-visual{align-self:center}.caption{text-align:center;color:var(--muted);font-size:.9rem}
.warning-box{padding:1rem;border-left:4px solid #d79b28;background:#fff8e8;border-radius:10px;color:#60460e}.dark .warning-box{background:#322910;color:#ffeab8}
.accommodation-sim{display:grid;grid-template-columns:minmax(0,2fr) minmax(250px,1fr);gap:1rem;align-items:center}
.sim-stage{border:1px solid var(--line);border-radius:18px;background:#f8fcfd;overflow:hidden}.dark .sim-stage{background:#0e2230}
#accommodationSvg{display:block;width:100%;height:auto;min-height:300px}
.object-arrow{stroke:#8e1686;stroke-width:8}.object-arrow-fill{fill:#8e1686}.eye-outline{fill:#e9f7fb;stroke:#006b59;stroke-width:7}.sim-lens{stroke:#128bb0;stroke-width:4}.ciliary-ring{fill:none;stroke:#d94b5b;stroke-width:16;stroke-dasharray:16 9;opacity:.65}.ligament-line{stroke:#e45c8f;stroke-width:4}.light-ray{fill:none;stroke:#e09c00;stroke-width:4}.retina-line{fill:none;stroke:#8e1686;stroke-width:10}.focus-dot{fill:#e09c00}.svg-label{font:700 18px system-ui;fill:#17324a}.dark .svg-label{fill:#e8f2f7}
.sim-controls label{display:flex;justify-content:space-between;margin-bottom:.6rem}.sim-controls input{width:100%}.sim-readout{display:grid;gap:.55rem;margin-top:1rem}.sim-readout div{display:flex;justify-content:space-between;padding:.65rem .75rem;background:var(--surface-2);border-radius:10px}.sim-readout span{color:var(--muted)}
.comparison-table-wrap{overflow:auto}.comparison-table{width:100%;border-collapse:collapse}.comparison-table th,.comparison-table td{padding:.85rem;border:1px solid var(--line);text-align:left}.comparison-table th{background:rgba(0,112,91,.09)}
.sentence-builder,.drop-sequence{display:flex;flex-wrap:wrap;gap:.65rem;min-height:82px;padding:1rem;border:2px dashed var(--line);border-radius:16px;margin:.8rem 0}.sentence-builder button,.drop-sequence button{border:1px solid var(--line);border-radius:999px;background:var(--surface);padding:.65rem .9rem;cursor:grab;color:var(--text)}
.drop-sequence{background:rgba(147,18,139,.04)}
.summary-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.summary-grid article{padding:1rem;border:1px solid var(--line);border-radius:14px;background:var(--surface-2)}
.answer-area{width:100%;min-height:150px;padding:1rem;border:1px solid var(--line);border-radius:14px;background:var(--surface);color:var(--text);font:inherit}
.mini-note{font-size:.9rem;color:var(--muted)}
@media(max-width:900px){.mechanism-grid{grid-template-columns:repeat(2,1fr)}.accommodation-sim{grid-template-columns:1fr}.summary-grid{grid-template-columns:1fr}}
@media(max-width:560px){.mechanism-grid{grid-template-columns:1fr}.focus-rule{font-size:.9rem}.sim-readout div{flex-direction:column;gap:.2rem}}

/* Module 3: image-supported learning sequence */
.accommodation-learn-card{overflow:hidden}
.learn-image-layout{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr);gap:1.5rem;align-items:center}
.learn-image-layout>.learn-figure:first-child{order:0}
.learn-copy{min-width:0}
.learn-figure{margin:0;border:1px solid var(--line);border-radius:18px;background:#fff;padding:.75rem;box-shadow:0 10px 28px rgba(16,44,64,.08)}
.learn-figure img{display:block;width:100%;height:auto;border-radius:12px;object-fit:contain}
.learn-figure figcaption{margin-top:.65rem;font-size:.88rem;line-height:1.4;color:var(--muted);text-align:center}
.definition-box{margin:1rem 0;padding:1rem 1.1rem;border-radius:14px;background:linear-gradient(135deg,rgba(143,24,139,.09),rgba(0,103,84,.07));border-left:4px solid var(--purple)}
.definition-box p{margin:.35rem 0}
.cause-chain{margin:.5rem 0 1rem;padding-left:1.35rem}
.cause-chain li{margin:.42rem 0;padding-left:.2rem}
.language-tip{margin-top:1rem;padding:.9rem 1rem;border-radius:12px;background:rgba(0,103,84,.08);border:1px solid rgba(0,103,84,.16)}
.learn-image-crop{position:relative;overflow:hidden;border-radius:12px;aspect-ratio:1/1}
.learn-image-crop img{position:absolute;top:0;width:200%;max-width:none;height:100%;object-fit:cover;border-radius:0}
.learn-image-crop.crop-left img{left:0;object-position:left center}
.learn-image-crop.crop-right img{left:-100%;object-position:right center}
.comparison-flow{display:grid;grid-template-columns:1fr 1fr;gap:.8rem;margin:1rem 0}
.comparison-flow>div{display:flex;flex-direction:column;gap:.42rem;padding:1rem;border-radius:14px;background:#f8fbfa;border:1px solid var(--line)}
.comparison-flow span:not(:last-child)::after{content:" ↓";color:var(--purple);font-weight:700}
.comparison-flow .flow-label{font-weight:800;color:var(--green)}

@media (max-width:900px){
  .learn-image-layout{grid-template-columns:1fr}
  .learn-image-layout .learn-figure{order:-1}
  .learn-image-crop{aspect-ratio:4/3}
}
@media (max-width:560px){
  .comparison-flow{grid-template-columns:1fr}
  .learn-figure{padding:.5rem;border-radius:14px}
  .learn-image-crop{aspect-ratio:1/1}
}

/* Module 3 update: clearer near/far comparison and video support */
.accommodation-video-card{display:grid;grid-template-columns:auto 1fr;gap:1rem;align-items:start;background:linear-gradient(135deg,rgba(147,18,139,.08),rgba(0,103,84,.07))}
.video-card-icon{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--purple);color:#fff;font-size:1.15rem;box-shadow:0 8px 18px rgba(147,18,139,.2)}
.link-button{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;margin-top:.5rem}
.accommodation-learn-card:nth-of-type(2) .learn-image-crop,
.accommodation-learn-card:nth-of-type(3) .learn-image-crop{aspect-ratio:1/1.05;background:#fff}
.accommodation-learn-card:nth-of-type(2) .learn-image-crop img,
.accommodation-learn-card:nth-of-type(3) .learn-image-crop img{object-fit:cover}
@media(max-width:600px){.accommodation-video-card{grid-template-columns:1fr}.video-card-icon{width:44px;height:44px}}

/* Improved round-eye accommodation simulation */
.accommodation-simulation-card{overflow:hidden}
.simulation-heading{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start}
.accommodation-sim{grid-template-columns:minmax(0,2.35fr) minmax(270px,.9fr)}
.sim-stage{position:relative;background:linear-gradient(180deg,#fbfeff,#eef8fb);padding:.5rem}
#accommodationSvg{min-height:390px}
.sclera-circle{fill:#e8f0f4;stroke:#2f5665;stroke-width:7}
.vitreous-circle{stroke:#87bfce;stroke-width:3}
.cornea-shape{stroke:#2a7f98;stroke-width:4}
.iris-shape{fill:none;stroke:#4b8f57;stroke-width:17;stroke-linecap:round}
.pupil-shape{fill:#17212a}
.ciliary-muscle{fill:none;stroke:#cb655d;stroke-width:18;stroke-linecap:round}
.ligament-line{stroke:#7f8991;stroke-width:3;transition:.25s ease}
.ligament-line.slack{stroke-dasharray:7 6;stroke-width:2.5}
.sim-lens{stroke:#1688a7;stroke-width:4;filter:drop-shadow(0 2px 2px rgba(0,0,0,.08));transition:.25s ease}
.retina-line{fill:none;stroke:#ecb932;stroke-width:13;stroke-linecap:round}
.choroid-line{fill:none;stroke:#9b3039;stroke-width:8;stroke-linecap:round}
.optic-nerve-shape{fill:#f1cf6c;stroke:#8d6722;stroke-width:4}
.incoming-ray,.refracted-ray{fill:none;stroke-width:4;stroke-linecap:round;transition:.2s ease}
.incoming-ray{stroke:#7a35b4;opacity:.9}
.refracted-ray{stroke:#17895e;stroke-dasharray:10 7}
.focus-dot{fill:#e94235;stroke:#8d1d17;stroke-width:2}
.label-line{stroke:#354d5b;stroke-width:2}
.retina-label{font-size:17px}
.sim-legend{display:flex;flex-wrap:wrap;gap:1rem;padding:.45rem .7rem .2rem;color:var(--muted);font-size:.88rem}
.sim-legend span{display:flex;align-items:center;gap:.45rem}
.legend-ray{display:inline-block;width:36px;height:0;border-top:3px solid}
.legend-ray.incoming{border-color:#7a35b4}.legend-ray.refracted{border-color:#17895e;border-top-style:dashed}
.legend-retina{display:inline-block;width:25px;height:8px;border-radius:999px;background:#ecb932}
.distance-scale{display:flex;justify-content:space-between;font-size:.82rem;color:var(--muted);margin-top:.15rem}
.dark .sim-stage{background:linear-gradient(180deg,#102735,#0b1d29)}
.dark .sclera-circle{fill:#324958;stroke:#9dc4d2}.dark .vitreous-circle{opacity:.8}.dark .label-line{stroke:#d6ebf4}
@media(max-width:900px){.simulation-heading{display:block}.simulation-heading .button-row{margin-top:.75rem}.accommodation-sim{grid-template-columns:1fr}#accommodationSvg{min-height:320px}}
@media(max-width:600px){.sim-stage{padding:.15rem}#accommodationSvg{min-height:260px}.sim-legend{gap:.6rem;font-size:.8rem}.retina-label{display:none}}

/* Practice feedback: reveal answers only after the learner checks them */
.question-feedback:empty{display:none}
.quiz-option{display:block;padding:.55rem .65rem;border:1px solid transparent;border-radius:10px;margin:.35rem 0;transition:.18s ease}
.quiz-option:hover{background:var(--green-soft)}
.quiz-option.correct-answer{background:#e6f6ef;border-color:#52a77f;color:var(--success)}
.quiz-option.incorrect-answer{background:#faeaed;border-color:#d98793;color:var(--danger)}
.quiz-option.correct-answer::after{content:" ✓";font-weight:900}
.quiz-option.incorrect-answer::after{content:" ✗";font-weight:900}
#resetAccommodationQuiz{margin-left:.5rem}

/* Module 3: expanded AIS.chat learning area */
.ai-intro-card{background:linear-gradient(135deg,rgba(147,18,139,.075),rgba(0,103,84,.07))}
.ai-prompt-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-bottom:1rem}
.ai-prompt-card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:1.15rem;box-shadow:var(--shadow);transition:.2s ease}
.ai-prompt-card:hover{transform:translateY(-2px);border-color:rgba(147,18,139,.35)}
.ai-prompt-card.selected{border:2px solid var(--purple);box-shadow:0 10px 28px rgba(147,18,139,.14)}
.ai-card-heading{display:flex;gap:.85rem;align-items:flex-start;margin-bottom:.7rem}
.ai-card-heading h4{margin:.15rem 0 0;font-size:1.06rem}
.ai-card-icon{display:grid;place-items:center;flex:0 0 42px;width:42px;height:42px;border-radius:13px;background:linear-gradient(135deg,var(--purple),var(--green));color:#fff;font-size:1.15rem}
.ai-prompt-card p{margin:.45rem 0;line-height:1.5}
.ai-prompt-card .secondary{margin-top:.6rem;width:100%}
.ai-workspace-card{border-top:4px solid var(--purple)}
.ai-workspace-card .prompt-output{white-space:pre-wrap;line-height:1.6;min-height:120px;padding:1rem;border-radius:14px;background:#f7f5fb;border:1px solid rgba(147,18,139,.18);margin:1rem 0}
.reflection-label{display:flex;flex-direction:column;gap:.2rem;margin-top:1.1rem}
.reflection-label span{font-size:.88rem;color:var(--muted)}
.ai-check-card{border-left:5px solid var(--green)}
.ai-checklist{display:grid;gap:.65rem;margin:1rem 0}
.ai-checklist label{display:flex;gap:.65rem;align-items:flex-start;padding:.7rem .8rem;border-radius:12px;background:var(--green-soft)}
.ai-checklist input{margin-top:.15rem;transform:scale(1.15)}
.dark .ai-workspace-card .prompt-output{background:#17212d;border-color:#51325d}
.dark .ai-checklist label{background:#163229}
@media(max-width:820px){.ai-prompt-cards{grid-template-columns:1fr}}

/* Vocabulary trainer */
.vocab-page{max-width:1280px;margin:auto}.vocab-hero{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;background:linear-gradient(135deg,var(--green),#0b7562 55%,var(--purple));color:#fff;padding:1.5rem;border-radius:22px;margin-bottom:1rem}.vocab-hero h2{font-size:clamp(2rem,4vw,3.4rem);margin:.25rem 0}.vocab-hero p{max-width:720px;margin:0;color:rgba(255,255,255,.9)}.vocab-progress-card{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.25);border-radius:18px;padding:1rem;min-width:210px}.vocab-progress-card strong{font-size:1.65rem;display:block}.vocab-progress-card span{font-size:.88rem}.vocab-progress-card .progress{background:rgba(255,255,255,.22);margin-top:.7rem}.vocab-progress-card .progress span{background:#fff}.vocab-filter,.vocab-mode-tabs{display:flex;gap:.55rem;flex-wrap:wrap;margin:.8rem 0}.vocab-filter-btn,.vocab-mode-btn{border:1px solid var(--line);background:var(--card);color:var(--text);border-radius:999px;padding:.65rem .9rem;font-weight:800;cursor:pointer}.vocab-filter-btn.active,.vocab-mode-btn.active{background:var(--purple);border-color:var(--purple);color:#fff}.vocab-stage{margin-top:1rem}.vocab-single-layout{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(260px,.75fr);gap:1rem}.trainer-card-shell{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:1rem}.trainer-flashcard{height:430px;perspective:1200px;cursor:pointer;max-width:760px;margin:auto}.trainer-flash-inner{height:100%;position:relative;transform-style:preserve-3d;transition:transform .55s}.trainer-flashcard.flipped .trainer-flash-inner{transform:rotateY(180deg)}.trainer-flash-front,.trainer-flash-back{position:absolute;inset:0;backface-visibility:hidden;border-radius:22px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:2rem;border:1px solid var(--line);box-shadow:0 18px 45px rgba(12,54,47,.1)}.trainer-flash-front{background:linear-gradient(155deg,#fff,var(--green-soft))}.trainer-flash-back{transform:rotateY(180deg);background:linear-gradient(155deg,#fff,var(--purple-soft))}.trainer-flash-front h3,.trainer-flash-back h3{font-size:clamp(2rem,5vw,3.7rem);margin:.6rem 0;color:var(--green)}.trainer-flash-back h3{font-size:clamp(1.6rem,3vw,2.5rem)}.trainer-flash-back p{max-width:620px;font-size:1.05rem}.term-icon{font-size:4rem}.module-pill{display:inline-block;background:var(--purple-soft);color:var(--purple);border-radius:999px;padding:.35rem .65rem;font-size:.78rem;font-weight:900}.trainer-german{font-size:1.35rem;font-weight:900;color:var(--purple);padding:.75rem 1rem;border-radius:12px;background:#fff;margin:.7rem}.trainer-example{font-style:italic;color:var(--muted)}.trainer-actions{display:flex;gap:.55rem;flex-wrap:wrap;justify-content:center;margin-top:1rem}.trainer-actions .known{box-shadow:inset 0 0 0 2px var(--success)}.vocab-tip{align-self:start}.vocab-tip ol,.vocab-tip ul{padding-left:1.2rem}.trainer-question{max-width:850px;margin:auto;text-align:center}.trainer-question h3{font-size:1.5rem}.question-prompt{font-size:clamp(1.8rem,4vw,3.2rem);font-weight:900;color:var(--green);margin:1.2rem 0}.choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem;max-width:720px;margin:auto}.choice-answer{border:1px solid var(--line);background:var(--card);border-radius:14px;padding:1rem;font-weight:850;font-size:1rem;cursor:pointer}.choice-answer:hover{background:var(--green-soft)}.choice-answer.correct{background:#def5e9;border-color:var(--success);color:var(--success)}.choice-answer.incorrect{background:#fae5e8;border-color:var(--danger);color:var(--danger)}.spell-label{display:grid;gap:.45rem;max-width:520px;margin:1rem auto;text-align:left;font-weight:800}.spell-input{width:100%;font-size:1.25rem;padding:.85rem;border:2px solid var(--line);border-radius:13px;background:var(--card);color:var(--text)}.spell-input:focus{outline:3px solid rgba(123,52,128,.18);border-color:var(--purple)}.match-game{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1rem 0}.match-column{display:grid;gap:.55rem}.match-card{padding:.8rem;border-radius:12px;border:1px solid var(--line);background:var(--card);font-weight:800;cursor:pointer;min-height:52px}.match-card.selected{outline:3px solid var(--purple);background:var(--purple-soft)}.match-card.matched{background:#def5e9;border-color:var(--success);color:var(--success)}.match-card.wrong{animation:shake .35s;background:#fae5e8;border-color:var(--danger)}@keyframes shake{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}.vocab-model{display:none}.nav-subheading{margin-top:1rem}
@media(max-width:800px){.vocab-hero{align-items:stretch;flex-direction:column}.vocab-progress-card{min-width:0}.vocab-single-layout{grid-template-columns:1fr}.trainer-flashcard{height:480px}.choice-grid{grid-template-columns:1fr}.match-game{gap:.55rem}.match-card{font-size:.9rem;padding:.65rem}.vocab-mode-tabs{overflow-x:auto;flex-wrap:nowrap;padding-bottom:.25rem}.vocab-mode-btn{white-space:nowrap}}

/* Module 3 Learn Step 1: Watch and Observe */
.accommodation-video-step{position:relative;overflow:hidden;border-top:5px solid var(--purple);background:linear-gradient(145deg,var(--card),rgba(147,18,139,.045))}
.accommodation-video-step::after{content:"";position:absolute;width:220px;height:220px;border-radius:50%;right:-95px;top:-105px;background:radial-gradient(circle,rgba(0,103,84,.13),transparent 68%);pointer-events:none}
.video-step-heading{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;margin-bottom:1rem}
.video-step-heading h3{font-size:clamp(1.5rem,3vw,2rem);margin:.25rem 0}
.lead-small{margin:.25rem 0;color:var(--muted);max-width:760px;line-height:1.55}
.step-status{display:inline-flex;align-items:center;white-space:nowrap;padding:.45rem .75rem;border-radius:999px;background:var(--purple-soft);color:var(--purple);font-size:.82rem;font-weight:900}
.video-complete .step-status{background:#def5e9;color:var(--success)}
.learning-goal-box{padding:1rem 1.05rem;border-radius:16px;background:var(--green-soft);border:1px solid rgba(0,103,84,.14);margin:1rem 0}
.learning-goal-box p{margin:.4rem 0 0;line-height:1.55}
.video-observe-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.8fr);gap:1rem;align-items:start}
.video-frame-wrap{position:relative;width:100%;aspect-ratio:16/9;border-radius:18px;overflow:hidden;background:#111;box-shadow:0 14px 32px rgba(18,44,40,.14)}
.video-frame-wrap iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.video-link-row{margin:.75rem 0}
.button-link{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
.observe-card{border:1px solid var(--line);border-radius:18px;padding:1rem;background:var(--card)}
.observe-card h4{margin:.1rem 0 .4rem}
.observe-questions{padding-left:1.25rem;margin:.75rem 0 1rem;display:grid;gap:.65rem}
.observe-questions li{line-height:1.45}
.video-complete-check{display:flex;gap:.8rem;align-items:flex-start;padding:1rem;border-radius:16px;border:2px solid var(--line);background:var(--card);cursor:pointer;transition:.2s ease}
.video-complete-check:hover{border-color:var(--green)}
.video-complete-check input{margin-top:.15rem;transform:scale(1.25);accent-color:var(--green)}
.video-complete-check span{display:grid;gap:.2rem}.video-complete-check small{color:var(--muted);line-height:1.35}
.video-complete .video-complete-check{border-color:var(--success);background:#effaf5}
.vocab-preview{margin-top:1.15rem;padding-top:1.05rem;border-top:1px solid var(--line)}
.vocab-preview h4{margin:.2rem 0 .8rem}
.vocab-preview-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.65rem}
.vocab-preview-grid span{display:flex;flex-direction:column;gap:.18rem;padding:.75rem;border-radius:13px;background:var(--purple-soft);border:1px solid rgba(147,18,139,.1)}
.vocab-preview-grid b{font-size:.9rem}.vocab-preview-grid em{font-style:normal;color:var(--muted);font-size:.82rem}
.next-after-video{transition:.3s ease;border:1px solid var(--line)}
.next-after-video.ready-to-learn{border-color:rgba(0,103,84,.45);box-shadow:0 0 0 4px rgba(0,103,84,.07),var(--shadow)}
.dark .video-complete .video-complete-check{background:#163229}
.dark .learning-goal-box{background:#163229}.dark .vocab-preview-grid span{background:#2a2132}
@media(max-width:900px){.video-observe-grid{grid-template-columns:1fr}.vocab-preview-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.video-step-heading{display:block}.step-status{margin-top:.55rem}.vocab-preview-grid{grid-template-columns:1fr}.video-complete-check{padding:.85rem}}

/* Module 4: Vision Defects and Colour Vision */
.defects-banner{background:linear-gradient(110deg,#fff,#eef8f5 46%,var(--purple-soft))}.defects-watch{border-top:5px solid var(--purple)}.mini-ray-preview{display:flex;align-items:center;min-height:250px}.defects-eye-svg{width:100%;height:auto;display:block;min-width:520px}.eye-outline{stroke:#567a72;stroke-width:5}.def-retina{fill:none;stroke:#c74374;stroke-width:12}.def-lens{fill:#a7deebaa;stroke:#16829a;stroke-width:4}.spectacle-lens{fill:#c1e4f1aa;stroke:#467f96;stroke-width:4}.def-ray{fill:none;stroke:#95108d;stroke-width:4;stroke-dasharray:12 8;animation:defRayMove 1.5s linear infinite}.def-ray.corrected{stroke:#168662}.def-focus{fill:#e27a2c;stroke:#fff;stroke-width:3;animation:defFocusPulse 1.4s ease-in-out infinite}.svg-label{font-size:17px;fill:var(--ink);font-weight:800}.object-arrow{stroke:#075f50;stroke-width:8}.object-arrow-fill{fill:#075f50}@keyframes defRayMove{to{stroke-dashoffset:-40}}@keyframes defFocusPulse{50%{r:14;opacity:.55}}.patient-intro article{border:1px solid var(--line);background:linear-gradient(145deg,#fff,var(--green-soft));border-radius:16px;padding:1rem}.patient-intro article>span{font-size:2rem}.patient-intro h4{margin:.4rem 0;color:var(--purple);font-size:1.2rem}.learn-image-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,1fr);gap:1rem;align-items:center}.cause-chain{padding-left:1.4rem}.cause-chain li{margin:.45rem 0}.language-tip{background:var(--purple-soft);border-radius:12px;padding:.85rem;border-left:4px solid var(--purple)}.teacher-solution{margin-top:.8rem;border:1px dashed var(--gold);border-radius:12px;padding:.7rem}.teacher-solution summary{color:var(--warning);font-weight:900;cursor:pointer}.teacher-solution>*:not(summary){display:none}.teacher-mode .teacher-solution[open]>*{display:block}.defects-sim-layout{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(260px,.6fr);gap:1rem}.segmented{display:flex;flex-wrap:wrap;gap:.4rem}.segmented button{border:1px solid var(--line);background:var(--card);color:var(--green);border-radius:11px;padding:.55rem .7rem;font-weight:850;cursor:pointer}.segmented button.active{background:var(--purple);border-color:var(--purple);color:#fff}.glasses-lab{display:grid;grid-template-columns:minmax(320px,.75fr) minmax(0,1.25fr);gap:1rem;align-items:start}.patient-file{display:flex;gap:1rem;background:linear-gradient(135deg,var(--green-soft),#fff);border:1px solid var(--line);border-radius:17px;padding:1rem}.patient-avatar{width:58px;height:58px;border-radius:50%;background:var(--purple);color:#fff;display:grid;place-items:center;font-weight:950;font-size:1.35rem;flex:none}.patient-file h4{margin:.1rem 0;color:var(--green);font-size:1.3rem}.patient-file p{margin:.25rem 0}.lab-label{display:block;font-weight:900;color:var(--green);margin:1rem 0 .45rem}.cone-display{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin:1rem 0}.cone-display article{min-height:190px;color:#fff;border-radius:60px 60px 18px 18px;padding:1.1rem;text-align:center;display:flex;flex-direction:column;justify-content:center;box-shadow:var(--shadow)}.cone-display article span{font-size:3rem;font-weight:950}.cone-display article b{line-height:1.2}.cone-display article small{margin-top:.5rem}.cone-l{background:linear-gradient(#e45d68,#a82b49)}.cone-m{background:linear-gradient(#53a66b,#176646)}.cone-s{background:linear-gradient(#508cce,#35519b)}.screening-card{border:2px solid var(--gold)}.screening-head{display:flex;gap:1rem;align-items:center}.screening-head>span{width:62px;height:62px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#e45864,#e7c741,#4ca96e,#4c83c5,#9b428f,#e45864);color:#fff;font-size:2rem}.button-link{display:inline-flex;text-decoration:none;align-items:center}.final-patient{border:1px solid var(--line);border-radius:15px;padding:1rem;margin:1rem 0}.final-patient legend{color:var(--purple);font-weight:950;padding:0 .5rem}.final-patient label{display:grid;gap:.4rem;font-weight:850}.final-patient select{padding:.65rem;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink)}.final-patient.correct{border-color:var(--success);background:#e9f8f0}.final-patient.incorrect{border-color:var(--danger);background:#fff0f2}.optics-badge{width:210px;height:210px;border-radius:50%;margin:1.5rem auto 0;border:9px double #b5aaa7;background:#dedbd9;color:#746f6d;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;filter:grayscale(1);opacity:.65;transition:.5s}.optics-badge span{font-size:3rem}.optics-badge strong{font-size:1.2rem}.optics-badge.unlocked{background:radial-gradient(circle at 35% 30%,#fff4a9,#dda32d 70%);border-color:#fff1a4;color:#5d3b00;filter:none;opacity:1;box-shadow:0 18px 44px rgba(173,117,16,.3);transform:rotate(-2deg)}.summary-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:.7rem}.summary-grid article{border:1px solid var(--line);border-radius:14px;padding:.85rem;background:var(--card)}.summary-grid article span{width:32px;height:32px;border-radius:50%;background:var(--purple-soft);color:var(--purple);font-weight:950;display:grid;place-items:center}.dark .patient-intro article,.dark .patient-file,.dark .final-patient select{background:var(--card);color:var(--ink)}
.spectacle-lens.concave-lens,.spectacle-lens.convex-lens{fill:#c1e4f1d9;stroke:#467f96;stroke-width:4;stroke-linejoin:round;filter:drop-shadow(0 3px 4px rgba(40,105,132,.2))}
.defects-sim-layout ellipse.eye-outline{rx:180px;ry:180px}
@media(max-width:1100px){.learn-image-layout,.defects-sim-layout,.glasses-lab{grid-template-columns:1fr}.summary-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:700px){.cone-display,.summary-grid{grid-template-columns:1fr}.defects-eye-svg{min-width:460px}.mini-ray-preview{overflow:auto}.glasses-lab .diagram{overflow:auto}.patient-intro{grid-template-columns:1fr}.segmented button{flex:1}.screening-head{align-items:flex-start}}
