.reaction-main{max-width:1720px;margin:auto;padding:26px}.reaction-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:24px}.reaction-heading h1{font-size:1.85rem;margin-top:6px}.reaction-heading label{font-size:.875rem;min-width:250px}.reaction-heading select{display:block;width:100%;margin-top:6px}.reaction-workspace{display:grid;grid-template-columns:235px minmax(0,1fr) 255px;gap:20px;align-items:start}.reaction-setup,.reaction-guide,.reaction-atom-info{background:white;border:1px solid var(--line);border-radius:14px;padding:22px}.reaction-setup h2,.reaction-guide h2{font-size:1.1rem;margin:8px 0 12px}.reaction-setup p,.reaction-guide p{line-height:1.6}.reaction-setup>div{display:grid;gap:9px;margin:18px 0}.reaction-setup small{font-size:.8rem;color:var(--muted)}.reaction-setup label:not(.check){font-size:.875rem}.reaction-setup select{width:100%}.condition-check{margin-top:22px;align-items:flex-start;font-weight:600}.condition-check input{flex:none;margin-top:3px}.reaction-atom-label{display:block;margin:24px 0 8px}.reaction-toolbar{display:flex;gap:8px;align-items:center;padding:17px 20px}.reaction-toolbar>div{margin-right:auto}.reaction-toolbar h2{font-size:1.05rem;margin:3px 0}.reaction-vat-host{background:white;border:1px solid var(--line);border-radius:14px;overflow:hidden}.reaction-equation{padding:12px 20px;border-top:1px solid var(--line);background:#eaf5f3;text-align:center;font-size:1.1rem;font-weight:600}.reaction-drag-tools{display:flex;align-items:center;flex-wrap:wrap;gap:12px;padding:12px 18px;font-size:.875rem}#reactionVat{width:100%;height:480px;display:block;background:#142b3e;touch-action:none;user-select:none;cursor:grab}.reaction-legend{display:flex;gap:18px;flex-wrap:wrap;background:#122638;color:#bed3df;padding:12px 18px;font-size:.8rem}.reaction-playback{display:flex;align-items:center;flex-wrap:wrap;gap:9px;padding:16px 18px}.reaction-playback label{font-size:.875rem}.reaction-playback select{padding:7px;margin-left:5px}.reaction-phases{display:flex;gap:12px;padding:0 18px;margin:0;list-style:none;font-size:.8rem;color:var(--muted)}.reaction-phases li{flex:1;border-bottom:3px solid var(--line);padding-bottom:10px}.reaction-phases li.active{color:#086b63;border-color:#36a699;font-weight:600}#reactionProgress{width:calc(100% - 36px);margin:12px 18px 0;height:7px;accent-color:#147e75}.phase-text{padding:4px 18px;font-size:.9rem;min-height:2.6em;color:var(--ink)}#reactionStatus{padding:12px 18px;background:#f1f6fa;margin:0;font-size:.875rem;line-height:1.5}.reaction-audit{display:flex;flex-wrap:wrap;gap:12px;padding:18px 0;font-size:.875rem}.reaction-audit strong{width:100%;font-size:.95rem}.reaction-audit span{background:#e5f2ed;color:#15584e;border-radius:6px;padding:7px 10px}.reaction-model-note{padding:16px 20px;background:white;border:1px solid var(--line);border-radius:12px}.reaction-model-note p{font-size:.875rem;line-height:1.6}.reaction-model-note a{font-size:.875rem}.guide-count{font-size:.8rem;color:var(--muted);margin-top:12px}.guide-nav{display:flex;justify-content:space-between;gap:8px;margin-top:20px}.reaction-inspection{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:20px;margin:30px 0 0 255px}.reaction-inspection .library-stage{height:430px}.reaction-atom-info h2{font-size:1.1rem;margin-bottom:14px}.reaction-atom-info p{line-height:1.6;font-size:.875rem}.reaction-neighbors{display:grid;gap:8px;margin-top:18px}.reaction-neighbors button{text-align:left}.reaction-neighbors small{display:block;font-weight:400;color:var(--muted);margin-top:5px}.reaction-vat-host:fullscreen,.reaction-vat-host.window-fullscreen{overflow:auto;background:#f7fafc}.reaction-vat-host:fullscreen #reactionVat,.reaction-vat-host.window-fullscreen #reactionVat{height:calc(100vh - 390px);min-height:260px}.reaction-page .primary{background:#126b67;color:white;border-color:#126b67}.reaction-page [hidden]{display:none!important}
@media(max-width:1250px){.reaction-workspace{grid-template-columns:220px minmax(0,1fr)}.reaction-guide{grid-column:2}.reaction-inspection{margin-left:240px;grid-template-columns:1fr}.reaction-heading h1{font-size:1.55rem}.reaction-main{padding:20px}}@media(max-width:750px){.reaction-workspace{grid-template-columns:1fr}.reaction-guide{grid-column:auto}.reaction-heading{align-items:stretch;flex-direction:column;gap:14px}.reaction-setup{padding:18px}.reaction-inspection{margin-left:0}.reaction-main{padding:15px}.reaction-toolbar{flex-wrap:wrap;padding:14px}.reaction-toolbar>div{width:100%}#reactionVat{height:370px}.reaction-equation{font-size:1rem}.reaction-inspection .library-stage{height:360px}.reaction-phases{font-size:.75rem}.reaction-page .app-header nav{flex-wrap:wrap}.reaction-playback{padding:12px}.reaction-drag-tools{padding:10px}.reaction-guide{padding:18px}}

.reaction-replay{margin:0 0 20px;border:1px solid var(--line);border-radius:14px;background:white;overflow:hidden}
.replay-heading{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:18px 20px}.replay-heading h2{font-size:1.1rem;margin:5px 0 0}.replay-heading>span{font-size:.8rem;color:var(--muted)}
.reaction-replay [data-empty]{padding:0 20px 20px;font-size:.9rem;line-height:1.6}
.reaction-replay svg{display:block;width:100%;height:300px;background:#142b3e}
.replay-time{padding:18px 20px 4px;display:flex;flex-wrap:wrap;justify-content:space-between;font-size:.85rem;gap:8px}.replay-time input{width:100%;accent-color:#147e75}
.replay-controls,.replay-phases{display:flex;flex-wrap:wrap;gap:8px;padding:10px 20px;font-size:.8rem;align-items:center}.replay-controls select{padding:7px}.replay-phases{display:grid;grid-template-columns:repeat(3,1fr)}.replay-phases button{font-size:.8rem;padding:9px 6px}.replay-phases [aria-pressed=true]{background:#e0f2ed;border-color:#259d8e;color:#0c6258}.replay-note{padding:10px 20px 18px;font-size:.8rem;line-height:1.6}
@media(max-width:750px){.reaction-replay svg{height:260px}.replay-heading{align-items:start;flex-direction:column}.replay-phases{padding:10px}}

.reaction-inspection{grid-template-columns:minmax(0,1fr)}

.reaction-explainer{font-size:.85rem;line-height:1.6;margin:12px 0 18px}.reaction-vat-help{padding:10px 18px;font-size:.8rem}.reaction-vat-help p{margin:10px 0;line-height:1.5}

.explanation-levels{margin:12px 0;flex-wrap:wrap}.explanation-levels button{flex:1;font-size:.8rem}.reaction-model-note [data-explanation] p{margin:10px 0}

.reaction-explainer .explanation-levels,.reaction-guide .explanation-levels{display:grid;grid-template-columns:1fr}.reaction-explainer [data-explanation] p,.reaction-guide [data-explanation] p{margin:10px 0;font-size:.85rem}