/* Electricity only. No selectors or tokens change the Light lessons. */
.ec-root, .ec-hub {
  --ec-bg:#124F40; --ec-deep:#0A3B31; --ec-surface:#185E4C; --ec-hover:#21705A;
  --ec-border:#397565; --ec-mint:#A9E8CF; --ec-light:#C8F5E2; --ec-cream:#FFF6D8;
  --ec-text:#F7FAF8; --ec-secondary:#C5D8D1; --ec-muted:#91AFA4;
  font-family:'Manrope',sans-serif; color:var(--ec-text); background:var(--ec-bg);
  font-size:16px; line-height:1.5; font-weight:500; color-scheme:dark;
}
.ec-root *, .ec-hub * {box-sizing:border-box;}
.ec-root [hidden], .ec-hub [hidden] {display:none!important;}
.ec-root {position:fixed;inset:0;height:100dvh;display:grid;grid-template-rows:auto minmax(0,1fr) auto;overflow:hidden;}
.ec-root button,.ec-root input {font:inherit;}
.ec-root button,.ec-root a {touch-action:manipulation;}
.ec-root button {cursor:pointer;}
.ec-root button:disabled {cursor:default;opacity:.4;}
.ec-root :focus-visible,.ec-hub :focus-visible {outline:2px solid var(--ec-mint);outline-offset:4px;}
.ec-topbar {display:flex;align-items:center;gap:8px;min-height:58px;padding:5px max(12px,env(safe-area-inset-right)) 5px max(12px,env(safe-area-inset-left));padding-top:max(5px,env(safe-area-inset-top));border-bottom:1px solid var(--ec-border);background:var(--ec-deep);}
.ec-topbar button,.ec-topbar a {display:inline-flex;align-items:center;justify-content:center;gap:7px;min-width:44px;min-height:44px;background:none;color:var(--ec-secondary);border:0;text-decoration:none;border-radius:8px;padding:8px;font-size:12px;white-space:nowrap;}
.ec-topbar svg {width:20px;height:20px;flex-shrink:0;}
.ec-topbar .ec-map-open {font-size:13px;}
.ec-chapter-title {margin:0 auto 0 2px;font-size:14px;font-weight:600;}
.ec-main {min-height:0;overflow-y:auto;overscroll-behavior:contain;display:flex;flex-direction:column;scrollbar-width:thin;}
.ec-root #main {width:100%;max-width:none;margin:0;padding:0;}
.ec-heading {padding:20px 22px 0;max-width:880px;width:100%;margin:0 auto;flex-shrink:0;}
.ec-focus {font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ec-mint);margin:0 0 9px;}
.ec-heading h1 {font-size:clamp(24px,6.3vw,34px);line-height:1.18;letter-spacing:-.03em;font-weight:650;margin:0;text-wrap:balance;color:var(--ec-text);}
.ec-support {font-size:16px;line-height:1.45;font-weight:500;color:var(--ec-secondary);margin:10px 0 0;max-width:48ch;}
.ec-workbench {display:flex;flex-direction:column;flex:1;min-height:0;width:100%;max-width:1050px;margin:0 auto;}
.ec-scene {position:relative;flex:1 0 300px;min-height:300px;width:100%;}
.ec-circuit {width:100%;height:100%;position:absolute;inset:0;overflow:visible;}
.ec-circuit text {font-family:'Manrope',sans-serif;}
.ec-wire {stroke:#90B7A6;stroke-width:3;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.ec-loop {transition:stroke .25s;}
.show-path .ec-wire {stroke:var(--ec-mint);stroke-width:4;}
.ec-label {font-size:14px;fill:var(--ec-secondary);font-weight:500;}
.ec-terminal {font-size:21px;font-weight:600;fill:var(--ec-light);text-anchor:middle;}
.ec-contact {fill:#E0EAE5;}
.ec-hit {fill:transparent;stroke:none;}
.ec-cue {font-size:14px;fill:var(--ec-mint);font-weight:600;}
.ec-switch-blade {stroke:#DDEAE1;stroke-width:6;stroke-linecap:round;}
.ec-bulb-glass {fill:#C8F5E2;fill-opacity:.055;stroke:#ABC9BC;stroke-width:2;transition:fill .18s,stroke .18s;}
.ec-bulb-pin {fill:none;stroke:#739785;stroke-width:2;}
.ec-filament {fill:none;stroke:#90AFA1;stroke-width:2.5;stroke-linecap:round;}
.ec-bulb-halo {opacity:0;transition:opacity .18s;}
.is-lit .ec-bulb-glass {fill:#FFF6D8;fill-opacity:.22;stroke:#F2D995;}
.is-lit .ec-filament {stroke:#FFE6A1;stroke-width:3;}
.is-lit .ec-bulb-halo {opacity:1;}
.is-actionable {cursor:pointer;}
.is-actionable:hover .ec-hit,.is-actionable:focus-visible .ec-hit {fill:#A9E8CF;fill-opacity:.07;stroke:#A9E8CF;stroke-width:1;stroke-dasharray:3 5;}
.ec-meter-face {fill:var(--ec-deep);stroke:#C8F5E2;stroke-width:2;}
.is-empty .ec-meter-face {stroke-dasharray:4 5;fill-opacity:.3;}
.is-empty .ec-meter-needle {visibility:hidden;}
.ec-meter-a {font-size:18px;fill:var(--ec-text);}
.ec-arrow {stroke:#FFF6D8;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;fill:none;}
.ec-arrow.electron {stroke:#BFC8FA;}
.ec-panel {padding:0 22px 20px;width:100%;flex-shrink:0;max-width:680px;margin:0 auto;}
.ec-panel p {margin:0 0 12px;}
.ec-panel .ec-learned {font-size:21px;line-height:1.35;font-weight:500;color:var(--ec-text);text-wrap:pretty;}
.ec-panel .ec-note {font-size:14px;color:var(--ec-secondary);line-height:1.45;}
.ec-panel .ec-eyebrow {font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ec-mint);margin:0 0 10px;}
.ec-root .ec-action {border:1px solid var(--ec-border);border-radius:10px;background:var(--ec-surface);color:var(--ec-text);min-height:46px;padding:10px 16px;font-weight:600;font-size:15px;display:inline-flex;gap:8px;align-items:center;justify-content:center;text-decoration:none;}
.ec-root .ec-action:hover {background:var(--ec-hover);}
.ec-root .ec-action.primary {background:var(--ec-mint);color:var(--ec-deep);border-color:var(--ec-mint);}
.ec-actions {display:flex;gap:10px;flex-wrap:wrap;margin:12px 0 0;}
.ec-feedback {font-size:16px;color:var(--ec-light);min-height:24px;line-height:1.45;}
.ec-footer {border-top:1px solid var(--ec-border);background:var(--ec-deep);padding:8px max(12px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));}
.ec-controls {display:flex;gap:8px;align-items:center;width:100%;max-width:860px;margin:auto;}
.ec-controls .ec-action {font-size:13px;min-height:44px;padding:10px 12px;}
.ec-controls .ec-next {margin-left:auto;min-width:82px;}
.ec-root .ec-skip {background:none;color:var(--ec-secondary);border:0;font-size:12px;min-height:44px;padding:5px 7px;}
.ec-session-progress {height:2px;background:#397565;max-width:860px;margin:0 auto 8px;}
.ec-session-progress span {display:block;height:100%;background:var(--ec-mint);transition:width .3s;}
.ec-measures {display:grid;grid-template-columns:1fr 1fr;gap:18px;border-top:1px solid var(--ec-border);padding-top:12px;margin:0 0 12px;}
.ec-measures dt {font-size:13px;color:var(--ec-secondary);}
.ec-measures dd {font-size:30px;letter-spacing:-.03em;margin:3px 0 0;font-variant-numeric:tabular-nums;color:var(--ec-text);}
.ec-measures dd small {font-size:17px;color:var(--ec-mint);}
.ec-measure-progress {height:4px;background:var(--ec-border);margin:0 0 14px;}
.ec-measure-progress span {height:100%;width:0;display:block;background:var(--ec-mint);}
.ec-readings {margin:16px 0;display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.ec-reading {border-top:1px solid var(--ec-border);padding-top:14px;}
.ec-reading .ec-reading-name {color:var(--ec-mint);font-size:12px;margin-bottom:8px;}
.ec-reading strong {font-size:26px;font-weight:500;}
.ec-reading .ec-time {color:var(--ec-secondary);font-size:17px;margin:4px 0 14px;}
.ec-reading .ec-reading-bar {display:flex;gap:4px;height:10px;margin:12px 0;}
.ec-reading-bar span {background:var(--ec-mint);height:100%;flex:1;}
.ec-equation {font-size:clamp(30px,9vw,48px);line-height:1.3;font-weight:500;letter-spacing:-.03em;margin:10px 0 18px!important;font-variant-numeric:tabular-nums;}
.ec-fraction {display:inline-flex;vertical-align:middle;flex-direction:column;text-align:center;font-size:.85em;margin:0 .1em;}
.ec-fraction span:first-child {border-bottom:1.5px solid var(--ec-mint);padding:0 .28em 4px;}
.ec-fraction span:last-child {padding-top:4px;}
.ec-formal {border-left:2px solid var(--ec-mint);padding:4px 0 4px 15px;margin:14px 0;}
.ec-formal .ec-exam-label {font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ec-mint);margin-bottom:6px;}
.ec-formal p:last-child {margin:0;font-size:16px;line-height:1.5;}
.ec-unit-lines {display:grid;gap:10px;font-size:20px;margin:14px 0;}
.ec-unit-lines p {margin:0;}
.ec-panel sup {font-size:.65em;}
.ec-direction-key {font-size:12px;letter-spacing:.1em;color:var(--ec-cream);margin-bottom:6px!important;}
.ec-direction-key.electron {color:#BFC8FA;}
.ec-direction-line {font-size:26px!important;color:var(--ec-text);}
.ec-working {border-top:1px solid var(--ec-border);margin:20px 0 14px;padding-top:14px;}
.ec-working p {font-size:23px;margin:7px 0;line-height:1.45;}
.ec-working .ec-working-label {font-size:13px;color:var(--ec-secondary);}
.ec-answer-form {display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:15px 0;}
.ec-answer-form label {flex-basis:100%;font-size:14px;color:var(--ec-secondary);}
.ec-answer-form input {width:125px;min-height:46px;border:1px solid var(--ec-border);border-radius:8px;background:var(--ec-deep);color:var(--ec-text);padding:9px 12px;font-size:20px;}
.ec-hint-button {background:none;border:0;border-bottom:1px solid var(--ec-border);color:var(--ec-secondary);min-height:44px;padding:8px 0;font:inherit;font-size:14px!important;}
.ec-recall-list {list-style:none;padding:0;margin:18px 0;}
.ec-recall-list li {padding:12px 0;border-bottom:1px solid var(--ec-border);font-size:17px;line-height:1.5;}
.ec-recall-list small {display:block;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ec-mint);margin-bottom:5px;}
.ec-recall-list li.is-new {animation:ec-appear .35s ease both;}
@keyframes ec-appear {from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
.ec-root[data-mode="working"] .ec-scene,.ec-root[data-mode="recall"] .ec-scene {display:none;}
.ec-root[data-mode="working"] .ec-panel,.ec-root[data-mode="recall"] .ec-panel {padding-top:14px;}
.ec-root[data-mode="compare"] .ec-scene,.ec-root[data-mode="formula"] .ec-scene,.ec-root[data-mode="compact"] .ec-scene {flex:0 0 280px;min-height:280px;}
.ec-root[data-mode="measure"] .ec-scene {min-height:300px;flex-basis:300px;}
.ec-map {position:fixed;margin:0;inset:0 auto 0 0;width:min(90vw,390px);height:100dvh;max-height:none;border:0;border-right:1px solid var(--ec-border);padding:20px;background:var(--ec-deep);color:var(--ec-text);font-family:'Manrope',sans-serif;overflow-y:auto;}
.ec-map::backdrop {background:rgba(3,20,14,.65);}
.ec-map header {display:flex;align-items:center;justify-content:space-between;}
.ec-map h2 {font-size:18px;font-weight:600;color:var(--ec-text);}
.ec-map svg {width:20px;height:20px;}
.ec-map button {min-height:44px;min-width:44px;background:none;border:0;color:var(--ec-text);font:inherit;cursor:pointer;}
.ec-map h3 {font-size:24px;margin:28px 0 6px;color:var(--ec-text);}
.ec-map p {font-size:14px;color:var(--ec-secondary);}
.ec-map .ec-map-current {display:block;padding:16px 0;border-top:1px solid var(--ec-border);border-bottom:1px solid var(--ec-border);margin:24px 0;color:var(--ec-mint);font-size:17px;}
.ec-map a {display:inline-block;color:var(--ec-mint);min-height:44px;padding:10px 0;}
.ec-hub {min-height:100dvh;padding:24px;}
.ec-hub #main {max-width:680px;margin:8vh auto;padding:0;}
.ec-hub h1 {font-size:clamp(36px,8vw,56px);letter-spacing:-.04em;margin:12px 0;color:var(--ec-text);}
.ec-hub a {color:var(--ec-mint);}
.ec-hub .ec-hub-start {display:block;margin:32px 0;padding:22px 0;border-block:1px solid var(--ec-border);font-size:22px;text-decoration:none;}
.ec-hub small {display:block;color:var(--ec-secondary);font-size:14px;margin-top:8px;}
@media(min-width:760px){
  .ec-heading {padding-top:26px;}
  .ec-topbar {padding-inline:24px;}
  .ec-chapter-title {font-size:16px;}
  .ec-workbench {flex-direction:row;align-items:stretch;padding:0 24px;min-height:350px;}
  .ec-scene {flex:1 1 55%!important;min-height:350px!important;}
  .ec-panel {flex:0 0 42%;align-self:center;padding:22px 0 22px 24px;margin:0;}
  .ec-root[data-mode="working"] .ec-scene,.ec-root[data-mode="recall"] .ec-scene {display:block;}
  .ec-root[data-mode="recall"] .ec-workbench {align-items:flex-start;}
  .ec-root[data-mode="recall"] .ec-scene {position:sticky;top:0;height:370px;}
  .ec-root[data-mode="working"] .ec-panel,.ec-root[data-mode="recall"] .ec-panel {flex-basis:53%;}
  .ec-controls .ec-action {font-size:14px;padding:10px 18px;}
}
@media(max-height:500px) and (orientation:landscape){
  .ec-heading {padding-top:12px;}
  .ec-heading h1 {font-size:24px;}
  .ec-focus {margin-bottom:4px;}
  .ec-support {margin-top:6px;}
  .ec-workbench {flex-direction:row;min-height:300px;padding:0 16px;}
  .ec-scene {flex:1 1 50%!important;min-height:300px!important;}
  .ec-panel {flex:0 0 46%;align-self:center;padding:14px;}
  .ec-topbar {min-height:48px;padding-block:2px;}
}
@media(prefers-reduced-motion:reduce){
  .ec-root * {animation:none!important;transition:none!important;scroll-behavior:auto!important;}
}
