.translation-lab{margin:24px 0;border:1px solid var(--line);border-radius:14px;background:var(--panel);overflow:hidden}.tl-head{padding:24px;display:flex;align-items:start;justify-content:space-between;gap:24px}.tl-head h2{font-size:30px;line-height:1.15}.translation-lab button,.translation-lab select{font:11px system-ui;color:var(--text);background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:9px;cursor:pointer}.translation-lab button[aria-pressed=true]{border-color:var(--mint);box-shadow:inset 0 -2px var(--mint)}.translation-lab button:disabled{opacity:.4;cursor:default}.tl-tools{padding:12px 24px;display:flex;flex-wrap:wrap;gap:8px;align-items:center;border-block:1px solid var(--line)}.tl-tools label{font-size:11px;display:flex;gap:8px;align-items:center}.tl-sequence{padding:18px 24px;display:flex;flex-wrap:wrap;gap:8px;align-items:center;font:12px ui-monospace,monospace}.tl-sequence span{padding:7px;border:1px solid transparent;border-radius:4px}.tl-sequence .tl-active{border-color:var(--mint);background:color-mix(in srgb,var(--mint) 13%,transparent)}.tl-sequence .tl-read{opacity:.55}.tl-split{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(290px,1fr);border-block:1px solid var(--line)}.tl-view{min-height:420px;position:relative;background:var(--bg)}.tl-view canvas{display:block;width:100%;height:440px;touch-action:none;outline-offset:-3px;cursor:grab}.tl-view [data-overlay]{position:absolute;inset:0;pointer-events:none}.tl-view .tl-view-note{position:absolute;left:18px;bottom:12px;right:18px;font-size:10px;color:var(--soft);pointer-events:none}.tl-explain{padding:24px;border-left:1px solid var(--line)}.tl-explain h3{font:25px var(--serif);margin:10px 0}.tl-explain p{font-size:12px;line-height:1.75;margin:10px 0}.tl-inventory{font:12px ui-monospace,monospace;color:var(--mint);line-height:1.9}.tl-steps{display:flex;gap:5px;flex-wrap:wrap;padding:14px 24px}.tl-steps button{font-size:10px}.tl-chem{padding:20px 24px}.tl-chem h3{font:23px var(--serif)}.tl-chem svg{display:block;width:100%;height:auto;max-height:320px;border:1px solid var(--line);border-radius:8px;background:#f2f6f1;margin:14px 0}.tl-chem svg text{font:13px system-ui;fill:#263e3d}.tl-chem svg .tl-small{font-size:11px}.tl-chem p,.translation-lab details{font-size:12px;line-height:1.8}.translation-lab details{padding:18px 24px;border-top:1px solid var(--line)}.translation-lab details p{margin:10px 0}.tl-statusline{padding:12px 24px;font-size:11px;line-height:1.7;border-top:1px solid var(--line)}.tl-key{display:flex;gap:14px;flex-wrap:wrap;font-size:11px}.tl-key i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:5px}.tl-picked{padding:10px 0;font-size:11px;color:var(--mint)}@media(max-width:760px){.tl-head{display:block}.tl-head button{margin-top:12px}.tl-split{display:block}.tl-explain{border-left:0;border-top:1px solid var(--line)}.tl-view canvas{height:360px}.tl-head,.tl-explain,.tl-chem{padding:20px}.tl-chem svg{min-height:210px}.tl-sequence{font-size:10px;gap:1px}}
