/* GENERIERT aus build/client/*.css von build/client-bundle.mjs — nicht hier editieren. */
/* ---- build/client/netz-brief.css ---- */
/* Einstein-Szilárd-Brief (manhattan-letter): Faksimile links (Handy: oben), Abschrift rechts, Randnotizen. */
.brief { --brief-mono: ui-monospace, "SFMono-Regular", "Cascadia Mono", Menlo, Consolas, "Liberation Mono", monospace; }
/* Auf breiten Schirmen tritt der Baustein aus der Lesespalte (720 px) heraus */
@media (min-width: 1000px) {
  .brief { width: min(1100px, calc(100vw - 4rem)); margin-inline: calc((100% - min(1100px, calc(100vw - 4rem))) / 2); }
}
.brief .brief__intro { font-size: .98rem; color: var(--ink-soft); max-width: 70ch; }
.brief__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 1.4rem 2.2rem; align-items: start; margin-top: 1.2rem; }
@media (max-width: 999px) { .brief__grid { grid-template-columns: minmax(0, 1fr); } .brief__faks { max-width: 440px; width: 100%; margin-inline: auto; } }

/* Faksimile */
.brief__faks { min-width: 0; }
@media (min-width: 1000px) { .brief.is-js .brief__faks { position: sticky; top: calc(var(--header-h) + 1rem); } }
.brief__tabs { display: flex; gap: .4rem; margin-bottom: .6rem; }
.brief__tab { font: 600 .88rem var(--font-sans); padding: .35rem .8rem; border-radius: 999px; border: 1px solid var(--line-strong); background: var(--surface); color: var(--ink-soft); cursor: pointer; }
.brief__tab[aria-pressed="true"] { background: var(--accent); border-color: var(--accent); color: var(--bg); }
.brief__tab:focus-visible, .brief__schalter:focus-visible, .brief__note-zu:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.brief .brief__seite { margin: 0 0 1.2rem; }
.brief.is-js .brief__seite:not(.is-sichtbar) { display: none; }
.brief__bild { position: relative; }
.brief__bild img { display: block; width: 100%; height: auto; }
.brief__hl { position: absolute; border-radius: 3px; background: color-mix(in srgb, var(--gold) 28%, transparent); box-shadow: 0 0 0 2px var(--gold); opacity: 0; transition: opacity .25s; pointer-events: none; }
.brief__hl.is-an { opacity: 1; }

/* Abschrift */
.brief__text { min-width: 0; }
.brief__leiste { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem 1rem; margin-bottom: 1rem; padding-bottom: .7rem; border-bottom: 1px solid var(--line); }
.brief .brief__legende { margin: 0; font-size: .82rem; color: var(--ink-faint); display: flex; flex-wrap: wrap; gap: .2rem 1rem; }
.brief__lg-en { font-family: var(--brief-mono); }
.brief__lg-tr { border-left: 3px solid var(--accent); padding-left: .45rem; }
.brief__schalter { font: 600 .85rem var(--font-sans); padding: .35rem .8rem; border-radius: 999px; border: 1px solid var(--line-strong); background: var(--surface); color: var(--ink-soft); cursor: pointer; }
.brief__schalter[aria-pressed="true"] { border-color: var(--accent); color: var(--accent-ink); background: var(--accent-soft); }
.brief.ohne-tr .brief__tr, .brief.ohne-tr .brief__lg-tr { display: none; }

.brief .brief__en { font-family: var(--brief-mono); font-size: .9rem; line-height: 1.7; margin: 0 0 .5rem; color: var(--ink); overflow-wrap: anywhere; }
.brief .brief__tr { font-size: .96rem; line-height: 1.6; margin: 0 0 1.1rem; padding-left: .8rem; border-left: 3px solid var(--accent); color: var(--ink-soft); }
.brief__abs { margin-bottom: .9rem; }
.brief__abs--liste { padding-left: 1.2rem; }
.brief__kopf { font-family: var(--brief-mono); font-size: .88rem; line-height: 1.55; margin-bottom: 1rem; }
.brief .brief__absender { text-align: right; font-size: inherit; margin: 0 0 1rem; }
.brief .brief__empf { font-size: inherit; margin: 0; }
.brief__datum { display: inline-block; margin-top: .5rem; }
.brief__sig { font-style: italic; color: var(--ink-faint); }
.brief__gruss .brief__en { padding-left: 45%; }
.brief .brief__seitenwechsel { display: flex; align-items: center; gap: .8rem; margin: 1.2rem 0; font-size: .8rem; color: var(--ink-faint); letter-spacing: .06em; text-transform: uppercase; }
.brief__seitenwechsel::before, .brief__seitenwechsel::after { content: ""; flex: 1; border-top: 1px dashed var(--line-strong); }
.brief .brief__hinweis { font-size: .82rem; color: var(--ink-faint); margin-top: 1rem; }

/* Markierte Stellen */
.brief__mark { color: inherit; text-decoration: none; background: var(--gold-soft); border-bottom: 2px solid var(--gold); border-radius: 2px; padding: 0 .08em; cursor: pointer; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.brief__mark sup { font: 700 .7em var(--font-sans); color: var(--gold); margin-left: .1em; }
.brief__mark:hover, .brief__mark.is-an { background: color-mix(in srgb, var(--gold) 38%, transparent); }
.brief__mark:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

/* Randnotizen: ohne JS offen, mit JS nur die gewählte */
.brief__note { margin: .2rem 0 1.2rem; padding: .75rem 1rem .8rem; border-radius: var(--radius-sm); background: var(--surface-2); border-left: 3px solid var(--gold); }
.brief.is-js .brief__note:not(.is-offen) { display: none; }
.brief.is-js .brief__note.is-offen { animation: brief-auf .25s ease-out; }
@keyframes brief-auf { from { opacity: 0; transform: translateY(-4px); } }
.brief .brief__note p { font-size: .93rem; line-height: 1.55; margin: 0 0 .45rem; color: var(--ink-soft); }
.brief .brief__note-kopf { display: flex; align-items: center; gap: .5rem; font: 700 .78rem var(--font-sans); letter-spacing: .08em; text-transform: uppercase; color: var(--gold); margin-bottom: .35rem; }
.brief__note-nr { display: inline-grid; place-items: center; width: 1.5em; height: 1.5em; border-radius: 50%; background: var(--gold); color: var(--surface); letter-spacing: 0; }
.brief__note-zu { margin-left: auto; display: inline-grid; place-items: center; width: 1.9rem; height: 1.9rem; border-radius: 50%; border: 1px solid var(--line-strong); background: var(--surface); color: var(--ink-soft); cursor: pointer; }
.brief .brief__note .brief__note-src { font-size: .8rem; margin: .3rem 0 0; color: var(--ink-faint); }
.brief ul.brief__note-src { padding-left: 1.1rem; }
.brief ul.brief__note-src li { margin: .1rem 0; }
.brief ul.brief__note-src a { overflow-wrap: anywhere; }
.brief .sources { margin-top: 1.4rem; }

@media (max-width: 560px) {
  .brief__gruss .brief__en { padding-left: 25%; }
  .brief .brief__en { font-size: .86rem; }
}
@media (prefers-reduced-motion: reduce) {
  .brief__hl { transition: none; }
  .brief.is-js .brief__note.is-offen { animation: none; }
}