/* =========================================================================
   myMangas – Design-System (siehe Designvorlage)
   Papier, Tinte, Panels, Rasterfolie, Sprechblasen.
   ========================================================================= */

:root {
    --ink: #1B1B1F;
    --paper: #FAF7F2;
    --panel: #FFFFFF;
    --accent: #D62839;
    --on-accent: #FFFFFF;
    /* Fehler bleiben rot, auch wenn Ereignisse den Akzent umfärben (#82) */
    --danger: #D62839;
    --indigo: #3D5A80;
    --on-indigo: #FFFFFF;
    --owned: #1F7A6F;
    --on-owned: #FFFFFF;
    --missing: #F4A261;
    --on-missing: #1B1B1F;
    --muted: #55535A;
    --tone: rgba(27, 27, 31, 0.07);
    --danger-bg: #FDE8EA;
    --info-bg: #E7EEF7;
    --success-bg: #E3F3F0;
    --font-head: 'M PLUS Rounded 1c', system-ui, sans-serif;
    --font-body: 'Zen Kaku Gothic New', system-ui, sans-serif;
    --border: 2.5px solid var(--ink);
    --shadow: 4px 4px 0 var(--ink);
    --shadow-sm: 3px 3px 0 var(--ink);
    --radius: 6px;
    color-scheme: light;
}

:root[data-theme="dark"] {
    --ink: #F2EEE6;
    --paper: #15151A;
    --panel: #1F1F26;
    --accent: #FF5A67;
    --on-accent: #15151A;
    --danger: #FF5A67;
    --indigo: #7FA7D9;
    --on-indigo: #15151A;
    --owned: #43C6B5;
    --on-owned: #15151A;
    --missing: #F4B37A;
    --on-missing: #15151A;
    --muted: #B9B4AA;
    --tone: rgba(255, 255, 255, 0.05);
    --danger-bg: #3A1D22;
    --info-bg: #1D2836;
    --success-bg: #18302C;
    color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }

html, body {
    margin: 0;
    font-family: var(--font-body);
    color: var(--ink);
    background: var(--paper);
    -webkit-text-size-adjust: 100%;
}

h1, h2, h3, .mm-head {
    font-family: var(--font-head);
    font-weight: 800;
    letter-spacing: 0.01em;
    line-height: 1.15;
}

a { color: var(--indigo); }
a:hover { opacity: .85; }
img { max-width: 100%; }
code { font-size: .9em; }

:focus-visible { outline: 3px solid var(--indigo); outline-offset: 2px; }
/* Blazor fokussiert nach der Navigation die h1 (Screenreader) – ohne sichtbaren Rahmen */
h1:focus, h1:focus-visible { outline: none; }

.mm-tone {
    background-color: var(--paper);
    background-image: radial-gradient(var(--tone) 1px, transparent 1px);
    background-size: 8px 8px;
}

.mm-accent { color: var(--accent); }
.mm-small { font-size: .875rem; color: var(--muted); }
.mm-center { text-align: center; }
.mm-lead { color: var(--muted); margin-top: -.25rem; }

/* ---------- Grundbausteine ---------- */

.mm-panel {
    background: var(--panel);
    border: var(--border);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
}

.mm-card {
    background: var(--panel);
    border: var(--border);
    border-radius: var(--radius);
    padding: 1.25rem;
}

.mm-bubble {
    position: relative;
    display: inline-block;
    max-width: 100%;
    padding: .75rem 1rem;
    margin-bottom: 1.25rem;
    background: var(--panel);
    border: var(--border);
    border-radius: 20px;
}
.mm-bubble::after {
    content: "";
    position: absolute;
    left: 26px;
    bottom: -11px;
    width: 16px;
    height: 16px;
    background: inherit;
    border-right: var(--border);
    border-bottom: var(--border);
    transform: rotate(45deg);
}
.mm-bubble-small { padding: .4rem 1rem; font-weight: 700; }

.mm-speedlines {
    background-image: repeating-conic-gradient(from 0deg at 92% 50%, rgba(255, 255, 255, .16) 0deg 3deg, transparent 3deg 10deg);
}

.mm-chips { display: flex; flex-wrap: wrap; gap: .5rem; padding: 0; margin: 0; list-style: none; }
.mm-chips li, .mm-chip {
    padding: .3rem .8rem;
    border: 2px solid var(--ink);
    border-radius: 999px;
    background: var(--panel);
    font-weight: 700;
    font-size: .875rem;
}

.mm-tag { align-self: flex-start; padding: .1rem .6rem; border-radius: 10px; font-size: .75rem; font-weight: 700; }
.mm-tag-now { background: var(--owned); color: var(--on-owned); }
.mm-tag-soon { background: var(--missing); color: var(--on-missing); }
.mm-tag-later { background: var(--indigo); color: var(--on-indigo); }

/* ---------- Buttons (auch für die Identity-Seiten) ---------- */

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    min-height: 44px;
    padding: 0 1.1rem;
    border: var(--border);
    border-radius: var(--radius);
    background: var(--panel);
    color: var(--ink);
    font: 700 1rem var(--font-body);
    text-decoration: none;
    cursor: pointer;
    transition: transform .08s, box-shadow .08s;
}
.btn:hover { opacity: 1; }
.btn:active { transform: translate(2px, 2px); box-shadow: none; }
.btn-primary { background: var(--accent); color: var(--on-accent); box-shadow: var(--shadow-sm); }
.btn-danger { background: var(--danger-bg); color: var(--ink); }
.btn-secondary { background: var(--panel); }
.btn-link { border-color: transparent; background: transparent; color: var(--indigo); text-decoration: underline; box-shadow: none; }
.btn-lg { min-height: 52px; font-size: 1.05rem; }
.w-100 { width: 100%; }

/* ---------- Formulare ---------- */

.mm-form { display: flex; flex-direction: column; gap: 1rem; margin: 1rem 0; }
.mm-field { display: flex; flex-direction: column; gap: .35rem; font-weight: 700; font-size: .9rem; }

.form-control {
    width: 100%;
    min-height: 46px;
    padding: .5rem .75rem;
    border: 2px solid var(--ink);
    border-radius: var(--radius);
    background: var(--paper);
    color: var(--ink);
    font: 400 1rem var(--font-body);
}
.form-control:focus { outline: 3px solid var(--indigo); outline-offset: 1px; }
.form-floating { display: flex; flex-direction: column-reverse; gap: .35rem; margin-bottom: 1rem; }
.form-floating > label, .form-label, .control-label { font-weight: 700; font-size: .9rem; }

.mm-row-between { display: flex; justify-content: space-between; align-items: center; gap: .5rem; flex-wrap: wrap; font-size: .9rem; }
.mm-check { display: inline-flex; align-items: center; gap: .5rem; font-weight: 500; }
.mm-check input, .form-check-input { width: 18px; height: 18px; accent-color: var(--accent); }

.text-danger { color: var(--danger); font-weight: 500; font-size: .875rem; }
.text-danger ul { margin: 0; padding-left: 1.2rem; }
.text-success { color: var(--owned); }
.text-secondary, .text-info { color: var(--muted); }

.alert { padding: .75rem 1rem; border: 2px solid var(--ink); border-radius: var(--radius); margin-bottom: 1rem; }
.alert-danger { background: var(--danger-bg); }
.alert-warning { background: #FFF3E3; color: #1B1B1F; }
.alert-info { background: var(--info-bg); }
.alert-success { background: var(--success-bg); }

/* Raster-Klassen der Identity-Seiten (Konto verwalten) schlicht abbilden */
.row { display: flex; flex-wrap: wrap; gap: 1rem; }
.row > [class*="col-"] { flex: 1 1 280px; min-width: 0; }
.mb-3 { margin-bottom: 1rem; }
.mt-2 { margin-top: .5rem; }
.mx-auto { margin-left: auto; margin-right: auto; }
.d-flex { display: flex; }
.flex-column { flex-direction: column; }
.input-group { display: flex; gap: .5rem; align-items: center; }
.table { width: 100%; border-collapse: collapse; }
.table td, .table th { padding: .5rem; border-bottom: 1px solid var(--tone); text-align: left; }
hr { border: 0; border-top: 2px dashed var(--tone); margin: 1.25rem 0; }

.nav { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: .25rem; }
.nav-link { display: block; padding: .55rem .75rem; border: 2px solid transparent; border-radius: var(--radius); color: var(--ink); text-decoration: none; font-weight: 700; }
.nav-link.active { background: var(--ink); color: var(--paper); }

/* ---------- Kopf/Fuß öffentlicher Seiten ---------- */

.mm-page { min-height: 100vh; display: flex; flex-direction: column; }
.mm-page > main { flex: 1; }
.mm-container { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 16px; }
.mm-narrow { max-width: 860px; }

.mm-brand { display: inline-flex; align-items: center; gap: .6rem; color: var(--ink); text-decoration: none; }
.mm-brand span { font-family: var(--font-head); font-weight: 800; font-size: 1.5rem; }
.mm-brand em { font-style: normal; color: var(--accent); }

/* „Zurück zur App“ (#29): angemeldet immer, sonst nur in der installierten App */
.mm-backbar { display: none; align-items: center; gap: .4rem; padding: calc(.6rem + env(safe-area-inset-top)) 16px .6rem; background: var(--accent); color: var(--on-accent); font-weight: 800; text-decoration: none; border-bottom: var(--border); }
.mm-backbar-on, html[data-standalone] .mm-backbar { display: flex; }
.mm-offline-page { display: flex; flex-direction: column; gap: 1rem; }
.mm-offline-page h1, .mm-offline-page h2 { margin: 0 0 .4rem; }
.mm-offline-page p { margin: 0; }
.mm-public-header { background: var(--panel); border-bottom: var(--border); }
.mm-public-header-inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem; padding-top: .75rem; padding-bottom: .75rem; }
.mm-public-nav { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; font-weight: 700; }
.mm-public-nav > a:not(.btn) { color: var(--ink); text-decoration: none; }

.mm-lang { display: inline-flex; border: 2px solid var(--ink); border-radius: 999px; overflow: hidden; }
.mm-lang a { padding: .25rem .6rem; color: var(--ink); text-decoration: none; font-weight: 700; font-size: .8rem; }
.mm-lang a.active { background: var(--ink); color: var(--paper); }

.mm-footer { background: #1B1B1F; color: #F2EEE6; border-top: var(--border); }
.mm-footer-inner { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; padding-top: 1.5rem; padding-bottom: 1.5rem; font-size: .9rem; }
.mm-footer nav { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; }
.mm-footer a { color: #F2EEE6; }

/* ---------- Konto-Seiten ---------- */

.mm-auth-header { display: flex; justify-content: space-between; align-items: center; padding: 1rem 16px; max-width: 1200px; width: 100%; margin: 0 auto; }
.mm-auth-main { display: flex; justify-content: center; align-items: flex-start; padding: 1rem 16px 3rem; }
.mm-auth-panel { width: 100%; max-width: 460px; padding: 1.5rem; }
.mm-auth-panel:has(.mm-manage) { max-width: 980px; }
.mm-auth-panel h1 { margin-top: 0; font-size: 1.75rem; }

.mm-divider { display: flex; align-items: center; gap: .75rem; margin: 1.25rem 0 .75rem; color: var(--muted); font-size: .85rem; }
.mm-divider::before, .mm-divider::after { content: ""; flex: 1; height: 2px; background: var(--tone); }
.mm-providers { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: .6rem; margin-bottom: 1.25rem; }
.mm-provider { border-width: 2px; }
.mm-provider-apple { background: #1B1B1F; color: #FFFFFF; }
.mm-provider-discord { background: #4E5AD9; color: #FFFFFF; }

.mm-manage-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; }
.mm-manage-body { display: flex; flex-wrap: wrap; gap: 1.5rem; margin-top: 1rem; }
.mm-manage-body > aside { flex: 1 1 200px; }
.mm-manage-body > section { flex: 999 1 420px; min-width: 0; }
.mm-logout { margin-top: 1rem; }

/* ---------- Landingpage ---------- */

.mm-hero { display: flex; flex-wrap: wrap; align-items: center; gap: 3rem; padding-top: 4rem; padding-bottom: 3rem; }
.mm-hero-text { flex: 999 1 460px; min-width: 0; display: flex; flex-direction: column; gap: 1.25rem; }
.mm-hero-text > .mm-bubble { align-self: flex-start; }
.mm-hero-text h1 { margin: 0; font-size: clamp(2.25rem, 5vw, 3.75rem); }
.mm-hero-lead { margin: 0; max-width: 560px; font-size: 1.15rem; line-height: 1.6; color: var(--muted); }
.mm-actions { display: flex; flex-wrap: wrap; gap: .75rem; }
.mm-hero-phone { flex: 1 1 300px; display: flex; justify-content: center; }

.mm-phone {
    width: 300px;
    padding: 18px 16px 24px;
    border: 3px solid var(--ink);
    border-radius: 30px;
    box-shadow: 8px 8px 0 var(--ink);
    background: var(--paper);
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.mm-phone-cam { height: 120px; border: var(--border); border-radius: var(--radius); background: #0E0E12; display: flex; align-items: center; justify-content: center; }
.mm-phone-cam span { width: 70%; height: 3px; background: var(--accent); box-shadow: 0 0 12px var(--accent); }

.mm-result { overflow: hidden; }
.mm-result-head { padding: .6rem .9rem; background-color: var(--owned); color: var(--on-owned); font-family: var(--font-head); font-weight: 800; font-size: 1.05rem; letter-spacing: .03em; }
.mm-result-missing { background-color: var(--missing); color: var(--on-missing); }
.mm-result-body { display: flex; gap: .75rem; padding: .75rem .9rem; align-items: center; }
.mm-result-body > div:last-child { display: flex; flex-direction: column; }
.mm-result-body strong { font-family: var(--font-head); font-size: 1.6rem; line-height: 1.1; font-variant-numeric: tabular-nums; }
.mm-result-body small { color: var(--muted); }

.mm-cover-ph {
    width: 48px;
    aspect-ratio: 2 / 3;
    flex-shrink: 0;
    border: 2px solid var(--ink);
    border-radius: 4px;
    background-color: var(--indigo);
    background-image: radial-gradient(rgba(255, 255, 255, .25) 1.2px, transparent 1.2px);
    background-size: 6px 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFFFFF;
    font-family: var(--font-head);
    font-weight: 800;
    font-size: 1.4rem;
}
.mm-cover-dashed { border-style: dashed; background-color: var(--paper); background-image: radial-gradient(var(--tone) 1.2px, transparent 1.2px); color: var(--ink); }

.mm-band { background: var(--panel); border-top: var(--border); border-bottom: var(--border); }
.mm-band > .mm-container, .mm-section { padding-top: 3.5rem; padding-bottom: 3.5rem; }
.mm-band h2, .mm-section h2 { margin-top: 0; font-size: 2.1rem; }
.mm-section-lead { color: var(--muted); max-width: 680px; font-size: 1.05rem; }

.mm-feature-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1.25rem; }
.mm-feature { padding: 1.25rem; background: var(--paper); display: flex; flex-direction: column; gap: .5rem; }
.mm-feature h3 { margin: 0; font-size: 1.25rem; }
.mm-feature p { margin: 0; line-height: 1.5; color: var(--muted); }

.mm-install-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1.25rem; }
.mm-install-grid h3 { margin-top: 0; }
.mm-install-grid ol { margin: 0; padding-left: 1.2rem; display: flex; flex-direction: column; gap: .4rem; line-height: 1.45; }

.mm-faq { padding: .9rem 1.1rem; margin-bottom: .75rem; border: var(--border); border-radius: var(--radius); background: var(--paper); }
.mm-faq summary { cursor: pointer; font-weight: 700; font-size: 1.05rem; }
.mm-faq p { margin: .6rem 0 0; color: var(--muted); line-height: 1.55; }

/* ---------- Ladebildschirm & Blazor-Fehler ---------- */

#blazor-error-ui {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 2000;
    padding: .75rem 1rem;
    background: var(--missing);
    color: #1B1B1F;
    border-top: var(--border);
    font-weight: 700;
}
#blazor-error-ui .dismiss { float: right; cursor: pointer; }

.mm-splash { min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1rem; }
.mm-splash img { width: 88px; height: 88px; animation: mm-bob 1.2s ease-in-out infinite; }
@keyframes mm-bob { 50% { transform: translateY(-8px); } }

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation: none !important; transition: none !important; }
}

/* Landingpage: Von Sammlern für Sammler */
.mm-community { padding: 1.5rem; }
.mm-community h2 { margin-top: 0; }
.mm-community-stat { margin: .5rem 0 0; font-size: 1.05rem; }
.mm-community-stat strong { font: 800 1.6rem var(--font-head); color: var(--accent); margin-right: .25rem; }

/* Impressum & Datenschutz */
.mm-legal h2 { font-size: 1.15rem; margin: 1.75rem 0 .5rem; }
.mm-legal p, .mm-legal li { line-height: 1.6; }
.mm-legal ul { padding-left: 1.25rem; }
.mm-table-wrap { overflow-x: auto; margin: .5rem 0 1rem; }
.mm-table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.mm-table th, .mm-table td { border: 1.5px solid var(--ink); padding: .45rem .6rem; text-align: left; vertical-align: top; }
.mm-table th { background: var(--panel); }
.mm-table code { font-size: .82rem; word-break: break-all; }
.mm-hero-note { margin: .75rem 0 0; font-size: .95rem; color: var(--muted); }

/* Kontaktformular: Honigtopf-Feld für Bots */
.mm-hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

/* Freiwillige Unterstützung: in App-Store-Versionen ausgeblendet */
[data-src="store"] .mm-support { display: none !important; }
/* Ladehinweis vor dem Start der App (#77) – weg, sobald die App-Oberfläche oder eine andere Seite gerendert ist */
.mm-boot { display: flex; flex-direction: column; align-items: center; gap: .5rem; padding: 18vh 16px 0; text-align: center; font-weight: 700; }
body:has(.mm-app, .mm-app-empty) .mm-boot { display: none; }
.mm-app-empty { display: contents; }
/* Saisonale Deko (#82, erweitert 24.10.): Akzent, Leisten und Hintergrundmuster während eines Ereignisses.
   Werte setzt pwa.js aus dem Kalender; alle Farbpaare erfüllen WCAG AA (SeasonalCalendarTests). */
:root[data-season] {
    --season: var(--season-light);
    --accent: var(--s-accent-light, var(--season-light));
    --on-accent: var(--s-on-accent-light, #FFFFFF);
    --s-bar: var(--s-bar-light);
    --s-on-bar: var(--s-on-bar-light);
    --s-bar-active: var(--s-bar-active-light);
    --s-pattern: var(--s-pattern-light);
}
:root[data-season][data-theme="dark"] {
    --season: var(--season-dark);
    --accent: var(--s-accent-dark, var(--season-dark));
    --on-accent: var(--s-on-accent-dark, #15151A);
    --s-bar: var(--s-bar-dark);
    --s-on-bar: var(--s-on-bar-dark);
    --s-bar-active: var(--s-bar-active-dark);
    --s-pattern: var(--s-pattern-dark);
}
:root[data-season]:not([data-season-plain]) .mm-tone {
    background-image: var(--s-pattern), radial-gradient(var(--tone) 1px, transparent 1px);
    background-size: 168px 168px, 8px 8px;
}
:root[data-season] :is(.mm-topbar, .mm-bottomnav, .mm-drawer, .mm-public-header, .mm-auth-header) {
    background: var(--s-bar); color: var(--s-on-bar);
    /* gedämpfte Texte und Links in den Leisten lesbar auf der Leistenfarbe */
    --muted: var(--s-on-bar); --indigo: var(--s-bar-active);
}
:root[data-season] :is(.mm-topbar, .mm-drawer, .mm-public-header, .mm-auth-header) .mm-brand { color: var(--s-on-bar); }
/* Sprachumschalter in den Leisten lesbar (Review #91) */
:root[data-season] :is(.mm-public-header, .mm-auth-header, .mm-drawer) .mm-lang { border-color: var(--s-on-bar); }
:root[data-season] :is(.mm-public-header, .mm-auth-header, .mm-drawer) .mm-lang a { color: var(--s-on-bar); }
:root[data-season] :is(.mm-public-header, .mm-auth-header, .mm-drawer) .mm-lang a.active { background: var(--s-on-bar); color: var(--s-bar); }
/* Konto-Kopfzeile ist schmaler als der Bildschirm – Leistenfarbe trotzdem über die volle Breite */
:root[data-season] .mm-auth-header { box-shadow: 0 0 0 100vmax var(--s-bar); clip-path: inset(0 -100vmax); }
:root[data-season] :is(.mm-topbar, .mm-drawer, .mm-public-header, .mm-auth-header) .mm-brand em { color: var(--s-bar-active); }
:root[data-season] .mm-drawer a:not(.btn), :root[data-season] .mm-public-nav a:not(.btn), :root[data-season] .mm-bottomnav > a, :root[data-season] .mm-bottomnav > button { color: var(--s-on-bar); }
:root[data-season] .mm-drawer-nav a.active { background: var(--s-bar-active); color: var(--s-bar); }
:root[data-season] .mm-bottomnav > a.active, :root[data-season] .mm-bottomnav > button.active { color: var(--s-bar-active); }
.mm-season-public { display: flex; align-items: center; gap: .6rem; margin-top: .75rem; margin-bottom: .25rem; padding: .4rem .6rem; border: 2px solid var(--season, var(--ink)); border-radius: var(--radius); background: var(--panel); }
.mm-season-public[hidden] { display: none; }
.mm-season-public p { flex: 1; margin: 0; font-weight: 600; }
.mm-season { border: 2px solid var(--season, var(--ink)); border-radius: var(--radius); background: var(--panel); padding: .4rem .6rem; }
.mm-season-line { display: flex; align-items: center; gap: .6rem; }
.mm-season-line p { flex: 1; margin: 0; font-weight: 600; }
.mm-season-line img { flex-shrink: 0; }
.mm-season-ja { margin-left: .35rem; font-weight: 400; color: var(--season, var(--ink)); }
.mm-season-more { margin: .4rem 0 0; }
/* Testumgebung (#55) */
/* Abstand oben (#78): das Band steht ganz oben, die Kopfzeile darunter braucht ihn dann nicht mehr */
body:has(.mm-test-banner) .mm-topbar { padding-top: 8px; }
.mm-test-banner { position: sticky; top: 0; z-index: 2000; padding: var(--mm-top-safe, 2px) 12px 2px; background: #3D5A80; color: #fff; font: 700 .75rem/1.5 var(--font-body, system-ui); text-align: center; }
.mm-support-hint { margin-top: .5rem; }

/* Geteilte Sammlung (/s/{code}) */
.mm-shared .mm-shared-grid { margin: 1.5rem 0 2rem; }
.mm-shared .mm-series-card { color: var(--ink); }
.mm-shared-missing { font-weight: 700; }
.mm-eyebrow { margin: 0 0 .25rem; font-size: .8rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--accent); }
.mm-shared-wishes { padding-left: 1.2rem; margin: 0 0 2rem; }
.mm-shared-wishes li { margin: .3rem 0; }
.mm-shared-cta { margin-top: 2rem; }
.mm-section .mm-shared-cta h2 { font-size: 1.35rem; margin-bottom: .5rem; }
.mm-share-url { font-family: ui-monospace, monospace; font-size: .85rem; }

/* Über-Seite (/ueber): Lesetext */
.mm-section.mm-about h2 { font-size: 1.4rem; margin: 2.25rem 0 .6rem; }
.mm-about p { margin: 0 0 1rem; line-height: 1.7; }
.mm-about .mm-lead { margin-top: .5rem; font-size: 1.15rem; }
.mm-about .mm-about-sign { margin-top: 1.75rem; font-weight: 600; }
.mm-about .mm-actions { margin-top: 2rem; }

/* Pflicht-Häkchen Nutzungsbedingungen (Registrierung) */
.mm-terms-check { align-items: flex-start; line-height: 1.45; }
.mm-terms-check input { flex: none; margin-top: .15rem; }

/* FAQ-Seite */
.mm-faq-page h2 { font-size: 1.3rem; margin: 2rem 0 .75rem; }
.mm-faq-more { margin-top: 1.25rem; }

/* Bot-Schutz (#93): Honigtopf außerhalb des sichtbaren Bereichs */
.mm-hp { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }
