.biology-page { background: #060b12; color: #e8f5ff; }
.biology-main { max-width: 1320px; padding-top: 42px; padding-bottom: 72px; }
.biology-hero { display:flex; justify-content:space-between; align-items:center; gap:30px; min-height:240px; position:relative; overflow:hidden; }
.biology-hero h1 { margin:12px 0 14px; max-width:760px; font-size:clamp(2.6rem,6vw,5.8rem); line-height:.94; letter-spacing:-.055em; color:#f2fbff; }
.biology-lead { max-width:680px; margin:0; color:#96b3c7; font-size:1.08rem; line-height:1.7; }
.biology-hero-orbit { width:220px; height:220px; flex:0 0 220px; border:1px solid rgba(46,214,255,.25); border-radius:50%; position:relative; box-shadow:0 0 70px rgba(21,169,255,.16), inset 0 0 45px rgba(21,169,255,.1); transform:rotate(-25deg); }
.biology-hero-orbit:before,.biology-hero-orbit:after { content:""; position:absolute; inset:28px -22px; border:1px solid rgba(127,247,218,.35); border-radius:50%; transform:rotate(55deg); }
.biology-hero-orbit:after { inset:-12px 28px; transform:rotate(110deg); }
.biology-hero-orbit span,.biology-hero-orbit i,.biology-hero-orbit b { position:absolute; width:14px; height:14px; border-radius:50%; background:#73f4d1; box-shadow:0 0 25px #73f4d1; }
.biology-hero-orbit span { top:26px; left:85px; }.biology-hero-orbit i { right:19px; bottom:56px; background:#39c9ff; box-shadow:0 0 25px #39c9ff; }.biology-hero-orbit b { left:30px; bottom:26px; background:#ffad66; box-shadow:0 0 25px #ffad66; }
.biology-lab { display:grid; grid-template-columns:340px minmax(0,1fr); min-height:620px; padding:0; overflow:hidden; background:linear-gradient(135deg,rgba(16,31,48,.97),rgba(7,14,23,.98)); border:1px solid rgba(95,171,216,.2); }
.biology-controls { padding:34px 28px; border-right:1px solid rgba(95,171,216,.18); display:flex; flex-direction:column; }
.biology-section-label { display:flex; align-items:center; gap:8px; color:#66e7c4; letter-spacing:.16em; font-size:.7rem; font-weight:800; }.biology-section-label small { font-size:.66rem; }.status-dot { width:7px; height:7px; border-radius:50%; background:#73f4d1; box-shadow:0 0 14px #73f4d1; }
.biology-controls h2 { font-size:1.55rem; margin:24px 0 15px; }
.pdb-file-label,.pdb-id-form label { display:block; color:#8daaba; font-size:.72rem; font-weight:800; letter-spacing:.07em; text-transform:uppercase; }.pdb-file-label { padding:12px; border:1px dashed rgba(104,196,216,.42); border-radius:9px; background:rgba(54,162,194,.06); cursor:pointer; }.pdb-file-label:hover { border-color:#63e6cb; }.pdb-file-label input { display:block; width:100%; margin-top:8px; color:#9bc0d1; font-size:.74rem; }.pdb-id-form { margin-top:15px; }.pdb-id-form > div { display:flex; gap:7px; margin-top:7px; }.pdb-id-form input { min-width:0; flex:1; padding:10px 11px; border:1px solid rgba(102,151,188,.3); border-radius:7px; background:#07111a; color:#e9fbff; font:800 .85rem monospace; text-transform:uppercase; letter-spacing:.12em; }.pdb-id-form .btn { padding:9px 11px; font-size:.71rem; }.pdb-mini-label { margin:18px 0 8px; color:#8daaba; font-size:.72rem; font-weight:800; letter-spacing:.07em; text-transform:uppercase; }.pdb-quick-load { display:grid; gap:7px; }.pdb-quick-load button { display:flex; align-items:center; justify-content:space-between; gap:7px; padding:9px 11px; border:1px solid rgba(102,151,188,.2); border-radius:7px; background:rgba(255,255,255,.025); color:#d7f3fa; cursor:pointer; font:800 .76rem monospace; text-align:left; }.pdb-quick-load button:hover { border-color:#42d4ff; background:rgba(40,176,225,.13); }.pdb-quick-load span { color:#7895a9; font:600 .67rem system-ui,sans-serif; }
.molecule-picker { display:grid; gap:8px; }.molecule-choice { text-align:left; border:1px solid rgba(102,151,188,.2); background:rgba(255,255,255,.025); color:#bdd0dd; border-radius:10px; padding:13px 14px; cursor:pointer; transition:.2s ease; }.molecule-choice:hover,.molecule-choice.is-active { border-color:#42d4ff; background:rgba(40,176,225,.13); transform:translateX(3px); color:#fff; }.molecule-choice strong,.molecule-choice span { display:block; }.molecule-choice strong { font-size:.88rem; color:inherit; }.molecule-choice span { margin-top:4px; font-size:.73rem; color:#7895a9; }
.biology-fact { margin-top:22px; min-height:112px; padding:15px; border-left:2px solid #62eecb; background:rgba(98,238,203,.05); color:#a5c1d0; line-height:1.55; font-size:.83rem; }.biology-fact strong { display:block; color:#edfaff; margin-bottom:6px; }.biology-fact em { color:#72eed1; font-style:normal; }
.biology-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:20px; }.biology-actions .btn { font-size:.72rem; padding:10px 12px; }.biology-note { margin-top:auto; padding-top:24px; color:#668296; font-size:.7rem; line-height:1.55; }
.biology-stage-shell { position:relative; min-height:620px; background:radial-gradient(circle at 50% 48%,rgba(20,87,112,.36),transparent 45%),linear-gradient(135deg,#07131f,#03070d); }.biology-stage { position:absolute; inset:0; }.biology-stage canvas { display:block; width:100%; height:100%; }.biology-stage-topline { position:absolute; top:20px; left:24px; right:24px; display:flex; justify-content:space-between; color:#6e9bb3; letter-spacing:.18em; font-size:.65rem; pointer-events:none; }.biology-stage-topline b { color:#d8f7ff; letter-spacing:.12em; }.biology-legend { position:absolute; bottom:20px; left:24px; display:flex; flex-wrap:wrap; gap:12px; color:#94b1c1; font-size:.7rem; pointer-events:none; }.biology-legend span { display:flex; align-items:center; gap:4px; }.biology-legend i { width:8px; height:8px; border-radius:50%; display:inline-block; }.legend-carbon{background:#b8c7d1}.legend-oxygen{background:#ff706f}.legend-nitrogen{background:#5c9eff}.legend-sulfur{background:#f1d454}.legend-phosphorus{background:#ffad55}.legend-iron{background:#d07b4e}.biology-stage-error { position:absolute; inset:40% 12%; text-align:center; color:#ffadad; }.biology-theory-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:18px; }.biology-theory-grid article { padding:25px; background:rgba(12,27,42,.8); border:1px solid rgba(95,171,216,.14); }.theory-index { color:#66e7c4; font:800 .72rem monospace; letter-spacing:.2em; }.biology-theory-grid h2 { margin:12px 0 8px; font-size:1.2rem; }.biology-theory-grid p { color:#8ba5b6; line-height:1.65; font-size:.85rem; margin:0; }
.pdb-samples { margin-top:55px; padding-top:34px; border-top:1px solid rgba(95,171,216,.18); }.pdb-heading { max-width:680px; }.pdb-heading h2 { margin:10px 0 8px; font-size:clamp(1.7rem,3vw,2.5rem); }.pdb-heading > p:last-child { color:#8ba5b6; line-height:1.65; margin:0; }.pdb-sample-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:10px; margin-top:22px; }.pdb-sample { min-height:160px; padding:16px; display:flex; flex-direction:column; border:1px solid rgba(95,171,216,.16); background:linear-gradient(145deg,rgba(18,42,60,.86),rgba(7,18,28,.9)); color:#dff7ff; text-decoration:none; transition:.2s ease; }.pdb-sample:hover { border-color:#55dcc9; transform:translateY(-4px); box-shadow:0 10px 24px rgba(0,0,0,.24); }.pdb-number { color:#62eecb; font:800 .66rem monospace; letter-spacing:.14em; }.pdb-sample strong { margin-top:20px; font-size:.95rem; }.pdb-sample small { margin-top:7px; color:#85a4b6; line-height:1.45; font-size:.71rem; }.pdb-sample em { margin-top:auto; padding-top:15px; color:#62eecb; font:700 .69rem monospace; font-style:normal; }.pdb-index-link { display:inline-block; margin-top:18px; color:#85b6ca; font-size:.8rem; text-decoration:none; }.pdb-index-link:hover { color:#62eecb; }
@media(max-width:1050px){.pdb-sample-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:850px){.biology-hero-orbit{width:150px;height:150px;flex-basis:150px}.biology-lab{grid-template-columns:1fr}.biology-controls{border-right:0;border-bottom:1px solid rgba(95,171,216,.18)}.biology-stage-shell{min-height:500px}.biology-theory-grid{grid-template-columns:1fr}}
@media(max-width:850px){.pdb-sample-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.biology-main{padding-top:24px}.biology-hero{min-height:0;padding:20px 0 35px}.biology-hero-orbit{display:none}.biology-hero h1{font-size:2.9rem}.biology-controls{padding:24px 18px}.biology-stage-shell{min-height:420px}.biology-legend{gap:7px;left:14px}.biology-stage-topline{left:14px;right:14px}.pdb-sample-grid{grid-template-columns:1fr}}
