/* Bereich „Lernen" – nur auf Lernseiten geladen. Nutzt die Theme-Variablen aus app.css (hell/dunkel automatisch). */

/* Lernpfad */
.learn-overall { display: grid; gap: 2px; min-width: 160px; text-align: right; }
.learn-bar { display: block; height: 6px; background: var(--surface-2); border: 1px solid var(--line); border-radius: 3px; overflow: hidden; }
.learn-bar span { display: block; height: 100%; background: var(--accent); transition: width .3s var(--ease, ease); }
.learn-path { list-style: none; margin: 0 0 16px; padding: 0; display: grid; gap: 10px;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); counter-reset: none; }
.learn-card { position: relative; }
.learn-card-link { display: grid; grid-template-columns: auto 1fr auto; gap: 12px; align-items: center; height: 100%;
    padding: 14px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-l);
    color: var(--text); text-decoration: none; }
a.learn-card-link:hover { border-color: var(--accent); background: var(--hover); }
a.learn-card-link:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.learn-card-body { display: grid; gap: 4px; }
.learn-card-body strong { font-size: 15px; }
.learn-step { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%;
    background: var(--surface-2); border: 1px solid var(--line-strong); font-weight: 600; }
.learn-card[data-state="erledigt"] .learn-step { background: var(--up); border-color: var(--up); color: #fff; }
.learn-card[data-state="angefangen"] .learn-step { border-color: var(--accent); color: var(--accent); }
.learn-ring { --p: 0; width: 26px; height: 26px; border-radius: 50%;
    background: conic-gradient(var(--accent) calc(var(--p) * 360deg), var(--line-strong) 0);
    -webkit-mask: radial-gradient(circle 9px, transparent 98%, #000); mask: radial-gradient(circle 9px, transparent 98%, #000); }
.learn-card[data-state="erledigt"] .learn-ring { background: conic-gradient(var(--up) 360deg, var(--up) 0); }
.learn-card.is-later .learn-card-link { border-style: dashed; background: var(--surface-2); color: var(--text-2); }
.learn-card.is-later .learn-step, .learn-card.is-later .learn-ring { visibility: hidden; }
.learn-meta { color: var(--text-2); }
.learn-later h2 { font-size: 14px; margin: 0 0 4px; }

/* Lektion */
.learn-crumb { margin: 0 0 6px; color: var(--text-2); }
.learn-crumb a { color: var(--text-2); }
.learn-layout { display: grid; grid-template-columns: minmax(240px, 320px) minmax(0, 1fr); gap: 16px; align-items: start; margin-bottom: 16px; }
.learn-text { font-size: 15px; line-height: 1.6; margin: 0 0 12px; max-width: 60ch; }
.learn-h { font-size: 13px; text-transform: uppercase; letter-spacing: .04em; color: var(--text-2); margin: 12px 0 6px; }
.learn-try { margin: 0; padding-left: 18px; color: var(--text-2); }
.learn-try li { margin: 4px 0; }
.learn-bridge { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin: 16px 0; }
@media (max-width: 900px) { .learn-layout { grid-template-columns: minmax(0, 1fr); } }
.learn-widget, .learn-intro { min-width: 0; }

/* Glossar-Begriffe und Popover */
.term { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: help;
    text-decoration: underline dotted var(--accent); text-underline-offset: 3px; }
.term:focus-visible { outline: 2px solid var(--focus); outline-offset: 1px; border-radius: 2px; }
.term[aria-expanded="true"] { color: var(--accent); }
.term-pop { position: fixed; z-index: 60; max-width: min(320px, calc(100vw - 16px)); padding: 10px 12px;
    background: var(--surface); color: var(--text); border: 1px solid var(--line-strong); border-radius: var(--radius-l);
    box-shadow: 0 10px 28px rgba(0, 0, 0, .22); font-size: 13px; }
.term-pop p { margin: 4px 0 0; color: var(--text-2); }

/* Quiz */
.learn-quiz h2 { font-size: 15px; margin: 0 0 8px; }
.learn-quiz [data-quiz-body] { max-width: 720px; }
.quiz-q { border: 0; margin: 0 0 12px; padding: 0; }
.quiz-q legend { font-weight: 600; margin-bottom: 6px; padding: 0; }
.quiz-a { display: flex; gap: 8px; align-items: center; padding: 8px 10px; margin: 4px 0; min-height: 40px;
    border: 1px solid var(--line); border-radius: var(--radius-m); cursor: pointer; }
.quiz-a:hover { background: var(--hover); }
.quiz-a:focus-within { outline: 2px solid var(--focus); outline-offset: 1px; }
.quiz-a.is-right { border: 2px solid var(--up); }
.quiz-a.is-wrong { border: 2px solid var(--down); }
.quiz-why:empty { display: none; }
.quiz-why { margin: 6px 0 0; font-size: 13px; }
.quiz-why.ok { color: var(--up); }
.quiz-why.no { color: var(--down); }
.quiz-score { font-weight: 600; margin: 4px 0 0; }

/* Simulator */
.learn-widget { padding: 12px; }
.sim-top { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; justify-content: space-between; }
.sim-src { flex-wrap: wrap; }
.sim-src button[aria-pressed="true"] { background: var(--accent); color: var(--accent-text); }
.sim-badge { margin: 8px 0; color: var(--text-2); }
.sim-chart { width: 100%; touch-action: pan-y; }
.sc-handle { touch-action: none; }
.sim-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; margin-top: 10px; }
@media (max-width: 767px) { .sim-grid { grid-template-columns: minmax(0, 1fr); } }
.sim-controls { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px 14px; align-content: start; }
@media (max-width: 480px) { .sim-controls { grid-template-columns: minmax(0, 1fr); } }
.sim-field { display: grid; gap: 4px; font-size: 13px; }
.sim-field-head { display: flex; align-items: baseline; gap: 6px; }
.sim-field-head output { margin-left: auto; }
.sim-check { display: flex; gap: 6px; align-items: center; }
.sim-field output { font-variant-numeric: tabular-nums; font-weight: 600; }
.sim-field input[type="range"] { width: 100%; min-height: 28px; accent-color: var(--accent); }
.sim-field select { min-height: 32px; }
.sim-hint { color: var(--text-2); }
.sim-controls [data-reset] { justify-self: start; align-self: end; }
.sim-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.sim-src button { white-space: nowrap; }
.sim-explain, .sim-compare { margin: 8px 0 0; color: var(--text-2); }
.player { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 6px; }
.player .button { min-width: 40px; min-height: 34px; }
.player-pos { color: var(--text-2); margin-left: auto; }

/* SVG-Grafik */
.svgchart svg { display: block; width: 100%; overflow: visible; font-family: var(--font); }
.sc-future { fill: var(--line); opacity: .35; }
.sc-entryv { stroke: var(--line-strong); stroke-dasharray: 3 3; }
.sc-c line { stroke-width: 1; }
.sc-c.up line, .sc-c.up rect { stroke: var(--up); fill: var(--up); }
.sc-c.down line, .sc-c.down rect { stroke: var(--down); fill: var(--down); }
.sc-line { stroke-width: 1.4; }
.sc-line.entry { stroke: var(--text-2); stroke-dasharray: 4 3; }
.sc-line.stop { stroke: var(--down); }
.sc-line.tp { stroke: var(--up); }
.sc-label { font-size: 11px; font-variant-numeric: tabular-nums; }
.sc-label.entry { fill: var(--text-2); }
.sc-label.stop { fill: var(--down); }
.sc-label.tp { fill: var(--up); }
.sc-stoppath { fill: none; stroke: var(--warn); stroke-width: 2; }
.sc-handle { cursor: ns-resize; outline: none; }
.sc-handle circle { stroke: var(--surface); stroke-width: 2; }
.sc-handle.stop circle { fill: var(--down); }
.sc-handle.tp circle { fill: var(--up); }
.sc-handle circle.sc-hit { fill: transparent; stroke: none; }   /* größere Trefferfläche für Finger */
.sc-handle:focus-visible circle:first-child { stroke: var(--focus); stroke-width: 3; }
.sc-marker { stroke: var(--surface); stroke-width: 1.5; }
.sc-marker.win { fill: var(--up); }
.sc-marker.loss { fill: var(--down); }
.sc-marker.part { fill: var(--accent); }

/* Legende, Positionsregler, Hinweis */
.sim-legend { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: center; margin: 4px 0 0; color: var(--text-2); }
.lg { display: inline-block; width: 16px; height: 0; border-top: 2px solid; margin-right: 4px; vertical-align: middle; }
.lg-entry { border-color: var(--text-2); border-top-style: dashed; }
.lg-stop { border-color: var(--down); }
.lg-tp { border-color: var(--up); }
.lg-path { border-color: var(--warn); }
.lg-dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 2px; vertical-align: middle; }
.lg-dot.part { background: var(--accent); }
.lg-dot.win { background: var(--up); }
.lg-dot.loss { background: var(--down); margin-right: 4px; }
.player-range { flex: 1 1 100%; accent-color: var(--accent); min-height: 28px; }
.sim-note { margin: 8px 0 0; color: var(--text-2); }

/* Touch: größere Ziele, Szenario-Knöpfe als Raster */
@media (pointer: coarse) {
    .player .button, .sim-field select, .learn-bridge .button { min-height: 44px; }
    .sim-field input[type="range"], .player-range { min-height: 40px; }
    .sim-src { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
    .sim-src button { min-height: 40px; }
    .term { padding: 2px 0; }
}
.sim-kpis [data-k="state"] { font-size: 14px; line-height: 1.3; }

/* Fibonacci */
.sc-zone.entryzone { fill: var(--accent); opacity: .12; }
.sc-zone-label { font-size: 11px; fill: var(--accent); }
.sc-line.retr { stroke: var(--text-2); stroke-dasharray: 2 3; }
.sc-line.ext { stroke: var(--up); stroke-dasharray: 5 4; opacity: .7; }
.sc-label.retr { fill: var(--text-2); }
.sc-label.ext { fill: var(--up); }
.sc-label.tp { font-weight: 600; }
.sc-pick { fill: transparent; cursor: pointer; }
.sc-point { cursor: ew-resize; }
.sc-point circle:first-child { fill: var(--accent); }
.sc-point-label { font-size: 11px; font-weight: 600; fill: var(--accent); }
.lg-zone { width: 16px; height: 8px; border: 0; background: var(--accent); opacity: .25; }
.lg-retr { border-color: var(--text-2); border-top-style: dotted; }
.fib-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.chip { font: inherit; font-size: 13px; padding: 4px 10px; min-height: 30px; border-radius: 999px; cursor: pointer;
    background: var(--surface); color: var(--text); border: 1px solid var(--line-strong); }
.chip[aria-pressed="true"] { background: var(--up); border-color: var(--up); color: var(--surface); font-weight: 600; }
.chip:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }

/* Positionsgröße */
.risk-calc { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px 14px; margin-bottom: 8px; }
.risk-calc input[type="number"] { min-height: 32px; width: 100%; }
.risk-hist { margin: 8px 0; }
.risk-hist svg { display: block; }
.hist-bar { fill: var(--accent); opacity: .75; }
.hist-bad { fill: var(--down); opacity: .8; }
.hist-label { font-size: 10px; fill: var(--text-2); }
.learn-widget .learn-h:first-child { margin-top: 0; }

/* Glossar */
.glossary-search input { min-height: 36px; max-width: 420px; }
.glossary-az { display: flex; flex-wrap: wrap; gap: 4px 10px; margin: 8px 0; }
.glossary-az a { color: var(--accent); padding: 2px 4px; }
@media (pointer: coarse) { .glossary-az a { min-width: 32px; min-height: 32px; display: inline-grid; place-items: center; } }
.glossary-list { margin: 0; display: grid; gap: 0; }
.glossary-item { padding: 8px 0; border-bottom: 1px solid var(--line); scroll-margin-top: 80px; }
.glossary-item dt { font-weight: 600; }
.glossary-item dd { margin: 2px 0 0; color: var(--text-2); }
@media (pointer: coarse) { .chip { min-height: 40px; padding: 6px 14px; } .risk-calc input[type="number"] { min-height: 44px; } }
.sim-field .segmented { justify-self: start; align-self: start; }

/* Backtesting und Overfitting */
.of-chart { width: 100%; margin: 6px 0; }
.of-chart svg { display: block; }
.of-learn { fill: var(--accent); opacity: .08; }
.of-hidden { fill: var(--surface-2); }
.of-hidden-label { font-size: 12px; fill: var(--text-2); }
.of-price { fill: none; stroke: var(--text); stroke-width: 1.2; }
.of-eq { fill: none; stroke: var(--up); stroke-width: 1.8; }
.of-bh { fill: none; stroke: var(--text-2); stroke-width: 1.2; stroke-dasharray: 4 3; }
.of-one { stroke: var(--line-strong); stroke-dasharray: 2 3; }
.of-split { stroke: var(--line-strong); }
.wf-track { position: relative; margin: 10px 0; transition: height .2s; }
.wf-block { position: absolute; height: 10px; border-radius: 2px; }
.wf-train { background: var(--accent); opacity: .55; }
.wf-win { background: var(--up); }
.wf-loss { background: var(--down); }
.wf-table { max-width: 520px; }
.glossary-az a[hidden] { display: none !important; }
.of-tag { font-size: 10px; fill: var(--text-2); }
.of-eq { stroke: var(--accent); }
.lg-rule { border-color: var(--accent); }
@media (pointer: coarse) { .learn-widget .button-small { min-height: 44px; } }

/* Paket B (08.10.2026): Gruppen auf /lernen, Einsteiger-Lektionen mit echtem Beispiel, Glossar aus App\Support\Glossary */
.learn-group { margin: 0 0 18px; }
.learn-group-title { font-size: 15px; margin: 0 0 2px; }
.learn-group-text { margin: 0 0 8px; color: var(--text-2); }
.learn-lesson { display: grid; gap: 14px; max-width: 76ch; margin-bottom: 16px; }
.learn-lead { font-size: 16px; margin: 0; max-width: none; }
.learn-sec { display: grid; gap: 4px; }
.learn-sec-title { font-size: 15px; margin: 0; }
.learn-sec .learn-text { margin: 0; max-width: none; }
.learn-example { padding: 12px 16px 14px; display: grid; gap: 10px; border-left: 3px solid var(--zone); }
.learn-example-title { font-size: 15px; margin: 0; }
.learn-example .learn-text { margin: 0; max-width: none; }
.learn-example-foot { margin: 0; color: var(--text-2); }
.glossary-example { display: block; margin-top: 4px; font-size: 12.5px; color: var(--text); }
.glossary-more { display: inline-block; margin-top: 3px; font-weight: 600; }
.glossary-item:target { background: color-mix(in srgb, var(--accent) 10%, transparent); box-shadow: inset 3px 0 0 var(--accent); padding-left: 8px; }
.glossary-item[hidden] { display: none; }
@media (max-width: 767px) { .learn-lead { font-size: 15px; } }

/* ---------- Akademie (09.10.2026): Rubrik-Kacheln, Stufen, Fortschritt, Lektions-Navigation ---------- */
@property --p { syntax: '<number>'; inherits: true; initial-value: 0; }
.learn-ring { transition: --p .6s var(--ease, ease); }
.academy-sub { max-width: 72ch; }
.academy-h { font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--text-2); margin: 18px 0 8px; }
.academy-bar { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; margin: 0 0 6px; }
.academy-filter button { display: inline-flex; align-items: center; gap: 6px; min-height: 30px; }
.academy-status { margin: 0; color: var(--text-2); }

/* Stufen: Punkte (1/2/3) statt Farbe, damit sie auch ohne Farbe lesbar sind */
.lv-dots { display: inline-block; flex: none; height: 6px; vertical-align: middle;
    background: radial-gradient(circle at 3px 3px, currentColor 2.2px, transparent 2.7px) 0 0 / 5px 6px repeat-x; }
.lv-dots.lv-einsteiger { width: 6px; }
.lv-dots.lv-fortgeschritten { width: 11px; }
.lv-dots.lv-profi { width: 16px; }
.lv-pill { display: inline-flex; align-items: center; gap: 6px; padding: 1px 9px; border: 1px solid var(--line-strong);
    border-radius: 999px; font-size: 12px; font-weight: 600; color: var(--text); background: var(--surface); line-height: 1.6; }
.lv-pill.lv-fortgeschritten { border-color: color-mix(in srgb, var(--accent) 55%, var(--line-strong)); }
.lv-pill.lv-profi { border-color: var(--accent); color: var(--accent); }
.lv-chip { display: inline-flex; align-items: center; gap: 4px; padding: 0 7px; border: 1px solid var(--line);
    border-radius: 999px; color: var(--text-2); white-space: nowrap; transition: border-color .2s, color .2s; }
.lv-chip.is-match { border-color: var(--accent); color: var(--accent); font-weight: 600; }

/* Wo anfangen? / Weiter / Nachschlagen: Sprungkarten mit Akzentkante */
.academy-start-list, .academy-ref-list { list-style: none; margin: 0 0 6px; padding: 0; display: grid; gap: 10px;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); }
.academy-start-link { display: grid; gap: 2px; align-content: start; height: 100%; padding: 10px 14px; color: var(--text);
    background: var(--surface); border: 1px solid var(--line); border-left: 3px solid var(--accent);
    border-radius: var(--radius-l); text-decoration: none; transition: background .2s, border-color .2s; }
.academy-start-link:hover { background: var(--hover); text-decoration: none; }
.academy-start-link:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.academy-start-link strong { font-size: 15px; }
.academy-start-link .small { color: var(--text-2); }
.academy-start-for { font-size: 11px; text-transform: uppercase; letter-spacing: .05em; }
.academy-resume .academy-start-link { border-left-color: var(--zone); background: var(--surface-2); }

/* Rubrik-Kacheln */
.academy-grid { list-style: none; margin: 0 0 8px; padding: 0; display: grid; gap: 10px;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 290px), 1fr)); }
.academy-tile { container-type: inline-size; min-width: 0; }
.academy-tile[hidden] { display: none; }
.academy-tile-link { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: auto 1fr; gap: 10px 12px;
    height: 100%; padding: 12px 14px 14px; color: var(--text); background: var(--surface); border: 1px solid var(--line);
    border-radius: var(--radius-l); text-decoration: none; transition: border-color .2s, background .2s, transform .2s var(--ease, ease); }
a.academy-tile-link:hover { border-color: var(--accent); text-decoration: none; }
a.academy-tile-link:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.academy-motif { grid-column: 1 / -1; display: flex; align-items: center; height: 60px; padding: 0 10px; color: var(--accent);
    border-radius: var(--radius-m); border: 1px solid var(--line);
    background: linear-gradient(var(--line) 1px, transparent 1px) 0 0 / 100% 15px, var(--surface-2); }
.academy-motif-svg { display: block; height: 48px; width: auto; max-width: 100%; fill: none; stroke: currentColor;
    stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.academy-motif-svg .m-fill { fill: currentColor; }
.academy-motif-svg .m-thin { stroke-width: 1.1; opacity: .6; }
.academy-motif-svg .m-zone { fill: currentColor; stroke: none; opacity: .16; }
.academy-tile-body { display: grid; gap: 4px; align-content: start; min-width: 0; }
.academy-tile-title { font-size: 16px; line-height: 1.25; }
.academy-tile-text { color: var(--text-2); }
.academy-meta { display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: center; margin-top: 4px; color: var(--text-2); }
.academy-levels { display: inline-flex; flex-wrap: wrap; gap: 4px; }
.academy-progress { display: grid; justify-items: center; align-content: start; gap: 2px; color: var(--text-2); }
.academy-ring { width: 36px; height: 36px; -webkit-mask: radial-gradient(circle 12px, transparent 98%, #000); mask: radial-gradient(circle 12px, transparent 98%, #000); }
.academy-tile[data-state="erledigt"] .academy-ring { background: conic-gradient(var(--up) 360deg, var(--up) 0); }
.academy-tile.is-soon .academy-tile-link { border-style: dashed; background: transparent; color: var(--text-2); }
.academy-tile.is-soon .academy-motif { color: var(--text-2); background: transparent; }
.academy-tile.is-soon .academy-tile-title { color: var(--text); }
.academy-soon { align-self: start; padding: 1px 8px; border: 1px solid var(--line-strong); border-radius: 999px; white-space: nowrap; }
.academy-grid-soon .academy-motif { height: 44px; }
.academy-grid-soon .academy-motif-svg { height: 36px; }
@media (max-width: 600px) { .academy-grid-soon .academy-motif { display: none; } }   /* Handy: „kommt bald“ kompakt */
.academy-empty { margin: 0 0 12px; }
.academy-ref { margin-top: 6px; }
@container (max-width: 300px) {
    .academy-tile-link { grid-template-columns: minmax(0, 1fr); }
    .academy-progress { grid-auto-flow: column; justify-content: start; align-items: center; }
}
@media (prefers-reduced-motion: no-preference) {
    a.academy-tile-link:hover .academy-motif-svg [pathLength] { animation: motif-draw .3s var(--ease, ease) both; }
    a.academy-tile-link:hover { transform: translateY(-1px); }
}
@media (prefers-reduced-motion: reduce) { .learn-ring, .learn-bar span { transition: none; } }
@keyframes motif-draw { from { stroke-dasharray: 1; stroke-dashoffset: 1; } to { stroke-dasharray: 1; stroke-dashoffset: 0; } }

/* Rubrik-Seite */
.rubric-head-main { display: flex; gap: 14px; align-items: center; min-width: 0; }
.rubric-motif { flex: none; width: 140px; height: 60px; }
@media (max-width: 480px) { .rubric-motif { display: none; } }
.rubric-meta { margin: 0 0 10px; color: var(--text-2); }
.rubric-level .learn-group-title { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; font-size: 15px; margin: 0 0 8px; }
.rubric-level .learn-group-title .learn-group-text { margin: 0; font-weight: 400; }
.rubric-soon { padding: 14px 16px; max-width: 70ch; }
.rubric-soon h2 { margin: 0 0 6px; font-size: 16px; }
.rubric-next { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); margin: 16px 0; }

/* Lektion: Stufe im Kopf, Übungsbereich, Weiter in der Rubrik */
.learn-sub { display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: center; }
.learn-lesson:has(.learn-lab) { max-width: none; }
.learn-lesson:has(.learn-lab) > :not(.learn-lab) { max-width: 76ch; }
.learn-lab { padding: 12px 16px 14px; display: grid; gap: 10px; min-width: 0; max-width: 1180px; }
.academy-grid-soon { grid-template-columns: repeat(auto-fill, minmax(min(100%, 230px), 1fr)); }
.learn-lab > h2 { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.learn-lab-note { font-weight: 400; color: var(--text-2); }
.learn-lab .learn-h { margin: 6px 0 0; }
.learn-lab .learn-try { margin: 0; }
.learn-next { margin: 8px 0 16px; max-width: 76ch; }
.learn-prereq { max-width: 76ch; margin: 0 0 14px; padding: 8px 12px; background: var(--surface); border: 1px solid var(--line);
    border-left: 3px solid var(--zone); border-radius: var(--radius-l); color: var(--text); }
.learn-next-link strong { font-size: 16px; }

/* Kerzen-Baukasten */
.cl-presets { display: flex; flex-wrap: wrap; gap: 6px; }
.cl-grid-wrap { display: grid; grid-template-columns: minmax(0, 400px) minmax(0, 1fr); gap: 16px; align-items: start; }
@media (max-width: 767px) { .cl-grid-wrap { grid-template-columns: minmax(0, 1fr); } }
.cl-figure { margin: 0; min-width: 0; }
.cl-stage { border: 1px solid var(--line); border-radius: var(--radius-m); background: var(--surface-2); }
.cl-svg { display: block; width: 100%; height: auto; font-family: var(--font); }
.cl-grid { stroke: var(--line); stroke-width: 1; }
.cl-axis { font-size: 10px; fill: var(--text-2); font-variant-numeric: tabular-nums; }
.cl-wick { stroke-width: 2.5; }
.cl-candle.up .cl-wick { stroke: var(--up); }
.cl-candle.up .cl-body { fill: var(--up); }
.cl-candle.down .cl-wick { stroke: var(--down); }
.cl-candle.down .cl-body { fill: var(--down); }
.cl-candle.flat .cl-wick { stroke: var(--text-2); }
.cl-candle.flat .cl-body { fill: var(--text-2); }
.cl-lead { stroke: var(--line-strong); stroke-dasharray: 2 2; }
.cl-label { font-size: 13px; fill: var(--text); }
.cl-val { font-weight: 600; font-variant-numeric: tabular-nums; }
.cl-brace path { fill: none; stroke: var(--text-2); stroke-width: 1.2; }
.cl-label-left { fill: var(--text-2); font-size: 12px; }
.cl-sum { margin: 6px 0 0; color: var(--text); font-size: 13px; line-height: 1.5; }
.cl-side { display: grid; gap: 10px; min-width: 0; }
.cl-controls { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.cl-note:empty { display: none; }
.cl-note { margin: 0; color: var(--warn); }
.cl-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; margin: 0; border: 1px solid var(--line); border-radius: var(--radius-m); }
.cl-facts > div { padding: 6px 10px; border-bottom: 1px solid var(--line); }
.cl-facts > div:nth-child(odd) { border-right: 1px solid var(--line); }
.cl-facts > div:nth-last-child(-n+2) { border-bottom: 0; }
.cl-facts dt { font-size: 12px; color: var(--text-2); }
.cl-facts dd { margin: 0; font-weight: 600; font-size: 15px; }
.cl-context { min-height: 200px; }

/* Marktstruktur und Zonen: Beschriftung der Wendepunkte */
.sc-marker-label { font-size: 11px; font-weight: 700; fill: var(--text); paint-order: stroke; stroke: var(--surface); stroke-width: 3px; }
.sc-marker.st-h, .sc-marker.st-t { fill: var(--accent); }
.st-key { display: inline-block; min-width: 22px; padding: 0 4px; margin-left: 6px; font-weight: 700; text-align: center;
    border: 1px solid var(--line-strong); border-radius: 3px; color: var(--text); }
.st-key:first-child { margin-left: 0; }
.st-guess { border: 0; margin: 0; padding: 0; }
.st-guess legend { font-weight: 600; padding: 0; margin-bottom: 6px; }
.st-guess-btns { display: flex; flex-wrap: wrap; gap: 6px; }
.st-guess .chip[aria-pressed="true"], .cl-presets .chip[aria-pressed="true"] { background: var(--accent); border-color: var(--accent); color: var(--accent-text); }
.st-feedback { margin: 0; font-size: 14px; line-height: 1.5; max-width: 70ch; }
.st-feedback:empty { display: none; }
.st-feedback.ok { color: var(--up); }
.st-feedback.no { color: var(--down); }
@media (prefers-reduced-motion: no-preference) {
    .st-animate .sc-marker, .st-animate .sc-marker-label { animation: st-pop .25s var(--ease, ease) both; animation-delay: calc(var(--n, 0) * 90ms); }
}
@keyframes st-pop { from { opacity: 0; } to { opacity: 1; } }

/* Orderarten */
.od-text { margin: 0; color: var(--text-2); }
.od-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; align-items: start; }
@media (max-width: 900px) { .od-grid { grid-template-columns: minmax(0, 1fr); } }
@media (min-width: 901px) { .od-grid > :first-child { position: sticky; top: 8px; } }
.od-bar { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin: 6px 0 0; border: 1px solid var(--line); border-radius: var(--radius-m); }
.od-bar > div { padding: 4px 8px; border-right: 1px solid var(--line); }
.od-bar > div:last-child { border-right: 0; }
.od-bar dt { color: var(--text-2); }
.od-bar dd { margin: 0; font-weight: 600; }
.od-orders { display: grid; gap: 4px; min-width: 0; }
.od-q legend .term { font-weight: 600; }
.od-score { font-weight: 600; }
.sc-line.od-dim { opacity: .45; }
.sc-line.od-active { stroke: var(--accent); stroke-dasharray: none; stroke-width: 2; }
.sc-label.od-active { fill: var(--accent); font-weight: 600; }
.sc-label.od-dim { fill: var(--text-2); }
@media (max-width: 480px) {
    .academy-filter { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
    .academy-filter button { justify-content: center; border-bottom: 1px solid var(--line); }
    .cl-controls { grid-template-columns: minmax(0, 1fr); }
}
@media (pointer: coarse) {
    .academy-filter button { min-height: 44px; }
    .st-guess .chip, .cl-presets .chip { min-height: 44px; }
}

/* Indikator-Übungen (Akademie Teil 12, 09.10.2026): Linien, Bänder, Unterfenster, Rechenweg. Grün/Rot bleiben Gewinn/Verlust
   vorbehalten – Indikatorlinien nutzen Akzent (schnell/Indikator) und Bernstein (langsam/Signal), Bänder die neutrale Zonenfarbe. */
.sc-ind { fill: none; stroke-width: 1.7; stroke-linejoin: round; stroke-linecap: round; }
.sc-ind.thin { stroke-width: 1.1; opacity: .75; }
.sc-close { fill: none; stroke: var(--text-2); stroke-width: 1.2; stroke-linejoin: round; }
.sc-ind.ma-sma, .sc-ind.ma-fast, .sc-ind.rsi-line, .sc-ind.macd-line, .sc-ind.bw-line { stroke: var(--accent); }
.sc-ind.ma-ema, .sc-ind.ma-slow, .sc-ind.macd-signal { stroke: var(--warn); }
.sc-ind.bb-edge { stroke: var(--zone); stroke-width: 1.2; }
.sc-ind.bb-mid { stroke: var(--zone); stroke-width: 1.2; stroke-dasharray: 5 4; }
.sc-band.bb-fill { fill: var(--zone); opacity: .1; }
.sc-span { fill: var(--line); opacity: .45; }
.sc-span-label { font-size: 11px; fill: var(--text-2); }
.sc-pane-bg { fill: var(--surface-2); stroke: var(--line); stroke-width: 1; }
.sc-pane-label { font-size: 11px; font-weight: 600; fill: var(--text-2); }
.sc-level { stroke: var(--line-strong); stroke-width: 1; stroke-dasharray: 3 3; }
.sc-level.mid, .sc-level.zero { stroke: var(--text-2); opacity: .6; }
.sc-level-label { fill: var(--text-2); }
.sc-hist.pos { fill: var(--accent); opacity: .4; }
.sc-hist.neg { fill: var(--warn); opacity: .45; }
.sc-seg { stroke-width: 1.8; }
.sc-seg.div-seg { stroke: var(--text); stroke-dasharray: 5 3; }
.sc-line.div-low { stroke: var(--text-2); }
.sc-marker.mk-top, .sc-marker.mk-at { fill: var(--text); }
.sc-marker.ma-sma, .sc-marker.mk-gc, .sc-marker.mk-x, .sc-marker.mk-mitte, .sc-marker.mk-sq { fill: var(--accent); }
.sc-marker.ma-ema, .sc-marker.mk-dc, .sc-marker.mk-weiter { fill: var(--warn); }
.sc-marker.mk-out { fill: var(--zone); }
.sc-marker.mk-offen { fill: var(--surface); stroke: var(--text-2); stroke-width: 1.5; }
.sc-marker-label.mk-gc { fill: var(--accent); }
.sc-marker-label.mk-dc { fill: var(--warn); }
.ind-legend { gap: 4px 14px; }
.ind-key { display: inline-block; width: 16px; height: 0; border-top: 2px solid var(--text-2); vertical-align: middle; margin-right: 4px; }
.ind-key.ma-sma, .ind-key.ma-fast, .ind-key.rsi-line, .ind-key.macd-line, .ind-key.bw-line { border-color: var(--accent); }
.ind-key.ma-ema, .ind-key.ma-slow, .ind-key.macd-signal { border-color: var(--warn); }
.ind-key.bb-edge { border-color: var(--zone); }
.ind-key.bb-mid { border-top-style: dashed; border-color: var(--zone); }
.ind-key.lv-edge { border-top: 1px dashed var(--line-strong); }
.ind-key.lv-mid, .ind-key.div-low { border-top: 1px dashed var(--text-2); }
.ind-key.div-seg { border-top: 2px dashed var(--text); }
.ind-key.macd-hist { height: 8px; border: 0; background: linear-gradient(90deg, color-mix(in srgb, var(--accent) 45%, transparent) 50%, color-mix(in srgb, var(--warn) 45%, transparent) 50%); }
.ind-key[class*="mk-"] { width: 9px; height: 9px; border: 0; border-radius: 50%; background: var(--accent); }
.ind-key.mk-top, .ind-key.mk-at { background: var(--text); }
.ind-key.mk-dc, .ind-key.mk-weiter { background: var(--warn); }
.ind-key.mk-out { background: var(--zone); }
.ind-key.mk-offen { background: var(--surface); box-shadow: inset 0 0 0 1.5px var(--text-2); }
.ind-calc { display: grid; gap: 0; margin: 0 0 10px; border: 1px solid var(--line); border-radius: var(--radius-m); }
.ind-calc:empty { display: none; }
.ind-calc > div { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; padding: 4px 8px; border-bottom: 1px solid var(--line); }
.ind-calc > div:last-child { border-bottom: 0; }
.ind-calc > p { margin: 0; padding: 6px 8px; color: var(--text-2); }
.ind-calc dt { color: var(--text-2); }
.ind-calc dd { margin: 0; text-align: right; font-variant-numeric: tabular-nums; }
@media (max-width: 480px) {
    .ind-calc > div { grid-template-columns: minmax(0, 1fr); gap: 0; }
    .ind-calc dd { text-align: left; }
}

/* Akademie Teil 12 (09.10.2026): Krypto, Fundamentaldaten, Psychologie, Kosten und Steuern. Grün/Rot bleiben Gewinn/Verlust
   vorbehalten – Szenarien, Zeitleisten und Balken nutzen Akzent, Bernstein (warn) und die neutrale Zonenfarbe. */
.learn-caution { max-width: 76ch; margin: 0 0 14px; padding: 8px 12px; background: var(--surface); border: 1px solid var(--line);
    border-left: 3px solid var(--warn); border-radius: var(--radius-l); color: var(--text); line-height: 1.5; }
.learn-caution-inline { margin: 0 0 8px; color: var(--text-2); }

/* Szenarien (decide.js): neutral eingefärbt, keine Punkte */
.dc-note { margin: 8px 0; color: var(--text-2); max-width: 76ch; }
.dc-q { border: 0; margin: 0; padding: 0; min-width: 0; }
.dc-lage { display: grid; gap: 2px; font-weight: 600; font-size: 15px; line-height: 1.45; margin-bottom: 8px; padding: 0; max-width: 76ch; }
.dc-kicker { font-weight: 600; color: var(--text-2); text-transform: uppercase; letter-spacing: .03em; font-size: 11px; }
.dc-a { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px 8px; align-items: start; padding: 8px 10px; margin: 6px 0;
    min-height: 44px; border: 1px solid var(--line); border-radius: var(--radius-m); cursor: pointer; background: var(--surface); }
.dc-a input { margin-top: 3px; }
.dc-a:hover { background: var(--hover); }
.dc-a:focus-within { outline: 2px solid var(--focus); outline-offset: 1px; }
.dc-text { line-height: 1.45; }
.dc-why { grid-column: 2; color: var(--text-2); line-height: 1.5; font-size: 13px; }
.dc-tag { color: var(--text); }
.dc-a.is-good { border-left: 3px solid var(--accent); }
.dc-a.is-trap { border-left: 3px solid var(--warn); }
.dc-a.is-picked { border-color: var(--text-2); box-shadow: inset 0 0 0 1px var(--text-2); }
.dc-a.is-good .dc-tag { color: var(--accent); }
.dc-a.is-trap .dc-tag { color: var(--warn); }
.dc-step { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 8px; }
.dc-step .small { color: var(--text-2); text-align: center; }
@media (prefers-reduced-motion: no-preference) {
    .dc-why { animation: st-pop .25s var(--ease, ease) both; }
}

/* Handelszeiten (crypto-lab.js, Modus zeiten): Woche als Zeitleiste */
.ck-week { display: grid; gap: 6px; margin: 4px 0 6px; }
.ck-days, .ck-row { display: grid; grid-template-columns: 9.5em minmax(0, 1fr); align-items: center; gap: 8px; }
.ck-days { grid-template-columns: 9.5em repeat(7, minmax(0, 1fr)); font-size: 11px; color: var(--text-2); }
.ck-days::before { content: ""; }
.ck-days span { border-left: 1px solid var(--line); padding-left: 3px; }
.ck-name { color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ck-track { position: relative; height: 22px; background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--radius-m);
    background-image: repeating-linear-gradient(90deg, transparent 0, transparent calc(100% / 7 - 1px), var(--line) calc(100% / 7 - 1px), var(--line) calc(100% / 7)); }
.ck-open { position: absolute; top: 3px; bottom: 3px; border-radius: 2px; }
.ck-crypto, .ck-key.ck-crypto { background: color-mix(in srgb, var(--accent) 55%, transparent); }
.ck-stock, .ck-key.ck-stock { background: var(--zone); }
.ck-wait, .ck-key.ck-wait { position: absolute; top: 9px; height: 4px; background: var(--warn); border-radius: 2px; }
.ck-key.ck-wait { position: static; display: inline-block; }
.ck-event { position: absolute; top: -4px; bottom: -4px; width: 2px; margin-left: -1px; background: var(--text); }
.ck-key { display: inline-block; width: 14px; height: 9px; border-radius: 2px; vertical-align: middle; margin-right: 4px; }
.ck-key.ck-event { width: 2px; height: 12px; background: var(--text); }
@media (max-width: 480px) {
    .ck-days, .ck-row { grid-template-columns: 5.5em minmax(0, 1fr); }
    .ck-days { grid-template-columns: 5.5em repeat(7, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: no-preference) {
    .ck-event, .ck-wait { transition: left .2s var(--ease, ease), width .2s var(--ease, ease); }
}

/* Modell-Kette (crypto-lab.js, Modus kette, 13.10.2026): vier Blöcke, Fingerabdrücke; „passt nicht“ in Bernstein (warn),
   Grün/Rot bleiben Gewinn/Verlust vorbehalten. Aufblitzen nur bei Änderung, gestaffelt in Rechenreihenfolge. */
.bc-chain { list-style: none; margin: 8px 0 6px; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.bc-block { position: relative; min-width: 0; padding: 8px 10px; background: var(--surface); border: 1px solid var(--line);
    border-top: 3px solid color-mix(in srgb, var(--accent) 55%, transparent); border-radius: var(--radius-l); }
.bc-block + .bc-block::before { content: "→"; position: absolute; left: -10px; top: 8px; width: 10px; text-align: center;
    color: var(--text-2); font-size: 12px; }
.bc-block.is-sel { box-shadow: inset 0 0 0 1px var(--text-2); }
.bc-block.is-bad { border-top-color: var(--warn); }
.bc-head { display: flex; justify-content: space-between; align-items: baseline; gap: 6px; margin-bottom: 4px; }
.bc-state { color: var(--text-2); }
.bc-block.is-bad .bc-state { color: var(--warn); font-weight: 600; }
.bc-rows { margin: 0; display: grid; gap: 4px; }
.bc-rows > div { display: grid; gap: 1px; min-width: 0; }
.bc-rows dt { color: var(--text-2); font-size: 11px; }
.bc-rows dd { margin: 0; min-width: 0; }
.bc-entry { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bc-entry.is-edit { font-weight: 600; text-decoration: underline dotted var(--text-2); text-underline-offset: 3px; }
.bc-hash { font-family: ui-monospace, "SFMono-Regular", Consolas, monospace; letter-spacing: .02em; }
.bc-hash.bad { color: var(--warn); font-weight: 600; }
.bc-actual { display: block; color: var(--text-2); font-weight: 400; font-size: 11px; }
.bc-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.bc-nodes { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; margin-top: 8px; }
.bc-node { display: grid; gap: 1px; padding: 4px 6px; border: 1px solid var(--line); border-radius: var(--radius-m); min-width: 0;
    background: var(--surface-2); font-size: 11px; }
.bc-node .small { color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 11px; }
.bc-node .num { font-family: ui-monospace, "SFMono-Regular", Consolas, monospace; overflow: hidden; text-overflow: ellipsis; }
.bc-node.is-mine { border-color: var(--text-2); }
.bc-node.is-bad .num, .bc-node.is-bad > span:last-child { color: var(--warn); font-weight: 600; }
.bc-legend { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 0 0 4px; color: var(--text-2); }
.bc-legend > span { display: inline-flex; align-items: center; }
.ck-key.bc-key-ok { background: color-mix(in srgb, var(--accent) 55%, transparent); }
.ck-key.bc-key-bad { background: var(--warn); }
@media (max-width: 767px) {
    .bc-chain { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .bc-block:nth-child(odd)::before { content: none; }
    .bc-nodes { grid-template-columns: repeat(auto-fit, minmax(5.5em, 1fr)); }
}
@media (prefers-reduced-motion: no-preference) {
    .bc-flash { animation: bc-flash .3s var(--ease, ease) both; animation-delay: calc(var(--i, 0) * 70ms); }
}
@keyframes bc-flash { from { background: color-mix(in srgb, var(--warn) 18%, var(--surface)); } to { background: var(--surface); } }

/* Fundamentaldaten (fund-lab.js): Umsatz-Balken, Zyklus-Säulen */
.fd-bar { display: flex; height: 26px; border: 1px solid var(--line); border-radius: var(--radius-m); overflow: hidden; background: var(--surface-2); }
.fd-bar > span { display: block; height: 100%; }
.fd-cost, .ck-key.fd-cost { background: var(--zone); opacity: .55; }
.fd-profit, .ck-key.fd-profit { background: var(--accent); }
.fd-bar.is-loss .fd-cost { background: var(--warn); opacity: .7; }
.fd-cycle { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 6px; align-items: end; margin: 4px 0; }
.fd-col { display: grid; gap: 3px; justify-items: center; padding: 6px 2px; min-height: 44px; background: var(--surface); color: var(--text);
    border: 1px solid var(--line); border-radius: var(--radius-m); cursor: pointer; font: inherit; }
.fd-col:hover { background: var(--hover); }
.fd-col[aria-pressed="true"] { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
.fd-col-bar { display: flex; align-items: flex-end; width: 60%; height: 90px; }
.fd-col-bar > span { display: block; width: 100%; background: var(--accent); border-radius: 2px 2px 0 0; opacity: .8; }
.fd-col[aria-pressed="true"] .fd-col-bar > span { opacity: 1; }
.fd-val { color: var(--text-2); }
.fd-pe { font-weight: 700; font-variant-numeric: tabular-nums; }
@media (max-width: 480px) {
    .fd-cycle { gap: 3px; }
    .fd-col-bar { height: 64px; width: 70%; }
    .fd-val { font-size: 10px; }
}
@media (prefers-reduced-motion: no-preference) {
    .fd-bar > span, .fd-col-bar > span { transition: width .2s var(--ease, ease), height .2s var(--ease, ease); }
}
/* Wertanzeige neben langen Feldnamen nicht umbrechen (z. B. „0 €“ im Krypto-Steuerrechner am Handy) */
.sim-field-head output { white-space: nowrap; }

/* Elliott-Wellen + Fibonacci (Akademie, 10.10.2026): Setup abspielen, Muster erkennen, Ziel-Rechner, Wellengrade. Grün/Rot nur für Ziel/Stop
   und Ergebnis – Wellenpunkte, Messstrecken und Schritte nutzen Akzent, Zonenfarbe und Textfarben. */
.rp-intro { margin: 0; color: var(--text-2); }
.rp-status { margin: 4px 0 0; font-size: 14px; font-weight: 600; line-height: 1.45; max-width: 76ch; }
.rp-steps { list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 0; grid-template-columns: repeat(auto-fill, minmax(min(100%, 210px), 1fr));
    border: 1px solid var(--line); border-radius: var(--radius-m); counter-reset: rp; }
.rp-steps li { position: relative; display: grid; gap: 2px; align-content: start; padding: 8px 10px 8px 30px; border-bottom: 1px solid var(--line);
    color: var(--text-2); counter-increment: rp; }
.rp-steps li::before { content: counter(rp); position: absolute; left: 8px; top: 9px; width: 16px; height: 16px; border-radius: 50%;
    border: 1px solid var(--line-strong); font-size: 10px; line-height: 14px; text-align: center; color: var(--text-2); }
.rp-steps li strong { color: var(--text-2); font-size: 13px; }
.rp-steps li .small { line-height: 1.4; }
.rp-steps li.is-done strong { color: var(--text); }
.rp-steps li.is-done::before { background: var(--accent); border-color: var(--accent); color: var(--accent-text); }
.rp-steps li[aria-current="step"] { background: var(--surface-2); box-shadow: inset 3px 0 0 var(--accent); color: var(--text); }
.rp-day { font-weight: 600; }
.sc-marker.rp-buy { fill: var(--text); }
@media (prefers-reduced-motion: no-preference) {
    .rp-steps li, .rp-steps li::before { transition: background-color .2s var(--ease, ease), color .2s var(--ease, ease); }
}

/* Muster erkennen */
.sc-seg.pl-seg { stroke: var(--accent); stroke-width: 1.6; opacity: .8; }
.sc-seg.pl-wedge { stroke: var(--zone); stroke-width: 1.2; stroke-dasharray: 6 4; }
.sc-marker.pl-ctx { fill: var(--text-2); }
.sc-marker-label.pl-ctx { fill: var(--text-2); font-weight: 600; }
.pl-facts { margin: 0; padding-left: 18px; display: grid; gap: 4px; max-width: 76ch; line-height: 1.5; }
.pl-facts:empty { display: none; }
.pl-facts li.is-ok::marker { content: "✓  "; color: var(--accent); }
.pl-facts li.is-no::marker { content: "–  "; color: var(--text-2); }

/* Ziel-Rechner */
.tl-controls { align-content: start; }
.tl-wide { grid-column: 1 / -1; }
.tl-points { display: contents; }
.tl-points input { min-height: 32px; width: 100%; font: inherit; font-variant-numeric: tabular-nums; }
.sc-seg.tl-measure { stroke: var(--text); stroke-width: 2; stroke-dasharray: 4 3; }
@media (pointer: coarse) { .tl-points input, .tl-wide select { min-height: 44px; } }

/* Wellengrade */
.wf-steps { flex-wrap: wrap; margin-bottom: 8px; }
.wf-steps button[aria-pressed="true"] { background: var(--accent); color: var(--accent-text); }
.wf-text { margin: 8px 0 0; max-width: 76ch; line-height: 1.5; }
.wf-text p { margin: 0 0 6px; }
[data-panel] > .sim-src { margin-bottom: 6px; }
@media (pointer: coarse) { .wf-steps { display: grid; grid-template-columns: 1fr 1fr; width: 100%; } .wf-steps button { min-height: 44px; } }
@media (max-width: 600px) {   /* Handy: nur der aktuelle Schritt mit Erklärung, die übrigen kompakt */
    .rp-steps li:not([aria-current]) > span.small:not(.rp-day) { display: none; }
}
[data-learn="target-lab"] .sc-close { stroke: var(--text); stroke-width: 2; }
.rp-steps li.is-open strong { color: var(--text-2); font-weight: 400; }
.rp-note { margin: 0; color: var(--text-2); max-width: 76ch; }

/* So analysieren wir (/methodik, SEO 24.10.2026): luftig wie die Akademie – große Überschrift, ruhige Karten, Schema ohne Kurse */
.mt-page { display: grid; gap: clamp(28px, 3vw, 44px); max-width: 1040px; margin: 0 auto 24px; }
.mt-head { display: grid; gap: 10px; padding: clamp(12px, 2vw, 28px) 0 0; }
.mt-kicker { margin: 0; font-size: 12.5px; font-weight: 650; letter-spacing: .06em; text-transform: uppercase; color: var(--accent); }
.mt-title { margin: 0; font-size: clamp(28px, 2.4vw + 16px, 46px); line-height: 1.08; letter-spacing: -0.028em; max-width: 22ch; }
.mt-lead { margin: 0; font-size: clamp(16px, .4vw + 14px, 19px); line-height: 1.55; color: var(--text-2); max-width: 64ch; }
.mt-stand { margin: 0; color: var(--text-2); }
.mt-fig { margin: 0; padding: clamp(14px, 2vw, 28px); background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-l);
    box-shadow: var(--shadow-1); display: grid; gap: 10px; justify-items: center; }
.mt-svg { display: block; width: 100%; max-width: 720px; height: auto; font-family: var(--font); }
.mt-svg .mt-grid line { stroke: var(--line); stroke-dasharray: 2 4; }
.mt-svg .mt-zone { fill: var(--fib); fill-opacity: .12; stroke: var(--fib); stroke-width: 1; }
.mt-svg .mt-wave { fill: none; stroke: var(--accent); stroke-width: 2.4; stroke-linejoin: round; stroke-linecap: round; }
.mt-svg .mt-wave-open { stroke: var(--chart-tp); stroke-dasharray: 7 6; }
.mt-svg .mt-dot { fill: var(--surface); stroke: var(--accent); stroke-width: 2; }
.mt-svg .mt-tp { stroke: var(--chart-tp); stroke-width: 1.4; }
.mt-svg .mt-stop { stroke: var(--chart-inv); stroke-width: 1.4; stroke-dasharray: 6 4; }
.mt-svg .mt-l { font-size: 15px; fill: var(--text-2); }
.mt-svg .mt-l-w { font-size: 17px; font-weight: 700; fill: var(--accent); }
.mt-svg .mt-l-zone { fill: var(--fib); font-weight: 600; }
.mt-svg .mt-l-tp, .mt-svg .mt-l-tp2 { fill: var(--chart-tp); font-weight: 600; }
.mt-svg .mt-l-stop { fill: var(--chart-inv); font-weight: 600; }
.mt-svg .mt-l-note { font-size: 13px; }
.mt-cap { margin: 0; color: var(--text-2); max-width: 70ch; text-align: center; line-height: 1.5; }
.mt-sec { display: grid; gap: 14px; }
.mt-h { margin: 0; font-size: clamp(20px, .8vw + 15px, 26px); letter-spacing: -0.015em; }
.mt-text { margin: 0; font-size: 15.5px; line-height: 1.6; max-width: 70ch; }
.mt-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.mt-step { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 16px; align-items: start; padding: 18px 20px;
    background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-l); }
.mt-step h3 { margin: 4px 0 6px; font-size: 17px; }
.mt-step p { margin: 0 0 8px; line-height: 1.6; max-width: 70ch; }
.mt-step p:last-child { margin-bottom: 0; }
.mt-num { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; font-weight: 700; font-variant-numeric: tabular-nums;
    color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, transparent); border: 1px solid color-mix(in srgb, var(--accent) 35%, transparent); }
.mt-list { margin: 0 0 8px; padding-left: 20px; display: grid; gap: 6px; line-height: 1.55; max-width: 70ch; }
.mt-list-wide { margin: 0; font-size: 15.5px; }
.mt-muted { color: var(--text-2); }
.mt-cards { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
.mt-card { padding: 16px 18px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-l); display: grid; gap: 6px; align-content: start; }
.mt-card h3 { margin: 0; font-size: 16px; }
.mt-card p { margin: 0; color: var(--text-2); line-height: 1.55; }
.mt-card-k { justify-self: start; font-size: 12px; font-weight: 700; letter-spacing: .03em; padding: 2px 8px; border-radius: 999px;
    color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, transparent); }
.mt-limits .mt-list li::marker { color: var(--chart-inv); }
.mt-alt-link { margin-left: 12px; }
@media (max-width: 600px) {
    .mt-step { grid-template-columns: minmax(0, 1fr); gap: 8px; padding: 16px; }
    .mt-alt-link { display: inline-block; margin: 10px 0 0; }
}
.rubric-method { margin: 0 0 14px; }