.codecr-dna{margin:0;width:100%;color:#f5f5f5}.codecr-dna [data-dna-stage]{position:relative;width:100%;aspect-ratio:620/860;max-height:840px;overflow:hidden;isolation:isolate;touch-action:pan-y;background:transparent}.codecr-dna [data-dna-canvas]{display:block;width:100%;height:100%;opacity:0}.codecr-dna [data-dna-canvas][hidden],.codecr-dna [data-dna-pause][hidden]{display:none}[data-dna-state=ready] [data-dna-canvas]{opacity:1}.codecr-dna [data-dna-fallback]{position:absolute;inset:0;display:block;background:url(./dna.svg) center/contain no-repeat}.codecr-dna img[data-dna-fallback]{inset:0;width:100%;height:100%;object-fit:contain}[data-dna-state=ready] [data-dna-fallback]{visibility:hidden}.codecr-dna__controls{display:flex;align-items:center;gap:14px;padding-top:12px}.codecr-dna [data-dna-pause]{min-height:44px;padding:9px 15px;border:1px solid #696969;border-radius:2px;color:#f5f5f5;background:#05070a;font:inherit;cursor:pointer}.codecr-dna [data-dna-pause]:focus-visible{outline:2px solid #f5f5f5;outline-offset:4px}.codecr-dna [data-dna-pause]:disabled{opacity:.5;cursor:default}.codecr-dna__hint,.codecr-dna__caption{font-size:.75rem;line-height:1.6;color:#aaa}.codecr-dna__caption{margin-top:8px;color:#696969}@media(max-width:640px){.codecr-dna [data-dna-stage]{max-height:650px}}@media(prefers-reduced-motion:reduce){.codecr-dna *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}@media(forced-colors:active){.codecr-dna [data-dna-pause]{color:ButtonText;border-color:ButtonText;background:ButtonFace}.codecr-dna [data-dna-pause]:focus-visible{outline-color:Highlight}}