.ec-card { --blue:#1b6ef3; --green:#27814a; --purple:#7950a6; --line:#e4ebf5; --ink:#0b2545; }

.ec-card .comparison { min-width:0; container-type:inline-size; }
.ec-card .tabs { display:grid; grid-template-columns:1fr 1fr; gap:4px; padding:4px; border:1px solid var(--line); border-radius:9px; background:#f2f5fa; margin-bottom:12px; }
.ec-card .tabs button { border:0; border-radius:6px; padding:8px; color:#56708f; background:transparent; font-size:14px; font-weight:750; }
.ec-card .tabs [aria-selected=true] { background:white; color:#1557b7; box-shadow:0 1px 3px #0b25450d; }
.ec-card .tabs button:hover { color:#1557b7; }
.ec-card .comparison-panel { border:1px solid #dce6f3; border-radius:11px; overflow:hidden; background:white; }
.ec-card .run-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 16px; color:#647a94; font-size:12px; border-bottom:1px solid var(--line); }
.ec-card .run-heading b { color:var(--ink); font-size:13px; }
.ec-card .scene-wrap { position:relative; aspect-ratio:960/320; background:#f8fbff; }
.ec-card canvas { display:block; width:100%; height:100%; }
.ec-card .comparison-results { padding:0 16px 8px; border-top:1px solid var(--line); }
.ec-card .reference-energy { margin:14px 0 12px; font-size:13px; color:#647a94; }
.ec-card .reference-energy strong { margin-left:5px; font:20px Georgia,serif; color:var(--ink); }
.ec-card .results-table { width:100%; border-collapse:collapse; table-layout:fixed; font-size:16px; text-align:left; }
.ec-card .mass-column { width:20%; }
.ec-card .speed-column { width:18%; }
.ec-card .results-table th { font-size:13px; font-weight:750; color:#526b8b; padding:8px 7px; border-bottom:1px solid #d7e2ef; }
.ec-card .results-table th span { font-weight:500; font-size:11px; }
.ec-card .results-table td { height:58px; padding:10px 7px; border-bottom:1px solid var(--line); vertical-align:middle; }
.ec-card .results-table tr:last-child td { border-bottom:0; }
.ec-card .results-table tbody tr { border-left:3px solid transparent; }
.ec-card .results-table tr.is-current { background:#f5f8fd; border-left-color:var(--blue); }
.ec-card .results-table .parameter { font:italic 19px Georgia,serif; visibility:hidden; }
.ec-card .results-table .is-started .parameter { visibility:visible; }
.ec-card .ke-cell { position:relative; }
.ec-card .ke-pending { color:#acb9c9; }
.ec-card .ke-formula { display:none; font:18px/1.45 Georgia,serif; white-space:nowrap; }
.ec-card .ke-formula sup { font-size:.7em; }
.ec-card .ke-formula strong { color:var(--purple); }
.ec-card .is-finished .ke-pending { display:none; }
.ec-card .is-finished .ke-formula { display:inline; }
.ec-card .result-summary { margin:10px 0 4px; min-height:24px; font-size:14px; font-weight:750; color:var(--purple); visibility:hidden; }
.ec-card .result-summary.is-visible { visibility:visible; }
.ec-card .motion-note { margin:0; padding:7px 8px 10px; border-top:1px solid #f0f3f7; text-align:center; color:#7c8da2; font-size:11px; }
.ec-card .thumbnail-open { display:none; position:absolute; inset:0; width:100%; background:transparent; border:0; cursor:zoom-in; }
.ec-card .thumbnail-open span { position:absolute; right:5px; bottom:5px; background:#0b2545c4; color:white; padding:5px 7px; border-radius:5px; font-size:10px; opacity:0; transition:opacity 150ms ease; }
.ec-card .thumbnail-open:hover span,.ec-card .thumbnail-open:focus-visible span { opacity:1; }
.ec-card .size-button { display:block; margin:7px 0 0 auto; padding:3px 0; background:none; border:0; color:#426a9d; font-size:11px; font-weight:700; }
.ec-card .thumbnail-label { display:none; color:#526c8a; font-size:10px; text-align:center; }
.ec-card:not(.is-expanded) .expanded-copy,.ec-card:not(.is-expanded) .expanded-controls,.ec-card:not(.is-expanded) .run-heading,.ec-card:not(.is-expanded) .comparison-results,.ec-card:not(.is-expanded) .motion-note { display:none; }
.ec-card:not(.is-expanded) .thumbnail-open,.ec-card:not(.is-expanded) .thumbnail-label { display:block; }
.ec-card .sr-only { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }

:is(#notes-content-1-2,.topic-one-notes,.topic-two-notes,.topic-three-notes,.topic-four-notes) { container-type:inline-size; }
:is(#notes-content-1-2,.topic-one-notes,.topic-two-notes,.topic-three-notes,.topic-four-notes) .ec-card { --card-bg:#f2f7fe; --card-accent:#1b6ef3; display:grid; grid-template-columns:minmax(0,1fr) 170px; align-items:center; gap:24px; background:#fff!important; border-color:#e4ebf5!important; }
:is(#notes-content-1-2,.topic-one-notes,.topic-two-notes,.topic-three-notes,.topic-four-notes) .ec-card[data-card-tone="1"] { --card-bg:#f2faf5; --card-accent:#27814a; }
:is(#notes-content-1-2,.topic-one-notes,.topic-two-notes,.topic-three-notes,.topic-four-notes) .ec-card[data-card-tone="2"] { --card-bg:#fff5eb; --card-accent:#b85b14; }
:is(#notes-content-1-2,.topic-one-notes,.topic-two-notes,.topic-three-notes,.topic-four-notes) .ec-card.is-expanded { grid-template-columns:minmax(0,1fr) 425px; align-items:start; }
:is(#notes-content-1-2,.topic-one-notes,.topic-two-notes,.topic-three-notes,.topic-four-notes) .ec-card.is-expanded .comparison { width:425px; max-width:100%; justify-self:center; }
.ec-card .nb-block-title { font-size:18px; line-height:1.4; }
.ec-card .nb-block-title button { padding:0; background:none; border:0; color:inherit; font:inherit; font-weight:800; text-align:left; width:100%; cursor:pointer; }
.ec-card .nb-block-desc { font-size:16px; line-height:1.65; }
.ec-card .ec-mark-focus { display:block; margin-top:12px; font-size:15px; line-height:1.65; background:var(--card-bg); border-left:3px solid var(--card-accent); }
.ec-card .ec-mark-focus>b { display:block; margin-bottom:3px; }
.ec-card .lesson-copy { cursor:pointer; }
.ec-card .expanded-copy { margin-top:16px; color:#42597a; font-size:15px; line-height:1.65; }
.ec-card:not(.is-expanded) .expanded-copy { display:none; }
.ec-card .equation { margin:18px 0 14px; font:28px/1.5 Georgia,serif; color:#0b2545; }
.ec-card .equation>span { padding:0 3px 3px; border-bottom:2px solid transparent; }
.ec-card .term-active { color:#7950a6; border-bottom-color:#c9b3df!important; }
.ec-card .units { margin:0; padding:0; font-size:15px; }
.ec-card .units>div { display:grid; grid-template-columns:48px 1fr; padding:5px 0; }
.ec-card .units dt { font-family:Georgia,serif; font-style:italic; font-weight:700; }.ec-card .units dd { margin:0; }.ec-card .units b { float:right; margin-left:8px; color:#526c8a; font-size:13px; }
.ec-card .comparison-notes { margin-top:20px; border-top:1px solid #e4ebf5; padding-top:14px; }
.ec-card .comparison-notes h4 { margin:0 0 6px; font-size:16px; color:#0b2545; }
.ec-card .comparison-notes p { margin:0; }
.ec-card .scope-note { margin:16px 0 0; color:#647a94; font-size:13px; }
.ec-card .ec-working { margin-top:17px; padding-top:12px; border-top:1px solid #e4ebf5; font-size:14px; }
.ec-card .ec-working summary { cursor:pointer; color:#315e94; font-weight:750; }.ec-card .ec-working p { margin:9px 0; }
.ec-card .ec-points { padding-left:18px; margin:15px 0; }.ec-card .ec-points li { margin-bottom:8px; }
.ec-card button { font-family:inherit; cursor:pointer; }.ec-card button:focus-visible,.ec-card summary:focus-visible { outline:3px solid #709ee5; outline-offset:3px; }
.ec-card:not(.is-expanded) .expanded-controls { display:none; }
.ec-card .ec-vertical-scene { aspect-ratio:640/340; }
.ec-card .ec-example { padding:11px 12px; font-size:12px; color:#526b8b; border-bottom:1px solid #e4ebf5; text-align:center; }
.ec-card .ec-energy-bars { padding:10px 12px; border-bottom:1px solid #e4ebf5; background:white; }
.ec-card .ec-energy-bars>div { display:grid; grid-template-columns:80px 1fr 42px; gap:7px; align-items:center; font-size:11px; color:#526b8b; }
.ec-card .ec-energy-bars i { display:block; height:8px; border-radius:4px; background:#eef2f7; overflow:hidden; }.ec-card .ec-energy-bars b[data-store] { display:block; height:100%; background:#d77a1d; }.ec-card .ec-energy-bars [data-store=ke] { background:#1b6ef3; }.ec-card .ec-energy-bars [data-store=thermal] { background:#b65370; }
.ec-card .ec-energy-bars strong { font-variant-numeric:tabular-nums; text-align:right; }.ec-card .ec-energy-bars p { margin:7px 0 0; font-size:11px; color:#647a94; }
.ec-card .ec-outcome { padding:14px 12px; border-top:1px solid #e4ebf5; min-height:130px; text-align:center; font-size:13px; color:#526b8b; }.ec-card .ec-outcome strong { color:#7950a6; font-size:17px; }.ec-card .ec-outcome p { margin:7px 0; }.ec-card .ec-outcome [hidden] { display:none; }
.ec-card .ec-zoom { position:absolute; inset:0; width:100%; border:0; border-radius:10px; background:transparent; cursor:zoom-in; }.ec-card.is-expanded .ec-zoom { cursor:zoom-out; }
.ec-card .ec-zoom span { position:absolute; right:7px; bottom:7px; color:white; background:#0b2545b3; padding:5px 7px; border-radius:5px; font-size:11px; opacity:0; transition:opacity 150ms ease; }.ec-card .ec-zoom i { position:absolute; top:45%; left:45%; font-style:normal; background:#fff; color:#1b6ef3; border-radius:50%; width:30px; height:30px; line-height:30px; opacity:0; }.ec-card .scene-wrap:hover .ec-zoom span,.ec-card .ec-zoom:focus-visible span,.ec-card .scene-wrap:hover .ec-zoom i { opacity:1; }
@container(max-width:700px) { :is(#notes-content-1-2,.topic-one-notes,.topic-two-notes,.topic-three-notes,.topic-four-notes) .ec-card.is-expanded { grid-template-columns:minmax(0,1fr); } }
@container(max-width:440px) { :is(#notes-content-1-2,.topic-one-notes,.topic-two-notes,.topic-three-notes,.topic-four-notes) .ec-card { grid-template-columns:minmax(0,1fr); padding:18px 15px; }.ec-card:not(.is-expanded) .comparison { width:170px; justify-self:center; }.ec-card .comparison-results { padding:0 9px 8px; }.ec-card .ke-formula { font-size:16px; }.ec-card .results-table .parameter { font-size:17px; }.ec-card .results-table th span { display:block; }.ec-card .results-table th,.ec-card .results-table td { padding-left:4px; padding-right:4px; }.ec-card .run-heading { flex-wrap:wrap; gap:4px 8px; padding:10px; } }
@container(max-width:420px) { .ec-card .scene-wrap:not(.ec-vertical-scene) { aspect-ratio:760/320; } }
@media(max-width:640px) {
 :is(#notes-content-1-2,.topic-one-notes,.topic-two-notes,.topic-three-notes,.topic-four-notes) .ec-card:not(.is-expanded) .comparison { width:110px; }
 :is(#notes-content-1-2,.topic-one-notes,.topic-two-notes,.topic-three-notes,.topic-four-notes) .ec-card.is-expanded .comparison { width:275px; }
 #mapThreeColumnContainer.unit12-concepts.lesson-view-mode .directory-left-sidebar { position:absolute!important; width:280px!important; min-width:0!important; transform:translateX(-105%)!important; opacity:0!important; pointer-events:none!important; visibility:hidden; z-index:100; }
 #mapThreeColumnContainer.unit12-concepts.lesson-view-mode .directory-left-sidebar.drawer-open { transform:translateX(0)!important; opacity:1!important; pointer-events:auto!important; visibility:visible; }
 #mapThreeColumnContainer.unit12-concepts .sidebar-collapse-circle { display:none; }
 #mapThreeColumnContainer.unit12-concepts #btnToggleChaptersSidebar { display:inline-flex!important; }
 #mapThreeColumnContainer.unit12-concepts .chapters-drawer-backdrop.active { display:block!important; }
}
@media(prefers-reduced-motion:reduce) { .ec-card,.ec-card .thumbnail-open span,.ec-card .ec-zoom span { transition:none; } }
