/* Isolated light interface for the tRNA and amino-acid introduction. */
.gb-translation-intro{--gti-ink:#26383d;--gti-muted:#60777d;--gti-line:#d5e5e3;--gti-mint:#dff4ec;--gti-purple:#eee7fb;--gti-blue:#4db9e9;width:min(100%,1080px);color:var(--gti-ink);font-family:Inter,"Source Sans 3",system-ui,sans-serif;container-type:inline-size}
.gb-translation-intro,.gb-translation-intro *{box-sizing:border-box}.gb-translation-intro button{font:inherit}.gb-translation-intro button:focus-visible{outline:3px solid #2878a5;outline-offset:3px}
.gti__cabinet{overflow:hidden;background:#fff;border:1px solid var(--gti-line);border-radius:16px;box-shadow:0 14px 36px rgba(42,78,82,.1)}
.gti__header{display:flex;min-height:64px;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px;background:linear-gradient(90deg,#eff9f6,#eef5ff);border-bottom:1px solid var(--gti-line)}.gti__header p,.gti__header h3{margin:0}.gti__header p{color:#2e836e;font-size:.68rem;font-weight:900;letter-spacing:.1em}.gti__header h3{font-size:1.08rem}.gti__header>div:last-child{display:flex;gap:7px}.gti__header button{display:grid;width:38px;height:38px;place-items:center;color:#3e5560;background:#fff;border:1px solid #bdd5d1;border-radius:10px;cursor:pointer}
.gti__stage{position:relative;min-height:560px;padding:clamp(18px,4vw,38px);background:radial-gradient(circle at 12% 16%,rgba(110,212,178,.1),transparent 34%),radial-gradient(circle at 88% 20%,rgba(169,138,221,.11),transparent 33%),#fbfdfd}.gti__lesson{display:grid;max-width:930px;margin:auto;gap:18px}.gti__copy{max-width:720px;margin:auto;text-align:center}.gti__copy p,.gti__copy h4{margin:0}.gti__copy h4{font-size:clamp(1.35rem,3vw,2rem)}.gti__copy>p:not(.gti__eyebrow){margin-top:8px;color:var(--gti-muted);line-height:1.55}.gti__eyebrow{margin-bottom:6px!important;color:#2c8c72;font-size:.68rem;font-weight:900;letter-spacing:.12em}
.gti__explore-card,.gti__ribosome-card{position:relative;min-height:270px;overflow:hidden;background:#fff;border:1px solid var(--gti-line);border-radius:16px;box-shadow:0 12px 28px rgba(42,78,82,.08)}
.gti__trna{position:relative;width:116px;height:150px;color:#4c4261}.gti__stem{position:absolute;top:35px;left:49px;width:18px;height:72px;background:#d8c7f0;border:3px solid #8669b3;border-radius:9px}.gti__stem::after{position:absolute;top:15px;left:3px;width:6px;height:37px;content:"";border-left:2px dashed #fff}.gti__arm{position:absolute;top:67px;width:48px;height:34px;background:#ede6f8;border:3px solid #8669b3}.gti__arm--left{left:12px;border-radius:24px 7px 7px 24px;transform:rotate(-12deg)}.gti__arm--right{right:12px;border-radius:7px 24px 24px 7px;transform:rotate(12deg)}.gti__amino{position:absolute;top:0;left:50%;z-index:2;display:grid;width:54px;height:54px;place-items:center;align-content:center;color:#26383d;background:var(--gti-amino);border:2px solid rgba(62,77,82,.35);border-radius:50%;box-shadow:0 5px 12px rgba(42,78,82,.12);transform:translateX(-50%)}.gti__amino strong{font-size:.78rem}.gti__amino small{font-size:.48rem}.gti__anticodon{position:absolute;right:2px;bottom:0;left:2px;z-index:3;display:flex;justify-content:center;gap:3px}.gti__anti-base,.gti__mrna-base{display:grid;width:30px;height:31px;place-items:center;color:#26383d;background:#fff;border:2px solid #9e88c2;border-radius:5px;font:900 .78rem Consolas,"Courier New",monospace}.gti__anti-base[data-base="A"],.gti__mrna-base[data-base="A"]{background:#ffd477;border-color:#dfa93d}.gti__anti-base[data-base="U"],.gti__mrna-base[data-base="U"]{color:#fff;background:#9a61d6;border-color:#7741b2}.gti__anti-base[data-base="C"],.gti__mrna-base[data-base="C"]{background:#68d5a6;border-color:#3daf80}.gti__anti-base[data-base="G"],.gti__mrna-base[data-base="G"]{background:#b69ae6;border-color:#876ac1}
.gti__trna--large{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(1.32)}.gti__hotspot{position:absolute;display:grid;gap:2px;min-width:150px;padding:9px 12px;color:#365158;background:#fff;border:2px solid #bdd7d2;border-radius:10px;cursor:pointer;text-align:left}.gti__hotspot::after{position:absolute;width:54px;height:2px;content:"";background:#83b8ae}.gti__hotspot strong{font-size:.8rem}.gti__hotspot span{font-size:.65rem}.gti__hotspot--amino{top:42px;left:8%}.gti__hotspot--amino::after{top:50%;left:100%}.gti__hotspot--anticodon{right:8%;bottom:35px}.gti__hotspot--anticodon::after{top:50%;right:100%}.gti__hotspot.is-seen{background:#e2f6ed;border-color:#54b897}.gti__hotspot.is-seen::before{position:absolute;top:-8px;right:-8px;display:grid;width:22px;height:22px;place-items:center;color:#fff;content:"✓";background:#42a982;border-radius:50%;font-weight:900}
.gti__fact{display:grid;grid-template-columns:180px 1fr;gap:14px;padding:14px 16px;color:#52686e;background:#fff8e7;border:1px solid #ead09a;border-left:5px solid #edbd55;border-radius:10px;font-size:.76rem;line-height:1.5}.gti__fact strong{color:#5c4b26}
.gti__lesson--protein{gap:14px}.gti__protein-card{display:grid;min-height:170px;place-content:center;gap:18px;padding:18px;background:linear-gradient(135deg,#f4faf8,#f7f3fd);border:1px solid var(--gti-line);border-radius:16px;box-shadow:0 10px 24px rgba(42,78,82,.07);text-align:center}.gti__protein-card>p{margin:0;color:#5a7075;font-size:.7rem;letter-spacing:.04em}.gti__protein-card.is-complete{background:linear-gradient(135deg,#e6f7f0,#f0ebfa);border-color:#84cbb5}.gti__protein-chain{display:flex;min-height:62px;align-items:center;justify-content:center;overflow-x:auto;padding:5px 12px}.gti__protein-chain>span{position:relative;display:grid;flex:0 0 auto;width:62px;height:62px;place-items:center;align-content:center;color:#26383d;background:var(--gti-amino);border:2px solid rgba(65,83,86,.28);border-radius:50%;box-shadow:0 5px 12px rgba(42,78,82,.1);animation:gti-amino-join .3s ease both}.gti__protein-chain b{font-size:.78rem}.gti__protein-chain small{font-size:.46rem}.gti__protein-chain i{position:absolute;top:50%;left:100%;width:18px;height:4px;background:#6f9790;transform:translateY(-50%)}.gti__protein-chain em{color:#819398;font-size:.72rem;font-style:normal}.gti__amino-builder{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.gti__amino-builder button{position:relative;display:grid;min-height:74px;place-content:center;gap:2px;color:#26383d;background:var(--gti-amino);border:2px solid rgba(65,83,86,.22);border-radius:12px;box-shadow:0 5px 11px rgba(42,78,82,.07);cursor:pointer}.gti__amino-builder button:hover:not(:disabled){border-color:#397b6b;transform:translateY(-2px)}.gti__amino-builder button:disabled{filter:saturate(.7);cursor:default;opacity:.66}.gti__amino-builder button strong{font-size:.86rem}.gti__amino-builder button span{font-size:.61rem;font-weight:750}.gti__amino-builder button em{position:absolute;top:5px;right:7px;color:#1f6d58;font-style:normal;font-weight:900}.gti__protein-fact{display:grid;grid-template-columns:250px 1fr;gap:14px;padding:13px 15px;color:#52686e;background:#fff8e7;border:1px solid #ead09a;border-left:5px solid #edbd55;border-radius:10px;font-size:.73rem;line-height:1.45}.gti__protein-fact strong{color:#5c4b26}.gti__protein-ready{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 14px;color:#246b59;background:#e1f5ed;border:1px solid #8ccdb8;border-radius:11px;font-size:.75rem}.gti__protein-ready button{min-height:42px;padding:7px 13px;color:#174f42;background:#fff;border:2px solid #68b99f;border-radius:9px;cursor:pointer;font-weight:850}
.gti__lesson--codons{max-width:1000px;gap:13px}.gti__code-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.gti__code-facts p{display:grid;gap:2px;margin:0;padding:11px 13px;color:#62767b;background:#fff;border:1px solid var(--gti-line);border-radius:10px;text-align:center}.gti__code-facts strong{color:#2f6458;font-size:.8rem}.gti__code-facts span{font-size:.64rem}.gti__codon-task{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 13px;color:#52686e;background:#f2f8f6;border:1px solid #cbe0dc;border-radius:10px}.gti__codon-task>div:first-child{display:grid;gap:2px;font-size:.7rem}.gti__codon-task>div:first-child span{font-size:.64rem}.gti__codon-task>div:last-child{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:5px}.gti__codon-task>div:last-child span{padding:4px 7px;color:#6f8084;background:#fff;border:1px solid #cfdfdc;border-radius:99px;font:900 .58rem Consolas,"Courier New",monospace}.gti__codon-task>div:last-child span.is-found{color:#176f59;background:#dcf4ea;border-color:#78c6ad}.gti__codon-result{display:flex;align-items:center;justify-content:center;gap:14px;min-height:72px;padding:10px;color:#40575c;background:linear-gradient(90deg,#eef6ff,#f3effb);border:1px solid #cfddea;border-radius:12px}.gti__codon-result>i{color:#6d8290;font-size:1.2rem;font-style:normal}.gti__result-codon{padding:8px 11px;color:#456b87;background:#fff;border:2px solid #83b8dc;border-radius:8px;font:900 1rem Consolas,"Courier New",monospace}.gti__result-amino{display:grid;min-width:170px;gap:1px;padding:8px 12px;color:#26383d;background:var(--gti-amino);border:2px solid rgba(65,83,86,.22);border-radius:9px;text-align:center}.gti__result-amino strong{font-size:.9rem}.gti__result-amino small{font-size:.5rem;font-weight:900;letter-spacing:.07em}.gti__codon-result.is-stop{background:#fff0ef;border-color:#e5aaa4}.gti__codon-result.is-stop .gti__result-amino{color:#8a3934;background:#ffd8d4;border-color:#dc776f}.gti__map-scroll{overflow-x:auto;padding:4px;background:#fff;border:1px solid var(--gti-line);border-radius:13px;box-shadow:0 10px 24px rgba(42,78,82,.07)}.gti__codon-map{display:grid;min-width:850px;grid-template-columns:64px repeat(4,minmax(0,1fr));gap:3px;padding:5px}.gti__codon-corner,.gti__codon-column,.gti__codon-row{display:grid;place-items:center;margin:0;border-radius:7px;font-size:.66rem;text-align:center}.gti__codon-corner{gap:0;padding:5px;color:#597076;background:#edf4f2}.gti__codon-corner span{font-size:.9rem}.gti__codon-corner small{font-size:.48rem}.gti__codon-column{min-height:34px}.gti__codon-row{min-height:112px}.gti__codon-column[data-base="U"],.gti__codon-row[data-base="U"]{color:#fff;background:#9861d4}.gti__codon-column[data-base="C"],.gti__codon-row[data-base="C"]{background:#68d5a6}.gti__codon-column[data-base="A"],.gti__codon-row[data-base="A"]{background:#ffd477}.gti__codon-column[data-base="G"],.gti__codon-row[data-base="G"]{background:#b69ae6}.gti__codon-cell{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:3px;min-height:112px;padding:3px;background:#f5f8f7;border:1px solid #e0e9e7;border-radius:7px}.gti__codon-cell button{position:relative;display:grid;grid-template-columns:38px 1fr;align-items:center;gap:3px;min-height:48px;padding:4px 5px;color:#4f6267;background:#fff;border:1px solid #d5e2df;border-radius:5px;cursor:pointer;text-align:left}.gti__codon-cell button strong{color:#2f464c;font:900 .65rem Consolas,"Courier New",monospace}.gti__codon-cell button span{overflow:hidden;font-size:.5rem;font-weight:750;text-overflow:ellipsis;white-space:nowrap}.gti__codon-cell button small{display:none}.gti__codon-cell button:hover{z-index:2;border-color:#4da98e;box-shadow:0 3px 8px rgba(42,78,82,.12);transform:translateY(-1px)}.gti__codon-cell button.is-target{border:2px solid #d8a833;background:#fff9e7}.gti__codon-cell button.is-target::after{position:absolute;top:-5px;right:-5px;width:11px;height:11px;content:"";background:#e5b13a;border:2px solid #fff;border-radius:50%}.gti__codon-cell button.is-found{color:#185c4c;background:#def4ea;border-color:#54b795}.gti__codon-cell button.is-found::after{display:grid;width:16px;height:16px;place-items:center;color:#fff;content:"✓";background:#3ea780;font-size:.48rem}.gti__codon-cell button.is-start{box-shadow:inset 0 0 0 2px rgba(66,166,128,.22)}.gti__codon-cell button.is-stop{color:#8d3934;background:#fff0ef;border-color:#e6aaa4}.gti__map-note{margin:0!important;color:#65797e!important;font-size:.68rem!important;text-align:center}
.gti__ribosome-card{min-height:280px}.gti__ribosome{position:absolute;top:50%;left:50%;width:410px;height:185px;transform:translate(-50%,-46%)}.gti__ribosome-large{position:absolute;top:0;left:50%;display:grid;width:320px;height:135px;place-items:center;color:#4c5d61;background:rgba(170,221,204,.55);border:3px solid #6fb59e;border-radius:52% 48% 36% 40%;font-size:.68rem;font-weight:900;letter-spacing:.08em;transform:translateX(-50%)}.gti__ribosome-small{position:absolute;right:36px;bottom:0;left:36px;height:76px;background:#e7f5f1;border:3px solid #6fb59e;border-radius:36% 40% 52% 48%}.gti__mrna{position:absolute;right:7%;bottom:34px;left:7%;z-index:5;display:flex;align-items:center;justify-content:center;gap:8px}.gti__mrna::before{position:absolute;right:42px;left:42px;bottom:13px;z-index:-1;height:7px;content:"";background:#9bc5ea;border-radius:99px}.gti__mrna strong{color:#4b6f8d;font:900 .74rem Consolas,"Courier New",monospace}.gti__mrna small{position:absolute;top:38px;color:#687c82;font-size:.6rem;font-weight:800}.gti__codon{display:flex;gap:3px;padding:4px 6px;background:#eef5ff;border:2px solid #7dadd4;border-radius:7px}.gti__pair-target{position:absolute;top:40px;right:0;left:0;color:#6d5b90;font-size:.7rem;font-weight:900;text-align:center}
.gti__choices{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.gti__choices>button{position:relative;display:grid;min-height:186px;place-items:center;padding:9px 3px;background:#fff;border:1px solid #cfdedc;border-radius:12px;box-shadow:0 5px 12px rgba(42,78,82,.07);cursor:pointer}.gti__choices>button:hover{background:#f5faf8;border-color:#6db9a2;transform:translateY(-2px)}.gti__choices .gti__trna{transform:scale(.84)}.gti__choices em{position:absolute;top:7px;right:9px;color:#71878c;font-size:.62rem;font-style:normal;font-weight:900}
.gti__lesson--complete .gti__ribosome-card{min-height:340px}.gti__trna--paired{position:absolute;top:38px;left:50%;z-index:6;transform:translateX(-50%) scale(.88)}.gti__hydrogen-bonds{position:absolute;bottom:76px;left:50%;z-index:7;display:flex;gap:5px;transform:translateX(-50%)}.gti__hydrogen-bonds i{width:3px;height:18px;background:repeating-linear-gradient(to bottom,#34aee9 0 4px,transparent 4px 7px)}.gti__summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.gti__summary p{margin:0;padding:13px;color:#52686e;background:#f5f9f8;border:1px solid var(--gti-line);border-radius:10px;font-size:.74rem;line-height:1.45}.gti__summary strong{color:#2c8c72}.gti__ready{margin:0!important;color:#226b59!important;font-weight:850;text-align:center}
.gti__feedback{min-height:1.4em;margin:2px 0 0!important;color:#5c7076!important;font-size:.75rem!important;font-weight:800;text-align:center}.gti__feedback[data-type="correct"]{color:#218366!important}.gti__feedback[data-type="wrong"]{color:#c35750!important}.gti__footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 15px;color:#60777d;background:#f5f9f8;border-top:1px solid var(--gti-line);font-size:.72rem}.gti__footer button{padding:7px 10px;color:#45636a;background:#fff;border:1px solid #bdd5d1;border-radius:8px;cursor:pointer}
@container (max-width:700px){.gti__stage{min-height:600px}.gti__choices{grid-template-columns:repeat(3,minmax(0,1fr))}.gti__choices>button{min-height:166px}.gti__fact,.gti__protein-fact{grid-template-columns:1fr}.gti__summary{grid-template-columns:1fr}.gti__hotspot--amino{left:3%}.gti__hotspot--anticodon{right:3%}.gti__protein-ready{align-items:flex-start;flex-direction:column}.gti__protein-ready button{width:100%}.gti__codon-task{align-items:flex-start;flex-direction:column}.gti__codon-task>div:last-child{justify-content:flex-start}.gti__code-facts{grid-template-columns:1fr}.gti__codon-result{gap:8px}.gti__result-amino{min-width:140px}}
@container (max-width:470px){.gti__header{padding-inline:10px}.gti__header h3{font-size:.9rem}.gti__stage{min-height:640px;padding:16px 10px}.gti__explore-card{min-height:350px}.gti__trna--large{top:47%}.gti__hotspot{min-width:126px;padding:7px}.gti__hotspot--amino{top:12px;left:8px}.gti__hotspot--anticodon{right:8px;bottom:12px}.gti__hotspot::after{display:none}.gti__choices,.gti__amino-builder{grid-template-columns:repeat(2,minmax(0,1fr))}.gti__choices>button:last-child,.gti__amino-builder>button:last-child{grid-column:1/-1}.gti__ribosome{width:350px}.gti__ribosome-large{width:280px}.gti__protein-chain{justify-content:flex-start}.gti__protein-chain>span{width:52px;height:52px}.gti__codon-result{flex-direction:column}.gti__codon-result>i{transform:rotate(90deg)}.gti__result-amino{width:100%}.gti__footer{align-items:flex-start;flex-direction:column}.gti__footer button{align-self:flex-end}}
@keyframes gti-amino-join{from{opacity:.35;transform:translateY(-12px) scale(.8)}to{opacity:1;transform:none}}
/* Guided genetic-code lesson and compact 20-amino-acid library. */
.gti__amino-library-heading,.gti__trna-pool-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;color:#51676d}.gti__amino-library-heading strong,.gti__trna-pool-heading strong{color:#2b6558;font-size:.76rem}.gti__amino-library-heading span,.gti__trna-pool-heading span{font-size:.64rem}.gti__amino-builder{grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}.gti__amino-builder button{min-height:54px;grid-template-columns:35px 1fr;place-content:unset;align-items:center;gap:6px;padding:7px 9px;text-align:left}.gti__amino-builder button strong{display:grid;width:34px;height:34px;place-items:center;background:rgba(255,255,255,.55);border:1px solid rgba(38,56,61,.15);border-radius:50%;font-size:.72rem}.gti__amino-builder button span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.gti__decode-guide{display:flex;align-items:center;justify-content:center;gap:9px;padding:9px 12px;color:#435a60;background:#eef8f5;border:1px solid #bcded4;border-radius:12px}.gti__decode-guide>span{display:grid;min-width:128px;grid-template-columns:25px 1fr 28px;align-items:center;gap:6px;padding:6px 8px;background:#fff;border:1px solid #cadfdb;border-radius:9px}.gti__decode-guide b{display:grid;width:23px;height:23px;place-items:center;color:#fff;background:#328d74;border-radius:50%;font-size:.64rem}.gti__decode-guide small{font-size:.58rem}.gti__decode-guide strong{font:900 .9rem Consolas,"Courier New",monospace;text-align:right}.gti__decode-guide>i{color:#4c9b86;font-style:normal;font-weight:900}.gti__codon-task>div:last-child span.is-current{color:#76581a;background:#fff4cf;border-color:#e3b94e;box-shadow:0 0 0 2px rgba(227,185,78,.14)}.gti__codon-column.is-guide,.gti__codon-row.is-guide{outline:4px solid #43a98d;outline-offset:1px;box-shadow:0 0 0 7px rgba(67,169,141,.15)}.gti__codon-cell.is-guide-cell{background:#e8f7f2;border:2px solid #5ab499}.gti__codon-cell button{grid-template-columns:38px minmax(0,1fr) auto}.gti__codon-cell button small{display:flex;align-items:center;gap:3px;color:#73868b;font-size:.43rem;white-space:nowrap}.gti__codon-cell button small b{display:grid;width:17px;height:17px;place-items:center;color:#2f6256;background:#e7f4f0;border-radius:50%;font-size:.52rem}.gti__codon-cell button.is-target{outline:3px solid rgba(228,175,46,.24)}.gti__trna-pool-heading{padding-top:2px}.gti__trna-pool{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px}.gti__trna-choice{display:grid;min-height:82px;grid-template-columns:38px 1fr;grid-template-rows:38px auto;align-items:center;gap:4px 6px;padding:6px;color:#31474d;background:#fff;border:2px solid #d3e1df;border-radius:12px;box-shadow:0 4px 10px rgba(42,78,82,.06);cursor:pointer}.gti__trna-choice:hover{border-color:#65b89f;box-shadow:0 7px 14px rgba(42,78,82,.11);transform:translateY(-2px)}.gti__choice-amino{display:grid;width:36px;height:36px;place-items:center;align-content:center;background:var(--gti-amino);border:1px solid rgba(65,79,83,.2);border-radius:50%}.gti__choice-amino b{font-size:.6rem}.gti__choice-amino small{max-width:33px;overflow:hidden;font-size:.36rem;text-overflow:ellipsis;white-space:nowrap}.gti__choice-trna{display:grid;height:34px;place-items:center;color:#76599d;background:#e9e0f7;border:2px solid #a688cf;border-radius:10px 10px 18px 18px;font-size:.48rem;font-weight:900}.gti__choice-anticodon{display:grid;grid-column:1/-1;gap:2px;text-align:center}.gti__choice-anticodon>small{color:#75878c;font-size:.42rem;font-weight:900;letter-spacing:.07em}.gti__choice-anticodon>strong{display:flex;align-items:center;justify-content:center;gap:2px;color:#61747a;font:800 .5rem Consolas,"Courier New",monospace}.gti__trna-choice .gti__anti-base{width:18px;height:19px;border-width:1px;font-size:.52rem}
@container (max-width:760px){.gti__amino-builder,.gti__trna-pool{grid-template-columns:repeat(4,minmax(0,1fr))}.gti__decode-guide{align-items:stretch;gap:5px}.gti__decode-guide>span{min-width:0;grid-template-columns:22px 1fr;flex:1}.gti__decode-guide>span strong{grid-column:1/-1;text-align:center}.gti__decode-guide>i{align-self:center}.gti__codon-cell button small{display:none}}
@container (max-width:470px){.gti__amino-library-heading,.gti__trna-pool-heading{align-items:flex-start;flex-direction:column;gap:3px}.gti__amino-builder,.gti__trna-pool{grid-template-columns:repeat(2,minmax(0,1fr))}.gti__amino-builder>button:last-child,.gti__trna-pool>button:last-child{grid-column:auto}.gti__decode-guide{display:grid;grid-template-columns:1fr}.gti__decode-guide>i{transform:rotate(90deg);text-align:center}.gti__decode-guide>span{grid-template-columns:25px 1fr 28px}.gti__decode-guide>span strong{grid-column:auto}.gti__codon-map{min-width:800px}}
.gti__codon-cell{grid-template-columns:1fr}.gti__codon-cell button{min-height:24px}
/* Reading-frame bridge: amino-acid chain -> mRNA codons -> genetic code. */
.gti__lesson--frame{max-width:1050px;gap:14px}.gti__frame-task{display:grid;gap:14px;padding:16px;background:linear-gradient(135deg,#f4faf8,#f5f1fb);border:1px solid #c9ded9;border-radius:16px;box-shadow:0 10px 24px rgba(42,78,82,.07)}.gti__frame-task.is-found{background:linear-gradient(135deg,#edf9f4,#f4effc);border-color:#82c7b2}.gti__frame-prompt{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;color:#536970}.gti__frame-prompt strong{color:#256b59;font-size:.8rem}.gti__frame-prompt span{font-size:.67rem}.gti__frame-flat{display:grid;grid-template-columns:30px 1fr 30px;align-items:center;gap:8px;overflow-x:auto;padding:8px 5px}.gti__frame-flat>strong,.gti__frame-grouped>strong{color:#2f7765;font:900 .76rem Consolas,"Courier New",monospace}.gti__frame-flat>div{display:flex;min-width:780px;justify-content:center;gap:2px;padding:9px;background:#fff;border:1px solid #d5e4e1;border-radius:10px}.gti__frame-base{display:grid;width:34px;height:38px;place-items:center;color:#24383d;background:#eef3f2;border:1px solid #bfd2cf;border-radius:6px;font:900 .74rem Consolas,"Courier New",monospace}.gti__frame-flat button{cursor:pointer}.gti__frame-flat button:hover{z-index:2;border-color:#3fa384;box-shadow:0 0 0 3px rgba(63,163,132,.16);transform:translateY(-2px)}.gti__frame-base[data-base="A"]{background:#ffd477;border-color:#dfa93d}.gti__frame-base[data-base="U"]{color:#fff;background:#9861d4;border-color:#7844ad}.gti__frame-base[data-base="C"]{background:#68d5a6;border-color:#3daf80}.gti__frame-base[data-base="G"]{background:#b69ae6;border-color:#876ac1}.gti__frame-grouped{display:grid;min-width:900px;grid-template-columns:30px minmax(205px,2fr) repeat(5,minmax(94px,1fr)) 30px;align-items:stretch;gap:8px;overflow-x:auto;padding:8px 5px}.gti__frame-grouped>strong{align-self:center}.gti__frame-utr,.gti__frame-codon{display:grid;align-content:center;justify-content:center;gap:4px;padding:8px;background:#fff;border:2px solid #cadcd9;border-radius:10px}.gti__frame-utr{grid-template-columns:repeat(6,34px);background:#f3f6f5;border-style:dashed}.gti__frame-codon{grid-template-columns:repeat(3,34px)}.gti__frame-utr small,.gti__frame-codon small{grid-column:1/-1;color:#677c81;font-size:.48rem;font-weight:900;letter-spacing:.04em;text-align:center}.gti__frame-codon.is-start{background:#fff8df;border-color:#e3b74c;box-shadow:0 0 0 4px rgba(227,183,76,.13)}.gti__frame-codon.is-start small{color:#8a6819}.gti__frame-codon.is-stop{background:#fff0ef;border-color:#df8a82}.gti__frame-codon.is-stop small{color:#a34f49}.gti__frame-hint{display:grid;grid-template-columns:220px 1fr;gap:12px;padding:13px 15px;color:#52686e;background:#fff8e7;border:1px solid #ead09a;border-left:5px solid #edbd55;border-radius:10px;font-size:.72rem;line-height:1.45}.gti__frame-hint strong{color:#5c4b26}.gti__frame-explanation{display:grid;grid-template-columns:minmax(220px,.7fr) 1.3fr;gap:10px}.gti__frame-explanation>div:first-child{display:grid;align-content:center;gap:4px;padding:13px 15px;color:#52686e;background:#eef8f5;border:1px solid #bdded4;border-radius:11px;font-size:.7rem;line-height:1.45}.gti__frame-explanation>div:first-child strong{color:#276b5b}.gti__frame-protein{display:grid;grid-template-columns:64px repeat(5,minmax(0,1fr));gap:4px;padding:9px;background:#fff;border:1px solid #d1e1de;border-radius:11px}.gti__frame-protein>span{display:grid;place-items:center;color:#61767b;font-size:.55rem;font-weight:900}.gti__frame-protein>b{display:grid;min-height:32px;place-items:center;color:#42585e;background:#edf5f3;border-radius:6px;font:900 .62rem Consolas,"Courier New",monospace}.gti__frame-protein>b:nth-last-child(-n+5){background:#f0eafb}.gti__direction-check{display:grid;grid-template-columns:1fr 140px 140px;align-items:center;gap:9px;padding:11px 13px;background:#fff;border:1px solid #cbdedb;border-radius:11px}.gti__direction-check>div{display:grid;gap:2px;color:#52686e;font-size:.66rem}.gti__direction-check>div strong{color:#344f55;font-size:.73rem}.gti__direction-check button{min-height:42px;color:#34565a;background:#f8fbfa;border:2px solid #b8d3ce;border-radius:9px;cursor:pointer;font:900 .75rem Consolas,"Courier New",monospace}.gti__direction-check button:hover{border-color:#5bad95}.gti__direction-check button.is-correct{color:#17664f;background:#dcf4ea;border-color:#58b493}
@container (max-width:700px){.gti__frame-prompt{align-items:flex-start;flex-direction:column}.gti__frame-hint,.gti__frame-explanation{grid-template-columns:1fr}.gti__direction-check{grid-template-columns:1fr 1fr}.gti__direction-check>div{grid-column:1/-1}}
@container (max-width:470px){.gti__frame-task{padding:11px 8px}.gti__frame-flat{grid-template-columns:24px 1fr 24px}.gti__frame-base{width:30px;height:34px}.gti__direction-check{grid-template-columns:1fr 1fr}.gti__frame-protein{grid-template-columns:52px repeat(5,minmax(42px,1fr));overflow-x:auto}.gti__frame-protein>b{min-width:42px}}
.gti__frame-grouped{width:100%;min-width:0;grid-template-columns:30px 205px repeat(5,94px) 30px}.gti__frame-explanation{min-width:0;grid-template-columns:minmax(220px,.7fr) minmax(0,1.3fr)}.gti__frame-protein,.gti__direction-check{min-width:0}
@container (max-width:700px){.gti__frame-explanation{grid-template-columns:1fr}}
/* Alphabetical groups make the 20 tRNA choices easier to scan without hiding any distractors. */
.gti__trna-groups{display:grid;gap:7px}.gti__trna-group{display:grid;grid-template-columns:34px minmax(0,1fr);align-items:stretch;gap:7px}.gti__trna-group>strong{display:grid;place-items:center;color:#397263;background:#e4f3ee;border:1px solid #b9d9d0;border-radius:10px;font:900 .59rem Consolas,"Courier New",monospace;letter-spacing:.04em;writing-mode:vertical-rl;transform:rotate(180deg)}
@container (max-width:760px){.gti__trna-group .gti__trna-pool{grid-template-columns:repeat(5,minmax(0,1fr))}}
@container (max-width:600px){.gti__trna-group .gti__trna-pool{grid-template-columns:repeat(3,minmax(0,1fr))}}
@container (max-width:470px){.gti__trna-group{grid-template-columns:28px minmax(0,1fr);gap:5px}.gti__trna-group .gti__trna-pool{grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}.gti__trna-group>strong{font-size:.53rem}}
@media (prefers-reduced-motion:reduce){.gb-translation-intro *,.gb-translation-intro *::before,.gb-translation-intro *::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* The introduction now uses the exact same codon-table language as Level 3. */
.gti__code-table{box-shadow:0 8px 20px rgba(42,78,82,.07)}
.gti__code-table .gt3__code-cell>button.is-found{z-index:2;color:#174c3b;background:#d9f5e9;border:2px solid #46a986;box-shadow:0 3px 9px rgba(42,120,93,.14)}
.gti__code-table .gt3__code-cell>button.is-found::after{justify-self:end;content:"✓";color:#278d72;font-size:.62rem;font-weight:900}
.gti__code-insight{display:grid;grid-template-columns:260px 1fr;gap:14px;padding:12px 14px;color:#52686e;background:#fff8e7;border:1px solid #ead09a;border-left:5px solid #edbd55;border-radius:11px;font-size:.72rem;line-height:1.45}
.gti__code-insight strong{color:#5c4b26}
.gti__lesson--pairing .gti__trna-pool{grid-template-columns:repeat(4,minmax(0,1fr));max-width:780px;width:100%;margin-inline:auto}
.gti__lesson--pairing .gti__trna-choice{min-height:96px}
@container (max-width:700px){.gti__code-insight{grid-template-columns:1fr}.gti__lesson--codons .gti__code-facts{grid-template-columns:repeat(3,minmax(0,1fr))}}
@container (max-width:470px){.gti__lesson--codons .gti__code-facts{grid-template-columns:1fr}.gti__lesson--pairing .gti__trna-pool{grid-template-columns:repeat(2,minmax(0,1fr))}}
