/* 과학 아틀라스 — 부력 놀이판 */
.by-sec{margin:34px 0 0;padding-top:26px;border-top:1px solid var(--ink-3)}
.by-h{font-family:var(--disp);font-weight:700;font-size:19px;margin-bottom:12px}
.by-tip{color:var(--chalk-dim);font-size:14.5px;line-height:1.7;margin-bottom:14px}

.by-gate{background:var(--ink-2);border:1px solid var(--ink-3);border-radius:var(--radius);padding:18px}
.by-gate-q{font-size:15px;line-height:1.7;margin-bottom:12px}
.by-gate-q b{color:var(--brass-soft);font-weight:500}
.by-gate-btns{display:flex;flex-wrap:wrap;gap:8px}
.by-gate-btns button{background:none;border:1px solid var(--ink-3);color:var(--chalk);
  border-radius:999px;padding:7px 15px;font-size:14px;font-family:inherit;transition:.15s}
.by-gate-btns button:hover:not(:disabled){border-color:var(--brass);color:var(--brass-soft)}
.by-gate-btns button:disabled{opacity:.45}
.by-gate-a{margin-top:13px;padding-top:13px;border-top:1px solid var(--ink-3);
  font-size:14.5px;line-height:1.75;color:var(--brass-soft)}

.by-panel{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}
@media(max-width:640px){.by-panel{grid-template-columns:1fr}}
.by-ctl{background:var(--ink-2);border:1px solid var(--ink-3);border-radius:var(--radius);padding:16px 18px}
.by-lbl{font-family:var(--mono);font-size:11px;letter-spacing:.11em;color:var(--brass);margin:14px 0 8px}
.by-lbl:first-child{margin-top:0}
.by-val{float:right;font-family:var(--mono);letter-spacing:0;color:var(--chalk)}
.by-chips{display:flex;flex-wrap:wrap;gap:6px}
.by-chip{background:none;border:1px solid var(--ink-3);color:var(--chalk-dim);
  border-radius:999px;padding:5px 12px;font-size:13px;font-family:inherit;transition:.15s}
.by-chip:hover{color:var(--chalk);border-color:rgba(232,236,244,.35)}
.by-chip.on{background:var(--brass);border-color:var(--brass);color:var(--ink)}
.by-range{width:100%;margin:4px 0 2px;accent-color:var(--brass)}

.by-view{background:var(--ink-2);border:1px solid var(--ink-3);border-radius:var(--radius);padding:8px}
.by-view svg{width:100%;height:auto;display:block}

.by-card{margin-top:14px;background:var(--ink-2);border:1px solid var(--ink-3);border-radius:var(--radius);padding:18px 20px}
.by-verdict{font-family:var(--disp);font-weight:700;font-size:21px}
.by-verdict.sink{color:var(--chalk-dim)}
.by-verdict.float{color:var(--brass-soft)}
.by-verdict.warn{color:var(--cyan)}
.by-why{margin-top:8px;font-size:14.5px;line-height:1.75}
.by-why b{color:var(--brass-soft);font-weight:500}
.by-num{margin-top:10px;padding-top:10px;border-top:1px solid var(--ink-3);
  font-family:var(--mono);font-size:12px;line-height:1.9;color:var(--chalk-dim)}
.by-note{margin-top:10px;padding-top:10px;border-top:1px solid var(--ink-3);
  font-size:14px;line-height:1.75;color:var(--cyan)}

/* svg 색 — 테마 변수를 그대로 쓴다 */
.sv-liq{fill:var(--cyan);opacity:.22}
.sv-liq-hg{fill:#b9b9c4;opacity:.45}
.sv-liq-oil{fill:#d9b64a;opacity:.25}
.sv-surf{stroke:var(--cyan);stroke-width:1.5;fill:none;opacity:.7}
.sv-wall{stroke:var(--ink-3);stroke-width:2;fill:none}
.sv-box{stroke:var(--chalk);stroke-width:1.5}
.sv-box-in{fill:var(--ink);stroke:none}
.sv-txt{font-family:var(--mono);font-size:10px;fill:var(--chalk-dim)}
.sv-arrow{stroke:var(--brass);stroke-width:2;fill:none}
.sv-arrow-head{fill:var(--brass)}
.sv-hull{fill:#6b7280;stroke:var(--chalk);stroke-width:1.5}
.sv-cargo{fill:var(--brass);opacity:.8}
.sv-line{stroke:var(--brass);stroke-width:2}
.sv-line-txt{font-family:var(--mono);font-size:9.5px;fill:var(--brass)}
.sv-bottom{fill:var(--ink-3)}