/* Shared glass panels for mode selection and RNA construction. */
.gb-protein-game .gb-protein-game__journey {display:none;}
.pg-game-page .pg-page-header {position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:center;min-height:280px;padding:36px!important;border-radius:26px;background:#143e42;text-align:left;margin-bottom:0;}
.pg-game-page .pg-page-header-image {position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:70% 45%;margin:0;border-radius:0;}
.pg-game-page .pg-page-header:after {content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#123b41ed,#123b4170 65%,#123b4120);}
.pg-game-page .pg-page-header h1 {margin:0!important;color:#f0faf5!important;text-align:left!important;font-size:clamp(1.8rem,3.4vw,3.4rem)!important;overflow-wrap:anywhere;line-height:1.15!important;}
.pg-science-intro {padding:22px 4px 26px;max-width:85ch;}
.pg-science-intro p {font-size:1rem!important;line-height:1.7!important;color:#456259!important;margin:0 0 12px!important;}
.gb-protein-game .gb2__overlay {background:#dcece440!important;backdrop-filter:none;}
.gb-protein-game .gb2__overlay-panel {background:linear-gradient(125deg,#f1faf4cf,#e8e7f2b8)!important;border:1px solid #ffffffd9!important;border-radius:28px!important;box-shadow:0 12px 28px #385c5914!important;}
.gb-protein-game [data-gb2-action="start-standard"] :is(strong,span,small) {color:#f3fcf7!important;}
.gb-protein-game .gb-dna-builder__helix-progress {display:flex;flex-direction:column;width:calc(100% - 24px);max-width:760px;gap:8px;padding:18px;margin:16px auto;background:linear-gradient(120deg,#e8f4f1b3,#e5e0f1a3);border:1px solid #c5dcd3;border-radius:24px;}
.gb-protein-game .gb-dna-builder__helix-graphic {display:block!important;width:100%!important;height:auto!important;aspect-ratio:560/190;transform:none!important;}
.gb-protein-game .gb-dna-builder__helix-graphic svg {width:100%;height:100%;transform:none;filter:drop-shadow(0 3px 2px #2c4b4b25);}
.gb-protein-game .pg-helix-unit text {font:bold 9px monospace;fill:#263b40;stroke:none;text-anchor:middle;}
.gb-protein-game .gb-dna-builder__helix-copy {display:grid;grid-template-columns:1fr auto;width:100%;gap:8px;align-items:center;}
.gb-protein-game .gb-dna-builder__helix-copy span {color:#426b60;font:700 .7rem system-ui;letter-spacing:.06em;}
.gb-protein-game .gb-dna-builder__helix-copy strong {color:#31564b;font-size:.84rem;}
.gb-protein-game .gb-dna-builder__helix-copy small {grid-column:1/-1;color:#4c6a61;font-size:.8rem;line-height:1.5;}
@media(max-width:600px){.pg-game-page .pg-page-header {padding:24px!important;min-height:210px;}.gb-protein-game .gb-dna-builder__helix-progress {padding:12px;}.pg-science-intro p {font-size:.9rem!important;}}
.gb-protein-game .gt3__code-cell>button {position:relative;box-sizing:border-box;}
.gb-protein-game .gt3__code-cell>button:is(.is-found,.is-correct-codon,.is-wrong-codon) {transform:none!important;translate:none!important;border-width:1px!important;outline-offset:-2px;}
.gb-protein-game .gt3__code-cell>button.is-found {box-shadow:inset 0 0 0 1px #46a986!important;}
.gb-protein-game .gti__code-table .gt3__code-cell>button.is-found::after {position:absolute;right:4px;top:3px;font-size:9px;}
.gb-protein-game .gt3__code-cell.is-active-cell {border-width:1px;box-shadow:inset 0 0 0 1px #62b79f;}
.gb-protein-game .gt3__code-cell>button:hover {transform:none!important;translate:none!important;}
.gb-protein-game .gti__navigation {position:sticky;bottom:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 24px;background:#eaf5f0f5;border-top:1px solid #c7ddd2;box-shadow:0 -5px 18px #34594d0a;}
.gb-protein-game .gti__navigation>span {color:#4e6c60;font-size:.78rem;line-height:1.4;}
.gb-protein-game .gti__navigation button {margin:0;min-height:46px;max-width:65%;padding:12px 20px;border:1px solid #659a85;background:linear-gradient(135deg,#377465,#24564f);color:white;font-size:.85rem;font-weight:700;line-height:1.4;cursor:pointer;}
.gb-protein-game .gti__navigation button:disabled {background:#dce9e2;color:#6a8075;border-color:#c3d4ca;cursor:default;}
@media(max-width:600px){.gb-protein-game .gti__navigation {padding:12px;gap:10px;}.gb-protein-game .gti__navigation button {padding:11px 14px;font-size:.78rem;}.gb-protein-game .gti__navigation>span {font-size:.7rem;}}
.gb-protein-game .gti__codon-task {padding:20px 24px;gap:20px;flex-wrap:wrap;}
.gb-protein-game .gti__codon-task>div:first-child>strong {display:flex;align-items:center;gap:18px;flex-wrap:wrap;font-size:.95rem;}
.gb-protein-game .gti__codon-task .gti__target-codon {display:inline-flex;align-items:center;gap:6px;padding:0;background:none;border:0;}
.gb-protein-game .gti__target-codon b {display:grid;place-items:center;width:44px;height:52px;border-radius:12px;font:800 1.8rem/1 monospace;color:#293e43;border:1px solid #ffffffb0;box-shadow:inset 0 1px 0 #fff,0 3px 0 #31544a20;}
.gb-protein-game .gti__target-codon b[data-base="A"] {background:#ffdc83;}
.gb-protein-game .gti__target-codon b[data-base="U"] {background:#c9adeb;}
.gb-protein-game .gti__target-codon b[data-base="C"] {background:#91dbc0;}
.gb-protein-game .gti__target-codon b[data-base="G"] {background:#b9ade0;}
.gb-protein-game .gti__target-codon small {font-size:.95rem;color:#4b675f;}
.gb-protein-game .gti__codon-task>div:last-child>span {font-size:.88rem;padding:9px 13px;}
.gb-protein-game .gt3__code-cell>button {grid-template-columns:44px minmax(0,1fr);min-height:36px;}
.gb-protein-game .gt3__code-cell>button>b {font-size:14px;letter-spacing:.025em;}
.gb-protein-game .gt3__code-cell>button>em {font-size:11px;}
.gb-protein-game .gt3__code-cell>button[data-start="true"] b::after {display:block;font-size:8px;}
.gb-protein-game :is(.gb-dna-builder__overlay,.gt3__overlay,.gr2__overlay) {background:rgba(213,232,227,.25)!important;backdrop-filter:none;}
.gb-protein-game :is(.gb-dna-builder__overlay-panel,.gt3__overlay-panel,.gr2__overlay>div) {background:linear-gradient(125deg,#f1faf4cf,#e8e7f2b8)!important;border:1px solid #ffffffd9!important;border-radius:28px!important;box-shadow:inset 0 1px 0 #fff,0 12px 28px #385c5914!important;padding:26px!important;}
.gb-protein-game :is(.gb-dna-builder__overlay-panel,.gt3__overlay-panel,.gr2__overlay>div) h3 {font-size:clamp(1.25rem,2.2vw,1.65rem)!important;line-height:1.35!important;color:#294b47!important;margin:0 0 12px!important;text-align:left;}
.gb-protein-game :is(.gb-dna-builder__overlay-panel,.gt3__overlay-panel,.gr2__overlay>div)>p {font-size:.9rem!important;line-height:1.6!important;color:#456560!important;text-align:left;}
.gb-protein-game :is([data-gb-action="start-mission"],[data-gt3-action="start-mission"]) :is(strong,span,small) {color:#f3fcf7!important;}
.gb-protein-game :is([data-gb-action="start-endless"],[data-gt3-action="start-endless"]) {background:linear-gradient(140deg,#f1f9f1c9,#dbebe6ab)!important;border:1px solid #afcfc3!important;box-shadow:inset 0 1px 0 #fff,0 3px 0 #b5ccc3!important;}
.gb-protein-game :is([data-gb-action="start-endless"],[data-gt3-action="start-endless"]) :is(strong,span) {color:#34574d!important;}
.gb-protein-game :is(.gb-dna-builder__overlay-actions,.gt3__mode-grid) {gap:14px;margin-block:20px;}
.gb-protein-game :is(.gb-dna-builder__overlay-actions,.gt3__mode-grid) button {text-align:left;padding:20px!important;border-radius:24px!important;}
.gb-protein-game .gr2__backbone-card {background:linear-gradient(125deg,#f0f8f35e,#e5e2f265)!important;border:1px solid #ffffffad!important;border-radius:26px;padding:20px 24px;box-shadow:inset 0 1px 0 #ffffff8a,0 10px 24px #3d585410;}
.gb-protein-game .gr2__chain-unit.is-current {background:#eef6f37d!important;border-radius:22px;}
.gb-protein-game .gr2__backbone-heading {font-family:inherit;font-size:.72rem;letter-spacing:.03em;color:#446259;}
.gb-protein-game :is(.gr2__backbone-note,.gr2__direction-note) {color:#47675f!important;line-height:1.55!important;text-align:left;}
.gb-protein-game :is(.gr2__backbone-note,.gr2__direction-note) strong {color:#2e5148!important;}
.gb-protein-game .gr2__summary {display:grid;gap:10px;padding:16px 20px;background:linear-gradient(130deg,#d0e6dcb8,#ded8ed99);border:1px solid #b9d3c6;border-radius:20px;}
.gb-protein-game .gr2__summary p,.gb-protein-game .gr2__summary strong {color:#32584c!important;font-size:.9rem!important;line-height:1.6!important;text-align:left;}
.gb-protein-game .gr2__cabinet:has(.gr2__overlay) .gr2__stage {height:auto;min-height:0;}
.gb-protein-game .gr2__cabinet:has(.gr2__overlay) .gr2__stage>.gr2__lesson {display:none;}
.gb-protein-game .gr2__overlay {position:relative;inset:auto;overflow:visible;padding:24px;}
.gb-protein-game .gr2__overlay>div {width:min(100%,760px);}
.gb-protein-game .gr2__cabinet:has(.gr2__overlay) .gr2__controls {display:none;}
@media(max-width:600px){.gb-protein-game :is(.gb-dna-builder__overlay-panel,.gt3__overlay-panel,.gr2__overlay>div) {padding:18px!important;}.gb-protein-game .gr2__overlay {padding:16px;}.gb-protein-game .gr2__backbone-card {padding:16px;}}

/* Match the shared photographic page headers. */
.pg-game-page .pg-page-header{min-height:330px;aspect-ratio:3/1;border-radius:0;padding:34px clamp(36px,4vw,56px)!important;}
.gb-protein-game .gb-dna-builder__target span{font-size:10px;letter-spacing:.02em;white-space:nowrap;}
@media(max-width:960px){.pg-game-page .pg-page-header{min-height:310px;}}
@media(max-width:600px){.pg-game-page .pg-page-header{min-height:350px;aspect-ratio:auto;align-items:flex-end;padding:170px 20px 26px!important;}}

.pg-game-page.biology-course-cover{--pg-header-gutter:clamp(36px,4vw,56px);padding-top:0!important;padding-inline:var(--pg-header-gutter)!important;}
.pg-game-page .pg-page-header{max-width:none!important;width:auto;margin:0 calc(-1 * var(--pg-header-gutter))!important;}
@media(max-width:960px){.pg-game-page.biology-course-cover{--pg-header-gutter:20px;}}
.pg-game-page .pg-page-header{box-sizing:border-box;width:calc(100% + 2 * var(--pg-header-gutter))!important;}

.pg-game-page .pg-science-intro{display:flex;align-items:center;gap:24px;max-width:none;padding:20px 0!important;margin:0!important;min-height:0;border:0;}
.pg-science-intro>div{flex:1;}.pg-game-page .pg-science-intro h2{font-size:20px;line-height:1.3;margin:0 0 7px!important;}
.pg-game-page .pg-science-intro p{font-size:14px!important;line-height:1.6!important;margin:0!important;max-width:65ch;}
.pg-reading-link{flex:0 0 230px;font-size:14px;color:#28685b;text-decoration:none;border-left:1px solid #c9dcd3;padding-left:20px;}.pg-reading-link>span:first-child{display:block;font-size:12px;color:#6a7e74;margin-bottom:4px;}.pg-reading-link:hover{text-decoration:underline;}
.pg-game-page .biology-resource-game{margin-top:0!important;padding-top:0!important;border-top:0!important;}.pg-game-page .gb-protein-game{margin-top:0!important;}
.gb-protein-game .gb-dna-builder__target{border:0;box-shadow:none;background:radial-gradient(ellipse at 50% 50%,transparent 38%,#a2cbb76b 43%,#5b948a80 63%,transparent 69%);}
.gb-protein-game .gb-dna-builder__target span{padding:7px 12px;border:1px solid #9dbdae;border-radius:45% 35% 40% 28% / 35% 45% 30% 40%;background:radial-gradient(ellipse at 30% 20%,#f0f7db,#b8d5bb 55%,#79a79b);color:#254c42;box-shadow:inset 0 2px 4px #ffffffab,0 4px 8px #264a4220;letter-spacing:.04em;font:700 10px system-ui;}
.gb-protein-game .gb2__polymerase{clip-path:none;border-radius:44% 56% 38% 48%;background:radial-gradient(ellipse at 25% 20%,#f4e2b9e6,#d7b789cc 50%,#a6bdb9bb);border:1px solid #b3aa85;box-shadow:inset 3px 4px 8px #fff7d8bd,inset -4px -5px 10px #647d7866,0 5px 10px #2e51422b;color:#344f45;}
.gb-protein-game .gb2__polymerase :is(span,strong,i){color:#344f45;text-shadow:none;}.gb-protein-game .gb2__polymerase::after{background:#edf8ed70;border-color:#b6cdbf;border-radius:45%;box-shadow:inset 2px 2px 5px #526f6466;}
@media(max-width:600px){.pg-game-page .pg-science-intro{display:block;padding:16px 0!important;}.pg-reading-link{display:block;margin-top:12px;padding:0;border:0;}.pg-reading-link>span:first-child{display:inline;margin-right:6px;}}
.pg-game-page .pg-science-intro h2{font-size:22px!important;line-height:1.3!important;}

.gb-protein-game .pg-structure-question{padding:18px 22px;margin:0 0 18px;text-align:left;background:#f0f8f5df;border:1px solid #ffffffd9;border-radius:22px;color:#30564e;}
.gb-protein-game .pg-structure-question>span{font-size:11px;font-weight:750;letter-spacing:.08em;color:#448574;}
.gb-protein-game .pg-structure-question h4{font-size:19px!important;line-height:1.4;margin:7px 0!important;}
.gb-protein-game .pg-structure-question p{font-size:14px!important;line-height:1.5;margin:0!important;}
.gb-protein-game :is(.gb0__backbone-card,.gr2__backbone-card,.gb0__pairing-card,.gr2__pairing-card){background:linear-gradient(125deg,#effaf3b8,#eee8f5b0)!important;border:1px solid #ffffffe0!important;border-radius:24px!important;box-shadow:0 7px 22px #395c4910!important;}
.gb-protein-game :is(.gb0__lesson,.gr2__lesson){padding:22px!important;}
.gb-protein-game :is(.gb0__controls,.gr2__controls){background:#f2f8f5d9!important;}
.gb-protein-game .gt3__learning[hidden]{display:none!important;}
@media(max-width:600px){.gb-protein-game :is(.gb0__lesson,.gr2__lesson){padding:12px!important;}.gb-protein-game .pg-structure-question{padding:14px;}.gb-protein-game .pg-structure-question h4{font-size:17px!important;}}
