/* One course, with illustrations bound to their own chapter and one real workbench.
   Existing foundation tokens also keep the learning route readable in English. */
.tensile-story[hidden] { display: none; }
.tensile-path--compact { display: flex; flex-wrap: wrap; gap: var(--spacing-lg); margin-bottom: var(--spacing-lg); }
.tensile-path--compact .tensile-path__entry { min-height: 0; padding: var(--spacing-xs) 0; border: 0; border-radius: 0; background: transparent; }
.tensile-path--compact .tensile-path__number,
.tensile-path--compact .tensile-path__description,
.tensile-path--compact .tensile-path__arrow { display: none; }
body.tensile-story-page { background: var(--neutrals-0); }
.tensile-story-page .tutorial-container.border-radius-large { padding: 0; background: var(--neutrals-0); border: 0; box-shadow: none; border-radius: 0; }
.tensile-story-page .tutorial-content { padding: 0; }
.tensile-story-page .tutorial-page-title { font-size: var(--text-xl); }
.tensile-story-page .custom-pageheader { margin-bottom: var(--spacing-md); }
#tensileElearning.tensile-story-active { max-width: none; padding: 0; background: var(--neutrals-0); border: 0; border-radius: 0; box-shadow: none; }
#tensileElearning.tensile-story-active > .tensile-path--compact { display: none; }
.tensile-story__course-header { padding: var(--spacing-lg) 0; margin-bottom: var(--spacing-xl); border-bottom: var(--border-thin) solid var(--surface-border); }
#tensileElearning .tensile-story__course-header > p { margin: 0 0 var(--spacing-sm); color: var(--textcolor-50contrast); font-size: var(--text-sm); }
.tensile-story__course-path { display: flex; flex-wrap: wrap; gap: var(--spacing-sm) var(--spacing-lg); align-items: center; font-size: var(--text-sm); }
#tensileElearning .tensile-story__course-path a { color: var(--primary-color); text-decoration: none; font-weight: 600; }
.tensile-story__course-layout { display: grid; grid-template-columns: 180px minmax(0,1fr); gap: var(--spacing-xl); align-items: start; }
.tensile-story__rail { scrollbar-width: thin; position: sticky; top: 90px; max-height: calc(100svh - 110px); overflow-y: auto; padding-right: var(--spacing-md); border-right: var(--border-thin) solid var(--surface-border); }
#tensileElearning.tensile-story-active .module-nav { display: grid; grid-template-columns: minmax(0,1fr); gap: var(--spacing-xs); margin: 0; padding: 0; border: 0; background: transparent; }
#tensileElearning.tensile-story-active .module-nav-btn { display: block; min-height: 0; box-shadow: none; width: 100%; text-align: left; padding: var(--spacing-sm); border: 0; border-left: var(--border-base) solid transparent; border-radius: 0; color: var(--textcolor-80contrast); background: transparent; font-size: var(--text-sm); line-height: 1.5; white-space: normal; overflow-wrap: anywhere; }
#tensileElearning.tensile-story-active .module-nav-btn.active { color: var(--primary-color); border-left-color: var(--primary-color); background: var(--primary-tint); }
#tensileElearning.tensile-story-active [data-tnsel-mod="anwenden"] { margin-top: var(--spacing-lg); border-top: var(--border-thin) solid var(--surface-border); }
#tensileElearning.tensile-story-active .tnsel-nav-row { margin: var(--spacing-xl) 0 var(--spacing-md); }
#tensileElearning.tensile-story-active .tnsel-nav-row a { font-size: var(--text-xs); padding: var(--spacing-sm); white-space: normal; }
#tensileElearning .tensile-story__progress { font-size: var(--text-xs); color: var(--textcolor-50contrast); line-height: 1.6; margin: var(--spacing-lg) var(--spacing-sm); }
.tensile-story__steps { min-width: 0; }
#tensileElearning.tensile-story-active .elearning-module:not([data-tnsel-section="anwenden"]) { display: block; }
#tensileElearning.tensile-story-active [data-tnsel-section="anwenden"] { display: none; }
#tensileElearning.tensile-story-active.tensile-story--real .tensile-story__steps > section:not([data-tnsel-section="anwenden"]) { display: none; }
#tensileElearning.tensile-story--real [data-tnsel-section="anwenden"].active { display: block; }
#tensileElearning .tensile-story__step { padding: var(--spacing-2xl) 0; border-bottom: var(--border-thin) solid var(--surface-border); scroll-margin-top: 90px; min-height: 0; }
#tensileElearning .tensile-story__step:first-child { padding-top: 0; }
.tensile-story__chapter-layout { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: var(--spacing-xl); align-items: start; }
.tensile-story__lesson { min-width: 0; }
#tensileElearning [data-tnsel-section="steif-fest"] .tensile-story__chapter-layout,
#tensileElearning [data-tnsel-section="werkstoffe"] .tensile-story__chapter-layout { display: block; }
#tensileElearning .tensile-story h2 { font-size: clamp(1.7rem,2.3vw,2.35rem); color: var(--textcolor-fullcontrast); letter-spacing: -.025em; line-height: 1.2; margin: 0 0 var(--spacing-lg); }
#tensileElearning .tensile-story__number { display: block; color: var(--primary-color); font-size: var(--text-sm); font-weight: 600; margin-bottom: var(--spacing-sm); }
#tensileElearning .tensile-story__chapter-copy p { font-size: var(--text-base); line-height: 1.75; margin-bottom: var(--spacing-lg); }
#tensileElearning .tensile-story__insight { padding: var(--spacing-md); background: var(--primary-tint); border-left: var(--border-base) solid var(--primary-color); color: var(--textcolor-fullcontrast); }
.tensile-story__definitions { margin: var(--spacing-lg) 0; }
.tensile-story__definitions dt { color: var(--primary-color); font-weight: 600; margin-top: var(--spacing-md); }
.tensile-story__definitions dd { margin: var(--spacing-xs) 0 var(--spacing-md); line-height: 1.7; }
#tensileElearning [data-tnsel-section="steif-fest"] .tensile-story__definitions { display: grid; grid-template-columns: auto 1fr; gap: var(--spacing-sm) var(--spacing-lg); }
#tensileElearning [data-tnsel-section="steif-fest"] .tensile-story__definitions dt,
#tensileElearning [data-tnsel-section="steif-fest"] .tensile-story__definitions dd { margin: 0; }
.tensile-story__equations { padding: var(--spacing-md); background: var(--primary-tint); border-radius: var(--radius-md); margin: var(--spacing-lg) 0; }
#tensileElearning .tensile-story__equations p { margin: var(--spacing-sm) 0; }
.tensile-story__stage { min-width: 0; padding: var(--spacing-lg); border: var(--border-thin) solid var(--surface-border); border-radius: var(--radius-lg); background: var(--neutrals-0); }
.tensile-story__stage-heading { display: flex; gap: var(--spacing-sm); align-items: baseline; }
#tensileElearning .tensile-story__stage-heading span { font-size: var(--text-xs); color: var(--textcolor-50contrast); }
.tensile-story__stage-heading strong { font-size: var(--text-sm); color: var(--primary-color); line-height: 1.5; }
.tensile-story__stage > svg { width: 100%; height: auto; display: block; }
.tensile-story svg text { font-family: inherit; font-size: 20px; fill: var(--textcolor-fullcontrast); }
.tensile-story svg .tensile-story__svg-symbol { font-size: 24px; font-style: italic; fill: var(--primary-color); }
.tensile-story svg .tensile-story__svg-muted { font-size: 17px; fill: var(--textcolor-50contrast); }
.tensile-story svg .tensile-story__svg-axis { font-size: 20px; }
.tensile-story svg .tensile-story__svg-tick { font-size: 18px; fill: var(--textcolor-50contrast); }
.tensile-story__controls[hidden], .tensile-story__error[hidden], .tensile-story [data-story-retry][hidden] { display: none; }
.tensile-story__controls { display: grid; gap: var(--spacing-sm); margin-top: var(--spacing-sm); }
.tensile-story__controls > label { display: flex; justify-content: space-between; font-size: var(--text-sm); font-weight: 600; }
.tensile-story__playback { display: flex; flex-wrap: wrap; gap: var(--spacing-sm); }
.tensile-story__playback .elearn-btn { margin: 0; }
.tensile-story__material-buttons { display: flex; gap: var(--spacing-sm); }
.tensile-story__material-buttons button { flex: 1; border: var(--border-thin) solid var(--surface-border); border-radius: var(--radius-md); background: var(--neutrals-0); padding: var(--spacing-sm); font: inherit; font-size: var(--text-xs); color: var(--primary-color); cursor: pointer; }
.tensile-story__material-buttons button[aria-pressed="true"] { color: var(--neutrals-0); background: var(--primary-color); border-color: var(--primary-color); }
#tensileElearning .tensile-story__readout { font-size: var(--text-sm); color: var(--primary-color); line-height: 1.6; margin: var(--spacing-xs) 0; font-variant-numeric: tabular-nums; }
#tensileElearning .tensile-story__stage-note { font-size: var(--text-xs); line-height: 1.6; color: var(--textcolor-50contrast); margin: var(--spacing-md) 0 0; }
#tensileElearning .tensile-story__error { color: var(--error-800); font-size: var(--text-sm); }
#tensileElearning .tensile-story .exercise-box { margin-top: var(--spacing-xl); border-radius: var(--radius-lg); padding: var(--spacing-lg); }
#tensileElearning .tensile-story .exercise-box h4 { font-size: var(--text-base); line-height: 1.5; }
.tensile-story .exercise-input-row { flex-wrap: wrap; }
#tensileElearning .tensile-story .quiz-option { font-size: var(--text-sm); padding: var(--spacing-sm) var(--spacing-md); }
#tensileElearning .tensile-story [data-tnsel-ex="norm_calc"],
#tensileElearning .tensile-story [data-tnsel-ex="emod_calc"] { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: var(--spacing-sm) var(--spacing-lg); align-items: start; }
.tensile-story__calculation { grid-column: 2; grid-row: 1 / span 4; margin: 0; }
.tensile-story__calculation svg { display: block; width: 100%; }
#tensileElearning .tensile-story [data-tnsel-ex="norm_calc"] > :not(figure),
#tensileElearning .tensile-story [data-tnsel-ex="emod_calc"] > :not(figure) { grid-column: 1; }
.tensile-story__reading { margin-top: var(--spacing-xl); padding: var(--spacing-md) 0; border-top: var(--border-thin) solid var(--surface-border); border-bottom: var(--border-thin) solid var(--surface-border); }
.tensile-story__reading > summary { cursor: pointer; color: var(--primary-color); font-size: var(--text-sm); font-weight: 600; line-height: 1.5; }
.tensile-story__reference { padding-top: var(--spacing-lg); }
#tensileElearning .tensile-story__reference > .module-title { font-size: var(--text-lg); line-height: 1.4; }
#tensileElearning .tensile-story a.elearn-btn-primary { color: var(--neutrals-0); text-decoration: none; font-weight: 600; }
#tensileElearning .tensile-story .tnsel-next-module { display: none; }
.tensile-story__experiment-plan { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--spacing-lg); padding: var(--spacing-lg); }
.tensile-story__experiment-plan strong, .tensile-story__experiment-plan span { display: block; }
.tensile-story__review-title { margin-top: var(--spacing-2xl); }
.tensile-story-page #tensileTest > .fmu-page-tabs { flex-wrap: wrap; }
.tensile-story-page #tensileTest > [data-content="versuchsstand"] > .fmu-pane { padding: 0; }
.tensile-story-page #tensileTest > [data-content="versuchsstand"] { overflow: visible; }
/* Five actual measurements form a journal, with the actual export contents
   reflected in a compact, sticky passport. No mirrored experiment state. */
.tensile-lab { max-width: none; padding: var(--spacing-xl); }
.tensile-lab-page [data-tensile-header] h1 { font-size: var(--text-lg); line-height: 1.5; }
.tensile-lab .tensile-preparation__intro { max-width: 52rem; margin: 0 0 var(--spacing-xl); }
.tensile-lab .tensile-preparation__intro h2 { color: var(--primary-color); font-size: clamp(2.2rem,3.7vw,3.6rem); letter-spacing: -.04em; line-height: 1.1; }
.tensile-lab__layout { display: grid; grid-template-columns: minmax(0,1fr) 215px; gap: var(--spacing-xl); align-items: start; }
.tensile-lab__content { min-width: 0; }
.tensile-lab__passport { position: sticky; top: 92px; padding: var(--spacing-lg); background: var(--primary-tint); border-radius: var(--radius-lg); font-size: var(--text-sm); }
.tensile-lab__passport h3 { color: var(--primary-color); font-size: var(--text-base); line-height: 1.5; }
.tensile-lab__passport progress { display: block; width: 100%; height: 7px; accent-color: var(--primary-color); margin-block: var(--spacing-lg); }
.tensile-lab__passport ol { padding: 0; margin: var(--spacing-lg) 0; list-style: none; display: grid; gap: var(--spacing-sm); }
.tensile-lab__passport li { display: flex; gap: var(--spacing-sm); line-height: 1.5; }
.tensile-lab__passport [data-guide-passport-item].is-complete { color: var(--success-800); }
.tensile-lab__passport li::before { content: '○'; color: var(--textcolor-50contrast); }
.tensile-lab__passport li.is-complete::before { content: '✓'; color: var(--success-800); }
.tensile-lab__passport .fmu-btn { width: 100%; white-space: normal; }
.tensile-lab__passport-note { border-top: var(--border-thin) solid var(--surface-border); padding-top: var(--spacing-md); font-size: var(--text-xs); }
.tensile-lab .tensile-preparation__route { max-width: none; margin: 0 0 var(--spacing-xl); }
.tensile-lab .tensile-preparation__theory { padding-top: 0; border: 0; }
.tensile-lab .tensile-preparation__section { padding: var(--spacing-md) 0 var(--spacing-lg); border-bottom: var(--border-thin) solid var(--surface-border); }
.tensile-lab .tensile-guide__choice { margin-top: var(--spacing-2xl); }
.tensile-lab__mission-title { color: var(--primary-color); margin: var(--spacing-2xl) 0 var(--spacing-lg); font-size: var(--text-xl); }
.tensile-lab .tensile-guide__task { padding: 0; border: 0; min-height: 0; margin-bottom: var(--spacing-md); }
.tensile-lab .tensile-guide__task-body { border-top: var(--border-thin) solid var(--surface-border); }
.tensile-lab .tensile-guide__task-body > h3 { padding: var(--spacing-lg) var(--spacing-sm); margin: 0; font-size: var(--text-lg); line-height: 1.5; }
.tensile-lab .tensile-guide__task--done .tensile-guide__task-body > h3 { color: var(--success-800); }
.tensile-lab .tensile-guide__theory { padding: var(--spacing-md) 0; }
.tensile-lab .tensile-guide__assignment { background: var(--primary-tint); padding: var(--spacing-lg); }
.tensile-lab .tensile-guide__reflection { padding: var(--spacing-md) 0 var(--spacing-xl); }
.tensile-lab .tensile-guide__station .tensile-versuch-grid { grid-template-columns: minmax(190px,.7fr) minmax(0,1.3fr); gap: var(--spacing-md); }
.tensile-lab .tensile-guide__station .tensile-eval__row { flex-wrap: wrap; }
.tensile-lab .tensile-guide__station .tensile-eval__label { min-width: 0; white-space: normal; }
.tensile-lab .tensile-guide__result { padding-inline: 0; border: 0; }
.tensile-lab .tensile-guide__theory p { line-height: 1.75; }
.tensile-lab .tensile-preparation__eyebrow { display: none; }


/* The course rail is the persistent navigation; the assignment keeps one wide work area. */
#tensileElearning .tensile-lab { padding: 0; }
#tensileElearning .tensile-lab__layout { display: block; }
#tensileElearning .tensile-lab__passport { position: static; margin-top: var(--spacing-xl); }
#tensileElearning .tensile-lab__passport ol { grid-template-columns: repeat(2,minmax(0,1fr)); }
#tensileElearning .tensile-lab .tensile-preparation__intro h2 { font-size: clamp(1.7rem,2.3vw,2.35rem); letter-spacing: -.025em; }
#tensileElearning .tensile-lab__passport .fmu-btn { width: auto; }
@media (max-width: 1100px) {
    .tensile-story__course-layout { grid-template-columns: 155px minmax(0,1fr); gap: var(--spacing-lg); }
    .tensile-story__chapter-layout { gap: var(--spacing-md); }
    .tensile-story__stage { padding: var(--spacing-sm); }
}
@media (max-width: 900px) {
    .tensile-story__chapter-layout { grid-template-columns: minmax(0,1fr); }
    .tensile-story__stage { max-width: 36rem; width: 100%; }
    #tensileElearning .tensile-story [data-tnsel-ex="norm_calc"],
    #tensileElearning .tensile-story [data-tnsel-ex="emod_calc"] { display: block; }
    .tensile-story__calculation { max-width: 30rem; }
    .tensile-lab .tensile-guide__station .tensile-versuch-grid { grid-template-columns: minmax(0,1fr); }
}
@media (max-width: 600px) {
    .tensile-story__course-layout { display: block; }
    .tensile-story__rail { position: static; max-height: none; overflow: visible; padding: 0 0 var(--spacing-md); border-right: 0; border-bottom: var(--border-thin) solid var(--surface-border); margin-bottom: var(--spacing-xl); }
    #tensileElearning.tensile-story-active .module-nav { display: flex; flex-direction: row; overflow-x: auto; flex-wrap: nowrap; gap: var(--spacing-xs); padding-bottom: var(--spacing-sm); }
    #tensileElearning.tensile-story-active .module-nav-btn { flex: 0 0 auto; width: auto; max-width: 12rem; border-left: 0; border-bottom: var(--border-base) solid transparent; padding: var(--spacing-sm); }
    #tensileElearning.tensile-story-active .module-nav-btn.active { border-bottom-color: var(--primary-color); }
    #tensileElearning.tensile-story-active [data-tnsel-mod="anwenden"] { margin: 0; border-top: 0; }
    #tensileElearning.tensile-story-active .tnsel-nav-row { margin: var(--spacing-sm) 0; }
    #tensileElearning .tensile-story__progress { margin: var(--spacing-sm); }
    .tensile-story__course-path { gap: var(--spacing-sm); }
    .tensile-story__course-path span { display: none; }
    #tensileElearning .tensile-story h2 { font-size: var(--text-2xl); }
    #tensileElearning .tensile-story__step { padding-block: var(--spacing-xl); }
    .tensile-story__experiment-plan { grid-template-columns: minmax(0,1fr); }
    #tensileElearning .tensile-lab__passport ol { grid-template-columns: minmax(0,1fr); }
    .tensile-lab .tensile-guide__task-body > h3 { font-size: var(--text-base); }
}