.morph-intro{max-width:1440px;margin:auto;padding-top:45px;padding-bottom:42px}.morph-intro h1{font-size:clamp(48px,5vw,74px);max-width:none}.morph-intro>p{font-size:16px;max-width:33ch}.pairing{max-width:1440px;margin:auto;padding-bottom:48px}.calculator-top{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding-top:23px;margin-bottom:22px}.calculator-top .eyebrow{margin:0}.calculator-top button{border:0;font-size:12px;padding-right:0}.parent-pair{display:grid;grid-template-columns:1fr 42px 1fr;align-items:center;gap:16px}.parent-panel{border:1px solid #d8dfd4;border-radius:12px;padding:23px;background:#fff;min-width:0;align-self:stretch;transition:border-color .2s,box-shadow .2s}.parent-panel:focus-within{border-color:#7c8e70;box-shadow:0 4px 22px #26332508}.parent-heading{display:flex;align-items:center;gap:10px;margin-bottom:19px}.parent-heading h2{font-size:23px;letter-spacing:-.03em}.parent-heading>span{font-size:12px;color:var(--muted)}.parent-tags{display:flex;flex-wrap:wrap;align-content:start;gap:8px;min-height:92px;margin-bottom:18px}.gene-chip{display:flex;align-items:center;gap:7px;padding:3px 3px 3px 10px;background:#eff2eb;border:1px solid #e0e6d9;border-radius:5px;font-size:12px;max-width:100%}.gene-chip>span{overflow-wrap:anywhere}.gene-chip select{min-height:34px;font-size:11px;background:transparent;border:0;padding:4px 1px;max-width:92px}.gene-chip button{min-height:34px;min-width:30px;border:0;padding:0;background:transparent;font-size:19px}.normal-tag{font-size:14px;color:#485043;padding-top:5px}.normal-tag small{display:block;font-size:12px;color:var(--muted);margin-top:5px}.gene-search-label{display:block;font-size:11px;color:var(--muted);margin-bottom:6px}.gene-search{width:100%;padding:9px 0;border:0;border-bottom:1px solid #dfe4da;font:inherit;font-size:14px;color:var(--ink);background:transparent;min-height:44px;outline-offset:4px}.gene-options{max-height:235px;overflow:auto;margin-top:10px}.gene-options[hidden]{display:none}.gene-options button{display:flex;align-items:center;gap:10px;width:100%;border:0;border-bottom:1px solid var(--line);text-align:left;font-size:13px;border-radius:0}.gene-options button small{margin-left:auto;font-size:10px;color:var(--muted)}.gene-options p{font-size:13px;padding:12px 0;color:var(--muted)}#swap-parents{border:0;font-size:23px;color:#738069;padding:0}.pair-message{min-height:24px;font-size:12px;color:var(--muted);margin:8px 0}.pair-presets{align-items:center;margin:0 0 35px;gap:8px}.pair-presets>span{font-size:11px;color:var(--muted);margin-right:7px}.pair-presets button{border:0;background:#f6f7f4;border-radius:30px;font-size:11px;min-height:36px;padding:8px 14px}.result-heading h3{font-size:27px}.result-heading p{font-size:12px;color:var(--muted);margin-top:4px}.result-modes{display:flex;background:#f4f5f2;border:1px solid #e6e9e2;border-radius:7px;padding:3px;gap:3px}.result-modes button{min-height:35px;font-size:12px;border:0;background:transparent;padding:6px 12px}.result-modes button[aria-pressed=true]{background:white;box-shadow:0 1px 4px #26332514}.result-explain{margin:15px 0 18px;font-size:12px;max-width:none}.outcome-scroll{max-height:600px;border:1px solid #dfe4da;border-radius:9px}.outcomes{font-size:13px}.outcomes th{background:#f7f8f5;padding:13px 20px}.outcomes th:first-child{width:165px}.outcomes th:last-child{text-align:left}.outcomes th button{font-size:12px;border:0;padding:0;min-height:30px;background:none;color:var(--muted)}.outcomes td{padding:23px 20px;vertical-align:middle}.outcomes td:first-child{padding-right:25px}.outcomes td:last-child{text-align:left;white-space:normal}.outcomes tr:last-child td{border-bottom:0}.outcomes td strong{font-size:20px;letter-spacing:-.04em;font-weight:500}.odds-track{max-width:88px;height:3px;background:#edf0e9;margin-top:8px}.odds-bar{margin:0;background:#7f9270;min-width:0}.trait-tags{display:flex;gap:7px;flex-wrap:wrap}.trait-tag{font-size:12px;padding:5px 10px;border-radius:4px;background:#f2f3f0;color:#465140;border:1px solid #e5e8df}.trait-tag.visual{background:#e9eddf;border-color:#dbe2cc;color:#4c593a}.trait-tag.het{background:#edf1f1;border-color:#dfe7e6;color:#4e6763}.trait-tag.possible{background:#f6f2e9;border-color:#ede5d3;color:#7c6942}.pair-learning{margin-top:30px;border-block:1px solid var(--line)}.pair-learning summary{cursor:pointer;list-style:none;padding:20px 0;font-size:14px;display:flex;justify-content:space-between}.pair-learning summary::-webkit-details-marker{display:none}.pair-learning summary>span{transition:rotate .2s}.pair-learning[open] summary>span{rotate:45deg}.learning-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:45px;padding-bottom:28px}.learning-copy h3{font-weight:400;font-size:25px;letter-spacing:-.03em;margin:15px 0}.learning-copy p{font-size:13px;color:var(--muted);margin:15px 0}.learning-copy a{font-size:12px}.pair-scope{font-size:11px}.library-disclosure{max-width:1440px;margin:auto;padding:0 var(--gutter)}.library-disclosure>summary{list-style:none;cursor:pointer;border-bottom:1px solid var(--line);padding:22px 0;display:flex;justify-content:space-between;gap:20px;font-size:20px;letter-spacing:-.03em}.library-disclosure>summary::-webkit-details-marker{display:none}.library-disclosure>summary span{font-size:12px;letter-spacing:0;color:var(--muted)}.library-disclosure .morph-explorer{padding:25px 0 0!important;border:0}.return{margin-top:65px}
@media(max-width:700px){.morph-intro h1{font-size:51px}.morph-intro{padding-top:25px;padding-bottom:30px}.morph-intro>p{font-size:14px;max-width:36ch}.parent-pair{grid-template-columns:1fr;gap:6px}.parent-panel{padding:18px}.parent-tags{min-height:40px}.parent-heading{margin-bottom:12px}#swap-parents{justify-self:center;min-height:35px;rotate:90deg}.calculator-top .eyebrow{font-size:9px;letter-spacing:.12em}.result-heading{flex-direction:column;gap:16px}.result-modes{width:100%}.result-modes button{flex:1}.outcomes th:first-child{width:85px}.outcomes td,.outcomes th{padding:15px 12px}.outcomes td:first-child{padding-right:10px}.outcomes td strong{font-size:18px}.trait-tag{font-size:11px;padding:4px 7px}.learning-grid{grid-template-columns:1fr;gap:10px}.library-disclosure>summary{font-size:17px}.library-disclosure>summary span{font-size:11px}.pair-presets>span{width:100%}.pair-presets{margin-bottom:25px}}
@media(prefers-reduced-motion:reduce){.parent-panel,.pair-learning summary>span{transition:none}}
/* Keep pairing inputs and the first result close together. */
@media(min-width:701px){.morph-intro{padding-top:28px;padding-bottom:30px}.parent-tags{min-height:76px;margin-bottom:10px}.parent-panel{padding:19px 22px}.parent-heading{margin-bottom:14px}.calculator-top{margin-bottom:15px;padding-top:14px}.pair-message{min-height:18px;margin:4px 0}.pair-presets{margin-bottom:25px}}
.punnett-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:30px 0 24px}.punnett-heading .eyebrow{margin-bottom:9px;font-size:10px}.punnett-heading h3{font-size:30px;font-weight:400;letter-spacing:-.04em;margin:0}.square-context{font-size:12px;color:var(--muted);margin-top:14px}.pair-explain select:disabled{opacity:.5}.punnett td{font-size:13px;padding-block:20px}.punnett small{font-size:14px;font-variant-numeric:tabular-nums}@media(max-width:700px){.punnett-heading{align-items:start;flex-direction:column;gap:18px}.punnett-heading .result-modes{width:100%}.punnett-heading .result-modes button{font-size:11px;padding-inline:7px}}
.pair-explain [hidden]{display:none!important}
.learning-grid.full-pairing{grid-template-columns:minmax(0,1fr)}.full-pairing .learning-copy{max-width:85ch}.learning-grid>.pair-explain{min-width:0}.punnett-scroll{overflow:auto;max-height:650px;margin-top:20px;outline-offset:4px}.punnett.combined{min-width:calc(var(--square-columns)*155px);width:100%;table-layout:fixed;margin:0;border-spacing:5px}.punnett.combined th:first-child{width:155px}.punnett.combined th{padding:12px 8px;vertical-align:top;background:#e8ede3}.punnett.combined th small{font-size:10px;color:#596651;margin-top:10px}.punnett.combined td{padding:20px 12px;font-size:12px;line-height:1.6}.gamete-label{font-size:11px;line-height:1.7}.gamete-label span{display:block}.punnett.combined caption{padding-bottom:8px}.punnett.combined tbody th{position:sticky;left:0;z-index:1}.punnett.combined thead th{position:sticky;top:0;z-index:2}@media(max-width:700px){.punnett.combined{min-width:calc(var(--square-columns)*135px)}.punnett.combined th:first-child{width:135px}.punnett-scroll{max-height:490px}.punnett.combined td{padding:14px 8px}}
/* Genotype colors remain paired with explicit form labels. */
.gene-chip.het,.trait-tag.het{background:#e3eefb;border-color:#b6cce9;color:#274d79}
.gene-chip.visual,.trait-tag.visual{background:#f4e4d5;border-color:#dfbc9b;color:#744019}
.gene-chip.single,.trait-tag.single{background:#e7e4f2;border-color:#c9c0df;color:#51436e}
.gene-chip.super,.trait-tag.super{background:#dcc8ff;border-color:#ad83e5;color:#482275}
.gene-chip select,.gene-chip button{color:inherit}
.gene-chip select:focus{background:rgba(255,255,255,.55)}
.gene-chip{transition:background-color .2s,border-color .2s,color .2s}
@media(prefers-reduced-motion:reduce){.gene-chip{transition:none}}
/* Separate the editable form control from its lighter gene tag. */
.gene-chip{--form-control:#584777}
.gene-chip.het{--form-control:#315d8e}
.gene-chip.visual{--form-control:#8b4b21}
.gene-chip.single{--form-control:#62517f}
.gene-chip.super{--form-control:#713ab0}
.pairing .gene-chip select,.pairing .gene-chip select:focus{background-color:var(--form-control);color:#fff;border:1px solid transparent;border-radius:4px;padding:6px 7px;font-weight:500;color-scheme:dark}
.pairing .gene-chip select:focus-visible{outline:2px solid var(--form-control);outline-offset:3px}
.pairing .gene-chip select option{background:#fff;color:#20251f}

/* Full morph search stays compact and scrollable. */
.gene-options { max-height:320px; overflow-y:auto; overscroll-behavior:contain; }
.catalogue-search-count { font-size:12px; color:#687167; padding:10px 14px; margin:0; }
.gene-chip.unmodeled { background:#f4f1eb; border-color:#d8cbb5; color:#67553c; flex-wrap:wrap; }
.gene-chip.unmodeled small { font-size:11px; }