/* ==========================================================================
   MIS Shell – Navigationsleiste, Menü-Overlay, Event-Detailseiten
   Formensprache: angefaste Ecken („Plates“), Punktraster, diagonale Verläufe.
   Farben aus den CI-Variablen (mis-theme.css / SiteConfig) plus
   --mis-glow (SiteConfig.hero_gradient_color).
   ========================================================================== */

:root {
    --mis-glow:          #3b1f6e;
    --mis-glow-rgb:      59, 31, 110;
    --mis-nav-h:         64px;
    --mis-topbar-height: var(--mis-nav-h);
    --mis-shell-max:     1440px;
    --mis-hot:           var(--mis-accent-fg);
    --mis-cut:           10px;   /* Fase an angeschnittenen Ecken */
    --mis-plate:         polygon(0 0, calc(100% - var(--mis-cut)) 0, 100% var(--mis-cut), 100% 100%, 0 100%);
    --mis-plate-sm:      polygon(0 0, calc(100% - 6px) 0, 100% 6px, 100% 100%, 0 100%);
    --mis-plate-both:    polygon(var(--mis-cut) 0, 100% 0, 100% calc(100% - var(--mis-cut)), calc(100% - var(--mis-cut)) 100%, 0 100%, 0 var(--mis-cut));
    --mis-dots:          radial-gradient(rgba(255,255,255,.07) 1px, transparent 1.4px);
}

/* ══════════════════════════════════════════════════════════════════════════
   Navigationsleiste (angedockt, volle Breite)
   ══════════════════════════════════════════════════════════════════════════ */

.mis-navbar {
    position: fixed; z-index: 2010; top: 0; left: 0; right: 0;
    height: var(--mis-nav-h);
    background: color-mix(in srgb, var(--mis-bg-canvas) 78%, transparent);
    backdrop-filter: blur(14px) saturate(140%);
    -webkit-backdrop-filter: blur(14px) saturate(140%);
    transition: background-color .25s, box-shadow .25s;
}
.mis-navbar::after {   /* Akzent-Haarlinie, läuft nach rechts aus */
    content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1px;
    background: linear-gradient(90deg, var(--mis-accent) 0%, rgba(var(--mis-glow-rgb), .9) 30%, rgba(255,255,255,.08) 70%, rgba(255,255,255,.04) 100%);
}
.mis-navbar.is-scrolled {
    background: color-mix(in srgb, var(--mis-bg-canvas) 94%, transparent);
    box-shadow: 0 8px 30px rgba(0,0,0,.4);
}
.mis-navbar-inner {
    height: 100%; width: min(var(--mis-shell-max), 100%); margin: 0 auto;
    display: flex; align-items: center; gap: 12px; padding: 0 20px;
}
body.mis-menu-open .mis-navbar { background: transparent; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }

/* Brand */
.mis-brand {
    display: flex; align-items: center; gap: 12px; min-width: 0; flex-shrink: 1;
    color: #fff; text-decoration: none;
}
.mis-brand:hover { color: #fff; }
.mis-brand-logo {
    width: 40px; height: 40px; flex-shrink: 0; object-fit: contain; display: block;
    transition: transform .3s cubic-bezier(.2,.7,.2,1);
}
.mis-brand:hover .mis-brand-logo { transform: rotate(-6deg) scale(1.05); }
.mis-brand-text { display: flex; flex-direction: column; min-width: 0; line-height: 1.1; }
.mis-brand-label {
    font-size: 16px; font-weight: 700; color: #fff;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.mis-brand-sub {
    font-size: 10.5px; font-weight: 500; color: var(--mis-text-secondary); margin-top: 3px;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

.mis-navbar-spacer { flex: 1; }

/* Nächstes Event – zweizeilig + Segment-Timer */
.mis-next-event {
    display: flex; align-items: center; gap: 12px; min-width: 0;
    height: 44px; padding: 0 6px 0 12px;
    background: rgba(255,255,255,.035);
    border-left: 2px solid var(--mis-success);
    color: var(--mis-text-primary); text-decoration: none;
    clip-path: var(--mis-plate-sm);
    transition: background .2s;
}
.mis-next-event:hover { background: rgba(255,255,255,.07); color: #fff; }
.mis-next-event-text { display: flex; flex-direction: column; min-width: 0; line-height: 1.15; }
.mis-next-event-kicker {
    display: flex; align-items: center; gap: 6px;
    font-size: 9.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--mis-success);
}
.mis-next-event-kicker::before {
    content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--mis-success);
    animation: mis-blink 1.6s ease-in-out infinite;
}
.mis-next-event-title {
    font-size: 13px; font-weight: 600; color: #fff; max-width: 230px;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.mis-next-event-timer { display: flex; gap: 3px; font-variant-numeric: tabular-nums; }
.mis-seg {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    min-width: 30px; height: 32px; padding: 0 4px;
    background: rgba(0,0,0,.35); border: 1px solid rgba(255,255,255,.07);
    font-size: 13px; font-weight: 700; color: #fff; line-height: 1;
}
.mis-seg small { font-size: 8px; font-weight: 600; color: var(--mis-text-muted); margin-top: 2px; text-transform: uppercase; }
@keyframes mis-blink { 50% { opacity: .25; } }

/* Icon-Bereich */
.mis-topbar-icons { display: flex; align-items: center; gap: 2px; height: 100%; flex-shrink: 0; }
.mis-icon-wrap    { position: relative; height: 100%; display: flex; align-items: center; }
.mis-icon-btn {
    position: relative; background: none; border: none;
    color: var(--mis-text-primary); cursor: pointer;
    width: 38px; height: 38px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    text-decoration: none; line-height: 1;
    transition: color .15s, background .15s;
}
.mis-icon-btn:hover { color: #fff; background: rgba(255,255,255,.08); }
.mis-icon-btn[data-tooltip]::after {
    content: attr(data-tooltip);
    position: absolute; top: calc(100% + 10px); left: 50%; transform: translateX(-50%);
    background: var(--mis-bg-canvas); color: var(--mis-text-primary);
    border: 1px solid var(--mis-border); border-radius: var(--mis-radius-sm);
    padding: 3px 8px; font-size: 11px; font-weight: 500; white-space: nowrap;
    opacity: 0; pointer-events: none; transition: opacity .15s;
    z-index: 9999; box-shadow: 0 4px 12px rgba(0,0,0,.5);
}
.mis-icon-btn[data-tooltip]:hover::after { opacity: 1; }
.mis-topbar-avatar {
    width: 30px; height: 30px; border-radius: 50%;
    object-fit: cover; border: 1.5px solid rgba(255,255,255,.2); display: block;
}

/* Fester CTA-Button (angefast) */
.mis-cta {
    display: inline-flex; align-items: center; gap: 8px; flex-shrink: 0;
    height: 40px; padding: 0 20px 0 16px;
    background: var(--mis-accent-solid); color: #fff; text-decoration: none;
    font-size: 13px; font-weight: 700;
    clip-path: var(--mis-plate);
    transition: background .15s, padding .2s;
}
.mis-cta:hover { background: var(--mis-accent-solid-hover); color: #fff; padding-right: 24px; }
.mis-cta svg { flex-shrink: 0; }

/* Menü-Button: Text + Zwei-Strich-Symbol */
.mis-burger {
    display: inline-flex; align-items: center; gap: 10px; flex-shrink: 0;
    height: 40px; padding: 0 14px;
    background: rgba(255,255,255,.06); border: none; color: #fff; cursor: pointer;
    font-size: 13px; font-weight: 600;
    clip-path: var(--mis-plate);
    transition: background .15s;
}
.mis-burger:hover { background: rgba(255,255,255,.12); }
.mis-burger-icon { position: relative; width: 18px; height: 10px; }
.mis-burger-icon i {
    position: absolute; left: 0; height: 2px; background: currentColor; border-radius: 1px;
    transition: transform .3s cubic-bezier(.7,0,.3,1), width .25s, top .3s;
}
.mis-burger-icon i:nth-child(1) { top: 0; width: 18px; }
.mis-burger-icon i:nth-child(2) { top: 8px; width: 11px; }
.mis-burger:hover .mis-burger-icon i:nth-child(2) { width: 18px; }
.mis-burger[aria-expanded="true"] { background: var(--mis-accent-solid); }
.mis-burger[aria-expanded="true"] .mis-burger-icon i { top: 4px; width: 18px; }
.mis-burger[aria-expanded="true"] .mis-burger-icon i:nth-child(1) { transform: rotate(45deg); }
.mis-burger[aria-expanded="true"] .mis-burger-icon i:nth-child(2) { transform: rotate(-45deg); }

.mis-nav-badge {
    background: var(--mis-danger); color: #fff;
    font-size: 10px; font-weight: 700; border-radius: 9px;
    min-width: 18px; height: 18px; padding: 0 5px; line-height: 1;
    display: inline-flex; align-items: center; justify-content: center; vertical-align: middle;
}

/* ══════════════════════════════════════════════════════════════════════════
   Menü-Overlay
   ══════════════════════════════════════════════════════════════════════════ */

.mis-menu {
    position: fixed; inset: 0; z-index: 2000;
    display: flex; flex-direction: column;
    background: color-mix(in srgb, var(--mis-bg-canvas) 60%, black);
    clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
    visibility: hidden;
    transition: clip-path .5s cubic-bezier(.7,0,.2,1), visibility 0s linear .5s;
}
.mis-menu.open {
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    visibility: visible;
    transition: clip-path .55s cubic-bezier(.7,0,.2,1);
}
.mis-menu-bg { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.mis-menu-bg::before {   /* Punktraster */
    content: ''; position: absolute; inset: 0;
    background-image: var(--mis-dots); background-size: 22px 22px;
    mask-image: linear-gradient(115deg, #000 0%, rgba(0,0,0,.6) 50%, transparent 85%);
    -webkit-mask-image: linear-gradient(115deg, #000 0%, rgba(0,0,0,.6) 50%, transparent 85%);
}
.mis-menu-bg::after {    /* diagonale Verläufe */
    content: ''; position: absolute; inset: -20%;
    background:
        linear-gradient(125deg, transparent 38%, rgba(var(--mis-glow-rgb), .55) 62%, rgba(var(--mis-glow-rgb), .15) 80%, transparent 100%),
        linear-gradient(200deg, color-mix(in srgb, var(--mis-accent) 18%, transparent) 0%, transparent 35%);
}

.mis-menu-stage {
    position: relative; flex: 1; min-height: 0;
    width: min(var(--mis-shell-max), 100%); margin: 0 auto;
    padding: calc(var(--mis-nav-h) + 40px) 20px 28px;
    display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 56px;
    overflow-y: auto;
}

/* Linke Spalte: nummerierte Liste */
.mis-menu-list { list-style: none; margin: 0; padding: 0; counter-reset: mis-menu; align-self: start; }
.mis-menu-item { counter-increment: mis-menu; border-bottom: 1px solid rgba(255,255,255,.06); }
.mis-menu-item:first-child { border-top: 1px solid rgba(255,255,255,.06); }
.mis-menu-link {
    position: relative; isolation: isolate;
    display: flex; align-items: center; gap: 18px; width: 100%;
    padding: 12px 14px 12px 4px;
    background: none; border: none; text-align: left; cursor: pointer;
    color: rgba(255,255,255,.82); text-decoration: none;
    font-size: clamp(20px, 2vw, 28px); font-weight: 700; line-height: 1.15; letter-spacing: -.005em;
    opacity: 0; transform: translateX(-18px);
    transition: color .2s;
}
.mis-menu.open .mis-menu-link {
    opacity: 1; transform: none;
    transition: color .2s, opacity .4s ease calc(var(--i, 0) * 40ms + 200ms), transform .5s cubic-bezier(.2,.7,.2,1) calc(var(--i, 0) * 40ms + 200ms);
}
.mis-menu-link::before {   /* Nummer */
    content: counter(mis-menu, decimal-leading-zero);
    flex-shrink: 0; width: 34px; height: 26px;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 11px; font-weight: 700; font-variant-numeric: tabular-nums;
    color: var(--mis-text-muted); border: 1px solid rgba(255,255,255,.12);
    clip-path: var(--mis-plate-sm);
    transition: color .2s, background .2s, border-color .2s;
}
.mis-menu-link::after {    /* Hover-Band, füllt sich von links */
    content: ''; position: absolute; inset: 0; z-index: -1;
    background: linear-gradient(90deg, color-mix(in srgb, var(--mis-accent) 22%, transparent), transparent 85%);
    transform: scaleX(0); transform-origin: left; transition: transform .35s cubic-bezier(.2,.7,.2,1);
}
.mis-menu-link-label { flex: 1; min-width: 0; }
.mis-menu-link-chev { flex-shrink: 0; opacity: .35; transition: transform .25s, opacity .2s; }
.mis-menu-link:hover, .mis-menu-link:focus-visible, .mis-menu-item.is-open > .mis-menu-link { color: #fff; outline: none; }
.mis-menu-link:hover::after, .mis-menu-link:focus-visible::after, .mis-menu-item.is-open > .mis-menu-link::after { transform: scaleX(1); }
.mis-menu-link:hover::before, .mis-menu-link:focus-visible::before, .mis-menu-item.is-open > .mis-menu-link::before { color: #fff; border-color: rgba(255,255,255,.35); }
.mis-menu-link:hover .mis-menu-link-chev, .mis-menu-item.is-open > .mis-menu-link .mis-menu-link-chev { opacity: 1; transform: translateX(4px); }

/* Aktive Seite */
.mis-menu-item.is-active > .mis-menu-link { color: var(--mis-hot); }
.mis-menu-item.is-active > .mis-menu-link::before { background: var(--mis-accent-solid); border-color: var(--mis-accent-solid); color: #fff; }
.mis-menu-here {
    flex-shrink: 0; font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
    color: var(--mis-hot); padding: 3px 8px; border: 1px solid color-mix(in srgb, var(--mis-hot) 45%, transparent);
}

/* Rechte Spalte: Kontextpanel */
.mis-menu-aside { position: relative; min-height: 360px; align-self: stretch; }
.mis-menu-pane {
    position: absolute; inset: 0 0 auto 0;
    opacity: 0; visibility: hidden; transform: translateY(12px);
    transition: opacity .2s, transform .3s cubic-bezier(.2,.7,.2,1), visibility 0s linear .3s;
}
.mis-menu-pane.is-shown { opacity: 1; visibility: visible; transform: none; transition: opacity .25s, transform .35s cubic-bezier(.2,.7,.2,1); }
.mis-menu-pane-title {
    display: flex; align-items: baseline; gap: 12px; margin-bottom: 16px;
    color: #fff; font-size: 20px; font-weight: 700;
}
.mis-menu-pane-title small { font-size: 11px; font-weight: 600; color: var(--mis-text-muted); letter-spacing: .06em; text-transform: uppercase; }
.mis-menu-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.mis-menu-tile {
    position: relative; display: flex; align-items: center; justify-content: space-between; gap: 10px;
    min-height: 58px; padding: 12px 16px;
    background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.07);
    color: var(--mis-text-primary); text-decoration: none; font-size: 14px; font-weight: 600;
    clip-path: var(--mis-plate);
    transition: background .2s, color .2s, border-color .2s, transform .2s;
}
.mis-menu-tile svg { flex-shrink: 0; opacity: .4; transition: opacity .2s, transform .2s; }
.mis-menu-tile:hover { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.18); color: #fff; transform: translateY(-2px); }
.mis-menu-tile:hover svg { opacity: 1; transform: translateX(3px); }
.mis-menu-tile.is-active { background: color-mix(in srgb, var(--mis-accent) 22%, transparent); border-color: var(--mis-accent); color: #fff; }
.mis-menu-tile.is-active::before {
    content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--mis-hot);
}

/* Emblem (immer sichtbar) + Default-Pane mit nächstem Event */
.mis-menu-pane { z-index: 1; }
.mis-menu-pane--default { inset: auto 0 0 0; }
.mis-menu-emblem {
    position: absolute; left: 50%; top: 46%;
    width: min(380px, 78%); aspect-ratio: 1;
    display: flex; align-items: center; justify-content: center;
    transform: translate(-50%, -50%);
    transition: opacity .4s, transform .6s cubic-bezier(.2,.7,.2,1);
}
.mis-menu.has-group .mis-menu-emblem { opacity: .3; transform: translate(-30%, -20%) scale(.9); }
.mis-menu-emblem::before, .mis-menu-emblem::after {
    content: ''; position: absolute; inset: 0; border-radius: 50%;
    border: 1px dashed rgba(255,255,255,.12);
}
.mis-menu-emblem::after {
    inset: 9%; border: 1px solid rgba(var(--mis-glow-rgb), .8);
    background: radial-gradient(circle, rgba(var(--mis-glow-rgb), .45) 0%, transparent 70%);
}
.mis-menu.open .mis-menu-emblem::before { animation: mis-spin 60s linear infinite; }
.mis-menu-emblem img { position: relative; z-index: 1; width: 62%; height: 62%; object-fit: contain; opacity: .55; filter: drop-shadow(0 10px 40px rgba(0,0,0,.6)); }
@keyframes mis-spin { to { transform: rotate(360deg); } }
.mis-menu-event {
    display: flex; align-items: center; gap: 14px; padding: 14px 16px;
    background: rgba(255,255,255,.04); border-left: 3px solid var(--mis-success);
    color: var(--mis-text-primary); text-decoration: none;
    clip-path: var(--mis-plate);
}
.mis-menu-event:hover { background: rgba(255,255,255,.08); color: #fff; }
.mis-menu-event-text { flex: 1; min-width: 0; }
.mis-menu-event-text b { display: block; color: #fff; font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mis-menu-event-text span { font-size: 12px; color: var(--mis-text-secondary); }

/* Fußzeile */
.mis-menu-foot { position: relative; flex-shrink: 0; border-top: 1px solid rgba(255,255,255,.07); }
.mis-menu-foot-inner {
    width: min(var(--mis-shell-max), 100%); margin: 0 auto; padding: 14px 20px;
    display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
}
.mis-menu-foot-link {
    display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 14px;
    color: var(--mis-text-primary); text-decoration: none; font-size: 13px; font-weight: 600;
    background: rgba(255,255,255,.05); clip-path: var(--mis-plate);
    transition: background .15s, color .15s;
}
.mis-menu-foot-link:hover { background: rgba(255,255,255,.1); color: #fff; }
.mis-menu-apply {
    display: inline-flex; align-items: center; gap: 10px; height: 40px; padding: 0 20px;
    background: var(--mis-accent-solid); color: #fff; text-decoration: none; font-size: 13px; font-weight: 700;
    clip-path: var(--mis-plate); transition: background .15s, gap .2s;
}
.mis-menu-apply:hover { background: var(--mis-accent-solid-hover); color: #fff; gap: 14px; }
.mis-menu-foot-meta { margin-left: auto; font-size: 11px; color: var(--mis-text-muted); }

body.mis-menu-open { overflow: hidden; }

/* ── Responsiv ─────────────────────────────────────────────────────────── */
@media (max-width: 1199.98px) {
    .mis-next-event-title { max-width: 150px; }
    .mis-brand-sub { display: none; }
}
@media (max-width: 991.98px) {
    .mis-next-event { display: none; }
    .mis-menu-stage { grid-template-columns: 1fr; gap: 0; padding-top: calc(var(--mis-nav-h) + 16px); }
    .mis-menu-aside { display: none; }
    .mis-menu-link { font-size: clamp(19px, 5vw, 26px); }
    /* Mobil: Untermenü als Kacheln direkt unter der Gruppe */
    .mis-menu-inline { display: none; padding: 4px 0 14px 56px; }
    .mis-menu-item.is-open > .mis-menu-inline { display: grid; grid-template-columns: 1fr; gap: 6px; }
    .mis-menu-inline .mis-menu-tile { min-height: 44px; font-size: 13.5px; }
    .mis-menu-foot-meta { display: none; }
}
@media (min-width: 992px) { .mis-menu-inline { display: none !important; } }
@media (max-width: 767.98px) {
    :root { --mis-nav-h: 58px; }
    .mis-navbar-inner { padding: 0 10px; gap: 6px; }
    .mis-brand-logo { width: 34px; height: 34px; }
    .mis-topbar-icons #searchToggle { display: none; }
    .mis-icon-btn { width: 34px; }
    .mis-burger-text { display: none; }
    .mis-burger { padding: 0 12px; }
}
@media (max-width: 575.98px) {
    .mis-icon-btn--admin { display: none; }
    .mis-cta span { display: none; }
    .mis-cta { padding: 0 12px; }
    .mis-cta:hover { padding-right: 12px; }
    .mis-brand-label { font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
    .mis-menu, .mis-menu-link, .mis-menu-pane { transition: none !important; }
    .mis-menu-emblem::before, .mis-next-event-kicker::before { animation: none !important; }
}


/* ══════════════════════════════════════════════════════════════════════════
   Event-Detailseiten (Operationen / Ausbildungen)
   ══════════════════════════════════════════════════════════════════════════ */

body.mis-page-event { padding-top: 0 !important; }
body.mis-page-event .container-fluid,
body.mis-page-event .mis-main { padding: 0 !important; }
body.mis-page-event .mis-main > .alert {
    width: min(1240px, calc(100% - 32px)); margin: calc(var(--mis-nav-h) + 10px) auto -60px;
    position: relative; z-index: 5;
}

.mis-ev { --ev-color: var(--mis-glow); --ev-color-rgb: var(--mis-glow-rgb); }
.mis-ev-wrap { width: min(1240px, calc(100% - 32px)); margin: 0 auto; }

/* ── Hero: Bild, Verlauf von unten, schräge Unterkante ── */
.mis-ev-hero {
    position: relative; overflow: hidden;
    min-height: clamp(400px, 56vh, 600px);
    display: flex; align-items: flex-end;
    padding: calc(var(--mis-nav-h) + 24px) 0 96px;
    background: color-mix(in srgb, var(--mis-bg-canvas) 60%, black);
    clip-path: polygon(0 0, 100% 0, 100% calc(100% - 56px), 0 100%);
}
.mis-ev-hero-media {
    position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; pointer-events: none;
    animation: mis-ev-drift 30s ease-out both;
}
@keyframes mis-ev-drift { from { transform: scale(1.06) translateY(-1%); } to { transform: none; } }
.mis-ev-hero-shade {
    position: absolute; inset: 0; pointer-events: none;
    background:
        linear-gradient(to top, var(--mis-bg-canvas) 0%, color-mix(in srgb, var(--mis-bg-canvas) 55%, transparent) 30%, transparent 65%),
        linear-gradient(to bottom, rgba(0,0,0,.55) 0%, transparent 28%);
}
.mis-ev-hero.has-gradient .mis-ev-hero-shade {
    background:
        linear-gradient(to top, var(--mis-bg-canvas) 0%, rgba(var(--ev-color-rgb), .78) 30%, rgba(var(--ev-color-rgb), .25) 62%, transparent 85%),
        linear-gradient(to bottom, rgba(0,0,0,.55) 0%, transparent 28%);
}
.mis-ev-hero-shade::after {  /* Punktraster rechts oben */
    content: ''; position: absolute; inset: 0;
    background-image: var(--mis-dots); background-size: 20px 20px;
    mask-image: linear-gradient(225deg, #000 0%, transparent 45%);
    -webkit-mask-image: linear-gradient(225deg, #000 0%, transparent 45%);
}
.mis-ev-hero.no-media.has-gradient { background: linear-gradient(160deg, color-mix(in srgb, var(--mis-bg-canvas) 60%, black) 30%, rgba(var(--ev-color-rgb), .95) 100%); }
.mis-ev-hero-inner { position: relative; z-index: 2; }

.mis-ev-hero-top { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 22px; }
.mis-ev-back {
    display: inline-flex; align-items: center; gap: 8px;
    color: rgba(255,255,255,.75); text-decoration: none; font-size: 13px; font-weight: 600;
    transition: color .15s, gap .2s;
}
.mis-ev-back:hover { color: #fff; gap: 12px; }
.mis-ev-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.mis-ev-actions form { margin: 0; }
.mis-ev-btn {
    display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 14px;
    border: none; background: rgba(0,0,0,.45); color: rgba(255,255,255,.9);
    font-size: 12.5px; font-weight: 600; text-decoration: none; cursor: pointer;
    clip-path: var(--mis-plate-sm);
    backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
    transition: background .15s, color .15s;
}
.mis-ev-btn:hover { background: rgba(0,0,0,.7); color: #fff; }
.mis-ev-btn--warn:hover   { background: var(--mis-warning); color: #1a1a1a; }
.mis-ev-btn--danger:hover { background: var(--mis-danger); color: #fff; }

.mis-ev-tags { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 14px; }
.mis-ev-tag {
    display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 12px 0 10px;
    background: rgba(0,0,0,.45); color: #fff; font-size: 11.5px; font-weight: 700;
    clip-path: var(--mis-plate-sm);
}
.mis-ev-tag--planned   { background: var(--mis-success); color: #06140c; }
.mis-ev-tag--review    { background: #e36209; }
.mis-ev-tag--completed { background: color-mix(in srgb, var(--mis-success) 30%, rgba(0,0,0,.5)); }
.mis-ev-tag--cancelled { background: var(--mis-danger); }
.mis-ev-tag--accent    { background: var(--mis-accent-solid); }
.mis-ev-tag--pvp       { box-shadow: inset 0 -2px 0 var(--mis-danger); }
.mis-ev-tag--pve       { box-shadow: inset 0 -2px 0 var(--mis-success); }

.mis-ev-titlebox { position: relative; max-width: 980px; }
.mis-ev-kicker { font-size: 13px; font-weight: 600; color: rgba(255,255,255,.7); margin-bottom: 6px; }
.mis-ev-kicker a { color: #fff; text-decoration: none; border-bottom: 1px dashed rgba(255,255,255,.4); }
.mis-ev-kicker a:hover { border-bottom-style: solid; }
.mis-ev-title {
    margin: 0; color: #fff; font-size: clamp(30px, 4.6vw, 58px); font-weight: 800; line-height: 1.05;
    text-shadow: 0 3px 24px rgba(0,0,0,.45); overflow-wrap: anywhere;
}
.mis-ev-lead { margin: 14px 0 0; max-width: 700px; color: rgba(255,255,255,.82); font-size: 15px; line-height: 1.6; text-shadow: 0 1px 8px rgba(0,0,0,.5); }

/* ── Info-Karten, überlappen die schräge Hero-Kante ── */
.mis-ev-cards {
    position: relative; z-index: 3; margin-top: -84px;
    display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px;
}
.mis-ev-card {
    display: flex; gap: 14px; align-items: flex-start; min-width: 0;
    padding: 16px 18px;
    background: color-mix(in srgb, var(--mis-bg-surface) 82%, black);
    border-top: 2px solid rgba(255,255,255,.08);
    box-shadow: 0 14px 34px rgba(0,0,0,.35);
    clip-path: var(--mis-plate);
}
.mis-ev-card--accent { border-top-color: var(--mis-hot); }
.mis-ev-card-icon {
    flex-shrink: 0; width: 38px; height: 38px;
    display: flex; align-items: center; justify-content: center;
    background: rgba(var(--ev-color-rgb), .45); color: #fff;
    clip-path: var(--mis-plate-sm);
}
.mis-ev-card-body { min-width: 0; flex: 1; }
.mis-ev-card-label { font-size: 11px; font-weight: 600; color: var(--mis-text-secondary); margin-bottom: 4px; }
.mis-ev-card-value { color: #fff; font-size: 15px; font-weight: 700; line-height: 1.3; overflow-wrap: anywhere; }
.mis-ev-card-sub { color: var(--mis-text-secondary); font-size: 12px; margin-top: 3px; }
.mis-ev-countdown { display: flex; gap: 4px; font-variant-numeric: tabular-nums; }
.mis-ev-countdown .mis-seg { min-width: 40px; height: 42px; font-size: 18px; background: rgba(0,0,0,.3); }
.mis-ev-countdown .mis-seg small { font-size: 8.5px; }
.mis-ev-meter { margin-top: 8px; height: 6px; background: rgba(255,255,255,.08); display: flex; gap: 2px; }
.mis-ev-meter span { display: block; height: 100%; background: linear-gradient(90deg, var(--mis-accent-solid), var(--mis-hot)); }

/* ── Reiter: linksbündige Segment-Tabs ── */
.mis-ev-tabs {
    position: sticky; top: var(--mis-nav-h); z-index: 20;
    margin-top: 28px; padding: 10px 0;
    background: color-mix(in srgb, var(--mis-bg-canvas) 90%, transparent);
    backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
}
.mis-ev-tabs-inner { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; }
.mis-ev-tabs-inner::-webkit-scrollbar { display: none; }
.mis-ev-tab {
    display: inline-flex; align-items: center; gap: 8px; flex-shrink: 0;
    height: 40px; padding: 0 18px;
    background: rgba(255,255,255,.04); border: none; cursor: pointer;
    color: var(--mis-text-secondary); font-size: 13.5px; font-weight: 600;
    clip-path: var(--mis-plate);
    transition: background .15s, color .15s;
}
.mis-ev-tab:hover { background: rgba(255,255,255,.08); color: #fff; }
.mis-ev-tab.is-active { background: var(--mis-accent-solid); color: #fff; }
.mis-ev-tab-count {
    min-width: 20px; height: 20px; padding: 0 6px;
    display: inline-flex; align-items: center; justify-content: center;
    background: rgba(0,0,0,.28); font-size: 11px; font-weight: 700; font-variant-numeric: tabular-nums;
}

.mis-ev-body { padding: 18px 0 64px; }
.mis-ev-tabpanel { display: none; animation: mis-ev-in .3s ease; }
.mis-ev-tabpanel.is-active { display: block; }
@keyframes mis-ev-in { from { opacity: 0; transform: translateX(-8px); } to { opacity: 1; transform: none; } }

/* ── Panels ── */
.mis-ev-panel, .mis-ev-tabpanel .card {
    background: color-mix(in srgb, var(--mis-bg-surface) 75%, black) !important;
    background-image: none !important;
    border: none !important; border-radius: 0 !important;
    clip-path: var(--mis-plate);
}
.mis-ev-panel { padding: 22px 24px; margin-bottom: 16px; }
.mis-ev-h {
    display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
    margin: 0 0 16px; padding-bottom: 12px; border-bottom: 1px solid rgba(255,255,255,.06);
}
.mis-ev-h-title { position: relative; color: #fff; font-size: 16px; font-weight: 700; margin: 0; }
.mis-ev-h-meta { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.mis-ev-prose { color: var(--mis-text-primary); font-size: 14.5px; line-height: 1.75; white-space: pre-wrap; overflow-wrap: anywhere; }
.mis-ev-empty { padding: 40px 16px; text-align: center; color: var(--mis-text-muted); }
.mis-ev-empty svg { opacity: .5; margin-bottom: 10px; }
.mis-ev-empty b { display: block; color: var(--mis-text-secondary); font-size: 14px; margin-bottom: 2px; }
.mis-ev-empty span { font-size: 13px; }

.mis-ev-facts { margin: 0; }
.mis-ev-facts > div { display: flex; justify-content: space-between; gap: 14px; padding: 8px 0; border-bottom: 1px dashed rgba(255,255,255,.07); font-size: 13.5px; }
.mis-ev-facts > div:last-child { border-bottom: none; }
.mis-ev-facts dt { color: var(--mis-text-secondary); font-weight: 500; }
.mis-ev-facts dd { margin: 0; color: #fff; text-align: right; overflow-wrap: anywhere; }
.mis-ev-facts dd a { color: var(--mis-link); text-decoration: none; }

/* Eigene Anmeldung */
.mis-ev-rsvp-state {
    display: flex; align-items: center; gap: 10px; padding: 10px 12px; margin-bottom: 12px;
    background: rgba(255,255,255,.04); font-size: 13.5px; font-weight: 600;
    border-left: 3px solid currentColor;
}
.mis-ev-rsvp { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.mis-ev-rsvp-btn {
    height: 42px; border: none; cursor: pointer;
    background: rgba(255,255,255,.05); color: var(--mis-text-primary);
    font-size: 13px; font-weight: 600; clip-path: var(--mis-plate-sm);
    transition: background .15s, color .15s;
}
.mis-ev-rsvp-btn:hover { background: rgba(255,255,255,.1); color: #fff; }
.mis-ev-rsvp-btn--yes.is-on   { background: var(--mis-success); color: #06140c; }
.mis-ev-rsvp-btn--late.is-on  { background: var(--mis-warning); color: #1a1a1a; }
.mis-ev-rsvp-btn--maybe.is-on { background: #6b7280; color: #fff; }
.mis-ev-rsvp-btn--no.is-on    { background: var(--mis-danger); color: #fff; }
.mis-ev-input {
    background: rgba(0,0,0,.28) !important; color: var(--mis-text-primary) !important;
    border: 1px solid rgba(255,255,255,.1) !important; border-radius: 0 !important;
}

/* Einladungsliste */
.mis-ev-stat-pill {
    display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 12px 0 10px;
    font-size: 12px; font-weight: 700; font-variant-numeric: tabular-nums;
    background: rgba(255,255,255,.05); color: var(--mis-text-primary); clip-path: var(--mis-plate-sm);
}
.mis-ev-stat-pill i { width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.mis-ev-stat-pill--yes i { background: var(--mis-success); }
.mis-ev-stat-pill--no i  { background: var(--mis-danger); }
.mis-ev-stat-pill--open i{ background: var(--mis-text-muted); }
.mis-ev-group { margin-bottom: 22px; }
.mis-ev-group-title { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; color: #fff; font-size: 15px; font-weight: 700; }
.mis-ev-group-title img { height: 22px; object-fit: contain; }
.mis-ev-callsign { color: var(--mis-text-secondary); font-weight: 500; font-style: italic; }
.mis-ev-subgroup { margin-bottom: 14px; }
.mis-ev-subgroup.is-nested { margin-left: 10px; padding-left: 14px; border-left: 2px solid rgba(255,255,255,.06); }
.mis-ev-subgroup-title { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; color: var(--mis-text-secondary); font-size: 13px; font-weight: 600; }
.mis-ev-subgroup-title img { height: 16px; object-fit: contain; }
.mis-ev-count-badge { font-size: 11px; font-weight: 700; padding: 1px 7px; background: rgba(255,255,255,.07); color: var(--mis-text-primary); }
.mis-ev-rows { display: grid; grid-template-columns: repeat(auto-fill, minmax(330px, 1fr)); gap: 4px 12px; }
.mis-ev-row {
    display: flex; align-items: center; gap: 10px; min-height: 42px; padding: 6px 4px 6px 10px;
    border-bottom: 1px solid rgba(255,255,255,.05);
    transition: background .15s;
}
.mis-ev-row:hover { background: rgba(255,255,255,.035); }
.mis-ev-row-name { flex: 1; min-width: 0; color: #fff; font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mis-ev-row-note { color: var(--mis-text-muted); font-style: italic; font-size: 11.5px; max-width: 110px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mis-ev-row-tools { display: flex; gap: 3px; flex-shrink: 0; }
.mis-ev-row-tools form { margin: 0; }
.mis-ev-state {
    flex-shrink: 0; font-size: 10.5px; font-weight: 700; padding: 3px 8px;
    background: rgba(255,255,255,.06); color: var(--mis-text-secondary);
}
.mis-ev-state--yes { background: color-mix(in srgb, var(--mis-success) 20%, transparent); color: var(--mis-success); }
.mis-ev-state--no  { background: color-mix(in srgb, var(--mis-danger) 20%, transparent); color: var(--mis-danger); }
.mis-ev-flag { flex-shrink: 0; font-size: 10.5px; font-weight: 700; padding: 3px 7px; background: rgba(255,255,255,.07); color: var(--mis-text-primary); }
.mis-ev-flag--late  { color: #7fe3f7; background: rgba(61,213,243,.14); }
.mis-ev-flag--maybe { color: var(--mis-warning); background: color-mix(in srgb, var(--mis-warning) 15%, transparent); }
.mis-ev-flag--instr { color: #f0c050; background: rgba(240,165,0,.18); }
.mis-ev-flag--pass  { color: var(--mis-success); background: color-mix(in srgb, var(--mis-success) 15%, transparent); }
.mis-ev-flag--fail  { color: var(--mis-danger); background: color-mix(in srgb, var(--mis-danger) 15%, transparent); }
.mis-ev-mini {
    width: 26px; height: 26px; padding: 0; border: none; cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center;
    background: rgba(255,255,255,.06); color: var(--mis-text-secondary); font-size: 11px; line-height: 1;
    transition: background .15s, color .15s;
}
.mis-ev-mini:hover { background: rgba(255,255,255,.14); color: #fff; }
.mis-ev-mini.is-yes  { background: var(--mis-success); color: #fff; }
.mis-ev-mini.is-open { background: #555d68; color: #fff; }
.mis-ev-mini.is-no   { background: var(--mis-danger); color: #fff; }

/* Slotliste: Einheiten als Karten mit Rollen-Zeilen */
.mis-ev-slotbar {
    display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap;
    margin-bottom: 14px; padding: 14px 18px;
    background: color-mix(in srgb, var(--mis-bg-surface) 75%, black); clip-path: var(--mis-plate);
}
.mis-ev-slotbar-title { color: #fff; font-size: 15px; font-weight: 700; }
.mis-ev-slotbar-sub { color: var(--mis-text-secondary); font-size: 12.5px; }
.mis-ev-slotbar-meter { display: flex; align-items: center; gap: 12px; font-size: 13px; font-weight: 700; color: #fff; font-variant-numeric: tabular-nums; }
.mis-ev-slotbar-meter .mis-ev-meter { width: 180px; margin: 0; }
.mis-ev-units { display: grid; grid-template-columns: repeat(auto-fill, minmax(380px, 1fr)); gap: 12px; align-items: start; }
.mis-ev-unit { background: color-mix(in srgb, var(--mis-bg-surface) 75%, black); clip-path: var(--mis-plate); }
.mis-ev-unit-head {
    display: flex; justify-content: space-between; align-items: center; gap: 10px;
    padding: 12px 16px; background: rgba(var(--ev-color-rgb), .35);
}
.mis-ev-unit-name { color: #fff; font-size: 14.5px; font-weight: 700; }
.mis-ev-unit-count { font-size: 12px; font-weight: 700; color: #fff; font-variant-numeric: tabular-nums; padding: 2px 8px; background: rgba(0,0,0,.3); }
.mis-ev-slot { display: flex; align-items: center; gap: 10px; min-height: 46px; padding: 8px 16px; border-top: 1px solid rgba(255,255,255,.05); }
.mis-ev-slot.is-mine { background: color-mix(in srgb, var(--mis-accent) 16%, transparent); box-shadow: inset 3px 0 0 var(--mis-hot); }
.mis-ev-slot-no { flex-shrink: 0; width: 24px; font-size: 11px; font-weight: 700; color: var(--mis-text-muted); font-variant-numeric: tabular-nums; }
.mis-ev-slot-role { flex: 0 0 42%; min-width: 0; color: var(--mis-text-secondary); font-size: 13px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mis-ev-slot-who { flex: 1; min-width: 0; display: flex; align-items: center; gap: 7px; color: #fff; font-size: 13.5px; }
.mis-ev-slot-who > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mis-ev-slot-free { color: var(--mis-text-muted) !important; font-style: italic; }
.mis-ev-slot form { margin: 0; }
.mis-ev-slot select { height: 28px; padding: 0 22px 0 8px; font-size: 12px; max-width: 190px; }

/* Dokumente */
.mis-ev-doc {
    display: flex; align-items: center; gap: 14px; padding: 12px 6px;
    border-bottom: 1px solid rgba(255,255,255,.06); color: var(--mis-text-primary); text-decoration: none;
    transition: background .15s, padding .2s;
}
.mis-ev-doc:last-child { border-bottom: none; }
.mis-ev-doc:hover { background: rgba(255,255,255,.04); padding-left: 12px; color: #fff; }
.mis-ev-doc-icon { flex-shrink: 0; width: 38px; height: 38px; display: flex; align-items: center; justify-content: center; background: rgba(var(--ev-color-rgb), .45); color: #fff; clip-path: var(--mis-plate-sm); }
.mis-ev-doc-title { flex: 1; min-width: 0; font-size: 14px; font-weight: 600; overflow-wrap: anywhere; }
.mis-ev-doc-meta { color: var(--mis-text-muted); font-size: 12px; white-space: nowrap; }

/* Verwaltung: vorhandene Karten (Discord-Sektion, Slot-Builder) */
.mis-ev-tabpanel .card { padding: 20px 22px !important; margin-bottom: 14px !important; }
.mis-ev-tabpanel .card h6.text-uppercase { color: #fff !important; font-size: 14px !important; text-transform: none !important; letter-spacing: 0; font-weight: 700; }

@media (max-width: 991.98px) {
    .mis-ev-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767.98px) {
    .mis-ev-hero { min-height: 360px; padding-bottom: 80px; clip-path: polygon(0 0, 100% 0, 100% calc(100% - 28px), 0 100%); }
    .mis-ev-cards { margin-top: -60px; gap: 8px; }
    .mis-ev-card { padding: 12px; gap: 10px; }
    .mis-ev-card-icon { display: none; }
    .mis-ev-countdown .mis-seg { min-width: 30px; height: 36px; font-size: 15px; }
    .mis-ev-panel { padding: 18px 16px; }
    .mis-ev-rows, .mis-ev-units { grid-template-columns: 1fr; }
    .mis-ev-slot-role { flex-basis: 38%; }
    .mis-ev-slotbar-meter .mis-ev-meter { width: 100px; }
}


/* ══════════════════════════════════════════════════════════════════════════
   Globale Stilschicht – überträgt die Formensprache auf alle übrigen Seiten,
   ohne die einzelnen Templates umzubauen. Selektoren sind auf .mis-main
   begrenzt (Navbar/Menü bleiben unberührt) und stärker als die Bootstrap-
   Overrides im <style>-Block von base.html. Die Landing-Page (frei gestaltete
   Sektionen) ist bewusst ausgenommen.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Seitenhintergrund: Verlauf + Punktraster oben ── */
body:not(.mis-page-event):not(.mis-page-landing)::before {
    content: ''; position: absolute; top: 0; left: 0; right: 0; height: 460px;
    pointer-events: none; z-index: 0;
    background:
        var(--mis-dots),
        linear-gradient(170deg, rgba(var(--mis-glow-rgb), .42) 0%, rgba(var(--mis-glow-rgb), .14) 40%, transparent 75%);
    background-size: 22px 22px, auto;
    mask-image: linear-gradient(to bottom, #000 30%, transparent 100%);
    -webkit-mask-image: linear-gradient(to bottom, #000 30%, transparent 100%);
}
body > .container-fluid, body > .mis-footer { position: relative; z-index: 1; }

/* ── Seitentitel ── */
body:not(.mis-page-landing) .mis-main :is(h1, h2):not(.card *):not(.modal *):not(.mis-ev *):not(.mis-article-content *):not(.mis-sec-title) {
    color: #fff !important; font-weight: 800; letter-spacing: -.01em;
}
body:not(.mis-page-landing) .mis-main h5:not(.card *):not(.modal *):not(.mis-ev *) { color: #fff; font-weight: 700; }

/* ── Karten: flach ── */
body:not(.mis-page-landing) .mis-main .card {
    border-radius: 0 !important;
    border: 1px solid rgba(255,255,255,.06) !important;
    box-shadow: 0 12px 32px rgba(0,0,0,.28);
}
body:not(.mis-page-landing) .mis-main .card .card { box-shadow: none; }
body:not(.mis-page-landing) .mis-main .card-header {
    background: rgba(255,255,255,.03) !important; border-bottom: 1px solid rgba(255,255,255,.06) !important;
    border-radius: 0 !important; color: #fff; font-weight: 700; padding-left: 20px;
}
body:not(.mis-page-landing) .mis-main .card-footer { border-radius: 0 !important; background: rgba(0,0,0,.15) !important; }
/* Kleine Versal-Überschriften in Karten (häufigstes Muster) → normale Titel */
body:not(.mis-page-landing) .mis-main .card h6.text-uppercase {
    color: #fff !important; text-transform: none !important; letter-spacing: 0 !important;
    font-size: 14.5px !important; font-weight: 700 !important;
}

/* ── Buttons: angefast, Outline-Varianten als getönte Flächen ── */
body:not(.mis-page-landing) .mis-main .btn:not(.btn-close):not(.btn-link) {
    border-radius: 0 !important; font-weight: 600;
    clip-path: polygon(0 0, calc(100% - 7px) 0, 100% 7px, 100% 100%, 0 100%);
}
body:not(.mis-page-landing) .mis-main .btn-sm:not(.btn-close):not(.btn-link) {
    clip-path: polygon(0 0, calc(100% - 5px) 0, 100% 5px, 100% 100%, 0 100%);
}
body:not(.mis-page-landing) .mis-main .btn-group > .btn { clip-path: none; }
body:not(.mis-page-landing) .mis-main :is(.btn-outline-secondary, .btn-outline-light, .btn-outline-dark) {
    background: rgba(255,255,255,.06); border-color: transparent; color: var(--mis-text-primary);
}
body:not(.mis-page-landing) .mis-main :is(.btn-outline-secondary, .btn-outline-light, .btn-outline-dark):hover,
body:not(.mis-page-landing) .mis-main :is(.btn-outline-secondary, .btn-outline-light, .btn-outline-dark).active {
    background: rgba(255,255,255,.13); border-color: transparent; color: #fff;
}
body:not(.mis-page-landing) .mis-main .btn-outline-primary { background: color-mix(in srgb, var(--mis-accent) 18%, transparent); border-color: transparent; color: var(--mis-hot); }
body:not(.mis-page-landing) .mis-main .btn-outline-success { background: color-mix(in srgb, var(--mis-success) 15%, transparent); border-color: transparent; color: var(--mis-success); }
body:not(.mis-page-landing) .mis-main .btn-outline-danger  { background: color-mix(in srgb, var(--mis-danger) 15%, transparent); border-color: transparent; color: var(--mis-danger); }
body:not(.mis-page-landing) .mis-main .btn-outline-warning { background: color-mix(in srgb, var(--mis-warning) 15%, transparent); border-color: transparent; color: var(--mis-warning); }
body:not(.mis-page-landing) .mis-main .btn-outline-info    { background: color-mix(in srgb, #3dd5f3 14%, transparent); border-color: transparent; color: #7fe3f7; }
body:not(.mis-page-landing) .mis-main .btn-outline-primary:hover { background: var(--mis-accent-solid); color: #fff; }
body:not(.mis-page-landing) .mis-main .btn-outline-success:hover { background: var(--mis-success); color: #fff; }
body:not(.mis-page-landing) .mis-main .btn-outline-danger:hover  { background: var(--mis-danger); color: #fff; }
body:not(.mis-page-landing) .mis-main .btn-outline-warning:hover { background: var(--mis-warning); color: #1a1a1a; }
body:not(.mis-page-landing) .mis-main .btn-outline-info:hover    { background: #3dd5f3; color: #06222a; }

/* ── Reiter (Verwaltungs-Hubs u.a.): Segment-Tabs ── */
body:not(.mis-page-landing) .mis-main .nav-tabs { border-bottom: none !important; gap: 6px; flex-wrap: wrap; }
body:not(.mis-page-landing) .mis-main .nav-tabs .nav-link {
    border: none !important; border-radius: 0 !important; margin: 0;
    background: rgba(255,255,255,.04); color: var(--mis-text-secondary); font-weight: 600;
    clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 0 100%);
    transition: background .15s, color .15s;
}
body:not(.mis-page-landing) .mis-main .nav-tabs .nav-link:hover { background: rgba(255,255,255,.09); color: #fff; }
body:not(.mis-page-landing) .mis-main .nav-tabs .nav-link.active { background: var(--mis-accent-solid) !important; color: #fff !important; }
body:not(.mis-page-landing) .mis-main .nav-pills .nav-link { border-radius: 0; }

/* ── Tabellen ── */
body:not(.mis-page-landing) .mis-main .table > thead > tr > th {
    font-size: 11.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase;
    color: var(--mis-text-secondary) !important;
    background-color: color-mix(in srgb, var(--mis-bg-overlay) 70%, black) !important;
    border-bottom: 2px solid rgba(var(--mis-glow-rgb), .9) !important;
}
body:not(.mis-page-landing) .mis-main .table > tbody > tr { transition: background-color .12s; }
body:not(.mis-page-landing) .mis-main .table-hover > tbody > tr:hover > *,
body:not(.mis-page-landing) .mis-main .table-dark > tbody > tr:hover > * { background-color: color-mix(in srgb, var(--mis-accent) 10%, var(--mis-table-bg)) !important; }

/* ── Badges, Formulare, Alerts, Dropdowns, Modals, Pagination ── */
body:not(.mis-page-landing) .mis-main .badge { border-radius: 0 !important; font-weight: 700; letter-spacing: .02em; }
body:not(.mis-page-landing) .mis-main :is(.form-control, .form-select, .input-group-text):not(.form-control-color) { border-radius: 0 !important; }
body:not(.mis-page-landing) .mis-main :is(.form-control, .form-select):focus { border-color: var(--mis-accent) !important; box-shadow: inset 3px 0 0 var(--mis-accent) !important; }
body .alert { border-radius: 0 !important; border: none !important; border-left: 3px solid currentColor !important; }
body .dropdown-menu { border-radius: 0 !important; }
body .modal-content { border-radius: 0 !important; border: 1px solid rgba(255,255,255,.08) !important; }
body .modal-header { border-bottom-color: rgba(255,255,255,.07) !important; }
body .modal-footer { border-top-color: rgba(255,255,255,.07) !important; }
body:not(.mis-page-landing) .mis-main .pagination .page-link { border-radius: 0 !important; }
body:not(.mis-page-landing) .mis-main :is(.list-group, .list-group-item) { border-radius: 0 !important; }

/* ── Footer: Akzent-Haarlinie wie die Navigationsleiste ── */
body .mis-footer { border-top: none !important; }
body .mis-footer::before {
    content: ''; position: absolute; left: 0; right: 0; top: 0; height: 1px;
    background: linear-gradient(90deg, var(--mis-accent) 0%, rgba(var(--mis-glow-rgb), .9) 30%, rgba(255,255,255,.08) 70%, rgba(255,255,255,.04) 100%);
}

/* ── Inhaltsbreite: auf breiten Monitoren zentriert statt randlos gestreckt ── */
body:not(.mis-page-event):not(.mis-page-landing) .mis-main { max-width: var(--mis-shell-max); margin: 0 auto; }


/* ══════════════════════════════════════════════════════════════════════════
   Seitenkopf (.mis-ph) – Banner für Übersichtsseiten ({% block page_head %})
   Body-Klasse „mis-has-ph“ setzen: der Kopf läuft dann unter der Navbar
   durch und ersetzt den einfachen Verlauf oben.
   ══════════════════════════════════════════════════════════════════════════ */

body.mis-has-ph::before { display: none; }
body.mis-has-ph .mis-main { padding-top: 0; }
.mis-ph {
    position: relative; overflow: hidden;
    margin-top: calc(-1 * var(--mis-nav-h));
    padding: calc(var(--mis-nav-h) + 40px) 0 0;
    background: color-mix(in srgb, var(--mis-bg-canvas) 70%, black);
    clip-path: polygon(0 0, 100% 0, 100% calc(100% - 36px), 0 100%);
}
.mis-ph-bg { position: absolute; inset: 0; pointer-events: none; }
.mis-ph-bg img {
    position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .38;
    mask-image: linear-gradient(100deg, transparent 15%, #000 75%);
    -webkit-mask-image: linear-gradient(100deg, transparent 15%, #000 75%);
}
.mis-ph-bg::before {
    content: ''; position: absolute; inset: 0;
    background:
        linear-gradient(to top, var(--mis-bg-canvas) 0%, rgba(var(--mis-glow-rgb), .55) 45%, rgba(var(--mis-glow-rgb), .15) 100%);
}
.mis-ph-bg::after {
    content: ''; position: absolute; inset: 0;
    background-image: var(--mis-dots); background-size: 22px 22px;
    mask-image: linear-gradient(200deg, #000 0%, transparent 55%);
    -webkit-mask-image: linear-gradient(200deg, #000 0%, transparent 55%);
}
.mis-ph-inner { position: relative; z-index: 1; width: min(var(--mis-shell-max), 100%); margin: 0 auto; padding: 0 24px 72px; }
.mis-ph-top { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; flex-wrap: wrap; }
.mis-ph-kicker { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; color: rgba(255,255,255,.7); font-size: 13px; font-weight: 600; }
.mis-ph-kicker a { color: rgba(255,255,255,.85); text-decoration: none; }
.mis-ph-kicker a:hover { color: #fff; }
.mis-ph-kicker i { width: 18px; height: 2px; background: var(--mis-hot); }
.mis-ph-title { position: relative; margin: 0; color: #fff; font-size: clamp(30px, 4vw, 50px); font-weight: 800; line-height: 1.05; }
.mis-ph-lead { margin: 12px 0 0; max-width: 720px; color: rgba(255,255,255,.75); font-size: 15px; line-height: 1.55; }
.mis-ph-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.mis-ph-btn {
    display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 18px;
    border: none; background: rgba(255,255,255,.08); color: #fff; text-decoration: none;
    font-size: 13.5px; font-weight: 600; cursor: pointer;
    clip-path: var(--mis-plate); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
    transition: background .15s;
}
.mis-ph-btn:hover { background: rgba(255,255,255,.16); color: #fff; }
.mis-ph-btn--primary { background: var(--mis-accent-solid); }
.mis-ph-btn--primary:hover { background: var(--mis-accent-solid-hover); }
.mis-ph-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 10px; margin-top: 28px; }
.mis-ph-stat {
    padding: 14px 18px; background: rgba(0,0,0,.32); border-top: 2px solid rgba(255,255,255,.1);
    clip-path: var(--mis-plate); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
}
.mis-ph-stat--accent { border-top-color: var(--mis-hot); }
.mis-ph-stat b { display: block; color: #fff; font-size: 26px; font-weight: 800; line-height: 1.1; font-variant-numeric: tabular-nums; }
.mis-ph-stat span { color: rgba(255,255,255,.65); font-size: 12px; font-weight: 600; }
/* Große Suche im Kopf (Wiki) */
.mis-ph-search {
    display: flex; align-items: center; gap: 12px; width: min(620px, 100%); height: 52px; margin: 22px 0 0 20px; padding: 0 18px;
    background: rgba(0,0,0,.4); border: 1px solid rgba(255,255,255,.12); color: rgba(255,255,255,.6);
    font-size: 15px; cursor: text; text-align: left; clip-path: var(--mis-plate);
    transition: border-color .15s, background .15s;
}
.mis-ph-search:hover { border-color: var(--mis-hot); background: rgba(0,0,0,.55); color: #fff; }

/* ── Abschnittstitel im Inhalt ── */
.mis-sec { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 34px 0 14px; }
.mis-sec:first-child { margin-top: 8px; }
.mis-sec-title { position: relative; margin: 0; color: #fff; font-size: 19px; font-weight: 800; }
.mis-sec-title small { margin-left: 8px; color: var(--mis-text-secondary); font-size: 13px; font-weight: 600; }
.mis-sec a { color: var(--mis-text-secondary); font-size: 13px; font-weight: 600; text-decoration: none; }
.mis-sec a:hover { color: #fff; }

/* ── Werkzeugleiste (Suche + Filter-Chips) ── */
.mis-toolbar {   /* bewusst ohne clip-path – Dropdowns (Filter) dürfen herausragen */
    display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 10px;
    background: color-mix(in srgb, var(--mis-bg-surface) 70%, black); box-shadow: inset 3px 0 0 rgba(var(--mis-glow-rgb), .9);
}
.mis-toolbar-search { position: relative; flex: 1 1 260px; }
.mis-toolbar-search svg { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--mis-text-muted); pointer-events: none; }
.mis-toolbar .form-control, .mis-toolbar .form-select {
    height: 38px; background-color: rgba(0,0,0,.3) !important; border: 1px solid rgba(255,255,255,.08) !important; color: var(--mis-text-primary) !important; font-size: 13px;
}
.mis-toolbar-search .form-control { padding-left: 36px; }
.mis-toolbar .form-select { width: auto; min-width: 140px; }
.mis-chip {
    display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 14px; margin: 0;
    background: rgba(255,255,255,.05); color: var(--mis-text-secondary); font-size: 12.5px; font-weight: 600;
    text-decoration: none; cursor: pointer; user-select: none; clip-path: var(--mis-plate-sm);
    transition: background .15s, color .15s;
}
.mis-chip:hover { background: rgba(255,255,255,.1); color: #fff; }
.mis-chip.is-on { background: var(--mis-accent-solid); color: #fff; }
.mis-chip i { width: 8px; height: 8px; border-radius: 50%; }
.mis-seg-toggle { display: inline-flex; gap: 2px; padding: 2px; background: rgba(0,0,0,.3); }
.mis-seg-toggle button {
    display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px; border: none;
    background: transparent; color: var(--mis-text-secondary); font-size: 12.5px; font-weight: 600; cursor: pointer;
}
.mis-seg-toggle button.is-on { background: var(--mis-accent-solid); color: #fff; }

/* ── Feature-Karten („Als Nächstes“) ── */
.mis-feature-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 14px; }
.mis-feature {
    position: relative; display: flex; flex-direction: column; justify-content: flex-end;
    min-height: 260px; overflow: hidden; color: #fff; text-decoration: none;
    background: color-mix(in srgb, var(--mis-bg-canvas) 60%, black);
    clip-path: var(--mis-plate);
}
.mis-feature img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.mis-feature::before {
    content: ''; position: absolute; inset: 0; z-index: 1;
    background: linear-gradient(to top, rgba(0,0,0,.92) 0%, rgba(var(--fc, var(--mis-glow-rgb)), .55) 55%, rgba(0,0,0,.15) 100%);
}
.mis-feature:hover { color: #fff; }
.mis-feature:hover img { transform: scale(1.05); }
.mis-feature-date {
    position: absolute; top: 14px; left: 14px; z-index: 2;
    display: flex; flex-direction: column; align-items: center; min-width: 56px; padding: 6px 8px;
    background: rgba(0,0,0,.55); border-top: 2px solid var(--mis-hot); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
}
.mis-feature-date b { font-size: 24px; font-weight: 800; line-height: 1; }
.mis-feature-date span { font-size: 10.5px; font-weight: 700; text-transform: uppercase; color: rgba(255,255,255,.75); margin-top: 3px; }
.mis-feature-body { position: relative; z-index: 2; padding: 18px 20px; }
.mis-feature-title { margin: 8px 0 6px; font-size: 21px; font-weight: 800; line-height: 1.2; }
.mis-feature-meta { display: flex; gap: 14px; flex-wrap: wrap; font-size: 12.5px; color: rgba(255,255,255,.75); }
.mis-feature-meta span { display: inline-flex; align-items: center; gap: 5px; }
.mis-feature .mis-ev-countdown { margin-top: 12px; }
.mis-feature .mis-seg { min-width: 36px; height: 36px; font-size: 15px; background: rgba(0,0,0,.45); }

/* ── Monatsgruppen-Liste (Archiv) ── */
.mis-month { margin-bottom: 22px; }
.mis-month-head {
    position: sticky; top: var(--mis-nav-h); z-index: 5;
    display: flex; align-items: baseline; gap: 10px; padding: 10px 0 8px;
    background: linear-gradient(to bottom, var(--mis-bg-canvas) 70%, transparent);
    color: #fff; font-size: 15px; font-weight: 800;
}
.mis-month-head small { color: var(--mis-text-muted); font-size: 12px; font-weight: 600; }
.mis-lrow {
    position: relative; display: flex; align-items: center; gap: 16px; min-height: 64px;
    padding: 10px 16px 10px 10px; margin-bottom: 6px;
    background: color-mix(in srgb, var(--mis-bg-surface) 70%, black); clip-path: var(--mis-plate);
    transition: background .15s, transform .15s;
}
.mis-lrow:hover { background: color-mix(in srgb, var(--mis-bg-surface) 88%, black); transform: translateX(3px); }
.mis-lrow-link { position: absolute; inset: 0; z-index: 1; }
.mis-lrow-date {
    flex-shrink: 0; width: 52px; display: flex; flex-direction: column; align-items: center; padding: 4px 0;
    background: rgba(0,0,0,.28); border-left: 3px solid var(--rc, var(--mis-hot));
}
.mis-lrow-date b { color: #fff; font-size: 20px; font-weight: 800; line-height: 1; }
.mis-lrow-date span { color: var(--mis-text-secondary); font-size: 10px; font-weight: 700; text-transform: uppercase; margin-top: 3px; }
.mis-lrow-main { flex: 1; min-width: 0; }
.mis-lrow-title { color: #fff; font-size: 15px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mis-lrow-sub { color: var(--mis-text-secondary); font-size: 12.5px; margin-top: 2px; display: flex; gap: 12px; flex-wrap: wrap; }
.mis-lrow-sub span { display: inline-flex; align-items: center; gap: 5px; }
.mis-lrow-tags { display: flex; gap: 5px; flex-wrap: wrap; justify-content: flex-end; }
.mis-lrow-tools { position: relative; z-index: 2; flex-shrink: 0; }
.mis-lrow.is-cancelled { opacity: .55; }
.mis-lrow.is-cancelled .mis-lrow-title { text-decoration: line-through; text-decoration-color: rgba(255,255,255,.4); }

/* ── Personalkarten (Roster) ── */
.mis-people { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 14px; }
.mis-person {
    position: relative; display: flex; flex-direction: column; overflow: hidden;
    background: color-mix(in srgb, var(--mis-bg-surface) 70%, black); color: var(--mis-text-primary); text-decoration: none;
    clip-path: var(--mis-plate); transition: transform .2s, background .2s;
}
.mis-person:hover { transform: translateY(-4px); background: color-mix(in srgb, var(--mis-bg-surface) 90%, black); color: var(--mis-text-primary); }
.mis-person-img { position: relative; aspect-ratio: 4 / 4.4; overflow: hidden; background: linear-gradient(160deg, rgba(var(--mis-glow-rgb), .5), rgba(0,0,0,.4)); }
.mis-person-img img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 12%; transition: transform .5s cubic-bezier(.2,.7,.2,1); }
.mis-person:hover .mis-person-img img { transform: scale(1.04); }
.mis-person-img::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,.85) 0%, transparent 45%); }
.mis-person-rank { position: absolute; left: 12px; bottom: 10px; z-index: 1; display: flex; align-items: center; gap: 8px; color: #fff; font-size: 12px; font-weight: 700; }
.mis-person-rank img { width: auto !important; height: 26px !important; object-fit: contain; filter: drop-shadow(0 2px 4px rgba(0,0,0,.6)); }
.mis-person-id { position: absolute; right: 10px; top: 10px; z-index: 1; padding: 2px 7px; background: rgba(0,0,0,.55); color: rgba(255,255,255,.8); font-size: 11px; font-weight: 700; font-variant-numeric: tabular-nums; }
.mis-person-status { position: absolute; left: 10px; top: 10px; z-index: 1; padding: 2px 8px; font-size: 10.5px; font-weight: 700; }
.mis-person-dot { position: absolute; right: 10px; bottom: 12px; z-index: 1; width: 10px; height: 10px; border-radius: 50%; background: #e53935; box-shadow: 0 0 0 3px rgba(229,57,53,.3); }
.mis-person-body { padding: 12px 14px 14px; display: flex; flex-direction: column; gap: 4px; flex: 1; }
.mis-person-name { color: #fff; font-size: 15.5px; font-weight: 800; line-height: 1.2; }
.mis-person-role { color: var(--mis-hot); font-size: 12.5px; font-weight: 700; }
.mis-person-unit { color: var(--mis-text-secondary); font-size: 12px; line-height: 1.35; }
.mis-person-staff { display: flex; gap: 4px; flex-wrap: wrap; margin-top: auto; padding-top: 6px; }
.mis-person-staff span { padding: 1px 7px; background: rgba(255,255,255,.07); color: var(--mis-text-primary); font-size: 10.5px; font-weight: 700; }

/* ── Wiki-Übersicht ── */
.mis-wcat-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; }
.mis-wcat {
    position: relative; display: flex; flex-direction: column; min-height: 210px; padding: 20px 22px; overflow: hidden;
    background: color-mix(in srgb, var(--mis-bg-surface) 70%, black); color: var(--mis-text-primary); text-decoration: none;
    border-top: 3px solid var(--cc); clip-path: var(--mis-plate); transition: transform .2s, background .2s;
}
.mis-wcat:hover { transform: translateY(-3px); background: color-mix(in srgb, var(--mis-bg-surface) 88%, black); color: var(--mis-text-primary); }
.mis-wcat::after {
    content: attr(data-num); position: absolute; right: 18px; top: 10px;
    font-family: Georgia, "Times New Roman", serif; font-size: 64px; font-weight: 700; line-height: 1;
    color: var(--cc); opacity: .16; pointer-events: none;
}
.mis-wcat-name { color: #fff; font-size: 19px; font-weight: 800; }
.mis-wcat-count { color: var(--cc); font-size: 12.5px; font-weight: 700; margin-top: 2px; }
.mis-wcat ul { list-style: none; margin: 14px 0 0; padding: 0; }
.mis-wcat li { padding: 5px 0; border-top: 1px solid rgba(255,255,255,.05); color: var(--mis-text-secondary); font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* Ganze Karte → Kategorie (gestreckter Link), Artikel darüber als eigene Links */
.mis-wcat-link, .mis-wcat-link:hover { color: inherit; text-decoration: none; }
.mis-wcat-link::before { content: ""; position: absolute; inset: 0; z-index: 0; }
.mis-wcat li a {
    position: relative; z-index: 1; color: inherit; text-decoration: none; transition: color .15s, padding-left .15s;
}
.mis-wcat li a:hover { color: var(--cc); padding-left: 4px; text-decoration: none; }
.mis-wcat-more { margin-top: auto; padding-top: 12px; color: var(--mis-text-primary); font-size: 12.5px; font-weight: 700; }
.mis-wart-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 12px; }
.mis-wart {
    display: flex; flex-direction: column; gap: 8px; padding: 18px 20px; min-height: 150px;
    background: color-mix(in srgb, var(--mis-bg-surface) 70%, black); color: var(--mis-text-primary); text-decoration: none;
    box-shadow: inset 3px 0 0 var(--cc, var(--mis-hot)); clip-path: var(--mis-plate); transition: background .2s;
}
.mis-wart:hover { background: color-mix(in srgb, var(--mis-bg-surface) 90%, black); color: var(--mis-text-primary); }
.mis-wart-tag { align-self: flex-start; padding: 2px 8px; font-size: 10.5px; font-weight: 700; color: var(--cc); background: color-mix(in srgb, var(--cc) 16%, transparent); }
.mis-wart-title { color: #fff; font-size: 16px; font-weight: 800; line-height: 1.25; }
.mis-wart-excerpt { color: var(--mis-text-secondary); font-size: 13px; line-height: 1.5; }
.mis-wart-meta { margin-top: auto; color: var(--mis-text-muted); font-size: 12px; }

@media (max-width: 767.98px) {
    .mis-ph { padding-top: calc(var(--mis-nav-h) + 24px); clip-path: polygon(0 0, 100% 0, 100% calc(100% - 20px), 0 100%); }
    .mis-ph-inner { padding: 0 16px 52px; }
    .mis-ph-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .mis-ph-stat b { font-size: 21px; }
    .mis-lrow { gap: 10px; padding-right: 10px; }
    .mis-lrow-tags { display: none; }
    .mis-people { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .mis-feature-grid { grid-template-columns: 1fr; }
}


/* ── Profil: Auszeichnungen & Insignias (kompakt, nur Anzeige) ── */
.mis-awards { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 6px 22px; }
.mis-awards-cat { min-width: 0; }
.mis-awards-cat-name { margin: 4px 0 6px; color: #8b949e; font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.mis-awards-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 0 22px; }
.mis-award { display: flex; align-items: center; gap: 10px; padding: 5px 0; min-width: 0; }
.mis-award + .mis-award { border-top: 1px solid rgba(255,255,255,.04); }
.mis-award img, .mis-award-noimg { flex: 0 0 auto; width: 48px; height: 14px; object-fit: contain; object-position: left center; }
.mis-award--insignia img, .mis-award--insignia .mis-award-noimg { height: 22px; }
.mis-award-text { min-width: 0; }
.mis-award-name { color: #c9d1d9; font-size: 12.5px; line-height: 1.3; }
.mis-award-name span { color: #6e7681; font-size: 11px; }
.mis-award-date { color: #6e7681; font-size: 11px; line-height: 1.3; font-variant-numeric: tabular-nums; }
.mis-award.is-unworn img { opacity: .35; }
.mis-award.is-unworn .mis-award-name { color: #6e7681; }