.genetics-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:12px 0}
.genetics-choices button{appearance:none;min-height:52px;border:1px solid var(--border);border-radius:13px;background:#0a362a;color:var(--text);font-size:21px;font-weight:650;cursor:pointer}
.genetics-choices button[aria-pressed=true]{background:#ffd18e;border-color:#ffe1ad;color:#402b0d}
.genetics-result .prep-result-top{flex-wrap:wrap}
.genetics-square{border:1px solid var(--border);border-radius:16px;overflow:hidden;background:#07382b}
.genetics-square table{border-collapse:collapse;width:100%;table-layout:fixed}
.genetics-square caption{padding:15px;font-size:12px;line-height:1.7;text-align:left;color:var(--muted);background:#0b4132}
.genetics-square th,.genetics-square td{padding:14px 8px;border:1px solid var(--border);text-align:center;color:var(--text)}
.genetics-square thead th,.genetics-square tbody th{background:#0e4735;font-size:14px;font-weight:650}
.genetics-square td strong{font-family:var(--font-serif);font-size:29px;color:#ffd18e}
.genetics-square td small{display:block;margin-top:5px;font-size:12px;color:var(--muted)}
.genetics-distribution{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:20px}
.genetics-distribution>div{border:1px solid var(--border);border-radius:12px;padding:12px 5px;text-align:center;background:#093e30}
.genetics-distribution strong{font-size:14px;color:var(--text)}
.genetics-distribution span{display:block;font-size:24px;font-weight:650;margin-top:6px;color:#ffd18e}
.genetics-phenotypes{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:20px}
.genetics-phenotypes strong{display:block;font-size:25px;color:var(--text)}
.genetics-phenotypes span{display:block;font-size:12px;line-height:1.6;margin-top:6px;color:var(--muted)}
.chronology-list{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.chronology-list li{display:grid;grid-template-columns:30px minmax(0,1fr) auto;align-items:center;gap:12px;padding:16px;border:1px solid var(--border);border-radius:17px;background:#073b2e}
.chronology-position{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#1b523e;color:var(--text);font-size:13px}
.chronology-title{min-width:0}
.chronology-title strong{font-size:14px;font-weight:600;line-height:1.6;color:var(--text)}
.chronology-title small{display:block;margin-top:6px;font-size:13px;color:#ffd18e}
.chronology-moves{display:flex;gap:7px}
.chronology-moves button{appearance:none;min-width:44px;min-height:44px;border:1px solid #789578;border-radius:12px;background:#104534;color:var(--text);font-family:inherit;font-size:20px;cursor:pointer}
.chronology-moves button:disabled{opacity:.35;cursor:default}
.chronology-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px}
.chronology-actions .button{min-height:48px}
.chronology-result{margin-top:26px}
.chronology-status{display:flex;gap:18px;align-items:center;padding:20px;border:1px solid var(--border);border-radius:17px;background:#104735;margin-bottom:18px;color:var(--text)}
.chronology-status .art{width:48px;height:48px;flex:none}
.chronology-status strong{display:block;font-size:18px;line-height:1.5}
.chronology-status p{margin-top:8px;font-size:13px;line-height:1.6;color:var(--muted)}
[data-genetics] [hidden],[data-chronology] [hidden]{display:none!important}
:root[data-theme=light] .genetics-choices button,:root[data-theme=light] .genetics-square,:root[data-theme=light] .genetics-distribution>div,:root[data-theme=light] .chronology-list li{background:#f4f7ec;border-color:#bdcdb4;color:var(--text)}
:root[data-theme=light] .genetics-choices button[aria-pressed=true]{background:#ffd18e;border-color:#d8ad65;color:#402b0d}
:root[data-theme=light] .genetics-square caption,:root[data-theme=light] .genetics-square th{background:#e4ecd9}
:root[data-theme=light] .genetics-square td strong,:root[data-theme=light] .genetics-distribution span,:root[data-theme=light] .chronology-title small{color:#6c4b1e}
:root[data-theme=light] .chronology-position,:root[data-theme=light] .chronology-moves button,:root[data-theme=light] .chronology-status{background:#e1ecda;color:var(--text)}
@media(max-width:650px){.chronology-list li{grid-template-columns:30px minmax(0,1fr);gap:10px;padding:14px}.chronology-moves{grid-column:2;justify-content:flex-end}.chronology-moves button{min-width:50px}.chronology-actions .button{flex:1 1 100%}.genetics-phenotypes{grid-template-columns:1fr}.genetics-square caption{padding:13px}.genetics-square th,.genetics-square td{padding:14px 5px}.genetics-square th{font-size:12px!important}}