:root{
  color-scheme:dark;
  --bg:#08111d;--panel:#101d30;--panel2:#13243a;--line:#2a405e;--ink:#f4f8fb;--muted:#a8bad0;
  --accent:#22b8cf;--accent2:#60a5fa;--ok:#34d399;--warn:#fbbf24;--bad:#fb7185;
}
*{box-sizing:border-box} body{margin:0;background:radial-gradient(circle at top,#14253f 0,#08111d 48%);color:var(--ink);font:15px/1.5 system-ui,-apple-system,Segoe UI,sans-serif}
button,select,input,textarea{font:inherit} button{cursor:pointer} button:disabled{cursor:not-allowed;opacity:.45}
.hero{max-width:1480px;margin:auto;padding:24px 26px 14px;display:flex;justify-content:space-between;gap:20px;align-items:flex-start}.hero h1{font-size:2.5rem;margin:.05rem 0}.hero p{margin:.2rem 0;color:var(--muted)}
.eyebrow,.kicker,.small-label{font-size:.75rem;letter-spacing:.09em;text-transform:uppercase;font-weight:800;color:#8ddce7}.version{padding:10px 14px;border:1px solid var(--line);border-radius:14px;text-align:right;font-weight:800;background:rgba(16,29,48,.85)}.version small{color:var(--muted)}
.shell{max-width:1480px;margin:auto;padding:0 18px 26px}.card{background:linear-gradient(180deg,rgba(19,36,58,.97),rgba(12,25,42,.98));border:1px solid var(--line);border-radius:16px;box-shadow:0 14px 40px rgba(0,0,0,.16)}
.setup-card{padding:14px 16px}.setup-grid{display:grid;grid-template-columns:1.1fr .8fr 1.7fr auto;gap:12px;align-items:end}.case-intro{display:grid;gap:2px;padding:4px 2px}.case-intro span:last-child{color:var(--muted)}
label{display:grid;gap:6px;font-weight:700;color:#d9e6f3} select,input,textarea{width:100%;border:1px solid var(--line);border-radius:10px;background:#0a1728;color:var(--ink);padding:9px 10px} textarea{resize:vertical;font-weight:400;line-height:1.45}
button{border:1px solid var(--line);border-radius:10px;padding:10px 13px;font-weight:800}.primary{background:#0f7890;color:white;border-color:#2ab6ca}.secondary{background:#182a42;color:#e5edf6}.ghost{background:transparent;color:#c9d8e8}.danger{color:#ffd1d8;border-color:rgba(251,113,133,.45);background:rgba(127,29,29,.16)}.subtle{width:100%;margin-top:12px}.compact{white-space:nowrap}.mini{padding:7px 10px;font-size:.82rem}
.stepper{margin:14px 0;padding:9px;display:grid;grid-template-columns:repeat(5,1fr);gap:7px}.step{display:grid;grid-template-columns:30px 1fr;grid-template-rows:auto auto;text-align:left;gap:0 7px;align-items:center;background:#0b1829;color:#d5e2ef}.step span{grid-row:1/3;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#1d3450;color:#bcd0e5}.step strong{font-size:.94rem}.step small{color:var(--muted)}.step.active{border-color:#31bed1;background:rgba(15,120,144,.22)}.step.active span{background:#0f7890;color:white}.step.done span{background:#176b54;color:#d5fff1}.step.locked{opacity:.48}
.work-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:14px}.workspace,.journal-card{padding:18px}.journal-card{position:sticky;top:10px;align-self:start}.section-head{display:flex;justify-content:space-between;gap:12px;align-items:center}.section-head h2{margin:.1rem 0 0}.stage{display:none;margin-top:14px}.stage.active{display:block}.mass-panel{padding:22px;border:1px solid var(--line);border-radius:14px;background:#0a1728}.mass-value{display:flex;align-items:baseline;gap:10px;margin:8px 0}.mass-value strong{font-size:3rem}.mass-value span{color:var(--muted)}.formula-box{display:inline-block;padding:7px 10px;border-radius:9px;background:#172b42;font-size:1.15rem;font-weight:800}.explain,.hint{color:var(--muted)}.journal-input{margin-top:14px}.next-btn{margin-top:12px}
.toolbar{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:9px;color:#cbd9e7}.wrap{flex-wrap:wrap}.toggle{display:flex;grid-template-columns:auto 1fr;align-items:center;gap:6px;font-weight:600;color:#cbd9e7}.toggle input{width:auto}
canvas{display:block;width:100%;height:auto;background:#07101b;border:1px solid var(--line);border-radius:12px}.readout{margin-top:8px;padding:8px 10px;border-radius:9px;background:#0b1829;color:#b8cbe0;font-family:ui-monospace,SFMono-Regular,Consolas,monospace}.signal-table{display:flex;gap:7px;flex-wrap:wrap;margin-top:8px}.signal-chip{padding:6px 8px;border:1px solid var(--line);border-radius:999px;background:#0b1829;color:#cbd9e7;font-size:.82rem}.signal-chip strong{color:#f0f7ff}.signal-chip.meta{background:#112335;color:#9fc3e7}
.hypothesis-block{border:1px solid var(--line);border-radius:14px;background:#0a1728;padding:16px;margin-bottom:12px}.hypothesis-block h3{margin:.35rem 0 .7rem}.locked-panel{opacity:.48;pointer-events:none}.locked-panel.unlocked{opacity:1;pointer-events:auto}.class-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:7px}.class-choice{background:#13253b;color:#e0eaf4}.class-choice.selected{border-color:#22b8cf;background:#123b4b}.feedback{margin-top:10px;padding:10px 12px;border:1px solid var(--line);border-radius:10px}.feedback.neutral{color:var(--muted)}.feedback.good{border-color:rgba(52,211,153,.55);background:rgba(6,78,59,.22)}.feedback.warn{border-color:rgba(251,191,36,.55);background:rgba(120,53,15,.2)}.feedback.bad{border-color:rgba(251,113,133,.6);background:rgba(127,29,29,.2)}
.structure-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.structure-card{min-height:142px;padding:14px 12px;border:1px solid var(--line);border-radius:12px;background:#0d1b2d;color:#e8f1f8;display:grid;place-items:center}.structure-card svg{width:100%;height:108px;overflow:visible}.structure-card svg text{font-weight:700;letter-spacing:.2px;paint-order:stroke;stroke:rgba(7,16,27,.8);stroke-width:1.6px;stroke-linejoin:round}.structure-card.selected{border-color:#22b8cf;box-shadow:inset 0 0 0 1px #22b8cf;background:#123143}
.journal-view{display:grid;gap:9px}.journal-item{padding:10px;border:1px solid var(--line);border-radius:11px;background:#0a1728}.journal-item strong{display:block;font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;color:#8ddce7;margin-bottom:3px}.journal-item span{color:#c8d7e7;white-space:pre-wrap}.journal-item.empty span{color:#71869c}.journal-status{display:flex;justify-content:space-between;margin-top:12px;padding:9px 0;border-top:1px solid var(--line);color:var(--muted)}.journal-status strong{color:#e6eef6}
.overlay{position:fixed;inset:0;background:rgba(0,0,0,.7);display:none;place-items:center;padding:20px;z-index:20}.overlay.open{display:grid}.toolbox{width:min(920px,96vw);max-height:90vh;overflow:auto;border:1px solid var(--line);border-radius:16px;background:#0d1b2d;padding:18px;box-shadow:0 24px 80px rgba(0,0,0,.45)}.toolbox-tabs{display:flex;gap:7px;flex-wrap:wrap;margin:14px 0}.toolbox-tabs button{background:#13263d;color:#dce7f1}.toolbox-tabs button.active{background:#0f7890;border-color:#2ab6ca}.toolbox-content{padding:14px;border:1px solid var(--line);border-radius:12px;background:#081522}.toolbox-content h3{margin-top:0}.toolbox-content ul{padding-left:20px}.toolbox-content .formula-steps{display:grid;gap:7px}.formula-steps div{padding:8px 10px;border-left:3px solid #2a99ad;background:#0c1b2d}
footer{max-width:1480px;margin:auto;padding:0 20px 24px;text-align:center;color:#71869c;font-size:.82rem}
@media(max-width:1050px){.setup-grid{grid-template-columns:1fr 1fr}.case-intro{grid-column:1/3}.work-grid{grid-template-columns:1fr}.journal-card{position:static}.class-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:700px){.hero{padding-inline:16px}.hero h1{font-size:2rem}.stepper{grid-template-columns:1fr}.setup-grid{grid-template-columns:1fr}.case-intro{grid-column:auto}.class-grid,.structure-grid{grid-template-columns:1fr}.toolbar{align-items:flex-start}.version{font-size:.8rem}}

.structure-card svg g[stroke]{stroke:rgba(190,207,225,.78);stroke-width:2.15px}
.reference-compare{margin-top:12px;padding:12px;border:1px solid var(--line);border-radius:12px;background:#081522}
.reference-compare[hidden]{display:none}
.reference-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.reference-toolbar>div:first-child{display:grid;gap:2px}.reference-toolbar span{color:var(--muted);font-size:.84rem}
.reference-tabs{display:flex;gap:6px;flex-wrap:wrap}.reference-tabs button{padding:7px 10px;background:#13263d;color:#dce7f1}
.reference-tabs button.active{background:#0f7890;border-color:#2ab6ca}
.reference-legend{margin-top:8px;color:#c5d5e6;font-size:.84rem}
@media(max-width:700px){.reference-toolbar{align-items:flex-start;flex-direction:column}}

.reference-candidate{min-width:190px;font-size:.82rem}.reference-candidate select{padding:7px 9px}
.proton-signal-list{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}
.proton-signal{display:grid;gap:2px;text-align:left;background:#13263d;color:#dce7f1}
.proton-signal span{font-size:.8rem;color:var(--muted)}
.proton-signal.active{border-color:#22b8cf;background:#123b4b}
.proton-signal.done{border-color:rgba(52,211,153,.6);background:rgba(6,78,59,.22)}
.proton-structure{max-width:760px;margin:12px auto;padding:12px;border:1px solid var(--line);border-radius:12px;background:#0b1829}
.proton-svg svg{display:block;width:100%;height:auto;color:#e7eff7}
.proton-svg svg > g:not(.proton-group-hit){pointer-events:none}
.proton-group-hit{cursor:pointer;pointer-events:all}
.proton-group-hit rect{fill:transparent;stroke:transparent;stroke-width:1.6;transition:fill .15s ease,stroke .15s ease}
.proton-group-hit:hover rect{fill:rgba(34,184,207,.08);stroke:rgba(94,213,226,.55)}
.proton-group-hit.active rect{fill:rgba(52,211,153,.16);stroke:#57d8b0;stroke-width:2}
.proton-signal.active{box-shadow:inset 0 0 0 1px rgba(87,216,176,.75)}

.fragment-chip-list{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}
.fragment-chip{display:grid;gap:2px;text-align:left;background:#13263d;color:#dce7f1}
.fragment-chip span{font-size:.8rem;color:var(--muted)}
.fragment-chip.active{border-color:#f5c66a;background:rgba(120,79,15,.24);box-shadow:inset 0 0 0 1px rgba(245,198,106,.45)}
.fragment-detail{margin-top:10px;padding:12px;border:1px solid rgba(52,211,153,.45);border-radius:10px;background:rgba(6,78,59,.16);color:#dfeee8}
.fragment-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:7px}
.fragment-ion{font:700 1.1rem ui-monospace,SFMono-Regular,Consolas,monospace;color:#f5d58a}
.fragment-detail p{margin:.5rem 0 0}


/* v0.1.5 · gemeinsame Spektrenwerkstatt */
.workbench-stage{padding:16px}
.workbench-head{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;margin-bottom:12px}
.workbench-head h3{margin:.25rem 0 .35rem}
.workbench-modes,.workbench-methods{display:flex;gap:7px;flex-wrap:wrap}
.workbench-modes button,.workbench-methods button{background:#13263d;color:#dce7f1;padding:8px 11px}
.workbench-modes button.active,.workbench-methods button.active{background:#0f7890;border-color:#2ab6ca;color:#fff}
.workbench-toolbar{display:flex;justify-content:space-between;gap:12px;align-items:end;margin-bottom:10px;padding:10px;border:1px solid var(--line);border-radius:11px;background:#0b1829}
.workbench-spectrum{padding:10px;border:1px solid var(--line);border-radius:12px;background:#07101b}
.workbench-spectrum canvas{border:0;background:#07101b}
.workbench-learning{margin-top:10px}
.workbench-learning[hidden],#workbenchCompareHint[hidden],#workbenchCandidateWrap[hidden],#workbenchMsPanel[hidden],#workbenchIrPanel[hidden],#workbenchNmrPanel[hidden]{display:none}
.workbench-options{display:flex;gap:16px;flex-wrap:wrap;margin:9px 0}
.workbench-footer-hint{margin-bottom:0}
@media(max-width:760px){
  .workbench-head,.workbench-toolbar{align-items:flex-start;flex-direction:column}
  .workbench-modes,.workbench-methods{width:100%}
  .workbench-modes button,.workbench-methods button{flex:1}
}


/* v0.2.0 · Analytik-Hub */
.bridge-context{display:none;max-width:1480px;margin:0 auto 14px;padding:12px 16px;border:1px solid rgba(34,184,207,.55);border-radius:14px;background:rgba(15,120,144,.14);gap:18px;align-items:center;justify-content:space-between}
.bridge-context.active{display:flex}.bridge-context.error{border-color:rgba(251,113,133,.7);background:rgba(127,29,29,.2)}
.bridge-context strong{display:block;color:#b9f3fa;margin-bottom:3px}.bridge-meta{color:#c9d7e5;font-size:.86rem}
.bridge-run{color:#8fa7bf;font:0.78rem ui-monospace,SFMono-Regular,Consolas,monospace;margin:2px 0}
.bridge-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.bridge-actions button{width:auto;white-space:nowrap}
.bridge-actions button:disabled{opacity:.42}
@media(max-width:760px){.bridge-context{margin-inline:12px;align-items:stretch;flex-direction:column}.bridge-actions{justify-content:stretch}.bridge-actions button{width:100%}}

.prior-findings{margin-top:9px;padding:9px 11px;border:1px solid rgba(96,165,250,.35);border-radius:10px;background:rgba(9,23,40,.45);max-width:760px}
.prior-findings>strong{color:#d8e9fb}.prior-findings ul{margin:6px 0;padding-left:20px;font-size:.84rem;color:#d0deec}
.prior-findings li+li{margin-top:3px}.prior-findings li strong{display:inline;color:#9fe2ea}.prior-findings span{display:block;color:#8fa7bf;font-size:.8rem}


/* v0.2.6 · Elementaranalyse im Expertenmodus */
.elemental-panel{margin-top:16px;padding:14px;border:1px solid var(--line);border-radius:14px;background:#0b1829}
.elemental-head{display:flex;justify-content:space-between;gap:14px;align-items:flex-start}
.elemental-head h3{margin:.15rem 0 0}
.elemental-results{margin-top:12px}
.elemental-values{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:10px 0 14px}
.elemental-value{padding:10px 11px;border:1px solid var(--line);border-radius:10px;background:#102238}
.elemental-value span{display:block;color:var(--muted);font-size:.76rem}
.elemental-value strong{display:block;margin-top:3px;font-size:1.12rem}
.elemental-step{margin-top:12px;padding:12px;border:1px solid var(--line);border-radius:12px;background:#0a1728}
.elemental-entry{display:flex;gap:10px;align-items:end;flex-wrap:wrap;margin-top:8px}
.elemental-entry label{min-width:190px;flex:1}
.elemental-entry input{width:100%}
.elemental-step.locked-panel{opacity:.48;pointer-events:none}
.elemental-step.unlocked{opacity:1;pointer-events:auto}
.elemental-complete{border-color:rgba(52,211,153,.55);background:rgba(6,78,59,.18)}
@media(max-width:700px){.elemental-head{flex-direction:column}.elemental-values{grid-template-columns:1fr}}


/* v0.3.0 · optionale Expertenpfade */
.elemental-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.elemental-actions button{width:auto}
.elemental-panel.elemental-skipped{border-color:rgba(96,165,250,.5);background:rgba(30,64,175,.10)}
.elemental-panel.elemental-skipped .elemental-results{opacity:.9}
@media(max-width:700px){.elemental-actions{width:100%;justify-content:stretch}.elemental-actions button{flex:1}}


/* v0.3.1 · reale Referenzspektren nach Identifikation */
.real-spectra-stage{border-color:rgba(52,211,153,.42);background:rgba(6,78,59,.10)}
.real-spectra-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:12px 0}
.external-spectrum-link{display:grid;gap:3px;padding:12px 14px;border:1px solid rgba(96,165,250,.42);border-radius:12px;background:#102238;color:#eef7ff;text-decoration:none}
.external-spectrum-link:hover{border-color:#5ddae8;background:#13304a}
.external-spectrum-link strong{color:#9cecf3}
.external-spectrum-link span{color:var(--muted);font-size:.84rem}
.real-spectra-note{margin-bottom:0}
@media(max-width:700px){.real-spectra-links{grid-template-columns:1fr}}