/* Same surfaces, row accents and yellow evidence marks as the main application. */
.home-actions #foundations-btn{order:0;background:var(--sage);border:1px solid var(--line);color:var(--forest);box-shadow:0 3px 0 color-mix(in srgb,var(--line) 90%,var(--forest) 10%)}
.home-actions #start-btn{font-size:14px}
.foundations-screen{--f-leaf:var(--forest);--f-soft:var(--sage);--f-violet:var(--purple);--f-violet-soft:var(--paper);width:100%;max-width:820px;gap:0;align-self:center}
.f-menu-content{max-width:600px;max-height:100%;display:flex;flex-direction:column;min-height:0}
.f-header{flex-shrink:0;margin-bottom:15px;gap:10px;padding:0 2px;min-width:0}
.f-header>div{flex:1;min-width:0;display:flex;align-items:center;gap:9px}.f-header h1{font-size:20px;line-height:1.7;overflow-wrap:anywhere;outline:none;letter-spacing:0}
.f-header .f-eyebrow{display:inline-grid;place-items:center;min-width:24px;height:24px;border:1px solid var(--line);border-radius:7px;font-size:11px;color:var(--muted);line-height:1;margin:0;flex-shrink:0}
.f-scroll{overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--line) transparent;min-height:0;flex:1;padding:2px 3px 12px;outline:none}
.f-lecture-list{display:flex;flex-direction:column;gap:10px}
.f-lecture-card{--topic-accent:#17815e;display:flex;align-items:center;gap:14px;text-align:right;min-height:62px;width:100%;padding:13px 15px;background:#fffefa;border:1px solid var(--line);border-radius:13px;transition:transform 180ms,border-color 180ms,box-shadow 180ms;animation:topic-arrive 320ms calc(var(--i)*32ms) backwards}
.f-lecture-card:nth-child(3n+2){--topic-accent:#8263ba}.f-lecture-card:nth-child(3n){--topic-accent:#a77916}
.f-lecture-card:hover{border-color:var(--topic-accent);box-shadow:0 2px 7px #1c354008}.f-lecture-card:active{transform:scale(.985)}
.f-lecture-number{display:grid;place-items:center;width:32px;height:32px;flex-shrink:0;border:1px solid color-mix(in srgb,var(--topic-accent) 35%,var(--line));border-radius:9px;font-size:13px;font-weight:750;color:var(--topic-accent);background:transparent}
.f-lecture-info{flex:1;min-width:0}.f-lecture-info>strong{font-size:13px;font-weight:750;line-height:1.8}
.f-lecture-end{width:18px;flex-shrink:0;color:var(--muted)}.f-lecture-end .icon{width:16px;height:16px}.is-complete .f-lecture-end{color:var(--forest)}
.f-exams-button{margin-top:18px;width:100%;justify-content:flex-start;font-size:13px;font-weight:750;min-height:54px;padding:10px 15px;background:#b74b4b;color:#fffaf5;border:1px solid #a33f3f;border-radius:13px;box-shadow:0 3px 0 #8c3737;gap:12px}
.f-exams-button:hover{background:#aa4242}.f-exams-button .arrow{margin-inline-start:auto;width:18px;height:18px}.f-exams-button>.icon:first-child{width:32px;height:32px;padding:7px;border:1px solid #ffffff40;border-radius:9px}
.f-exam-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.f-exam-choice{display:grid;grid-template-columns:29px minmax(0,1fr);align-items:center;min-height:94px;padding:15px 12px;gap:11px;border-radius:14px}
.f-exam-choice .f-lecture-number{width:29px;height:29px;font-size:12px;border-radius:50%;border-color:#d2b3af;color:#9e5750}.f-exam-choice .f-lecture-end{display:none}.f-exam-choice .f-lecture-info>strong{font-size:12px;line-height:1.95}.f-exam-choice:hover{border-color:#bc8580}
.f-step-track{display:flex;gap:5px;flex-shrink:0;padding:0 4px;margin-bottom:10px}.f-step-track button{min-height:30px;padding:10px 0;flex:1;position:relative;border-radius:5px}.f-step-track button i{display:block;height:3px;border-radius:4px;background:var(--line);transition:background 180ms}.f-step-track button.is-done i{background:color-mix(in srgb,var(--forest) 40%,var(--line))}.f-step-track button[aria-current="step"] i{background:var(--forest)}
.f-lesson-card{border:1px solid var(--line);border-radius:16px;background:var(--paper);padding:17px 18px 20px;overflow:hidden}
.f-lesson-card>h2{font-size:18px;line-height:1.8;font-weight:800;outline:none}
.f-scene{margin:10px 0 15px;padding:16px 12px 19px;border-bottom:1px solid var(--line);position:relative;min-height:145px;overflow:hidden}
.f-lesson-copy{font-size:13px;line-height:2.15}.f-lesson-copy p+p{margin-top:9px}.f-lesson-copy strong{font-weight:750;color:inherit}
.f-lesson-copy bdi,.f-lesson-copy [dir="ltr"],.f-model-answer bdi{font-family:'Genetics Symbols',Arial,sans-serif;letter-spacing:.03em;font-weight:600}
.f-highlight{color:inherit;background:#f5df8f;border-radius:3px;padding-inline:2px;box-decoration-break:clone;-webkit-box-decoration-break:clone;font-weight:inherit}
.f-note{display:flex;gap:8px;align-items:flex-start;border-inline-start:3px solid #dfc56c;background:color-mix(in srgb,#f5df8f 18%,var(--paper));padding:9px 11px;margin-top:14px;font-size:11.5px;line-height:1.95;border-radius:4px}.f-note .icon{width:16px;height:16px;color:#9c7b21;margin-top:4px;flex-shrink:0}
.f-lecture-exam{width:100%;margin-top:13px;min-height:44px;font-size:12px}
.f-lesson-nav{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:12px 2px 4px;flex-shrink:0;border-top:1px solid var(--line)}.f-lesson-nav .button{font-size:12px;min-height:44px;padding:8px 13px;gap:7px}.f-lesson-nav .icon{width:15px;height:15px}.f-prev{background:#fffefa;border:1px solid var(--line)}
.f-gene{display:inline-block;font:600 27px/1.25 'Genetics Symbols',Arial,sans-serif;letter-spacing:.03em;color:var(--f-leaf)}
.f-plant{width:84px;height:100px;overflow:visible;color:var(--f-leaf)}.f-stem{transform-origin:60px 132px;animation:f-grow .8s cubic-bezier(.22,1,.36,1) both}.f-flower{transform-origin:60px 43px;animation:f-bloom .9s .15s cubic-bezier(.22,1,.36,1) both}
.f-identity{display:grid;grid-template-columns:minmax(0,1fr) 28px minmax(0,1fr);align-items:center;gap:7px;text-align:center;min-height:180px}
.f-specimen{display:flex;flex-direction:column;align-items:center;gap:7px}.f-specimen-name{font-size:11px;font-weight:750;line-height:1.8}.f-code-specimen>small{font-size:10px;color:var(--muted)}.f-identity-link{display:flex;align-items:center;gap:2px;justify-content:center;direction:ltr}.f-identity-link>span{width:4px;height:4px;border-radius:50%;background:#a9c0b3}.f-identity-link>i{width:5px;height:5px;border-radius:50%;background:var(--f-leaf);animation:f-link .9s .2s both}
.f-alleles{display:flex;direction:ltr;align-items:center;justify-content:center;gap:7px;margin:15px 0 10px}.f-allele{width:49px;height:59px;background:#e0ede3;border:1px solid #adcbb7;border-radius:14px;box-shadow:0 3px 0 #c0d6c7;font:500 34px/1 'Genetics Symbols',Arial,sans-serif;color:#397255;animation:f-token-in .65s calc(var(--i)*150ms) cubic-bezier(.22,1,.36,1) both;transition:transform .2s,box-shadow .2s}
.f-allele.is-recessive{background:#eee7f2;border-color:#d3c3df;color:#8a6b9c;box-shadow:0 3px 0 #dacde4}.f-allele:hover,.f-allele.is-selected{transform:translateY(-5px);box-shadow:0 6px 0 #c0d6c7}.f-allele.is-selected{outline:2px solid var(--f-leaf);outline-offset:3px}.f-allele-label{display:block;font-size:10px;color:var(--muted);line-height:1.9;margin-top:9px;min-height:19px}
.f-allele-lab{text-align:center;padding:9px 0}.f-allele-lab>small{font-size:11px;color:var(--muted)}.f-allele-lab .f-alleles{margin:24px 0 15px}.f-allele-lab .f-allele{width:65px;height:73px;font-size:42px}.f-bracket{width:128px;height:8px;border:1px solid #9ab4a4;border-top:0;margin:0 auto;border-radius:0 0 8px 8px}
.f-traits{display:flex;align-items:stretch;justify-content:center;gap:9px;text-align:center}.f-trait{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:8px;animation:f-row-in .6s calc(var(--i)*150ms) both}.f-trait .f-plant{width:64px;height:83px}.f-trait .f-gene{font-size:24px}.f-trait span{font-size:10px;line-height:1.8;max-width:90px}
.f-trait-dots{height:83px;display:flex;align-items:center;justify-content:center;gap:5px}.f-trait-dots i{width:21px;height:37px;background:#c9dfcb;border:1px solid #9dbea4;border-radius:12px;box-shadow:inset 4px 0 0 #ffffff30}.f-trait-dots i.is-recessive{background:#dfd2e8;border-color:#bca6ca}
.f-coding{display:flex;flex-direction:column;gap:12px}.f-code-row{display:flex;align-items:center;gap:14px;border-bottom:1px solid var(--line);padding:1px 0 12px;animation:f-row-in .6s both}.f-code-row:last-child{border-bottom:0;padding-bottom:0;animation-delay:.15s}.f-code-row .f-plant{width:52px;height:65px;flex-shrink:0}.f-code-row>span{font-size:12px;font-weight:750;flex:1}.f-code-row small{display:block;font-size:9px;font-weight:500;color:var(--muted);margin-top:4px}.f-code-letter{font:500 38px/1 'Genetics Symbols',Arial,sans-serif;color:var(--f-leaf);width:44px;text-align:center}.f-code-letter.is-recessive{color:var(--f-violet)}
.f-inference{text-align:center}.f-evidence,.f-conclusion{text-align:right;border:1px solid #d9cde3;border-radius:13px;background:var(--f-violet-soft);padding:12px 14px;animation:f-row-in .6s both}.f-evidence small,.f-conclusion small{font-size:9px;font-weight:750;color:var(--f-violet)}.f-evidence p,.f-conclusion p{font-size:12px;line-height:1.95;margin-top:4px}.f-conclusion{background:#e4eee5;border-color:#c3d8c9;animation-delay:.25s}.f-conclusion small{color:var(--f-leaf)}.f-inference-arrow{font:22px/1.5 Arial,sans-serif;color:#99b1a2;margin:4px}.f-inference-genes{display:flex;align-items:center;justify-content:center;gap:23px;margin:17px 0 2px;animation:f-child-in .6s .4s both}.f-inference-genes>span{color:#9aaca1;font:24px Arial,sans-serif}
.f-inference-context{font-size:10px;font-weight:750;color:var(--muted);margin-bottom:12px}
.f-identity[data-focus="phenotype"] .f-code-specimen{opacity:.42}.f-identity[data-focus="genotype"] .f-specimen{opacity:.65}
.f-rule bdi{font:600 18px/1.8 'Genetics Symbols',Arial,sans-serif;color:var(--f-leaf)}
.f-rule-scene{display:flex;flex-direction:column;gap:13px}.f-rule{display:flex;gap:11px;align-items:flex-start;animation:f-row-in .6s calc(var(--i)*100ms) both}.f-rule-number{display:grid;place-items:center;width:26px;height:26px;flex-shrink:0;border:1px solid #c6d9cc;border-radius:9px;color:var(--f-leaf);font-size:11px;background:var(--paper)}.f-rule strong{font-size:12px;line-height:1.85}.f-rule p{font-size:11px;line-height:1.95;color:var(--muted);margin-top:3px}

.f-evidence,.f-conclusion{background:var(--paper);border-color:var(--line);border-radius:11px}.f-evidence small{color:var(--muted)}.f-conclusion{border-inline-start:3px solid var(--forest);background:var(--sage)}.f-conclusion small{color:var(--forest)}
.f-allele{box-shadow:none}.f-allele:hover,.f-allele.is-selected{box-shadow:none}
.f-exam-question{background:var(--paper);border:1px solid var(--line);border-radius:15px;padding:15px;margin-bottom:12px}.f-exam-question>h2{display:flex;align-items:flex-start;gap:9px;font-size:13px;line-height:2;font-weight:700;margin-bottom:12px}.f-exam-question>h2>span{width:25px;height:25px;display:grid;place-items:center;flex-shrink:0;background:var(--sage);color:var(--forest);border-radius:8px;font-size:11px;margin-top:2px}
.f-model-answer{margin-top:14px;border-top:1px solid var(--line);padding-top:12px;animation:f-row-in .35s both}.f-model-answer>h3{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--forest);margin-bottom:7px}.f-model-answer .icon{width:14px;height:14px}.f-model-answer>div{font-size:12px;line-height:2.1}.f-model-answer p+p{margin-top:7px}
.f-exam-after{display:flex;gap:9px;margin-top:15px}.f-exam-after .button{flex:1;font-size:11px;gap:6px;min-height:43px}.f-exam-after .icon{width:16px;height:16px}.f-exam-footer{padding:12px 2px 4px;border-top:1px solid var(--line);flex-shrink:0}.f-exam-footer .button{width:100%;font-size:13px;min-height:45px}
@keyframes f-row-in{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}
@keyframes f-token-in{from{opacity:0;translate:0 12px;scale:.9}to{opacity:1;translate:0 0;scale:1}}
@keyframes f-grow{from{opacity:0;transform:scaleY(.68)}to{opacity:1;transform:scaleY(1)}}
@keyframes f-bloom{from{transform:scale(.4);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes f-link{from{scale:.3;opacity:0}to{scale:1;opacity:1}}
@keyframes f-gamete{from{opacity:0;transform:translateY(-15px) scale(.65)}to{opacity:1;transform:none}}
@keyframes f-child-in{from{opacity:0;transform:translateY(-12px) scale(.9)}to{opacity:1;transform:none}}
@keyframes f-line{from{scale:.2 1;opacity:0}to{scale:1;opacity:1}}
@keyframes f-bar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
[data-theme="dark"] .foundations-screen{--f-leaf:var(--forest);--f-violet:#c3aedf}
[data-theme="dark"] #foundations-btn{background:var(--sage);border-color:var(--line);color:var(--forest);box-shadow:none}
[data-theme="dark"] .f-lecture-card{background:var(--paper);--topic-accent:#9bc5ad}[data-theme="dark"] .f-lecture-card:nth-child(3n+2){--topic-accent:#c3aedf}[data-theme="dark"] .f-lecture-card:nth-child(3n){--topic-accent:#d9be7e}
[data-theme="dark"] .f-exams-button{background:#8d4545;border-color:#a86565;box-shadow:0 3px 0 #643333;color:#fff2ed}[data-theme="dark"] .f-exams-button:hover{background:#9b4e4e}[data-theme="dark"] .f-exam-choice .f-lecture-number{color:#dfa9a2;border-color:#94736d}[data-theme="dark"] .f-prev{background:var(--paper)}
[data-theme="dark"] .f-highlight{background:#756337}
[data-theme="dark"] .f-note{background:color-mix(in srgb,#756337 24%,var(--paper));border-color:#a08a4d}[data-theme="dark"] .f-note .icon{color:#d9be7e}
[data-theme="dark"] .f-allele{background:#4b554b;border-color:#738b70;color:#d6e5cf;box-shadow:none}[data-theme="dark"] .f-allele.is-recessive{background:#514959;border-color:#746283;color:#d4bfe5;box-shadow:none}[data-theme="dark"] .f-rule-number{border-color:var(--line)}
@media(min-width:800px){.f-lesson-card{padding:20px}.f-lesson-copy{font-size:14px}.f-identity{min-height:190px}.f-plant{width:90px;height:113px}.f-lesson-nav .button{min-width:110px}.f-traits .f-plant{width:75px;height:96px}}
.f-exam-choices .f-lecture-card{background:#fffefa}[data-theme="dark"] .f-exam-choices .f-lecture-card{background:var(--paper)}
@media(max-width:360px){.f-exam-choices{gap:9px}.f-exam-choice{min-height:93px;padding:12px 9px;gap:8px;grid-template-columns:25px minmax(0,1fr)}.f-exam-choice .f-lecture-number{width:25px;height:25px}.f-exam-choice .f-lecture-info>strong{font-size:11.5px}.f-header h1{font-size:18px}.f-lecture-card{gap:9px;padding-inline:10px}.f-lecture-info>strong{font-size:12px}.f-lesson-card{padding:14px}.f-allele{width:39px;height:50px;font-size:30px}.f-exam-after{flex-direction:column}}
@media(max-height:740px){.home-screen{overflow-y:auto;justify-content:flex-start;padding-block:24px 35px;scrollbar-width:none}.home-content{max-height:none;margin-block:auto;flex-shrink:0}.home-content .pea-mark{width:119px;height:106px}.home-content #home-title{font-size:26px}.home-actions{margin-top:18px;gap:9px}}

/* Reuse the practice cross unchanged; reveal only the rows taught in this step. */
.f-scene[data-scene="cross"]{padding:0;border-bottom:0;overflow:visible}
.f-practice-cross[data-stage="1"] :is(.flow-g-label,.flow-gamete-row,.flow-f-label,.flow-offspring,.flow-axis,.cross-flow-summary),
.f-practice-cross[data-stage="2"] :is(.flow-f-label,.flow-offspring,.cross-flow-summary),
.f-practice-cross[data-stage="3"] .cross-flow-summary{visibility:hidden}
.f-practice-cross .flow-parent{animation:f-row-in .55s both}
.f-practice-cross .gamete-circle{animation:f-gamete .65s .2s both}
.f-practice-cross .flow-child{animation:f-child-in .65s .55s both}
.f-practice-cross .cross-flow-summary{animation:f-row-in .55s .9s both}
/* Lessons: a readable explanation, a linked diagram, then worked source examples. */
#foundation-lesson-screen{max-width:740px}
.f-lesson-card{padding:22px;background:var(--paper);border-radius:15px}
.f-lesson-card>h2{font-size:19px;margin-bottom:16px;padding-bottom:13px;border-bottom:1px solid var(--line)}
.f-lesson-copy{font-size:14px;line-height:2.1;width:100%;max-width:none;min-width:0}
.f-lesson-copy>p{margin:0 0 10px}.f-lesson-copy>p:last-child{margin-bottom:0}
.f-scene{min-height:0;margin:20px 0 0;padding:0;border:0;overflow:visible}
.f-highlight{padding:1px 4px;border-radius:4px;background:#f5df8f;color:inherit}
.foundations-screen{--f-phenotype:#f5df8f;--f-genotype:#dcebf8;--f-allele:#e9ddf6;--f-dominant:#dceee0;--f-recessive:#f8dfe5}
.f-highlight[data-concept="phenotype"],.f-highlight[data-concept="evidence"],.f-highlight[data-concept="offspring"]{background:var(--f-phenotype)}
.f-highlight[data-concept="genotype"]{background:var(--f-genotype)}
.f-highlight[data-concept="allele"],.f-highlight[data-concept="gametes"]{background:var(--f-allele)}
.f-highlight[data-concept="dominant"]{background:var(--f-dominant)}
.f-highlight[data-concept="recessive"]{background:var(--f-recessive)}
.f-concept-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.f-concept-panel{border:1px solid var(--line);border-radius:11px;padding:16px 10px;text-align:center;min-width:0;animation:f-row-in .5s both}
.f-concept-panel:nth-child(2){animation-delay:.12s}.f-concept-panel:nth-child(3){animation-delay:.24s}
.f-concept-panel h3{font-size:12px;font-weight:750;line-height:1.8;margin:0}
.f-concept-value{min-height:58px;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;line-height:1.8;padding:12px 0 7px}
.f-concept-value .f-gene{font-size:28px;color:var(--ink)}
.f-concept-panel p{font-size:11px;line-height:1.8;color:var(--muted)}
.f-concept-grid[data-focus="phenotype"] [data-concept="phenotype"],.f-concept-grid[data-focus="genotype"] [data-concept="genotype"],.f-concept-grid[data-focus="allele"] [data-concept="allele"]{border-color:var(--forest)}
.f-traits{gap:10px}.f-trait{padding:16px 8px;border:1px solid var(--line);border-radius:11px;gap:12px}.f-trait strong{font-size:12px;line-height:1.9}.f-trait .f-gene{font-size:28px;color:var(--ink)}.f-trait>span{max-width:none;font-size:11px}
.f-allele-lab{padding:16px 0}.f-allele-lab .f-alleles{margin:15px 0}.f-allele-lab .f-allele{width:55px;height:62px;font-size:36px}
.f-coding{gap:0;border:1px solid var(--line);border-radius:11px;padding:0 14px}.f-code-row{padding:12px 0;gap:12px}.f-code-row:last-child{padding-bottom:12px}.f-code-row .f-plant{height:60px;width:48px}.f-code-row>span{font-size:13px}.f-code-row small{font-size:11px}.f-code-letter{font-size:30px}.f-code-letter:not(.is-recessive){background:var(--f-dominant);border-radius:7px}.f-code-letter.is-recessive{background:var(--f-recessive);border-radius:7px}
.f-inference{text-align:right;display:flex;flex-direction:column;gap:12px}.f-inference-context{text-align:center;margin:0;font-size:12px;line-height:2}
.f-evidence,.f-conclusion,.f-inference-result{border:1px solid var(--line);border-radius:10px;padding:13px 15px;background:transparent;animation:f-row-in .5s both}
.f-conclusion{animation-delay:.15s;border-inline-start:3px solid var(--forest)}.f-inference-result{animation-delay:.3s}
.f-inference h3{font-size:11px;color:var(--muted);font-weight:650;line-height:1.9;margin:0 0 7px}
.f-evidence p,.f-conclusion p{font-size:14px;line-height:2;margin:0}
.f-inference-genes{margin:2px 0;gap:24px}.f-inference-genes .f-gene{font-size:26px;color:var(--ink)}
.f-rule-scene{gap:0;border:1px solid var(--line);border-radius:11px;padding:0 14px}.f-rule{gap:12px;padding:13px 0;border-bottom:1px solid var(--line);align-items:center}.f-rule:last-child{border-bottom:0}.f-rule>div{flex:1}.f-rule strong{font-size:13px}.f-rule p{font-size:12px;color:var(--ink)}
.f-cross-key{margin-top:20px;border:1px solid var(--line);border-radius:10px;padding:12px}
.f-cross-key>h3{font-size:12px;margin-bottom:10px}.f-cross-key dl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.f-cross-key dt{display:flex;align-items:center;gap:8px;font-size:12px}.f-cross-key dt bdi{font-family:'Genetics Symbols',sans-serif;font-size:19px}.f-cross-key dd{margin:7px 0 0;font-size:11px;line-height:1.85;color:var(--muted)}.f-cross-key>p{border-top:1px solid var(--line);margin-top:10px;padding-top:9px;font-size:11px;line-height:1.9;color:var(--muted)}
.f-step-question{padding:13px 15px;border:1px solid var(--line);border-radius:10px;margin:0 0 16px;border-inline-start:3px solid #c4a349}.f-step-question h3{font-size:11px;color:var(--muted);margin-bottom:6px}.f-step-question p{font-size:14px;line-height:2.1}
.f-worked-examples{margin-top:23px;border-top:1px solid var(--line);padding-top:17px}.f-worked-examples>h3{font-size:13px;margin-bottom:12px;color:var(--ink)}
.f-worked-example+ .f-worked-example{margin-top:18px}.f-worked-example h4{font-size:12px;margin-bottom:10px;font-weight:650;line-height:1.9}.f-example-question{font-size:13px;line-height:2.05;padding:0 0 10px}.f-example-answer{font-size:13px;line-height:2.1;border-inline-start:2px solid var(--forest);padding-inline-start:13px}.f-example-answer p+p{margin-top:7px}
.f-example-table-wrap{max-width:100%;overflow-x:auto;border:1px solid var(--line);border-radius:10px}
.f-worked-examples table{border-collapse:collapse;width:100%;font-size:12px;line-height:1.95;text-align:right;table-layout:fixed}
.f-worked-examples th{background:var(--sage);font-size:11px;font-weight:700;padding:10px 12px;border-bottom:1px solid var(--line)}.f-worked-examples td{padding:12px;border-bottom:1px solid var(--line);vertical-align:middle;overflow-wrap:break-word}.f-worked-examples tr:last-child td{border-bottom:0}
.f-worked-examples td bdi{font:400 20px/1.5 'Genetics Symbols',sans-serif;white-space:nowrap}.f-worked-examples td mark{display:inline;box-decoration-break:clone;-webkit-box-decoration-break:clone}
[data-theme="dark"] .foundations-screen{--f-phenotype:#756337;--f-genotype:#3d566b;--f-allele:#614f76;--f-dominant:#405f49;--f-recessive:#714b57}
@media(max-width:520px){.f-lesson-card{padding:16px}.f-lesson-card>h2{font-size:17px}.f-lesson-copy,.f-step-question p{font-size:13px}.f-concept-grid{grid-template-columns:1fr;gap:8px}.f-concept-panel{display:grid;grid-template-columns:110px 1fr;align-items:center;text-align:right;padding:12px;gap:3px 10px}.f-concept-panel h3{grid-column:1;grid-row:1/3;font-size:11px}.f-concept-value{grid-column:2;min-height:0;padding:0;justify-content:flex-start;font-size:13px}.f-concept-panel p{grid-column:2;font-size:10px}.f-concept-value .f-gene{font-size:25px}.f-cross-key dl{gap:8px}.f-cross-key dt{flex-wrap:wrap;gap:5px;font-size:11px}.f-cross-key dd{font-size:10px}.f-worked-examples th{padding:9px 6px;font-size:10px}.f-worked-examples td{padding:10px 6px;font-size:11px}.f-worked-examples td bdi{font-size:18px}.f-trait{padding:12px 5px}.f-trait strong{font-size:11px}.f-trait>span{font-size:10px}.f-trait .f-gene{font-size:25px}}
.f-walkthrough{margin-top:12px}.f-walk-units{display:flex;flex-direction:column;gap:12px}.f-walk-unit{border:1px solid var(--line);border-inline-start:3px solid var(--forest);border-radius:10px;padding:13px 14px;animation:f-row-in .35s both}.f-walk-unit[hidden]{display:none}.f-walk-unit h4{color:var(--forest);margin-bottom:8px}.f-walk-unit p{font-size:13px;line-height:2.1}.f-walk-controls{display:flex;gap:8px;margin-top:12px}.f-walk-controls .button{min-height:40px;font-size:12px;padding:8px 12px}.f-walk-controls [hidden]{display:none}

/* Highlight ink reveals once on entry; the text itself remains readable throughout. */
.foundations-screen .f-highlight{--f-mark-fill:var(--f-phenotype);background-color:transparent!important;background-image:linear-gradient(var(--f-mark-fill),var(--f-mark-fill));background-repeat:no-repeat;background-position:right center;background-size:100% 100%;animation:f-marker-reveal 650ms var(--f-mark-delay,80ms) cubic-bezier(.22,1,.36,1) both}
.f-highlight[data-concept="genotype"]{--f-mark-fill:var(--f-genotype)}
.f-highlight[data-concept="allele"],.f-highlight[data-concept="gametes"]{--f-mark-fill:var(--f-allele)}
.f-highlight[data-concept="dominant"]{--f-mark-fill:var(--f-dominant)}
.f-highlight[data-concept="recessive"]{--f-mark-fill:var(--f-recessive)}
@keyframes f-marker-reveal{from{background-size:0% 100%}to{background-size:100% 100%}}
.f-picture{display:grid;place-items:center;width:100%;height:146px;color:var(--forest)}.f-picture>svg{height:130px;width:140px;max-width:100%}.f-picture .f-plant{height:132px;width:110px}.f-organism{overflow:visible}
.f-picture-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.f-picture-card{padding:14px 12px;border:1px solid var(--line);border-radius:12px;min-width:0;animation:f-row-in .5s both}
.f-picture-card:nth-child(2){--f-mark-delay:200ms;animation-delay:.1s}.f-picture-card:nth-child(3){--f-mark-delay:320ms;animation-delay:.2s}
.f-picture-card dl>div+div{border-top:1px solid var(--line);margin-top:12px;padding-top:12px}.f-picture-card dt{font-size:10px;color:var(--muted);margin:0 0 7px}.f-picture-card dd{margin:0;font-size:13px;line-height:2}.f-picture-card .f-gene{font-size:26px;color:var(--ink)}
.f-phenotype-intro{display:flex;align-items:center;gap:20px;border:1px solid var(--line);border-radius:12px;padding:18px}.f-phenotype-intro .f-picture{width:125px;flex-shrink:0}.f-phenotype-intro strong{display:block;font-size:18px;margin:10px 0}.f-phenotype-intro p{font-size:12px;line-height:2;color:var(--muted)}
.f-parent-sources{direction:ltr;display:grid;grid-template-columns:1fr 1fr;gap:16px}.f-parent-sources section{direction:rtl;border:1px solid var(--line);padding:16px;text-align:center;border-radius:12px}.f-parent-sources h3,.f-inherited-pair h3{font-size:12px;margin-bottom:12px}.f-parent-sources p,.f-inherited-pair p{font-size:12px;line-height:2;margin-top:8px}.f-parent-sources .f-gene{font-size:32px}.f-inherit-arrows{text-align:center;direction:ltr;font:30px/1.8 Arial,sans-serif;color:var(--muted)}
.f-inherited-pair{border:1px solid var(--line);border-radius:12px;padding:18px;text-align:center}.f-pair-tokens{display:flex;justify-content:center;gap:12px}.f-pair-tokens>div{display:flex;flex-direction:column;gap:9px}.f-inherited-token{font:400 36px/1.5 'Genetics Symbols',sans-serif;background:var(--sage);border:1px solid var(--line);border-radius:10px;width:60px}.f-pair-tokens small{font-size:10px;color:var(--muted)}
.f-picture-application{display:grid;grid-template-columns:140px 1fr;gap:20px;align-items:center;border:1px solid var(--line);border-radius:12px;padding:16px}.f-picture-application ol{padding-inline-start:21px}.f-picture-application li{padding:7px 0}.f-picture-application h3{font-size:12px;line-height:2}.f-picture-application p{font-size:13px;line-height:2}.f-picture-application .f-gene{font-size:27px;color:var(--ink)}
.f-picture-homework{display:flex;flex-direction:column;gap:15px}.f-homework-card{display:grid;grid-template-columns:130px 1fr;align-items:center;gap:18px;border:1px solid var(--line);border-radius:12px;padding:16px}.f-homework-fields h3{font-size:13px}.f-homework-fields>p{font-size:11px;color:var(--muted);line-height:2;margin:6px 0 11px}.f-homework-fields label{display:grid;grid-template-columns:105px 1fr;align-items:center;gap:10px;font-size:11px;margin-top:9px}.f-homework-fields input{width:100%;min-width:0;border:1px solid var(--line);border-radius:8px;background:var(--paper);color:var(--ink);padding:9px 10px;font-size:13px;outline-offset:3px}.f-homework-fields input:focus{outline:2px solid var(--forest)}
.f-exam-question>.f-picture{height:152px;margin:8px 0 15px;border:1px solid var(--line);border-radius:10px;background:var(--paper)}
@media(max-width:520px){.f-picture-grid{grid-template-columns:1fr}.f-picture-card{display:grid;grid-template-columns:96px 1fr;gap:12px;align-items:center;padding:12px}.f-picture-card>.f-picture{height:110px}.f-picture-card>.f-picture svg{height:105px;width:95px}.f-picture-card dt{font-size:10px}.f-picture-card dd{font-size:12px}.f-phenotype-intro{gap:12px;padding:12px}.f-phenotype-intro .f-picture{width:85px;height:120px}.f-phenotype-intro .f-picture>svg{width:85px;height:110px}.f-phenotype-intro strong{font-size:15px}.f-homework-card{grid-template-columns:1fr;gap:5px}.f-homework-card>.f-picture{height:120px}.f-homework-card>.f-picture svg{height:112px}.f-homework-fields label{grid-template-columns:95px 1fr}.f-picture-application{grid-template-columns:1fr;gap:0}.f-picture-application>.f-picture{height:115px}.f-picture-application>.f-picture svg{height:110px}.f-inherited-pair{padding:15px 10px}}
.f-paper-homework{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.f-paper-homework .f-homework-card{display:flex;flex-direction:column;gap:9px;padding:14px 10px;text-align:center}.f-paper-homework .f-homework-card h3{font-size:11px;color:var(--muted);font-weight:600}.f-paper-homework .f-picture{height:140px}.f-paper-homework .f-picture>svg{height:130px;max-width:100%}
@media(max-width:520px){.f-paper-homework{grid-template-columns:1fr}.f-paper-homework .f-homework-card{flex-direction:row;justify-content:flex-start;gap:20px;text-align:right}.f-paper-homework .f-picture{width:110px;height:120px;flex-shrink:0}.f-paper-homework .f-picture>svg{height:115px}}

.f-after-examples{font-size:13px;line-height:2;margin-top:14px;color:var(--ink)}
.f-allele-explainer{max-width:430px;margin:0 auto;padding:8px 0;border:0;border-radius:0;overflow:visible;text-align:center}
.f-allele-explainer>header{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;padding:0 12px 8px;border:0;background:transparent}.f-allele-explainer h3{font-size:12px;font-weight:650}.f-allele-explainer header .f-gene{font-size:32px;color:var(--ink)}
.f-factor-pair{display:flex;justify-content:center;align-items:flex-start;gap:20px;padding:22px 15px 20px}.f-factor{display:flex;flex-direction:column;align-items:center;gap:10px;direction:rtl;min-width:98px}.f-factor .f-allele{width:72px;height:76px;border-radius:13px;font-size:42px;background:var(--f-dominant);border:0;color:var(--ink);box-shadow:none}.f-factor .f-allele.is-recessive{background:var(--f-recessive);border:0;color:var(--ink);box-shadow:none}.f-factor strong{font-size:12px;font-weight:650}.f-factor small{font-size:10px;color:var(--muted);line-height:1.8}.f-factor-plus{font:300 25px/1 Arial,sans-serif;color:var(--muted);padding-top:24px}
.f-factor-summary{border:0;padding:9px 15px 4px;background:transparent}.f-factor-summary p{font-size:11px;line-height:1.9;color:var(--muted);margin-bottom:6px}.f-factor-summary strong{font-size:13px;line-height:2}.f-allele-explainer>.f-allele-label{margin:0;padding:9px 12px 5px;font-size:11px;line-height:1.9;border:0}
@media(max-width:360px){.f-factor-pair{gap:10px;padding-inline:10px}.f-factor{min-width:84px}.f-factor .f-allele{width:65px;height:69px;font-size:38px}}

.f-symbol-pairs{display:flex;flex-direction:column;gap:22px}.f-symbol-pair-row{animation:f-row-in .45s calc(var(--i)*90ms) both}.f-symbol-pair-row>h3{font-size:13px;margin-bottom:10px;line-height:1.9}.f-symbol-pair-options{display:grid;grid-template-columns:1fr 1fr;gap:12px}.f-symbol-pair-options>div{display:grid;grid-template-columns:1fr auto;align-items:center;gap:6px 12px;padding:12px 15px;background:var(--paper);border-radius:11px;box-shadow:inset 0 -2px 0 var(--line)}.f-symbol-kind{font-size:11px}.f-symbol-pair-options strong{font-size:13px;line-height:1.9;grid-column:1}.f-symbol-pair-options .f-gene{grid-column:2;grid-row:1/3;font-size:31px;color:var(--ink)}
@media(max-width:400px){.f-symbol-pair-options{gap:8px}.f-symbol-pair-options>div{padding:10px;gap:5px 8px}.f-symbol-pair-options strong{font-size:12px}.f-symbol-pair-options .f-gene{font-size:27px}}

.f-practice-cross[data-stage="0"] .flow-parent>.genotype,.f-practice-cross[data-stage="0"] .flow-child .genotype{font-family:inherit;font-size:12px;line-height:1.9;direction:rtl;white-space:normal;color:var(--ink)}
.f-practice-cross[data-stage="0"] .flow-gametes{flex-direction:column;gap:6px}.f-gamete-caption{display:flex;flex-direction:column;align-items:center;gap:5px;font-size:11px;line-height:1.8;color:var(--muted)}.f-gamete-caption svg{width:16px;height:25px}
.f-practice-cross[data-stage="0"] .flow-gamete-row{padding-block:12px}.f-practice-cross[data-stage="0"] .flow-parent-heading{font-size:12px}.f-practice-cross[data-stage="0"] .flow-sex{font-size:20px}.f-practice-cross[data-stage="0"] .flow-child{max-width:none}.f-practice-cross[data-stage="0"] .flow-offspring{padding-top:8px}
@media(prefers-reduced-motion:reduce){.foundations-screen *,.foundations-screen *:before,.foundations-screen *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.f-practice-cross[data-reveal="phenotype"] .flow-parent>.genotype{visibility:hidden}

.f-before-scene-text{font-size:14px;line-height:2.1;margin-top:14px}.f-after-scene-copy{margin-top:16px}

/* Keep symbol highlights compact and preserve the circular gamete outline. */
.f-practice-cross .flow-parent>.genotype.f-highlight{display:inline-block;width:max-content;max-width:100%;padding:1px 4px;margin-inline:auto;line-height:1.5}
.f-practice-cross .gamete-circle.f-highlight{border-radius:50%;padding:0;aspect-ratio:1;overflow:hidden}

.f-has-gamete-links{position:relative;padding-bottom:72px;align-items:start;isolation:isolate}
.f-has-gamete-links .flow-gametes{align-self:start;padding-top:10px}
.f-gamete-links{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:2}
.f-gamete-link{fill:none;stroke:#8b6ca7;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;opacity:0;stroke-dasharray:1;stroke-dashoffset:1;animation:f-distribution-arrow 1500ms calc(300ms + var(--i)*1800ms) both}
.f-gamete-link[data-mother="1"]{stroke:#608ca5}
@keyframes f-distribution-arrow{0%{opacity:0;stroke-dashoffset:1}12%{opacity:.9}68%{opacity:.9;stroke-dashoffset:0}86%{opacity:.9;stroke-dashoffset:0}100%{opacity:0;stroke-dashoffset:0}}
.f-practice-cross[data-distribution="sequential"] .flow-child{animation:f-distribution-result 380ms calc(1500ms + var(--f-result-index)*1800ms) both}
.f-practice-cross[data-distribution="sequential"] .offspring-separator{animation:f-distribution-result 250ms calc(1500ms + var(--f-result-index)*1800ms) both}
.f-practice-cross[data-distribution="sequential"] .cross-flow-summary{animation:f-distribution-result 450ms calc(300ms + var(--f-distribution-count)*1800ms) both}
@keyframes f-distribution-result{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.f-gamete-link{animation:none}}

.f-has-gamete-links .gamete-circle{animation:none}

/* The head is independent of SVG markers, so it cannot appear before the line reaches it. */
.f-gamete-arrowhead{fill:none;stroke:#8b6ca7;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;opacity:0;animation:f-distribution-head 1500ms calc(300ms + var(--i)*1800ms) both}
.f-gamete-arrowhead[data-mother="1"]{stroke:#608ca5}
@keyframes f-distribution-head{0%,67.99%{opacity:0}68%,86%{opacity:.9}100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.f-gamete-arrowhead{animation:none}}

.f-practice-cross .flow-parent-heading{font-size:13px;line-height:1.9}
.f-plant-note{border:0;border-radius:10px;background:var(--sage);padding:13px 15px;align-items:center;gap:11px}.f-plant-note>.icon{width:27px;height:27px;padding:5px;background:var(--paper);border-radius:8px;margin:0;color:var(--forest)}.f-plant-note p{font-size:12px;line-height:2}
.f-practice-cross .gamete-circle.f-highlight{background-position:center 52%;background-size:60% 58%;animation:f-gamete-underline .65s both}
@keyframes f-gamete-underline{from{background-size:0% 58%}to{background-size:60% 58%}}
.f-paper-questions{padding-inline-start:24px;display:flex;flex-direction:column;gap:18px}.f-paper-questions li{padding:12px 10px;font-size:13px;line-height:2.1}.f-paper-questions li::marker{color:var(--forest);font-weight:700}
.f-lecture-exam-red{background:#b74b4b;color:#fffaf5;border-color:#a33f3f}.f-lecture-exam-red:hover{background:#a94040}[data-theme="dark"] .f-lecture-exam-red{background:#8d4545;color:#fff2ed;border-color:#a86565}
@media(prefers-reduced-motion:reduce){.f-practice-cross .gamete-circle.f-highlight{animation:none}}

[data-theme="dark"] .f-plant-note{background:var(--sage)}

.f-highlight[data-concept="ratio"]{--f-mark-fill:var(--f-phenotype)}

.f-exam-cross-title{font-size:12px;line-height:1.9;margin-top:15px;color:var(--ink)}

/* Exam answers: a quiet surface with readable facts, comparisons and worked crosses. */
.f-exam-questions{display:flex;flex-direction:column;gap:16px}.f-exam-question{padding:20px;margin:0;border-radius:15px}.f-exam-question>h2{font-size:14px;line-height:2.1;gap:12px;margin-bottom:0;font-weight:650}.f-exam-question>h2>span{width:28px;height:28px;margin-top:3px;border-radius:9px;font-size:12px}
.f-model-answer{margin-top:18px;padding:17px 18px 18px;border:1px solid var(--line);border-inline-start:3px solid var(--forest);border-radius:12px;background:color-mix(in srgb,var(--cream) 65%,var(--paper))}
.f-model-answer>h3{display:flex;align-items:center;gap:9px;font-size:12px;font-weight:700;margin:0 0 15px;line-height:1.8}.f-answer-check{width:25px;height:25px;display:grid;place-items:center;border-radius:50%;background:var(--sage);color:var(--forest);flex-shrink:0}.f-answer-check .icon{width:14px;height:14px}
.f-model-answer>.f-answer-body{font-size:14px;line-height:2.1;color:var(--ink)}.f-answer-prose p{margin:0;line-height:2.15}.f-answer-prose p+p{margin-top:12px}.f-answer-prose bdi{display:inline-block;font-size:19px;line-height:1.5;vertical-align:baseline}.f-answer-reasoning{margin-bottom:16px}
.f-answer-facts{display:flex;flex-direction:column;gap:0;margin:0}.f-answer-facts>div{display:grid;grid-template-columns:145px minmax(0,1fr);align-items:center;gap:16px;padding:13px 0;border-bottom:1px solid var(--line)}.f-answer-facts>div:first-child{padding-top:0}.f-answer-facts>div:last-child{border-bottom:0;padding-bottom:0}.f-answer-facts dt{color:var(--muted);font-size:12px;line-height:1.9}.f-answer-facts dd{margin:0;font-size:15px;line-height:1.9;font-weight:600}.f-answer-facts dd bdi{font-size:28px;font-weight:400;line-height:1.5}
.f-answer-table-wrap{max-width:100%;overflow-x:auto;border:1px solid var(--line);border-radius:10px;background:var(--paper)}.f-answer-table-wrap table{width:100%;border-collapse:collapse;text-align:right;font-size:13px;line-height:1.9}.f-answer-table-wrap th{padding:11px 13px;font-size:11px;font-weight:700;color:var(--muted);border-bottom:1px solid var(--line);background:var(--cream)}.f-answer-table-wrap td{padding:12px 13px;border-bottom:1px solid var(--line)}.f-answer-table-wrap tr:last-child td{border-bottom:0}.f-answer-table-wrap td bdi{font-size:24px;font-weight:400;line-height:1.5}
.f-answer-crosses{display:flex;flex-direction:column;gap:22px}.f-answer-cross-stage{min-width:0}.f-answer-cross-stage .f-practice-cross>.cross-flow{margin:0;background:var(--paper)}.f-answer-cross-stage .f-exam-cross-title{margin:0 0 10px;font-size:13px;font-weight:700;color:var(--forest);line-height:1.9}.f-answer-cross-stage+.f-answer-cross-stage{padding-top:18px;border-top:1px solid var(--line)}
.f-answer-body .flow-parent-heading{font-size:13px;line-height:1.9}.f-answer-body .cross-flow-summary{padding:12px 14px;font-size:12px;line-height:2}.f-answer-body .cross-flow .genotype{font-weight:400}
.f-exam-after{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding-top:6px}.f-exam-after .button{font-size:12px;min-height:44px}
@media(max-width:520px){.f-exam-question{padding:15px}.f-exam-question>h2{font-size:13px;gap:9px}.f-model-answer{padding:14px 12px;border-radius:10px;margin-top:15px}.f-model-answer>.f-answer-body{font-size:13px}.f-answer-facts>div{grid-template-columns:106px minmax(0,1fr);gap:12px}.f-answer-facts dt{font-size:11px}.f-answer-facts dd{font-size:13px}.f-answer-facts dd bdi{font-size:25px}.f-answer-table-wrap th,.f-answer-table-wrap td{padding:10px 8px}.f-answer-table-wrap td{font-size:12px}.f-answer-table-wrap td bdi{font-size:22px}.f-answer-body .flow-parent-heading{font-size:11px}.f-answer-body .cross-flow-summary{font-size:11px}.f-exam-after .button{font-size:11px;padding-inline:8px}}

/* A slightly tighter cross, followed by compact phone layouts without scaling the page. */
.foundations-screen .cross-flow{max-width:650px;margin-inline:auto}
.foundations-screen .cross-flow .flow-grid{gap:10px 2px;padding:10px 9px 12px}
.foundations-screen .cross-flow .flow-parent-heading{font-size:12px}
.foundations-screen .cross-flow .flow-parent>.genotype{font-size:18px}
.foundations-screen .cross-flow .gamete-circle{width:32px;height:32px;font-size:15px}
.foundations-screen .cross-flow .flow-child .genotype{font-size:17px}
.foundations-screen .cross-flow .cross-stage{font-size:15px}
.foundations-screen .cross-flow-summary{font-size:11px;padding:9px 11px}
@media(max-width:600px){
 #question-text,#review-question,.f-step-question p,.f-example-question,.f-paper-questions p,.f-exam-question>h2{text-align:justify;text-align-last:right;word-break:normal;overflow-wrap:break-word}
 .foundations-screen .f-header{margin-bottom:9px;gap:8px}.foundations-screen .f-header h1{font-size:16px;line-height:1.7}
 .foundations-screen .f-step-track{margin-bottom:6px;gap:4px}.foundations-screen .f-step-track button{min-height:27px;padding-block:10px}
 .foundations-screen .f-lesson-card{padding:12px;border-radius:12px}.foundations-screen .f-lesson-card>h2{font-size:15px;line-height:1.8;margin-bottom:12px;padding-bottom:10px}
 .foundations-screen .f-lesson-copy,.foundations-screen .f-before-scene-text,.foundations-screen .f-step-question p{font-size:12px;line-height:1.95}
 .foundations-screen .f-lesson-copy>p{margin-bottom:8px}.foundations-screen .f-before-scene-text{margin-top:10px}
 .foundations-screen .f-step-question{padding:10px 11px;margin-bottom:12px;border-radius:8px}.foundations-screen .f-step-question h3{font-size:10px;margin-bottom:4px}
 .foundations-screen .f-note{padding:9px 10px;font-size:10.5px;line-height:1.85;margin-top:10px;gap:8px}.foundations-screen .f-note p{font-size:10.5px;line-height:1.85}.foundations-screen .f-plant-note>.icon{width:23px;height:23px;padding:4px}
 .foundations-screen .f-scene{margin-top:14px}.foundations-screen .f-after-scene-copy{margin-top:12px}
 .foundations-screen .cross-flow{border-radius:11px}.foundations-screen .cross-flow .flow-grid{grid-template-columns:26px minmax(0,1fr);gap:8px 1px;padding:9px 6px 10px}
 .foundations-screen .cross-flow .flow-parents,.foundations-screen .cross-flow .flow-gamete-row{grid-template-columns:minmax(0,1fr) 32px minmax(0,1fr)}
 .foundations-screen .cross-flow .flow-parent-heading{font-size:10.5px;line-height:1.75;gap:3px;min-height:32px;padding:0 2px 5px}
 .foundations-screen .cross-flow .flow-sex{font-size:15px;flex-shrink:0}.foundations-screen .cross-flow .flow-parent>.genotype{font-size:17px;line-height:1.5;margin-top:5px}
 .foundations-screen .cross-flow .cross-stage{font-size:13px}.foundations-screen .cross-flow .flow-times{font-size:26px}
 .foundations-screen .cross-flow .gamete-circle{width:29px;height:29px;font-size:14px}.foundations-screen .cross-flow .flow-gametes{gap:5px}
 .foundations-screen .cross-flow .flow-child{min-width:38px;min-height:30px;padding:5px 6px}.foundations-screen .cross-flow .flow-child .genotype{font-size:16px}.foundations-screen .cross-flow .offspring-separator{font-size:14px;padding-inline:3px}
 .foundations-screen .cross-flow .cross-flow-summary{font-size:10px;line-height:1.9;padding:9px}.foundations-screen .cross-flow .flow-axis>.flow-meiosis{font-size:8px;padding:4px 2px}
 .foundations-screen .f-practice-cross[data-stage="0"] .flow-parent>.genotype,.foundations-screen .f-practice-cross[data-stage="0"] .flow-child .genotype{font-size:10.5px}
 .foundations-screen .f-gamete-caption{font-size:10px}.foundations-screen .f-has-gamete-links{padding-bottom:61px}
 .foundations-screen .f-cross-key{padding:10px;margin-top:14px}.foundations-screen .f-cross-key>h3{font-size:11px;margin-bottom:8px}.foundations-screen .f-cross-key dt{font-size:10px;gap:5px}.foundations-screen .f-cross-key dt bdi{font-size:16px}.foundations-screen .f-cross-key dd,.foundations-screen .f-cross-key>p{font-size:9.5px;line-height:1.85}
 .foundations-screen .f-picture{height:96px}.foundations-screen .f-picture>svg{height:90px;width:94px}.foundations-screen .f-picture-card{grid-template-columns:76px minmax(0,1fr);padding:10px;gap:10px}.foundations-screen .f-picture-card>.f-picture{height:85px}.foundations-screen .f-picture-card>.f-picture svg{height:80px;width:75px}
 .foundations-screen .f-picture-card dt{font-size:9px;margin-bottom:4px}.foundations-screen .f-picture-card dd{font-size:11px;line-height:1.8}.foundations-screen .f-picture-card dl>div+div{margin-top:8px;padding-top:8px}.foundations-screen .f-picture-card .f-gene{font-size:21px}
 .foundations-screen .f-phenotype-intro{padding:10px;gap:10px}.foundations-screen .f-phenotype-intro .f-picture{width:70px;height:90px}.foundations-screen .f-phenotype-intro .f-picture>svg{width:70px;height:85px}.foundations-screen .f-phenotype-intro strong{font-size:13px;margin-block:7px}.foundations-screen .f-phenotype-intro p{font-size:10.5px;line-height:1.85}
 .foundations-screen .f-paper-homework .f-homework-card{padding:10px;gap:12px}.foundations-screen .f-paper-homework .f-picture{height:95px;width:86px}.foundations-screen .f-paper-homework .f-picture>svg{height:90px;width:85px}
 .foundations-screen .f-parent-sources{gap:10px}.foundations-screen .f-parent-sources section{padding:12px}.foundations-screen .f-parent-sources h3,.foundations-screen .f-inherited-pair h3{font-size:11px;margin-bottom:8px}.foundations-screen .f-parent-sources .f-gene{font-size:26px}.foundations-screen .f-parent-sources p,.foundations-screen .f-inherited-pair p{font-size:11px;line-height:1.9}.foundations-screen .f-inherit-arrows{font-size:24px}.foundations-screen .f-inherited-pair{padding:12px 9px}.foundations-screen .f-inherited-token{font-size:29px;width:48px}.foundations-screen .f-pair-tokens{gap:9px}
 .foundations-screen .f-allele-explainer{max-width:340px;padding-block:4px}.foundations-screen .f-allele-explainer header .f-gene{font-size:26px}.foundations-screen .f-factor-pair{padding:16px 10px 12px;gap:14px}.foundations-screen .f-factor{min-width:80px;gap:8px}.foundations-screen .f-factor .f-allele{width:57px;height:61px;font-size:34px}.foundations-screen .f-factor-plus{font-size:21px;padding-top:20px}.foundations-screen .f-factor strong,.foundations-screen .f-factor-summary strong{font-size:11px}.foundations-screen .f-factor small{font-size:9px}.foundations-screen .f-allele-label{font-size:10px}
 .foundations-screen .f-traits{gap:7px}.foundations-screen .f-trait{padding:10px 4px;gap:8px}.foundations-screen .f-trait .f-gene{font-size:22px}.foundations-screen .f-trait strong{font-size:10px}.foundations-screen .f-trait>span{font-size:9px}
 .foundations-screen .f-worked-examples{margin-top:17px;padding-top:13px}.foundations-screen .f-worked-examples>h3{font-size:12px;margin-bottom:9px}.foundations-screen .f-worked-examples th{font-size:9px;padding:8px 5px}.foundations-screen .f-worked-examples td{font-size:10px;padding:8px 5px}.foundations-screen .f-worked-examples td bdi{font-size:16px}
 .foundations-screen .f-example-question,.foundations-screen .f-example-answer,.foundations-screen .f-walk-unit p{font-size:12px;line-height:1.95}.foundations-screen .f-walk-unit{padding:10px 11px}.foundations-screen .f-walk-unit h4{font-size:11px}.foundations-screen .f-evidence,.foundations-screen .f-conclusion,.foundations-screen .f-inference-result{padding:10px 12px}.foundations-screen .f-evidence p,.foundations-screen .f-conclusion p{font-size:12px;line-height:1.95}.foundations-screen .f-inference-genes .f-gene{font-size:22px}.foundations-screen .f-rule{padding-block:10px;gap:9px}.foundations-screen .f-rule strong{font-size:11px}.foundations-screen .f-rule p{font-size:10.5px}
 .foundations-screen .f-symbol-pair-options>div{padding:10px;gap:5px 8px}.foundations-screen .f-symbol-pair-options strong{font-size:11px}.foundations-screen .f-symbol-pair-options .f-gene{font-size:25px}.foundations-screen .f-symbol-pair-row>h3{font-size:12px}
 .foundations-screen .f-paper-questions{gap:11px;padding-inline-start:20px}.foundations-screen .f-paper-questions li{font-size:12px;line-height:1.95;padding:9px 5px}
 .foundations-screen .f-exam-questions{gap:12px}.foundations-screen .f-exam-question{padding:12px}.foundations-screen .f-exam-question>h2{font-size:12px;line-height:1.95;gap:8px}.foundations-screen .f-exam-question>h2>span{width:24px;height:24px;font-size:11px}.foundations-screen .f-exam-question>.f-picture{height:105px;margin-block:9px 11px}
 .foundations-screen .f-model-answer{padding:12px 10px;margin-top:12px}.foundations-screen .f-model-answer>h3{font-size:11px;margin-bottom:11px}.foundations-screen .f-model-answer>.f-answer-body{font-size:12px;line-height:1.95}.foundations-screen .f-answer-prose p{line-height:1.95}.foundations-screen .f-answer-prose bdi{font-size:17px}.foundations-screen .f-answer-facts>div{padding-block:10px;gap:10px;grid-template-columns:94px minmax(0,1fr)}.foundations-screen .f-answer-facts dt{font-size:10px}.foundations-screen .f-answer-facts dd{font-size:12px}.foundations-screen .f-answer-facts dd bdi{font-size:22px}.foundations-screen .f-answer-table-wrap th{font-size:10px;padding:8px 6px}.foundations-screen .f-answer-table-wrap td{font-size:11px;padding:9px 6px}.foundations-screen .f-answer-table-wrap td bdi{font-size:19px}
 .foundations-screen .f-lesson-nav{gap:8px;padding-top:9px}.foundations-screen .f-lesson-nav .button{font-size:11px;min-height:42px;padding:8px 10px}
}

.f-coding-guide{display:grid;gap:14px;margin-block:18px}.f-coding-guide>section{padding-block:0 12px;border-bottom:1px solid var(--line)}.f-coding-guide>section:last-child{border:0;padding-bottom:0}.f-coding-guide h3{font-size:13px;color:var(--forest);margin:0 0 6px}.f-coding-guide p{margin:5px 0}.f-lesson-copy>.f-step-question{margin-block:16px}@media(max-width:600px){.f-coding-guide{gap:11px}.f-coding-guide h3{font-size:12px}}

.f-scene[data-scene="empty"]{display:none}

.f-lesson-copy,.f-before-scene-text,.f-after-examples,.f-note p{ text-align:justify;text-align-last:right;word-break:normal;overflow-wrap:break-word }.f-lesson-solution{margin-block:18px;font-size:13px;line-height:2.1}.f-lesson-solution p{margin:8px 0}@media(max-width:600px){.foundations-screen .f-lesson-solution{font-size:12px}}

.f-coding-solved{padding-block:0 18px;margin-bottom:18px;border-bottom:1px solid var(--line)}.f-coding-solved:last-child{border:0;margin-bottom:0;padding-bottom:0}.f-coding-solved h3,.f-coding-solved h4{font-size:inherit;margin:8px 0;color:var(--forest)}.f-coding-solved .f-example-question{text-align:justify;text-align-last:right;margin-bottom:12px}

.f-lesson-card>h2 .f-title-grade{display:inline-block;font-size:11px;font-weight:600;color:#b84444;vertical-align:middle;margin-inline-start:5px;line-height:1.8}html[data-theme="dark"] .f-lesson-card>h2 .f-title-grade,body.dark-mode .f-lesson-card>h2 .f-title-grade{color:#f08c8c}@media(max-width:600px){.foundations-screen .f-lesson-card>h2 .f-title-grade{font-size:10px}}

.f-worked-examples:has([data-restart="true"])>h3{display:none}.f-walkthrough[data-restart="true"] [data-f-walk-next]{background:#327bb6;border-color:#286a9e;color:#fff;box-shadow:0 3px 0 #245b85}.f-walkthrough[data-restart="true"] [data-f-walk-next]:hover{background:#286a9e}

.f-ministerial-grade{display:inline-block;color:#b84444;font-size:10px;font-weight:600;line-height:1.8;margin-inline-start:5px}[data-theme="dark"] .f-ministerial-grade{color:#f08c8c}

.foundations-screen .f-solution-phrase{font-weight:650}

/* Compact exam rhythm, shared by all six lectures. */
#foundation-exam-screen>.f-header,#foundation-exam-screen>.f-exam-scroll,#foundation-exam-screen>.f-exam-footer{width:100%;max-width:760px;align-self:center;box-sizing:border-box}
#foundation-exam-screen .f-exam-questions{gap:10px}
#foundation-exam-screen .f-exam-question{padding:13px 15px;border-radius:12px}
#foundation-exam-screen .f-exam-question>h2{font-size:13px;line-height:1.9;gap:9px}
#foundation-exam-screen .f-exam-question>h2>span{width:24px;height:24px;font-size:11px;margin-top:1px;border-radius:7px}
#foundation-exam-screen .f-model-answer{margin-top:10px;padding:10px 12px;border-radius:9px;border-inline-start-width:2px}
#foundation-exam-screen .f-model-answer>h3{margin:0 0 6px;gap:6px;font-size:11px;line-height:1.6}
#foundation-exam-screen .f-answer-check{width:20px;height:20px}
#foundation-exam-screen .f-answer-check .icon{width:12px;height:12px}
#foundation-exam-screen .f-model-answer>.f-answer-body{font-size:13px;line-height:1.85}
#foundation-exam-screen .f-answer-prose p{line-height:1.85;margin:0}
#foundation-exam-screen .f-answer-prose p+p{margin-top:4px}
#foundation-exam-screen .f-answer-prose bdi{font-size:17px;line-height:1.35}
#foundation-exam-screen .f-answer-reasoning{margin-bottom:10px}
#foundation-exam-screen .f-answer-facts>div{padding-block:8px;gap:10px}
#foundation-exam-screen .f-answer-facts dd{font-size:13px;line-height:1.8}
#foundation-exam-screen .f-answer-facts dd bdi{font-size:23px}
#foundation-exam-screen .f-answer-crosses{gap:12px}
#foundation-exam-screen .f-answer-cross-stage+.f-answer-cross-stage{padding-top:10px}
#foundation-exam-screen .f-answer-cross-stage .f-exam-cross-title{margin-bottom:6px}
#foundation-exam-screen .f-answer-body .cross-flow-summary{padding:8px 10px;line-height:1.85}
#foundation-exam-screen .f-exam-question>.f-picture{height:110px;margin:8px 0}
@media(max-width:600px){
 #foundation-exam-screen .f-exam-questions{gap:9px}
 #foundation-exam-screen .f-exam-question{padding:10px 11px}
 #foundation-exam-screen .f-exam-question>h2{font-size:12px;gap:7px}
 #foundation-exam-screen .f-model-answer{padding:9px;margin-top:8px}
 #foundation-exam-screen .f-model-answer>.f-answer-body{font-size:12px}
 #foundation-exam-screen .f-answer-prose bdi{font-size:16px}
 #foundation-exam-screen .f-answer-facts>div{padding-block:7px;grid-template-columns:90px minmax(0,1fr)}
 #foundation-exam-screen .f-answer-facts dd{font-size:12px}
 #foundation-exam-screen .f-exam-question>.f-picture{height:90px}
}

.f-lesson-example .f-step-question .f-example-question{padding:0;font-size:14px;line-height:2.1}.f-lesson-example .f-example-note{margin-block:0 12px}.f-lesson-example+.f-lesson-example{margin-top:24px;padding-top:20px;border-top:1px solid var(--line)}@media(max-width:600px){.foundations-screen .f-lesson-example .f-step-question .f-example-question{font-size:12px;line-height:1.95}.f-lesson-example+.f-lesson-example{margin-top:18px;padding-top:16px}}

#foundation-exams-screen{justify-content:flex-start;padding-top:clamp(12px,4vh,32px);box-sizing:border-box}
#foundation-exams-screen .f-menu-content{max-width:540px;width:100%}
#foundation-exams-screen .f-header{margin-bottom:13px}
#foundation-exams-screen .f-exam-choices{display:flex;flex-direction:column;gap:9px}
#foundation-exams-screen .f-exam-choice{--topic-accent:#b34f4f;display:grid;grid-template-columns:32px minmax(0,1fr) 18px;min-height:60px;padding:11px 14px;gap:12px;border-radius:12px;background:var(--paper);border-color:var(--line)}
#foundation-exams-screen .f-lecture-number{width:32px;height:32px;border-radius:9px;background:color-mix(in srgb,#b34f4f 7%,var(--paper));border-color:color-mix(in srgb,#b34f4f 26%,var(--line));color:#ad4c4c;font-size:12px}
#foundation-exams-screen .f-lecture-info>strong{font-size:13px;line-height:1.8}
#foundation-exams-screen .f-lecture-end{display:flex;align-items:center;justify-content:center;color:var(--muted)}
#foundation-exams-screen .f-exam-choice:hover{border-color:#bc8580;box-shadow:0 2px 7px #1c354008}
[data-theme="dark"] #foundation-exams-screen .f-lecture-number{color:#efa6a1}
@media(max-width:600px){#foundation-exams-screen{padding-top:12px}#foundation-exams-screen .f-exam-choice{min-height:56px;padding:10px 12px;gap:10px}#foundation-exams-screen .f-lecture-info>strong{font-size:12px}}

.f-picture>img{display:block;width:100%;height:100%;max-height:130px;object-fit:contain}
.f-supplied-picture{background:#fff;border-radius:9px;overflow:hidden}
.f-exam-pictures{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-block:12px}
#foundation-exam-screen .f-exam-pictures>.f-picture{height:160px;padding:8px;box-sizing:border-box;border:1px solid var(--line)}
@media(max-width:600px){.foundations-screen .f-picture>img{max-height:90px}#foundation-exam-screen .f-exam-pictures>.f-picture{height:125px}#foundation-exam-screen .f-exam-pictures img{max-height:110px}}

/* Lecture two: definition, factor diagram, then compact examples. */
#foundation-lesson-screen[data-lecture="2"] .f-lesson-card{padding:18px 20px}
#foundation-lesson-screen[data-lecture="2"] .f-worked-examples{margin-top:16px;padding-top:14px}
#foundation-lesson-screen[data-lecture="2"] .f-worked-examples th,#foundation-lesson-screen[data-lecture="2"] .f-worked-examples td{padding:9px 12px;line-height:1.85}
#foundation-lesson-screen[data-lecture="2"] .f-after-examples{margin-top:13px;font-size:12px;color:var(--forest)}
.f-trait-explanation{display:grid;grid-template-columns:minmax(0,1fr) minmax(230px,.9fr);column-gap:24px;align-items:start}
.f-trait-explanation>h2{grid-column:1/-1;margin-bottom:14px}
.f-trait-explanation>.f-lesson-copy{grid-column:1;grid-row:2;font-size:13px;line-height:2}
.f-trait-explanation>.f-scene{grid-column:2;grid-row:2;margin:0;padding:0;border:0;min-height:0}
.f-trait-explanation>.f-worked-examples,.f-trait-explanation>.f-note{grid-column:1/-1}
.f-trait-explanation .f-allele-explainer>header{flex-direction:row;gap:12px;padding-bottom:0}
.f-trait-explanation .f-allele-explainer header .f-gene{font-size:25px}
.f-trait-explanation .f-factor-pair{padding:12px 0 8px;gap:12px}
.f-trait-explanation .f-factor{min-width:70px;gap:6px}
.f-trait-explanation .f-factor .f-allele{width:55px;height:58px;font-size:33px}
.f-trait-explanation .f-factor-plus{font-size:20px;padding-top:18px}
.f-trait-explanation .f-factor-summary{padding-top:5px}
.f-trait-explanation .f-allele-label{font-size:10px}
.f-trait-explanation .f-worked-examples th:last-child,.f-trait-explanation .f-worked-examples td:last-child{display:none}
.f-trait-explanation .f-worked-examples tbody td:first-child{width:65%}
@media(max-width:600px){
 #foundation-lesson-screen[data-lecture="2"] .f-lesson-card{padding:13px}
 .f-trait-explanation{display:block}
 .f-trait-explanation>.f-lesson-copy{font-size:12px}
 .f-trait-explanation>.f-scene{margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}
 .f-trait-explanation .f-allele-explainer{max-width:280px}
 #foundation-lesson-screen[data-lecture="2"] .f-worked-examples th,#foundation-lesson-screen[data-lecture="2"] .f-worked-examples td{padding:8px 7px}
 #foundation-lesson-screen[data-lecture="2"] .f-worked-examples{margin-top:13px;padding-top:12px}
}

.f-clean-traits .f-definition-stack{display:grid;gap:16px}.f-definition-stack>section+section{padding-top:14px;border-top:1px solid var(--line)}
.f-definition-stack h3,.f-clean-examples>h3{font-size:13px;color:var(--forest);margin:0 0 7px;font-weight:700}.f-definition-stack p{margin:0}
.f-clean-traits>.f-scene{margin-top:18px}.f-clean-traits>.f-lesson-copy{line-height:2}
.f-trait-example-list{display:grid;gap:8px}.f-trait-example-list>article{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:11px 13px;background:var(--cream);border-radius:9px;font-size:13px;line-height:1.8}
.f-trait-code{font:400 24px/1.2 'Genetics Symbols',Arial,sans-serif;color:var(--forest);flex-shrink:0;letter-spacing:.04em}
.f-trait-contrasts{display:grid;gap:12px}.f-trait-contrasts>article{border-bottom:1px solid var(--line);padding-bottom:12px}.f-trait-contrasts>article:last-child{border:0;padding-bottom:0}.f-trait-contrasts h4{font-size:12px;margin:0 0 8px;color:var(--muted);font-weight:600}
.f-contrast-pair{display:grid;grid-template-columns:1fr 1fr;gap:10px}.f-contrast-pair>section{display:grid;grid-template-columns:1fr auto;align-items:center;gap:3px 10px;background:var(--cream);padding:10px 12px;border-radius:9px}.f-contrast-pair small{grid-column:1;font-size:10px;color:var(--muted)}.f-contrast-pair span{font-size:13px;grid-column:1}.f-contrast-pair .f-trait-code{grid-column:2;grid-row:1/3}.f-contrast-pair>section:last-child .f-trait-code{color:#a55f74}
.f-factor-comparison{display:grid;grid-template-columns:1fr 1fr;gap:14px}.f-factor-comparison>section{padding:18px;background:var(--cream);border:1px solid var(--line);border-radius:12px}.f-factor-comparison h3{font-size:14px;margin:0 0 12px}.f-factor-comparison p{font-size:12px;line-height:2;margin:0}.f-comparison-codes{display:flex;gap:14px;align-items:center;justify-content:center;direction:ltr;margin:17px 0}.f-comparison-codes .f-gene{font-size:34px;padding:9px 14px;background:var(--paper);border-radius:8px;color:var(--ink)}
.f-clean-traits .f-symbol-pair-row{padding:12px 0}.f-clean-traits .f-symbol-pair-options>div{padding:10px}.f-clean-traits .f-symbol-kind .f-highlight{background:none;animation:none;padding:0}
@media(max-width:600px){.f-definition-stack h3,.f-clean-examples>h3{font-size:12px}.f-clean-traits .f-definition-stack{gap:12px}.f-definition-stack>section+section{padding-top:11px}.f-trait-example-list>article{font-size:12px;padding:9px 11px}.f-trait-code{font-size:22px}.f-contrast-pair{gap:7px}.f-contrast-pair>section{padding:9px;gap:4px 6px}.f-contrast-pair span{font-size:11px}.f-contrast-pair .f-trait-code{font-size:21px}.f-factor-comparison{grid-template-columns:1fr;gap:10px}.f-factor-comparison>section{padding:13px}.f-comparison-codes{margin:12px 0}.f-comparison-codes .f-gene{font-size:29px}.f-factor-comparison h3{font-size:13px}}

/* A single comparison surface for upper- and lower-case symbols. */
.f-clean-traits .f-symbol-pairs{gap:0;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.f-clean-traits .f-symbol-pair-row{display:grid;grid-template-columns:minmax(125px,.8fr) minmax(0,2fr);align-items:center;gap:14px;padding:13px 15px;background:var(--paper)}
.f-clean-traits .f-symbol-pair-row+.f-symbol-pair-row{border-top:1px solid var(--line)}
.f-clean-traits .f-symbol-pair-row>h3{margin:0;font-size:12px;line-height:1.9;color:var(--ink)}
.f-clean-traits .f-symbol-pair-options{gap:0;align-items:stretch}
.f-clean-traits .f-symbol-pair-options>div{grid-template-columns:44px minmax(0,1fr);gap:2px 10px;box-shadow:none;border-radius:0;padding:2px 12px;background:transparent}
.f-clean-traits .f-symbol-pair-options>div+div{border-inline-start:1px solid var(--line)}
.f-clean-traits .f-symbol-pair-options .f-gene{grid-column:1;grid-row:1/3;display:grid;place-items:center;width:42px;height:48px;border-radius:8px;background:var(--sage);color:var(--forest);font-size:29px}
.f-clean-traits .f-symbol-pair-options>div:last-child .f-gene{background:color-mix(in srgb,var(--f-recessive) 65%,var(--paper));color:var(--ink)}
.f-clean-traits .f-symbol-kind{grid-column:2;grid-row:1;color:var(--muted);font-size:10px;line-height:1.7}
.f-clean-traits .f-symbol-pair-options strong{grid-column:2;grid-row:2;font-size:12px;line-height:1.8;font-weight:650}
.f-clean-traits:has(.f-symbol-pairs) .f-worked-examples{border-top:0;padding-top:0;margin-top:21px}
.f-clean-traits:has(.f-symbol-pairs) .f-example-table-wrap{border:1px solid var(--line);border-radius:10px;overflow:hidden}
.f-clean-traits:has(.f-symbol-pairs) .f-worked-examples th{background:var(--cream);font-size:11px}
.f-clean-traits:has(.f-symbol-pairs) .f-worked-examples td{font-size:12px}
.f-clean-traits:has(.f-symbol-pairs) .f-worked-examples td bdi{font-size:20px}
@media(max-width:600px){
 .f-clean-traits .f-symbol-pair-row{grid-template-columns:1fr;gap:9px;padding:11px 12px}
 .f-clean-traits .f-symbol-pair-row>h3{font-size:11px;color:var(--muted)}
 .f-clean-traits .f-symbol-pair-options>div{grid-template-columns:35px minmax(0,1fr);gap:1px 8px;padding:1px 8px}
 .f-clean-traits .f-symbol-pair-options>div:first-child{padding-inline-start:0}
 .f-clean-traits .f-symbol-pair-options .f-gene{width:34px;height:42px;font-size:25px}
 .f-clean-traits .f-symbol-pair-options strong{font-size:11px}
 .f-clean-traits:has(.f-symbol-pairs) .f-worked-examples th{font-size:10px;padding:8px 5px}
 .f-clean-traits:has(.f-symbol-pairs) .f-worked-examples td{font-size:10.5px;padding:9px 5px}
 .f-clean-traits:has(.f-symbol-pairs) .f-worked-examples td bdi{font-size:18px}
}

.f-important-factors h3{margin-block:8px;font-size:13px;line-height:2}.f-important-factors .f-comparison-codes{margin-bottom:0}.f-important-factors .f-comparison-codes .f-gene{font-size:28px}@media(max-width:600px){.f-important-factors h3{font-size:12px}.f-important-factors .f-comparison-codes .f-gene{font-size:25px}}

.f-table-phenotype{display:block;font-size:11px;line-height:1.8;margin-top:5px;color:var(--ink);font-weight:400}.f-example-table-wrap td:has(.f-table-phenotype){text-align:center;vertical-align:middle}@media(max-width:600px){.f-table-phenotype{font-size:10px;line-height:1.7;margin-top:4px}}

#foundation-exam-screen[data-lecture="5"] .f-practice-cross>.cross-flow,#foundation-lesson-screen[data-lecture="5"] .f-practice-cross>.cross-flow{margin-inline:auto;width:100%;box-sizing:border-box}

.home-actions #foundations-btn{background:#faf4e5;border-color:#e7d8b4;color:#876623;box-shadow:0 3px 0 #e3d4af}
.home-actions #foundations-btn:hover{background:#f5ecd7;border-color:#d7be87}
[data-theme="dark"] .home-actions #foundations-btn{background:#39342a;border-color:#64583c;color:#e3c688;box-shadow:0 3px 0 #28251f}
[data-theme="dark"] .home-actions #foundations-btn:hover{background:#433b2d;border-color:#8a7347}

.home-actions #exam-start-btn{background:#eaf1f9;border-color:#cad9ed;color:#365e8b;box-shadow:0 3px 0 #c6d5e9}
.home-actions #exam-start-btn:hover{background:#e0ebf7;border-color:#aac4e2}
[data-theme="dark"] .home-actions #exam-start-btn{background:#293646;border-color:#455d78;color:#b6d1f0;box-shadow:0 3px 0 #1d2734}
[data-theme="dark"] .home-actions #exam-start-btn:hover{background:#32445a;border-color:#6384a6}

[data-theme="dark"] .home-actions :is(#foundations-btn,#exam-start-btn,#saved-btn){background:#444340;border-color:#5b5955;color:#e9e3da;box-shadow:0 3px 0 #2e2d2b}
[data-theme="dark"] .home-actions :is(#foundations-btn,#exam-start-btn,#saved-btn):hover{background:#4b4a46;border-color:#727069}
[data-theme="dark"] .home-actions #foundations-btn>.icon:first-child{color:#cfbd99}
[data-theme="dark"] .home-actions #exam-start-btn>.icon:first-child{color:#b6c7d5}
[data-theme="dark"] .home-actions #saved-btn>.icon:first-child{color:#c9bed7}
[data-theme="dark"] .home-actions :is(#foundations-btn,#exam-start-btn)>.arrow{color:#bdb7ac}
[data-theme="dark"] .home-actions #saved-btn .count{background:#55534e;color:#ded8cd}

/* Solid home actions retain their identity in both colour modes. */
:root .home-actions #foundations-btn{--action-fill:#97671d;--action-shadow:#755019}
:root .home-actions #exam-start-btn{--action-fill:#356fa8;--action-shadow:#285681}
:root .home-actions #saved-btn{--action-fill:#7952a5;--action-shadow:#5c3e7e}
:root .home-actions :is(#foundations-btn,#exam-start-btn,#saved-btn),:root[data-theme="dark"] .home-actions :is(#foundations-btn,#exam-start-btn,#saved-btn){background:var(--action-fill);border-color:var(--action-fill);color:#fff;box-shadow:0 3px 0 var(--action-shadow)}
:root .home-actions :is(#foundations-btn,#exam-start-btn,#saved-btn):hover,:root[data-theme="dark"] .home-actions :is(#foundations-btn,#exam-start-btn,#saved-btn):hover{background:color-mix(in srgb,var(--action-fill) 91%,#000);border-color:var(--action-fill)}
:root[data-theme] .home-actions :is(#foundations-btn,#exam-start-btn,#saved-btn)>.icon:first-child,:root[data-theme] .home-actions :is(#foundations-btn,#exam-start-btn,#saved-btn)>.arrow{color:#fff}
:root .home-actions #saved-btn .count,:root[data-theme="dark"] .home-actions #saved-btn .count{background:#ffffff24;color:#fff}

:root .home-actions #foundations-btn{--action-fill:#527b7b;--action-shadow:#3f6262}
:root .home-actions #exam-start-btn{--action-fill:#5b7897;--action-shadow:#465e77}
:root .home-actions #saved-btn{--action-fill:#847297;--action-shadow:#685a79}

/* Pastel home actions, with dark labels in either theme. */
:root .home-actions #foundations-btn{--action-fill:#e0eee7;--action-shadow:#b8d0c2;--action-ink:#335e4b;--action-border:#c2d9cc}
:root .home-actions #exam-start-btn{--action-fill:#e2ecf8;--action-shadow:#becee3;--action-ink:#3d5d85;--action-border:#c9d9ed}
:root .home-actions #saved-btn{--action-fill:#eee5f6;--action-shadow:#d0c0e0;--action-ink:#6b4e86;--action-border:#dccde9}
:root .home-actions :is(#foundations-btn,#exam-start-btn,#saved-btn),:root[data-theme="dark"] .home-actions :is(#foundations-btn,#exam-start-btn,#saved-btn){color:var(--action-ink);border-color:var(--action-border)}
:root .home-actions :is(#foundations-btn,#exam-start-btn,#saved-btn):hover,:root[data-theme="dark"] .home-actions :is(#foundations-btn,#exam-start-btn,#saved-btn):hover{background:color-mix(in srgb,var(--action-fill) 95%,var(--action-ink));border-color:var(--action-shadow)}
:root[data-theme] .home-actions :is(#foundations-btn,#exam-start-btn,#saved-btn)>.icon:first-child,:root[data-theme] .home-actions :is(#foundations-btn,#exam-start-btn,#saved-btn)>.arrow{color:var(--action-ink)}
:root .home-actions #saved-btn .count,:root[data-theme="dark"] .home-actions #saved-btn .count{background:#ffffff80;color:var(--action-ink)}

/* Off-white actions differentiated by text and icons. */
:root .home-actions #foundations-btn{--action-fill:#fffdf7;--action-shadow:#ddd9ce;--action-ink:#5f7868;--action-border:#dddcd3}
:root .home-actions #exam-start-btn{--action-fill:#fffdf7;--action-shadow:#ddd9ce;--action-ink:#536f94;--action-border:#dddcd3}
:root .home-actions #saved-btn{--action-fill:#fffdf7;--action-shadow:#ddd9ce;--action-ink:#83689b;--action-border:#dddcd3}

/* Distinct hues with the same visual weight as the green practice action. */
:root .home-actions #foundations-btn{--action-fill:#267fa1;--action-shadow:#1e637e;--action-ink:#fff;--action-border:#267fa1}
:root .home-actions #exam-start-btn{--action-fill:#ad5c63;--action-shadow:#88484e;--action-ink:#fff;--action-border:#ad5c63}
:root .home-actions #saved-btn{--action-fill:#8060a8;--action-shadow:#634a83;--action-ink:#fff;--action-border:#8060a8}
:root .home-actions #saved-btn .count,:root[data-theme="dark"] .home-actions #saved-btn .count{background:#ffffff24;color:#fff}

:root .home-actions #foundations-btn{--action-fill:#7256a3;--action-shadow:#58427f;--action-ink:#fff;--action-border:#7256a3}
:root .home-actions #exam-start-btn{--action-fill:#386fa4;--action-shadow:#2b5680;--action-ink:#fff;--action-border:#386fa4}
:root .home-actions #saved-btn{--action-fill:#a45d78;--action-shadow:#80485d;--action-ink:#fff;--action-border:#a45d78}

/* Home actions use the app's paper surface and logo accents. */
:root .home-actions #foundations-btn{--action-accent:#3b7863;--action-soft:#e6f0e9}
:root .home-actions #exam-start-btn{--action-accent:#9a7932;--action-soft:#f7f0dc}
:root .home-actions #saved-btn{--action-accent:#8162a8;--action-soft:#eee7f5}
:root .home-actions :is(#foundations-btn,#exam-start-btn,#saved-btn),:root[data-theme="dark"] .home-actions :is(#foundations-btn,#exam-start-btn,#saved-btn){background:#fffefa;color:var(--ink);border:1px solid var(--line);border-inline-start:3px solid var(--action-accent);box-shadow:0 3px 0 #dce5df;gap:12px}
:root .home-actions :is(#foundations-btn,#exam-start-btn,#saved-btn):hover,:root[data-theme="dark"] .home-actions :is(#foundations-btn,#exam-start-btn,#saved-btn):hover{background:color-mix(in srgb,var(--action-soft) 45%,var(--paper));border-color:var(--line);border-inline-start-color:var(--action-accent)}
:root[data-theme] .home-actions :is(#foundations-btn,#exam-start-btn,#saved-btn)>.icon:first-child{width:29px;height:29px;padding:5px;box-sizing:border-box;flex-shrink:0;border-radius:8px;background:var(--action-soft);color:var(--action-accent)}
:root[data-theme] .home-actions :is(#foundations-btn,#exam-start-btn,#saved-btn)>.arrow{color:var(--action-accent)}
:root .home-actions #saved-btn .count,:root[data-theme="dark"] .home-actions #saved-btn .count{background:var(--action-soft);color:var(--action-accent)}
:root[data-theme="dark"] .home-actions #foundations-btn{--action-accent:#9ec4ad;--action-soft:#414d44}
:root[data-theme="dark"] .home-actions #exam-start-btn{--action-accent:#d2bd80;--action-soft:#504a3b}
:root[data-theme="dark"] .home-actions #saved-btn{--action-accent:#c1a9dc;--action-soft:#4b4356}
:root[data-theme="dark"] .home-actions :is(#foundations-btn,#exam-start-btn,#saved-btn){background:var(--paper);color:var(--ink);box-shadow:0 3px 0 #2d2c2a}

/* Clear icon and counter contrast on dark home surfaces. */
:root[data-theme="dark"] .home-actions #foundations-btn{--action-accent:#bde5ce;--action-soft:#334b3e}
:root[data-theme="dark"] .home-actions #exam-start-btn{--action-accent:#f0d79b;--action-soft:#4d422e}
:root[data-theme="dark"] .home-actions #saved-btn{--action-accent:#e0cdf5;--action-soft:#493b58}
:root[data-theme="dark"] .home-actions :is(#foundations-btn,#exam-start-btn,#saved-btn)>.icon:first-child{width:31px;height:31px;padding:5px;color:var(--action-accent);stroke-width:2}
:root[data-theme="dark"] .home-actions :is(#foundations-btn,#exam-start-btn)>.arrow{color:var(--action-accent);width:21px;height:21px;opacity:1;stroke-width:2.2}
:root[data-theme="dark"] .home-actions #saved-btn .count{display:grid;place-items:center;min-width:28px;min-height:24px;padding:0 7px;background:#5c496e;color:#fff7ff;font-size:12px;font-weight:800;line-height:1.4;border:1px solid #877295}

/* Match the practice leaf to the other home icon tiles. */
.home-actions #start-btn>.icon:first-child{width:29px;height:29px;padding:5px;box-sizing:border-box;flex-shrink:0;border-radius:8px;background:#ffffff24;color:#fff}
:root[data-theme="dark"] .home-actions #start-btn>.icon:first-child{width:31px;height:31px;padding:5px;background:#ffffff24;color:#fff;stroke-width:2}

/* Neutral topic cards follow the same paper surfaces as the home actions. */
#topics-screen{justify-content:flex-start;padding-top:clamp(12px,4vh,30px);box-sizing:border-box}
#topics-screen .menu-content{max-width:640px}
#topics-screen .topics-grid{gap:10px}
#topics-screen .topic-card{background:var(--paper);border:1px solid var(--line);border-inline-start:3px solid var(--topic-accent);border-bottom:2px solid var(--line);border-radius:12px;min-height:72px;padding:12px 14px;box-shadow:none}
#topics-screen .topic-card:hover{background:var(--paper);border-color:var(--line);border-inline-start-color:var(--topic-accent);box-shadow:0 3px 10px #1c354009}
#topics-screen .topic-card .topic-icon{background:transparent;color:var(--topic-accent);width:27px;height:27px;border-radius:0}
#topics-screen .topic-card .topic-icon svg{width:23px;height:23px}
#topics-screen .topic-name{font-size:13px;line-height:1.8;padding-inline-end:9px}
#topics-screen .topic-arrow{color:var(--topic-accent);opacity:1}
@media(max-width:480px){#topics-screen .topics-grid{gap:8px}#topics-screen .topic-card{padding:10px;min-height:70px}#topics-screen .topic-name{font-size:12px}}

/* Use the available height with a consistent compact list, without an orphan tile. */
#topics-screen{padding-top:12px}
#topics-screen .menu-content{max-width:540px}
#topics-screen .page-heading{min-height:42px;margin-bottom:10px}
#topics-screen .topic-groups{margin-bottom:10px;padding:3px;border-radius:11px}
#topics-screen .topic-groups>button{min-height:36px}
#topics-screen .topics-grid{grid-template-columns:minmax(0,1fr);gap:7px}
#topics-screen .topic-card{grid-template-columns:30px minmax(0,1fr) 18px;gap:12px;min-height:49px;padding:7px 12px;border-radius:10px;border-bottom-width:1px}
#topics-screen .topic-card .topic-icon{width:29px;height:29px}
#topics-screen .topic-card .topic-icon svg{width:28px;height:28px}
#topics-screen .topic-name{padding:0;font-size:12.5px;line-height:1.7}
#topics-screen .topic-arrow .icon{width:16px;height:16px}
@media(max-width:480px){#topics-screen{padding-top:5px}#topics-screen .topic-card{min-height:48px;padding:7px 11px;gap:10px}#topics-screen .topic-name{font-size:12px}#topics-screen .topics-grid{gap:6px}}

/* Restore the two-column topic arrangement with tighter card spacing. */
#topics-screen .menu-content{max-width:600px}
#topics-screen .topics-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
#topics-screen .topic-card{grid-template-columns:26px minmax(0,1fr) 15px;min-height:54px;padding:8px 10px;gap:8px}
#topics-screen .topic-card .topic-icon{width:26px;height:26px}
#topics-screen .topic-card .topic-icon svg{width:26px;height:26px}
#topics-screen .topic-name{font-size:12px;line-height:1.7}
#topics-screen .topic-arrow .icon{width:15px;height:15px}
@media(max-width:480px){#topics-screen .topics-grid{gap:7px}#topics-screen .topic-card{grid-template-columns:24px minmax(0,1fr) 12px;min-height:53px;padding:8px;gap:6px}#topics-screen .topic-card .topic-icon,#topics-screen .topic-card .topic-icon svg{width:24px;height:24px}#topics-screen .topic-name{font-size:11.5px}#topics-screen .topic-arrow .icon{width:13px;height:13px}}
@media(max-width:330px){#topics-screen .topic-card{grid-template-columns:21px minmax(0,1fr) 10px;gap:4px;padding:7px}#topics-screen .topic-name{font-size:11px}#topics-screen .topic-card .topic-icon,#topics-screen .topic-card .topic-icon svg{width:21px;height:21px}}