/* LEVEL 3 transcription styles. Legacy filename and gb2 namespace are retained for compatibility. */
.gb-rna-builder {
  --gb2-ink:#eefcf5; --gb2-muted:#a8cabf; --gb2-screen:#071b1b; --gb2-green:#56e39f; --gb2-blue:#58c7f3; --gb2-amber:#ffd166; --gb2-coral:#ff7b68; --gb2-purple:#a875e8;
  width:min(100%,1080px); color:var(--gb2-ink); font-family:Inter,"Source Sans 3",system-ui,sans-serif; line-height:1.4; container-type:inline-size;
}
.gb-rna-builder,.gb-rna-builder *{box-sizing:border-box}.gb-rna-builder button{font:inherit}.gb-rna-builder button:focus-visible,.gb-rna-builder [tabindex="0"]:focus-visible{outline:3px solid #fff;outline-offset:3px}
.gb2__cabinet{overflow:hidden;background:#0b2422;border:1px solid #2f6a60;border-radius:16px;box-shadow:0 22px 54px rgba(11,46,40,.22),inset 0 0 0 5px #102f2c}
.gb2__topbar{position:relative;display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:60px;padding:10px 14px 10px 18px;background:linear-gradient(180deg,#174e47,#123a36);border-bottom:3px solid #071b1b}
.gb2__topbar p,.gb2__topbar strong{margin:0}.gb2__topbar p{color:var(--gb2-green);font:900 .7rem Consolas,"Courier New",monospace;letter-spacing:.08em}.gb2__topbar strong{color:#fff;font-size:1rem}
.gb2__top-actions{display:flex;gap:7px}.gb2__top-actions button{display:grid;width:38px;height:38px;place-items:center;color:#fff;background:#0c2a28;border:1px solid #4a8c7f;border-radius:5px;box-shadow:3px 3px 0 #061615;cursor:pointer;font-weight:900}.gb2__top-actions button:disabled{opacity:.4;cursor:not-allowed}
.gb2__help{position:absolute;top:calc(100% + 8px);right:58px;z-index:30;display:grid;min-width:190px;gap:4px;padding:11px 13px;color:#eafff7;background:#0b2422;border:1px solid #69ad9e;border-radius:5px;box-shadow:5px 5px 0 #03100f;font-size:.78rem}.gb2__help[hidden]{display:none}.gb2__help strong{color:var(--gb2-green)}
.gb2__hud{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:1px;padding:1px;background:#214943;border-bottom:3px solid #071b1b}.gb2__hud>div{display:grid;min-width:0;gap:2px;padding:8px 5px;text-align:center;background:#0b2422}.gb2__hud small{color:var(--gb2-muted);font:800 clamp(.52rem,1.2vw,.68rem) Consolas,"Courier New",monospace;letter-spacing:.05em}.gb2__hud strong{overflow:hidden;color:#fff;font:800 clamp(.82rem,1.8vw,1.05rem) Consolas,"Courier New",monospace;text-overflow:ellipsis;white-space:nowrap}.gb2__hud [data-gb2-lives]{color:var(--gb2-coral)}
.gb2__stage{position:relative;height:520px;overflow:hidden;background:linear-gradient(rgba(71,154,139,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(71,154,139,.055) 1px,transparent 1px),radial-gradient(circle at 50% 44%,#143b37 0,#081d1c 50%,#051514 100%);background-size:22px 22px,22px 22px,auto;outline:none;isolation:isolate}
.gb2__sequence-label{position:absolute;right:14px;left:14px;z-index:9;display:grid;grid-template-columns:38px 1fr 38px;align-items:center;color:#dff9ef;font:700 .72rem Consolas,"Courier New",monospace;text-align:center;text-transform:uppercase}.gb2__sequence-label--coding{top:12px}.gb2__sequence-label--template{top:276px}.gb2__sequence-label strong{display:grid;min-height:27px;place-items:center;color:#07201d;background:var(--gb2-amber);border-radius:3px;box-shadow:3px 3px 0 #061615}.gb2__sequence-label--template strong{background:var(--gb2-blue)}
.gb2__dna-window{position:absolute;top:55px;right:0;left:0;height:230px;overflow:hidden}.gb2__dna-track{position:absolute;top:42px;left:50%;display:flex;width:max-content;transition:transform .24s steps(4,end)}
.gb2__dna-pair{position:relative;display:grid;width:56px;height:126px;grid-template-rows:44px 30px 44px;place-items:center;transition:filter .2s ease}.gb2__dna-pair::before,.gb2__dna-pair::after{position:absolute;right:-3px;left:-3px;height:4px;content:"";background:#8dbeb1}.gb2__dna-pair::before{top:20px}.gb2__dna-pair::after{bottom:20px}.gb2__dna-base{z-index:2;display:grid;width:35px;height:35px;place-items:center;color:#061716;border:2px solid rgba(255,255,255,.65);border-radius:4px;box-shadow:3px 3px 0 #03100f;font:900 1rem Consolas,"Courier New",monospace;transition:transform .22s ease}.gb2__dna-base--a{background:var(--gb2-amber)}.gb2__dna-base--t{background:var(--gb2-blue)}.gb2__dna-base--c{background:var(--gb2-green)}.gb2__dna-base--g{background:#c7a6ff}.gb2__dna-bonds{color:#e9fff7;font-size:1rem;letter-spacing:1px;transition:opacity .18s ease}.gb2__dna-pair.is-open .gb2__coding-base{transform:translateY(-14px)}.gb2__dna-pair.is-open .gb2__template-base{transform:translateY(14px)}.gb2__dna-pair.is-open .gb2__dna-bonds{opacity:0}.gb2__dna-pair.is-active .gb2__template-base{box-shadow:0 0 0 4px #fff,0 0 26px rgba(86,227,159,.9),3px 3px 0 #03100f}.gb2__dna-pair.is-active{filter:brightness(1.12)}
.gb2__polymerase{position:absolute;top:41px;left:50%;z-index:7;display:grid;width:126px;height:132px;place-content:center;color:#fff7d1;background:linear-gradient(135deg,rgba(255,209,102,.68),rgba(255,159,104,.56));border:3px solid rgba(255,232,166,.92);border-radius:44% 52% 43% 48%;box-shadow:0 0 0 3px rgba(8,32,29,.54),5px 5px 0 rgba(3,16,15,.76);transform:translateX(-82%);text-align:center;clip-path:polygon(8% 22%,22% 7%,70% 3%,94% 26%,90% 73%,68% 96%,23% 91%,3% 65%);backdrop-filter:blur(.5px);pointer-events:none}.gb2__polymerase::after{position:absolute;top:50%;right:-18px;width:42px;height:38px;content:"";background:rgba(8,29,28,.38);border:3px solid rgba(255,244,204,.96);border-left:0;transform:translateY(-50%)}.gb2__polymerase span,.gb2__polymerase strong,.gb2__polymerase i{position:relative;z-index:2;text-shadow:0 1px 2px #071b1b}.gb2__polymerase span{font:900 .61rem Consolas,"Courier New",monospace}.gb2__polymerase strong{margin-top:4px;font:900 .58rem Consolas,"Courier New",monospace}.gb2__polymerase i{max-width:88px;margin-top:28px;font:800 .46rem Consolas,"Courier New",monospace;line-height:1.2}.gb-rna-builder[data-phase="binding"] .gb2__polymerase{animation:gb2-bind 1.45s steps(6,end)}.gb-rna-builder[data-phase="releasing"] .gb2__polymerase{animation:gb2-release .7s ease forwards}
.gb2__mrna{position:absolute;right:14px;bottom:72px;left:14px;z-index:8;display:grid;grid-template-columns:34px 46px 1fr 34px;align-items:center;gap:5px;min-height:68px;padding:8px 10px;color:#e9fff8;background:rgba(6,25,23,.84);border:1px solid #3b7166;border-radius:6px;box-shadow:4px 4px 0 #03100f}.gb2__mrna>strong{display:grid;min-height:28px;place-items:center;color:#160b23;background:var(--gb2-purple);border-radius:3px;font:900 .76rem Consolas,"Courier New",monospace}.gb2__mrna-label{font:900 .7rem Consolas,"Courier New",monospace;color:#d9bdff}.gb2__mrna>[data-gb2-mrna]{display:flex;gap:5px;align-items:center;overflow-x:auto;padding:4px 2px}.gb2__codon{display:flex;flex:0 0 auto;gap:2px;padding:3px;border:1px dashed #5e857d;border-radius:4px}.gb2__codon.is-complete{border-style:solid;border-color:#b991ef}.gb2__rna-base{display:grid;width:25px;height:28px;place-items:center;color:#061716;border-radius:3px;font:900 .8rem Consolas,"Courier New",monospace;font-style:normal}.gb2__rna-base--a{background:var(--gb2-amber)}.gb2__rna-base--u{color:#fff;background:var(--gb2-purple)}.gb2__rna-base--c{background:var(--gb2-green)}.gb2__rna-base--g{background:#c7a6ff}
.gb2__projectile{position:absolute;bottom:105px;left:50%;z-index:10;display:grid;width:34px;height:34px;place-items:center;color:#061716;border:2px solid #fff;border-radius:4px;font:900 1rem Consolas,"Courier New",monospace;transform:translateX(-50%)}.gb2__projectile[hidden]{display:none}.gb2__projectile.is-fired{animation:gb2-shot .24s ease-out}.gb2__projectile--a{background:var(--gb2-amber)}.gb2__projectile--t{background:var(--gb2-blue)}.gb2__projectile--c{background:var(--gb2-green)}.gb2__projectile--g{background:#c7a6ff}.gb2__projectile--u{color:#fff;background:var(--gb2-purple)}
.gb2__feedback{position:absolute;right:15px;bottom:38px;left:15px;z-index:10;margin:0!important;color:#dff8ef!important;font:800 .7rem Consolas,"Courier New",monospace!important;text-align:center}.gb2__feedback[data-type="correct"]{color:var(--gb2-green)!important}.gb2__feedback[data-type="wrong"]{color:#ffad9f!important}
.gb2__overlay{position:absolute;inset:0;z-index:20;display:grid;place-items:center;padding:18px;background:rgba(3,16,15,.9);backdrop-filter:blur(5px);overflow-y:auto;overscroll-behavior:contain}.gb2__overlay[hidden]{display:none}.gb2__overlay-panel{width:min(100%,820px);max-height:calc(100% - 2px);overflow-y:auto;padding:clamp(18px,3vw,28px);color:#cfe7df;text-align:center;background:#0d2a27;border:2px solid #4c8b7c;border-radius:8px;box-shadow:8px 8px 0 #03100f;scrollbar-gutter:stable}.gb2__overlay-panel h3{margin:0;color:#fff;font-size:clamp(1.35rem,3.6vw,2rem)}.gb2__overlay-panel p{color:inherit!important}.gb2__kicker{margin:0 0 8px!important;color:var(--gb2-green)!important;font:900 .7rem Consolas,"Courier New",monospace!important;letter-spacing:.08em}.gb2__primary,.gb2__overlay-panel button{min-height:46px;padding:8px 17px;color:#e7fff6;background:#123a36;border:1px solid #6aa598;border-radius:5px;box-shadow:4px 4px 0 #020c0b;cursor:pointer;font-weight:850}.gb2__overlay-panel .gb2__primary{color:#061916;background:var(--gb2-green);border:2px solid #a7ffcf;font-weight:900}.gb2__strand-choice,.gb2__result-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:9px;margin:14px 0}.gb2__result-actions{padding:2px 4px}.gb2__question-feedback{min-height:1.4em;color:#ffd9a6!important;font-weight:750}.gb2__shortcut,.gb2__next-note{font:700 .68rem Consolas,"Courier New",monospace!important;color:#a8cabf!important}
.gb2__mode-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:16px 0}.gb2__mode-card{display:grid;min-height:112px!important;align-content:center;gap:5px;text-align:left}.gb2__mode-card strong{font-size:1rem}.gb2__mode-card span,.gb2__mode-card small{display:block;font-size:.72rem;font-weight:650;line-height:1.35}.gb2__mode-card small{color:#a8cabf}
.gb2__mode-grid--single{width:min(100%,520px);grid-template-columns:1fr;margin-inline:auto}
.gb2__record-badge{width:max-content;margin:8px auto!important;padding:5px 10px;color:#4b3810!important;background:#ffd166;border-radius:999px;font:900 .68rem Consolas,"Courier New",monospace!important;letter-spacing:.08em}
.gb2__final-sequences{display:grid;gap:6px;margin:14px 0;text-align:left}.gb2__final-sequences p{display:grid;grid-template-columns:130px 1fr;gap:8px;margin:0!important;padding:7px 9px;background:#081f1d;border:1px solid #315d56;border-radius:4px}.gb2__final-sequences span{overflow-wrap:anywhere;color:#fff;font:700 .72rem Consolas,"Courier New",monospace}
.gb2__concept-choice button{flex:1 1 260px;max-width:360px;text-align:left}.gb2__processing-note{max-width:700px;margin:10px auto;padding:9px 11px;color:#40565c;background:#eef8f5;border:1px solid #b9ddd3;border-radius:10px;font-size:.72rem;line-height:1.45;text-align:left}.gb2__processing-note strong{color:#267b65}
.gb2__results{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:12px 0}.gb2__results>div{display:grid;gap:2px;padding:7px 9px;background:#081f1d;border:1px solid #315d56;border-radius:4px;text-align:left}.gb2__results dt{font-size:.65rem;line-height:1.2}.gb2__results dd{margin:0;color:#fff;font:900 .78rem Consolas,"Courier New",monospace}
.gb2__controls{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px;padding:13px;background:#123a36;border-top:3px solid #061716}.gb2__base-button{position:relative;display:flex;min-height:62px;align-items:center;justify-content:center;gap:8px;color:#061716;border:2px solid rgba(255,255,255,.62);border-radius:5px;box-shadow:4px 4px 0 #04110f;cursor:pointer;touch-action:manipulation}.gb2__base-button strong{font:900 1.35rem Consolas,"Courier New",monospace}.gb2__base-button small{font-size:.7rem;font-weight:800}.gb2__base-button em{position:absolute;top:3px;right:6px;font:900 .58rem Consolas,"Courier New",monospace;font-style:normal;opacity:.65}.gb2__base-button--a{background:var(--gb2-amber)}.gb2__base-button--t{background:var(--gb2-blue)}.gb2__base-button--c{background:var(--gb2-green)}.gb2__base-button--g{background:#c7a6ff}.gb2__base-button--u{color:#fff;background:var(--gb2-purple);border-color:#e0c6ff}
.gb2__footer{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:11px 14px;color:#b8d9cf;background:#0b2422;border-top:1px solid #2c5d55}.gb2__footer p{margin:0!important;color:inherit!important;font-size:.76rem!important}.gb2__footer>div{display:flex;gap:6px}.gb2__footer button{padding:6px 9px;color:#dff8ef;background:transparent;border:1px solid #568d81;border-radius:4px;cursor:pointer;font-size:.7rem;font-weight:750}
.gb-rna-builder[data-flash="wrong"] .gb2__stage{animation:gb2-shake .18s linear}.gb-rna-builder[data-flash="correct"] .gb2__polymerase{filter:brightness(1.22)}
@keyframes gb2-bind{0%{transform:translate(130%,-30%) scale(.7);opacity:0}55%{opacity:1}100%{transform:translateX(-50%) scale(1)}}@keyframes gb2-release{to{transform:translate(160%,-20%) scale(.75);opacity:0}}@keyframes gb2-shot{from{transform:translate(-50%,80px) scale(.8)}to{transform:translate(-50%,-90px) scale(1)}}@keyframes gb2-shake{0%,100%{transform:translateX(0)}35%{transform:translateX(-5px)}70%{transform:translateX(5px)}}
@container (max-width:760px){.gb2__hud{grid-template-columns:repeat(4,minmax(0,1fr))}.gb2__stage{height:500px}.gb2__base-button{min-height:62px;flex-direction:column;gap:0}.gb2__base-button small{font-size:.58rem}.gb2__footer{align-items:flex-start;flex-direction:column}.gb2__final-sequences p{grid-template-columns:1fr}.gb2__results{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container (max-width:460px){.gb2__topbar{padding-inline:10px}.gb2__topbar strong{font-size:.82rem}.gb2__topbar p{font-size:.58rem}.gb2__top-actions{gap:4px}.gb2__top-actions button{width:33px;height:33px}.gb2__stage{height:480px}.gb2__polymerase{top:45px;width:104px;height:116px;transform:translateX(-86%)}.gb2__polymerase i{margin-top:24px;font-size:.4rem}.gb2__dna-track{transition-duration:.12s}.gb2__mrna{grid-template-columns:30px 38px 1fr 30px}.gb2__mrna-label{font-size:.6rem}.gb2__controls{gap:4px;padding:8px 6px}.gb2__base-button{min-height:58px;padding:3px 1px}.gb2__base-button strong{font-size:1.15rem}.gb2__base-button small{font-size:.5rem}.gb2__results{grid-template-columns:1fr 1fr}.gb2__result-actions{flex-direction:column}.gb2__result-actions button{width:100%}.gb2__mode-grid{grid-template-columns:1fr}.gb2__mode-card{min-height:88px!important}.gb2__overlay{padding:10px}.gb2__overlay-panel{padding:16px 10px}.gb2__footer>div{flex-wrap:wrap}}
@media (prefers-reduced-motion:reduce){.gb-rna-builder *,.gb-rna-builder *::before,.gb-rna-builder *::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}

/* Progressive tempo for Level 3. */
.gb2__hud{grid-template-columns:repeat(8,minmax(0,1fr))}
.gb2__dna-track{transition-duration:var(--gb2-track-duration,.24s)}
.gb2__tempo{position:absolute;top:0;right:0;left:0;z-index:14;height:5px;overflow:hidden;background:rgba(83,121,126,.16)}

/* Visible sugar-phosphate backbones during transcription. */
.gb2__dna-pair::before,.gb2__dna-pair::after{content:none}
.gb2__dna-backbone{position:absolute;z-index:1;display:grid;width:56px;height:24px;grid-template-columns:22px 12px 22px;align-items:center;color:#26383d;font:900 .6rem Consolas,"Courier New",monospace;transition:transform .22s ease}
.gb2__dna-backbone::before{position:absolute;top:10px;right:-4px;left:-4px;z-index:0;height:3px;content:"";background:#67a99a;border-radius:999px}
.gb2__dna-backbone--coding{top:-26px;left:-17px}
.gb2__dna-backbone--template{bottom:-26px;left:17px}
.gb2__dna-pair.is-open .gb2__dna-backbone--coding{transform:translateY(-14px)}
.gb2__dna-pair.is-open .gb2__dna-backbone--template{transform:translateY(14px)}
.gb2__dna-backbone>b{position:relative;z-index:1;display:grid;width:22px;height:22px;place-items:center;border:2px solid #6a9f93;box-shadow:0 2px 0 rgba(25,69,62,.18)}
.gb2__dna-backbone>i{position:relative;z-index:1;display:block;height:3px;background:#67a99a;border-radius:999px}
.gb2__backbone-phosphate{background:#fff0bd;border-color:#d8b758!important;border-radius:50%}
.gb2__backbone-sugar{background:#bce8dc!important;border-color:#67ad9c!important;clip-path:polygon(50% 0,100% 36%,82% 100%,18% 100%,0 36%)}
.gb2__dna-backbone--coding .gb2__backbone-sugar::after{position:absolute;top:20px;left:8px;width:4px;height:15px;content:"";background:#67a99a}
.gb2__dna-backbone--template .gb2__backbone-sugar::before{position:absolute;bottom:20px;left:8px;width:4px;height:15px;content:"";background:#67a99a}
.gb2__upstream-region{position:relative;display:flex;flex:0 0 auto}
.gb2__upstream-region::before{position:absolute;top:-45px;right:-40px;z-index:6;padding:3px 7px;content:"PROMOTOR → +1";color:#586b70;background:rgba(255,255,255,.9);border:1px solid #c9dcd9;border-radius:999px;box-shadow:0 3px 8px rgba(42,78,82,.08);font:900 .52rem Inter,"Source Sans 3",system-ui,sans-serif;letter-spacing:.04em;white-space:nowrap}
.gb2__dna-pair.is-upstream{filter:saturate(.72);opacity:.66}
.gb2__dna-pair.is-upstream .gb2__dna-base{box-shadow:0 2px 6px rgba(42,78,82,.08)}

.gb2__mrna{grid-template-columns:34px 92px 1fr 34px;min-height:82px}
.gb2__mrna-label{display:grid;gap:2px;line-height:1.1}
.gb2__mrna-label small{color:#6c7e83;font-size:.46rem;font-weight:700;line-height:1.2}
.gb2__codon{align-items:flex-start}
.gb2__rna-nucleotide{position:relative;display:grid;width:34px;grid-template-rows:22px 30px;place-items:center}
.gb2__rna-backbone{position:relative;display:grid;width:34px;grid-template-columns:14px 6px 14px;align-items:center;color:#26383d;font:900 .45rem Consolas,"Courier New",monospace}
.gb2__rna-backbone::before{position:absolute;top:6px;right:-4px;left:-5px;z-index:0;height:3px;content:"";background:#9b80c0}
.gb2__rna-backbone>b{position:relative;z-index:1;display:grid;width:14px;height:14px;place-items:center;background:#fff0bd;border:1px solid #c7aa63;border-radius:50%}
.gb2__rna-backbone>b:last-child{background:#dbc9f3;border-color:#9473bd;border-radius:3px;clip-path:polygon(50% 0,100% 36%,82% 100%,18% 100%,0 36%)}
.gb2__rna-backbone>i{position:relative;z-index:1;height:3px;background:#9b80c0}
.gb2__rna-backbone::after{position:absolute;top:12px;right:6px;width:3px;height:11px;content:"";background:#9b80c0}
.gb2__rna-nucleotide .gb2__rna-base{width:29px;height:29px}

@container (max-width:460px){.gb2__mrna{grid-template-columns:30px 64px 1fr 30px}.gb2__mrna-label small{font-size:.4rem}}
.gb2__tempo>span{display:block;width:100%;height:100%;background:linear-gradient(90deg,#68c8a7 0 58%,#edc75f 78%,#ef8377 100%);transform:scaleX(1);transform-origin:left center;will-change:transform}
.gb2__speed-notice{position:absolute;top:34px;left:50%;z-index:16;padding:6px 10px;color:#493a60;background:#f0e8ff;border:1px solid #c8b1e8;border-radius:999px;box-shadow:0 6px 16px rgba(77,59,104,.12);font:900 .68rem Consolas,"Courier New",monospace;letter-spacing:.06em;transform:translateX(-50%)}
.gb2__speed-notice[hidden]{display:none}
@container (max-width:760px){.gb2__hud{grid-template-columns:repeat(4,minmax(0,1fr))}}
@keyframes gb2-bind{0%{transform:translate(130%,-30%) scale(.7);opacity:0}55%{opacity:1}100%{transform:translateX(var(--gb2-polymerase-x,-82%)) scale(1)}}

/* Completed triplets lock together as clearly separated codons. */
.gb2__mrna{min-height:78px}
.gb2__mrna>[data-gb2-mrna]{gap:14px;padding:13px 2px 4px}
.gb2__codon{position:relative;gap:2px;padding:5px 5px 4px;background:rgba(177,145,232,.08);border:2px dashed #9c87bc;border-radius:7px}
.gb2__codon::before{position:absolute;top:-12px;left:50%;content:"CODON " attr(data-codon);color:#745aa7;font:900 .45rem Consolas,"Courier New",monospace;letter-spacing:.05em;transform:translateX(-50%);white-space:nowrap}
.gb2__codon.is-complete{gap:0;background:rgba(177,145,232,.18);border-color:#8f6ec5;box-shadow:0 3px 9px rgba(92,67,132,.12);animation:gb2-codon-lock .28s ease both}
.gb2__codon.is-complete .gb2__rna-base{border-radius:0}
.gb2__codon.is-complete .gb2__rna-base:first-child{border-radius:4px 0 0 4px}
.gb2__codon.is-complete .gb2__rna-base:last-child{border-radius:0 4px 4px 0}
.gb2__codon.is-complete .gb2__rna-nucleotide:first-child .gb2__rna-base{border-radius:4px 0 0 4px}
.gb2__codon.is-complete .gb2__rna-nucleotide:last-child .gb2__rna-base{border-radius:0 4px 4px 0}
.gb2__utr{position:relative;display:flex;flex:0 0 auto;gap:2px;padding:5px 5px 4px;background:rgba(104,200,167,.08);border:2px dashed #83b9aa;border-radius:7px}
.gb2__utr::before{position:absolute;top:-12px;left:50%;content:"5′-UTR";color:#397866;font:900 .45rem Consolas,"Courier New",monospace;letter-spacing:.05em;transform:translateX(-50%);white-space:nowrap}
.gb2__utr.is-complete{border-style:solid;background:rgba(104,200,167,.14)}
.gb2__codon.is-start{background:rgba(255,209,102,.22);border-color:#d6a52f;box-shadow:0 0 0 2px rgba(255,209,102,.2),0 3px 9px rgba(92,67,132,.1)}
.gb2__codon.is-start::before{content:"START · AUG";color:#8a6111}
.gb2__codon.is-stop::before{content:"STOP · " attr(data-sequence);color:#a34f49}

.gb2__translation-preview{display:grid;gap:8px;margin:10px 0;padding:42px 12px 10px;color:#40565c;background:#f7faf9;border:1px solid #d9e6e4;border-radius:9px;overflow-x:auto}
.gb2__translation-strand{display:flex;width:max-content;min-width:100%;align-items:center;justify-content:center;gap:7px;padding:3px 2px 20px;font:900 .72rem Consolas,"Courier New",monospace}
.gb2__translation-strand>strong{color:#745aa7}
.gb2__translation-utr,.gb2__translation-start,.gb2__translation-next{position:relative;display:flex;gap:2px;padding:4px;border-radius:5px}
.gb2__translation-utr{background:#e5f3ee;border:1px solid #9ecbbc}
.gb2__translation-start{background:#fff0bd;border:2px solid #d6a52f;box-shadow:0 0 0 3px rgba(255,209,102,.18)}
.gb2__translation-next{background:#eee8f8;border:1px solid #cbbde3}
.gb2__translation-utr>span,.gb2__translation-start>span:not(.gb2__translation-ribosome),.gb2__translation-next>span{display:grid;width:22px;height:24px;place-items:center;color:#263a40;background:#fff;border-radius:3px}
.gb2__translation-utr>small,.gb2__translation-start>small{position:absolute;bottom:-18px;left:50%;font:900 .48rem Consolas,"Courier New",monospace;letter-spacing:.04em;transform:translateX(-50%);white-space:nowrap}
.gb2__translation-utr>small{color:#397866}.gb2__translation-start>small{color:#8a6111}
.gb2__translation-ribosome{position:absolute;bottom:calc(100% + 5px);left:50%;display:grid;width:82px;height:32px;place-items:center;color:#43555b;background:#d9f2e8;border:2px solid #68a994;border-radius:42px 42px 15px 15px;box-shadow:0 5px 12px rgba(42,78,82,.14);font:900 .52rem Inter,"Source Sans 3",system-ui,sans-serif;letter-spacing:.05em;transform:translateX(-50%)}
.gb2__translation-ribosome::after{position:absolute;right:13px;bottom:-7px;left:13px;height:9px;content:"";background:#eef9f5;border:2px solid #68a994;border-top:0;border-radius:0 0 9px 9px}
.gb2__translation-preview>p{max-width:660px;margin:0 auto!important;color:#536a70!important;font-size:.72rem!important;line-height:1.4!important;text-align:center}
@keyframes gb2-codon-lock{from{transform:scale(1.08)}to{transform:scale(1)}}

/* Keep help in the bottom-left utility slot so the HUD starts immediately. */
.gb2__footer{position:relative;z-index:40;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center}
.gb2__footer-help{position:relative;z-index:2}
.gb2__footer .gb2__help-button{display:grid;width:34px;height:34px;min-height:34px;place-items:center;padding:0;color:#40575d;background:#fff;border:1px solid #b9d4ce;border-radius:50%;box-shadow:0 4px 12px rgba(42,78,82,.1);font-weight:900}
.gb2__help-button[aria-expanded="true"]{color:#185b4c;background:#e2f5ed;border-color:#8cccb6}
.gb2__footer .gb2__help{top:auto;right:auto;bottom:calc(100% + 9px);left:0;width:min(320px,calc(100cqw - 28px))}
@container (max-width:760px){.gb2__footer{grid-template-columns:auto minmax(0,1fr) auto;align-items:center}.gb2__footer p{font-size:.68rem!important}}
@container (max-width:460px){.gb2__footer>div{width:auto;flex-wrap:nowrap}}
