/* chip and battery designer, generations guide */
.lab-modal .modal-b { padding: 12px 14px; }
.lab { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.lab-quick { display: flex; flex-wrap: wrap; gap: 6px; align-items: stretch; margin-bottom: 10px; } .lab-quick > span { width: 100%; font-size: 12px; color: var(--mut, #a89a86); }
.lab-quick button { flex: 1 1 90px; text-align: left; padding: 7px 9px; border-radius: 8px; border: 1px solid var(--line, rgba(255, 255, 255, .15)); background: rgba(255, 255, 255, .04); color: inherit; cursor: pointer; min-height: 44px; }
.lab-quick button:hover { border-color: var(--acc, #e0864f); } .lab-quick b { display: block; font-size: 13px; } .lab-quick small { font-size: 11px; color: var(--mut, #a89a86); }
.lab-ctl { margin: 0 0 12px; } .lab-cl { display: flex; justify-content: space-between; align-items: baseline; } .lab-cl b { font-size: 13.5px; } .lab-cl span { font: 700 14px 'JetBrains Mono', monospace; color: var(--acc2, #e0b05a); }
.lab-ctl input[type=range] { width: 100%; margin: 4px 0 2px; } .lab-ctl small { display: block; font-size: 11.5px; line-height: 1.35; color: var(--mut, #a89a86); } .lab-ctl small i { color: #e8745a; font-style: normal; }
.lab-fts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; margin-top: 4px; }
.lab-ft { text-align: left; padding: 7px 9px; border-radius: 8px; border: 1px solid var(--line, rgba(255, 255, 255, .15)); background: rgba(255, 255, 255, .03); color: inherit; cursor: pointer; min-height: 52px; }
.lab-ft b { display: block; font-size: 12.5px; } .lab-ft small { font-size: 11px; color: var(--mut, #a89a86); line-height: 1.3; } .lab-ft.on { border-color: #8fd18a; background: rgba(143, 209, 138, .12); } .lab-ft.locked { opacity: .45; cursor: not-allowed; }
.lab-chem { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; margin: 4px 0; } .lab-chem button { padding: 8px; border-radius: 8px; border: 1px solid var(--line, rgba(255, 255, 255, .15)); background: rgba(255, 255, 255, .03); color: inherit; cursor: pointer; font-size: 12.5px; min-height: 40px; } .lab-chem button.on { border-color: var(--acc, #e0864f); background: rgba(224, 134, 79, .15); } .lab-chem button.locked { opacity: .4; cursor: not-allowed; }
.lab-right { position: sticky; top: 0; }
.lab-vis { background: radial-gradient(circle at 50% 40%, rgba(255, 255, 255, .06), rgba(0, 0, 0, .25)); border: 1px solid var(--line, rgba(255, 255, 255, .12)); border-radius: 12px; padding: 8px; display: flex; justify-content: center; }
.lab-svg { width: 100%; max-width: 300px; height: auto; display: block; }
.lab-hot { animation: labhot 1.4s ease-in-out infinite; } @keyframes labhot { 0%, 100% { opacity: .75; } 50% { opacity: 1; } }
.lab-verdict { margin: 10px 0 6px; font-size: 14px; line-height: 1.45; }
.lab-st { display: grid; grid-template-columns: 82px minmax(0, 1fr) 62px; gap: 8px; align-items: center; margin: 4px 0; font-size: 12.5px; } .lab-st b { text-align: right; font: 700 12px 'JetBrains Mono', monospace; }
.lab-cost { margin-top: 6px; font-size: 13px; } .lab-caps { margin-top: 10px; font-size: 12.5px; line-height: 1.45; color: var(--mut, #a89a86); }
.lab-link { background: none; border: 0; color: var(--acc2, #e0b05a); text-decoration: underline; cursor: pointer; font: inherit; padding: 2px 0; }
.lab-name { margin-top: 10px; display: flex; gap: 8px; align-items: center; } .lab-name label { font-size: 12px; color: var(--mut, #a89a86); } .lab-name input { flex: 1; min-width: 0; }
.lab-mini { width: 100%; max-height: 88px; display: flex; justify-content: center; margin-bottom: 4px; } .lab-mini .lab-svg { max-width: 120px; max-height: 88px; }
.sc-edit { margin-left: 8px; padding: 2px 9px; border-radius: 6px; border: 1px solid var(--line, rgba(255, 255, 255, .25)); background: rgba(255, 255, 255, .06); color: inherit; cursor: pointer; font-size: 11.5px; }
.lab-guide-btn { margin: 6px 14px 4px; width: calc(100% - 28px); }
.gen-list { display: flex; flex-direction: column; gap: 6px; }
.gen-row { display: grid; grid-template-columns: minmax(130px, 1fr) minmax(0, 2.2fr) auto; gap: 10px; align-items: center; padding: 8px 10px; border-radius: 9px; border: 1px solid var(--line, rgba(255, 255, 255, .1)); background: rgba(255, 255, 255, .03); }
.gen-row.done { border-color: rgba(143, 209, 138, .4); } .gen-row.next { border-color: var(--acc, #e0864f); background: rgba(224, 134, 79, .1); }
.gen-n b { display: block; font-size: 13.5px; } .gen-n small { font-size: 11.5px; color: var(--mut, #a89a86); } .gen-t { font-size: 12.5px; line-height: 1.4; }
@media (max-width: 760px) { .lab { grid-template-columns: 1fr; } .lab-right { position: static; order: -1; } .gen-row { grid-template-columns: 1fr auto; } .gen-t { grid-column: 1 / -1; order: 3; } }
@media (max-height: 520px) and (orientation: landscape) { .lab { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .lab-right { position: sticky; order: 0; } .lab-svg { max-width: 220px; } }
