/* === ACP_GLOBAL [default] === */

:root {
    --gold: #c5a059;
    --gold-dark: #8e6d2d;
    --gold-main: #C5A059;
    --gold-bright: #E8D48B;
    --bg-dark: #141414;
    --bg-panel: #1a1a1a;
    --bg-sidebar: #0f0f0f;
    --bg-content: #0d0d0d;
    --text-main: #e8e8e8;
    --text-muted: #aaa;
    --border-color: #2a2a2a;
    --border-line: #222;
    --admin-red: #ff4444;
}
* { box-sizing: border-box; }
body {
    background-color: #111111;
    color: var(--text-main);
    font-family: "Segoe UI", Roboto, sans-serif;
    margin: 0;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

/* ── ACP Globale Schrift aufhellen ── */
.acp-body { color: #ccc !important; }
.acp-nav-link { color: #888 !important; }
.acp-nav-link:hover { color: #ddd !important; }
.acp-nav-link.active { color: #c5a059 !important; }
.acp-sidebar-title { color: #777 !important; }
.acp-topbar-title { color: #aaa !important; }
.acp-topbar-user { color: #888 !important; }
.acp-section-title { color: #777 !important; }
.acp-stat-value { color: #bbb !important; }
.acp-stat-label { color: #666 !important; }
.acp-stat-card i { color: rgba(197,160,89,0.5) !important; }
.acp-card-label { color: #bbb !important; }
.acp-card-desc { color: #777 !important; }
.acp-card-header { color: #aaa !important; }
.acp-card-body p { color: #888 !important; }
.acp-page-btn { color: #888 !important; }
.acp-page-info { color: #777 !important; }
.acp-page-ellipsis { color: #555 !important; }
.acp-empty { color: #666 !important; }
.log-table thead th { color: #888 !important; }
.log-id { color: #666 !important; }
.log-actor { color: #ccc !important; }
.log-details { color: #aaa !important; }
.log-target { color: #888 !important; }
.log-ip { color: #666 !important; }
.log-ts { color: #777 !important; }
.log-filter-label { color: #777 !important; }
.log-filter-input { color: #aaa !important; border-color: #2a2a2a !important; }
.log-filter-input::placeholder { color: #444 !important; }
.acp-logout { color: #774444 !important; }


/* === MAIN [default] === */
/* --- TOP HEADER --- */
header { width: 100%; }
.header-content { display: flex; justify-content: space-between; align-items: center; width: 100%; padding: 10px 40px; background: rgba(0,0,0,0.8); border-bottom: 1px solid rgba(197,160,89,0.1); }
.server-label { font-family: 'Cinzel', serif; font-size: 0.75em; color: #888; }
.status-online { color: var(--gold); }
.header-auth-link { color: var(--gold); margin-left: 15px; text-decoration: none; font-size: 0.8em; border: 1px solid rgba(197,160,89,0.3); padding: 4px 10px; transition: background 0.3s; }
.header-auth-link:hover { background: rgba(197, 160, 89, 0.1); }
.header-logo-container { display: flex; align-items: center; gap: 20px; }
.header-logo-img { height: 40px; width: auto; filter: drop-shadow(0 0 5px rgba(197, 160, 89, 0.2)); transition: transform 0.3s ease; }
.header-logo-img:hover { transform: scale(1.05); }
.header-divider { width: 1px; height: 20px; background: rgba(197, 160, 89, 0.2); margin: 0 10px; }
.main-container { display: flex; flex: 1; width: 100%; }
.content-area { flex: 1; padding: 60px; min-width: 0; }
article { max-width: 1000px; margin: 0 auto; }
.article-header { display: flex; justify-content: space-between; align-items: center; border-bottom: 2px solid var(--gold-dark); margin-bottom: 30px; padding-bottom: 15px; gap: 15px; }
h1, .article-title { font-family: 'Cinzel', serif; font-size: 2.2em; color: #fff; margin: 0; }
.header-actions { display: flex; gap: 10px; }
.user-status { display: flex; align-items: center; gap: 20px; }
.user-info { font-size: 0.85em; color: var(--text-muted); text-transform: uppercase; letter-spacing: 1px; }
.user-info strong { color: var(--gold); }
.btn-outline-gold, button, .btn-gold { border: 1px solid var(--gold); color: var(--gold); padding: 8px 18px; font-family: 'Cinzel', serif; background: rgba(197, 160, 89, 0.05); cursor: pointer; text-transform: uppercase; font-weight: bold; display: inline-flex; align-items: center; gap: 8px; text-decoration: none; transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); position: relative; overflow: hidden; }
.btn-outline-gold:hover, button:hover, .btn-gold:hover { background: var(--gold); color: #000 !important; box-shadow: 0 0 20px rgba(197, 160, 89, 0.4); transform: translateY(-2px); }
input, select, textarea { background: #050505; border: 1px solid var(--border-color); color: #fff; padding: 10px; width: 100%; font-family: 'Segoe UI', sans-serif; }
.admin-box { background: rgba(255, 255, 255, 0.01); border: 1px solid #222; padding: 20px; margin-bottom: 20px; }
.admin-box-summon { background: rgba(197, 160, 89, 0.02); border: 1px solid rgba(197, 160, 89, 0.1) !important; box-shadow: inset 0 0 20px rgba(0, 0, 0, 0.5); padding: 20px; margin-bottom: 30px; }
.maintenance-wrapper { max-width: 800px; margin: 60px auto; text-align: center; font-family: 'Cinzel', serif; }
.maintenance-icon { font-size: 5.5em; color: var(--gold); margin-bottom: 20px; }
.maintenance-headline { color: var(--gold); letter-spacing: 3px; text-transform: uppercase; }
.maintenance-box { color: #aaa; line-height: 1.8; padding: 35px; background: rgba(10,10,10,0.7); border: 1px solid rgba(197,160,89,0.1); }
.btn-mnt { padding: 5px 10px; text-decoration: none; font-size: 10px; font-weight: bold; border: 1px solid var(--gold); }
.btn-mnt.active { border-color: #ff4444; color: #ff4444; }
.btn-mnt.inactive { border-color: #c5a059; color: #c5a059; }
.btn-edit-small { font-size: 10px; padding: 5px 10px; text-decoration: none; }
.editor-title-input { width: 100%; padding: 10px; background: #000; border: 1px solid #333; color: #fff; margin-bottom: 20px; }
.link-logout { color: #ff4444 !important; }
.link-logout:hover { border-left-color: #ff4444 !important; }
.admin-link { color: var(--gold) !important; }
.admin-section-title { color: var(--gold-dark) !important; margin-top: 25px !important; }
.herald-link { color: #eee; text-decoration: none; font-weight: 500; transition: color 0.2s; }
.herald-link:hover { color: var(--gold) !important; }
.stats-card { background: linear-gradient(135deg, rgba(20,20,20,0.4) 0%, rgba(5,5,5,0.4) 100%); border: 1px solid #111; padding: 20px; position: relative; overflow: hidden; }
.stats-card::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 2px; background: var(--gold-dark); opacity: 0.3; }
.content-area.full-width { width: 100%; max-width: 100%; margin: 0; }
.header-content { border-bottom: 2px solid rgba(197,160,89,0.3); border-radius: 0 0 8px 8px; }

/* ── Article Title dezenter ── */
h1, .article-title {
    font-size: 1.4em !important;
    color: #888 !important;
    font-weight: 400 !important;
    letter-spacing: 3px !important;
}

/* ── Dynamic Page Content ─────────────────────────────────── */

.dynamic-content {
    max-width: 960px;
    width: 100%;
}

/* Alle direkten Block-Kinder auf Breite begrenzen */
.dynamic-content > * {
    max-width: 100%;
    box-sizing: border-box;
}

/* Tabellen scrollbar machen statt überlaufen */
.dynamic-content table {
    width: 100%;
    max-width: 100%;
    border-collapse: collapse;
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* Bilder nie breiter als Container */
.dynamic-content img {
    max-width: 100%;
    height: auto;
    display: block;
}

/* iFrames (z.B. YouTube) responsiv */
.dynamic-content iframe {
    max-width: 100%;
}

/* Typografie — passend zur CMS-Palette */
.dynamic-content h1,
.dynamic-content h2,
.dynamic-content h3,
.dynamic-content h4 {
    font-family: 'Cinzel', serif;
    color: var(--glow-gold);
    margin-top: 1.6em;
    margin-bottom: 0.5em;
    letter-spacing: 1px;
}
.dynamic-content h1 { font-size: 1.5em; border-bottom: 1px solid rgba(197,160,89,0.15); padding-bottom: 0.3em; }
.dynamic-content h2 { font-size: 1.2em; }
.dynamic-content h3 { font-size: 1.0em; color: #aaa; }

.dynamic-content p {
    color: #bbb;
    line-height: 1.8;
    margin-bottom: 1em;
    font-family: sans-serif;
    font-size: 0.92em;
}

.dynamic-content a {
    color: var(--glow-gold);
    text-decoration: none;
    border-bottom: 1px solid rgba(197,160,89,0.2);
    transition: border-color 0.2s, color 0.2s;
}
.dynamic-content a:hover {
    color: #e8c97a;
    border-bottom-color: rgba(197,160,89,0.5);
}

.dynamic-content ul,
.dynamic-content ol {
    color: #bbb;
    font-family: sans-serif;
    font-size: 0.92em;
    padding-left: 1.5em;
    margin-bottom: 1em;
    line-height: 1.8;
}

.dynamic-content blockquote {
    border-left: 3px solid rgba(197,160,89,0.35);
    margin: 1.2em 0;
    padding: 0.6em 1.2em;
    color: #888;
    font-style: italic;
    font-family: sans-serif;
    font-size: 0.9em;
    background: rgba(197,160,89,0.03);
}

.dynamic-content code,
.dynamic-content pre {
    font-family: 'Courier New', monospace;
    background: rgba(255,255,255,0.04);
    border: 1px solid #1e1e1e;
    color: #ccc;
    font-size: 0.82em;
}
.dynamic-content code { padding: 2px 6px; }
.dynamic-content pre  { padding: 14px; overflow-x: auto; line-height: 1.6; }

.dynamic-content hr {
    border: none;
    border-top: 1px solid rgba(197,160,89,0.12);
    margin: 2em 0;
}


/* ── Dynamic Content Isolation Layer ── */
.dynamic-content {
    /* Verhindert dass CKEditor-HTML das Theme bricht */
    contain: style layout;
}

/* Reset aller generischen Tags NUR innerhalb .dynamic-content */
.dynamic-content h1,
.dynamic-content h2,
.dynamic-content h3,
.dynamic-content h4,
.dynamic-content h5,
.dynamic-content h6 {
    all: revert;
    font-family: "Cinzel", serif !important;
    color: #c5a059 !important;
    font-weight: 400 !important;
    margin: 1.2em 0 0.4em 0 !important;
    letter-spacing: 1px !important;
}
.dynamic-content h1 { font-size: 1.4em !important; border-bottom: 1px solid rgba(197,160,89,0.15) !important; padding-bottom: 0.3em !important; }
.dynamic-content h2 { font-size: 1.15em !important; }
.dynamic-content h3 { font-size: 0.95em !important; color: #999 !important; }

.dynamic-content p,
.dynamic-content li,
.dynamic-content td,
.dynamic-content th,
.dynamic-content span {
    all: revert;
    font-family: sans-serif !important;
    color: #bbb !important;
    font-size: 0.92em !important;
    line-height: 1.8 !important;
}

.dynamic-content ul,
.dynamic-content ol {
    all: revert;
    padding-left: 1.5em !important;
    margin-bottom: 1em !important;
    color: #bbb !important;
    font-family: sans-serif !important;
    font-size: 0.92em !important;
}

/* Tabellen: scrollbar statt overflow */
.dynamic-content table {
    all: revert;
    width: 100% !important;
    max-width: 100% !important;
    border-collapse: collapse !important;
    display: block !important;
    overflow-x: auto !important;
    font-size: 0.85em !important;
    color: #aaa !important;
}
.dynamic-content td,
.dynamic-content th {
    padding: 8px 12px !important;
    border: 1px solid #1e1e1e !important;
    text-align: left !important;
}
.dynamic-content thead tr { background: rgba(197,160,89,0.05) !important; }

/* Bilder */
.dynamic-content img {
    max-width: 100% !important;
    height: auto !important;
    display: block !important;
}

/* Links */
.dynamic-content a {
    all: revert;
    color: #c5a059 !important;
    text-decoration: none !important;
    border-bottom: 1px solid rgba(197,160,89,0.2) !important;
    transition: color 0.2s !important;
}
.dynamic-content a:hover {
    color: #e8c97a !important;
    border-bottom-color: rgba(197,160,89,0.5) !important;
}

/* Inline-Styles vom CKEditor neutralisieren */
.dynamic-content [style*="font-family"] { font-family: sans-serif !important; }
.dynamic-content [style*="color"] { color: #bbb !important; }
.dynamic-content [style*="font-size"] { font-size: inherit !important; }
.dynamic-content [style*="background"] { background: transparent !important; }
.dynamic-content [style*="width"]:not(img):not(table) { width: auto !important; max-width: 100% !important; }



/* ── Trumbowyg Content Isolation ── */
.dynamic-content {
    contain: style;
}

/* Globale Tag-Resets NUR innerhalb dynamic-content */
.dynamic-content h1,
.dynamic-content h2,
.dynamic-content h3,
.dynamic-content h4 {
    all: unset;
    display: block;
    font-family: "Cinzel", serif;
    color: #c5a059;
    font-weight: 400;
    margin: 1.2em 0 0.4em 0;
    letter-spacing: 1px;
}
.dynamic-content h1 { font-size: 1.4em; border-bottom: 1px solid rgba(197,160,89,0.15); padding-bottom: 0.3em; }
.dynamic-content h2 { font-size: 1.15em; }
.dynamic-content h3 { font-size: 0.95em; color: #999; }
.dynamic-content h4 { font-size: 0.85em; color: #777; }

.dynamic-content p {
    all: unset;
    display: block;
    font-family: sans-serif;
    color: #bbb;
    font-size: 0.92em;
    line-height: 1.8;
    margin-bottom: 0.8em;
}

.dynamic-content ul,
.dynamic-content ol {
    all: unset;
    display: block;
    padding-left: 1.5em;
    margin-bottom: 1em;
    color: #bbb;
    font-family: sans-serif;
    font-size: 0.92em;
    line-height: 1.8;
}
.dynamic-content ul { list-style: disc; }
.dynamic-content ol { list-style: decimal; }
.dynamic-content li { display: list-item; }

.dynamic-content strong, .dynamic-content b { font-weight: bold; color: #ddd; }
.dynamic-content em, .dynamic-content i { font-style: italic; }
.dynamic-content del, .dynamic-content s { text-decoration: line-through; opacity: 0.6; }

.dynamic-content a {
    all: unset;
    display: inline;
    color: #c5a059;
    cursor: pointer;
    border-bottom: 1px solid rgba(197,160,89,0.25);
    transition: color 0.2s, border-color 0.2s;
}
.dynamic-content a:hover { color: #e8c97a; border-bottom-color: rgba(197,160,89,0.5); }

.dynamic-content hr {
    all: unset;
    display: block;
    border-top: 1px solid rgba(197,160,89,0.12);
    margin: 1.5em 0;
}

.dynamic-content blockquote {
    all: unset;
    display: block;
    border-left: 3px solid rgba(197,160,89,0.35);
    margin: 1em 0;
    padding: 0.5em 1em;
    color: #888;
    font-style: italic;
    font-family: sans-serif;
    font-size: 0.9em;
    background: rgba(197,160,89,0.03);
}

.dynamic-content table {
    all: unset;
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    border-collapse: collapse;
    font-size: 0.85em;
    margin-bottom: 1em;
}
.dynamic-content td, .dynamic-content th {
    all: unset;
    display: table-cell;
    padding: 8px 12px;
    border: 1px solid #1e1e1e;
    color: #aaa;
}
.dynamic-content thead tr { background: rgba(197,160,89,0.05); }

.dynamic-content img {
    max-width: 100%;
    height: auto;
    display: block;
}


/* ── Trumbowyg Content Isolation ── */
.dynamic-content h1,.dynamic-content h2,.dynamic-content h3,.dynamic-content h4{all:unset;display:block;font-family:"Cinzel",serif;color:#c5a059;font-weight:400;margin:1.2em 0 0.4em 0;letter-spacing:1px}
.dynamic-content h1{font-size:1.4em;border-bottom:1px solid rgba(197,160,89,0.15);padding-bottom:0.3em}
.dynamic-content h2{font-size:1.15em}
.dynamic-content h3{font-size:0.95em;color:#999}
.dynamic-content p{all:unset;display:block;font-family:sans-serif;color:#bbb;font-size:0.92em;line-height:1.8;margin-bottom:0.8em}
.dynamic-content ul,.dynamic-content ol{all:unset;display:block;padding-left:1.5em;margin-bottom:1em;color:#bbb;font-family:sans-serif;font-size:0.92em;line-height:1.8}
.dynamic-content ul{list-style:disc}
.dynamic-content ol{list-style:decimal}
.dynamic-content li{display:list-item}
.dynamic-content strong,.dynamic-content b{font-weight:bold;color:#ddd}
.dynamic-content em,.dynamic-content i{font-style:italic}
.dynamic-content a{all:unset;display:inline;color:#c5a059;cursor:pointer;border-bottom:1px solid rgba(197,160,89,0.25)}
.dynamic-content a:hover{color:#e8c97a}
.dynamic-content hr{all:unset;display:block;border-top:1px solid rgba(197,160,89,0.12);margin:1.5em 0}
.dynamic-content blockquote{all:unset;display:block;border-left:3px solid rgba(197,160,89,0.35);margin:1em 0;padding:0.5em 1em;color:#888;font-style:italic;font-family:sans-serif;font-size:0.9em}
.dynamic-content img{max-width:100%;height:auto;display:block}

/* === HEADER_STARFIELD [default] === */
#starfield {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
}

/* === HEADER_PAGE_WRAPPER [default] === */
.page-wrapper {
    position: relative;
    width: 90vw;
    max-width: 1800px;
    margin: 0 auto;
    min-height: 100vh;
    background: rgba(10, 10, 10, 0.93);
    display: flex;
    flex-direction: column;
    box-shadow: -12px 0 40px rgba(0,0,0,0.98), 12px 0 40px rgba(0,0,0,0.98);
    overflow: hidden;
}

/* === HEADER_RESPONSIVE [default] === */
@media screen and (max-width: 768px) {
    .hide-mobile {
        display: none !important;
    }
}

/* === HEADER_USER_DROPDOWN [default] === */
.user-dropdown-wrap { position: relative; }
.user-dropdown-trigger {
    display: flex;
    align-items: center;
    gap: 7px;
    color: #c5a059;
    cursor: pointer;
    padding: 5px 10px;
    border: 1px solid transparent;
    border-radius: 4px;
    font-size: 0.9em;
    transition: border-color 0.2s, background 0.2s;
    user-select: none;
    font-family: "Cinzel", serif;
    letter-spacing: 0.03em;
}
.user-dropdown-trigger:hover,
.user-dropdown-wrap.open .user-dropdown-trigger {
    border-color: #2a2a2a;
    background: rgba(197,160,89,0.05);
}
.user-dropdown-menu {
    display: none;
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    min-width: 180px;
    background: #0a0a0a;
    border: 1px solid #1e1e1e;
    border-radius: 4px;
    box-shadow: 0 8px 30px rgba(0,0,0,0.8);
    z-index: 9999;
    overflow: hidden;
}
.user-dropdown-wrap.open .user-dropdown-menu { display: block; }
.user-dropdown-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    color: #888;
    text-decoration: none;
    font-size: 0.78em;
    letter-spacing: 1px;
    text-transform: uppercase;
    font-family: "Cinzel", serif;
    transition: background 0.15s, color 0.15s;
}
.user-dropdown-item:hover { background: rgba(255,255,255,0.04); color: #c5a059; }
.user-dropdown-item i { width: 14px; text-align: center; opacity: 0.6; }
.user-dropdown-item--admin { color: #c5a059; }
.user-dropdown-item--admin:hover { background: rgba(197,160,89,0.08); color: #e8c97a; }
.user-dropdown-item--logout:hover { background: rgba(180,50,50,0.1); color: #e07070; }
.user-dropdown-divider { height: 1px; background: #151515; margin: 2px 0; }

/* === HEADER_NAV [default] === */
.header-nav {
    display: flex;
    align-items: center;
    gap: 0;
    margin-left: 10px;
    flex-wrap: nowrap;
    overflow-x: auto;
    scrollbar-width: none;
}
.header-nav::-webkit-scrollbar { display: none; }
.header-nav a {
    color: #aaa;
    text-decoration: none;
    font-family: "Cinzel", serif;
    font-size: 0.6em;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    padding: 5px 9px;
    border: 1px solid transparent;
    transition: color 0.2s, border-color 0.2s;
    white-space: nowrap;
}
.header-nav a:hover,
.header-nav a.active { color: #c5a059; border-color: #333; }
.header-nav .nav-sep {
    width: 1px;
    height: 12px;
    background: #2e2e2e;
    flex-shrink: 0;
}
@media screen and (max-width: 768px) {
    .header-nav { display: none; }
}

/* === FOOTER [default] === */
footer { width: 100%; text-align: center; padding: 20px; background: #050505; border-top: 1px solid #1a1a1a; color: #555; font-size: 0.8em; }
.legal-disclaimer { line-height: 1.6; max-width: 800px; margin: 0 auto; font-size: 0.75em; color: #444; }
.custom-scroll::-webkit-scrollbar { width: 5px; }
.custom-scroll::-webkit-scrollbar-track { background: #050505; }
.custom-scroll::-webkit-scrollbar-thumb { background: #222; border-radius: 2px; }
.custom-scroll::-webkit-scrollbar-thumb:hover { background: var(--gold-dark); }
footer { border-top: 2px solid rgba(197,160,89,0.3); border-radius: 8px 8px 0 0; }
.main-footer { border-top: 2px solid rgba(197,160,89,0.3); border-radius: 8px 8px 0 0; }

/* ── Footer schmaler ── */
.main-footer .footer-container {
    max-width: 60%;
    margin: 0 auto;
}

/* ── Footer noch schmaler ── */
.main-footer .footer-container {
    max-width: 40% !important;
}

/* ── Footer = Header-Breite ── */
.main-footer .footer-container {
    max-width: 100% !important;
    padding: 0 40px !important;
}

/* ── Footer Breite ── */
.main-footer .footer-container {
    max-width: 100% !important;
    padding: 0 40px 0 320px !important;
}

/* ── Footer = Header-Breite ── */
.main-footer .footer-container {
    max-width: 100% !important;
    padding: 0 40px !important;
}

/* ── Footer zentriert in Content-Bereich ── */
.main-footer .footer-container {
    max-width: 100% !important;
    padding: 0 40px !important;
    margin-left: 280px !important;
}

/* ── Footer zentriert & schmal ── */
.main-footer .footer-container {
    max-width: 400px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    text-align: center !important;
}

/* Footer Link */
.footer-link {
    color: inherit;
    text-decoration: none;
    transition: color 0.2s, text-decoration 0.2s;
}
.footer-link:hover,
.footer-link:active {
    color: var(--glow-gold);
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* === REALM_EFFECTS [default] === */
.realm-atlantis .class-node:hover { border-color: var(--color-atlantis) !important; box-shadow: 0 0 15px rgba(224, 224, 224, 0.1); }
.realm-albion .class-node:hover { border-color: var(--color-albion) !important; box-shadow: 0 0 15px rgba(255, 68, 68, 0.1); }
.realm-midgard .class-node:hover { border-color: var(--color-midgard) !important; box-shadow: 0 0 15px rgba(68, 170, 255, 0.1); }
.realm-hibernia .class-node:hover { border-color: var(--color-hibernia) !important; box-shadow: 0 0 15px rgba(46, 204, 113, 0.1); }

/* === ACP_MOBILE [default] === */
@media screen and (max-width: 768px) {
    /* Globales Layout */
    .main-container { flex-direction: column; }
    .acp-main { margin-left: 0 !important; }
    .acp-sidebar { 
        width: 100% !important; 
        position: relative !important; 
        min-height: auto !important; 
        border-right: none; 
        border-bottom: 1px solid rgba(197, 160, 89, 0.2); 
    }

    /* ── Content-Area Padding fix (war 60px → schneidet ab) ── */
    .content-area {
        padding: 20px 16px !important;
    }
    .content-area.full-width {
        padding: 20px 16px !important;
    }

    /* ── Article max-width aufheben ── */
    article {
        max-width: 100% !important;
    }

    /* ── Forum Wrapper ── */
    .um-nexus-wrapper {
        padding: 0 !important;
        margin: 0 !important;
        overflow-x: hidden;
    }

    /* ── Forum Board Cards ── */
    .quick-card {
        padding: 12px 14px !important;
        flex-wrap: wrap !important;
        gap: 10px !important;
    }

    /* ── Board Card: Stats-Block (Thread/Post Zähler) ausblenden ── */
    .spike-board-grid .quick-card > div:nth-child(2) {
        display: none !important;
    }

    /* ── Board Card: Last Post ausblenden auf sehr kleinen Screens ── */
    .spike-board-grid .quick-card > div:last-child {
        display: none !important;
    }

    /* ── Board Card: Name + Icon nimmt volle Breite ── */
    .spike-board-grid .quick-card > div:first-child {
        flex: 1 !important;
        min-width: 0 !important;
    }

    /* ── Kategorie-Header ── */
    .um-nexus-wrapper h3 {
        font-size: 0.85em !important;
        padding-bottom: 8px !important;
        margin-bottom: 10px !important;
        word-break: break-word;
    }

    /* ── Article Header ── */
    .article-header {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 10px !important;
        margin-bottom: 16px !important;
    }

    /* Header & Topbar Kompaktierung */
    .header-content { padding: 10px 15px !important; flex-wrap: wrap; gap: 10px; }
    .header-logo-img { height: 30px !important; }
    .acp-topbar { padding: 10px 15px !important; flex-direction: column; gap: 10px; align-items: flex-start; }
    
    /* Sidebar Navigation kompakter */
    .acp-nav-link { padding: 8px 15px !important; font-size: 0.6em !important; }
    .sidebar-search-container { padding: 10px 15px !important; }
    
    /* ACP Content Bereich */
    .acp-content { padding: 20px 15px !important; }
    
    /* Grids & Karten */
    .acp-stats-row { 
        grid-template-columns: repeat(2, 1fr) !important; 
        gap: 10px !important; 
    }
    .acp-card-grid { 
        grid-template-columns: 1fr !important; 
    }
    .acp-card-wide { grid-column: span 1 !important; }
    
    /* Typografie */
    h1, .article-title { font-size: 1.2em !important; letter-spacing: 2px !important; }
    .guild-name { font-size: 1.8em !important; }
    
    /* Footer Anpassung */
    .main-footer .footer-container {
        margin-left: 0 !important;
        padding: 0 15px !important;
        max-width: 100% !important;
    }
    
    /* Verstecke weniger wichtige Elemente */
    .hide-mobile { display: none !important; }

    /* ── Overflow-Guard global ── */
    body, .main-container, .content-area {
        overflow-x: hidden;
        max-width: 100vw;
    }
}

/* === SIDEBAR [default] === */
/* --- SIDEBAR BASE --- */
.sidebar { 
    width: 280px; 
    background: rgba(10, 10, 10, 0.95); 
    border-right: 1px solid rgba(197, 160, 89, 0.2); 
    flex-shrink: 0; 
}

.sidebar ul, .sidebar li, .sidebar nav ul, .sidebar nav li { 
    list-style: none !important; 
    padding: 0 !important; 
    margin: 0 !important; 
    background: none !important;
}

.sidebar h3 { 
    font-family: 'Cinzel', serif; 
    font-size: 0.75em; 
    color: #444; 
    text-transform: uppercase; 
    letter-spacing: 2px; 
    padding: 20px 20px 5px 20px;
    margin: 0;
}

.sidebar ul li a { 
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 30px; 
    color: #bbb; 
    text-decoration: none; 
    font-size: 0.85em;
    transition: 0.2s; 
    border-left: 3px solid transparent;
}

.sidebar ul li a:hover { 
    color: #c5a059; 
    background: rgba(197, 160, 89, 0.05);
    border-left: 3px solid var(--gold);
    padding-left: 35px;
}

/* ── Sidebar Search ── */
.sidebar-search-container { padding: 5px 20px 15px 20px; }
.sidebar-search-form { position: relative; }
.sidebar-search-input {
    width: 100%;
    background: transparent;
    border: none;
    border-bottom: 1px solid rgba(197, 160, 89, 0.2);
    color: #666;
    padding: 6px 28px 6px 0;
    font-size: 0.75em;
    font-family: 'Cinzel', serif;
    letter-spacing: 1px;
    text-transform: uppercase;
    transition: border-color 0.3s, color 0.3s;
    outline: none;
    box-sizing: border-box;
}
.sidebar-search-input::placeholder {
    color: #333;
    letter-spacing: 2px;
    font-size: 0.9em;
}
.sidebar-search-input:focus {
    border-bottom-color: var(--gold);
    color: #aaa;
}
.sidebar-search-form::after {
    content: "f002";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    color: #333;
    font-size: 0.7em;
    pointer-events: none;
    transition: color 0.3s;
}
.sidebar-search-form:focus-within::after {
    color: var(--gold);
}

/* ── Sidebar Search Nexus Gold ── */
.sidebar-search-container { padding: 5px 20px 15px 20px; }
.sidebar-search-form { position: relative; }
.sidebar-search-input {
    width: 100%;
    background: transparent;
    border: 1px dashed rgba(197, 160, 89, 0.25);
    color: #666;
    padding: 6px 10px;
    font-size: 0.75em;
    font-family: 'Cinzel', serif;
    letter-spacing: 1px;
    text-transform: uppercase;
    transition: border-color 0.3s, color 0.3s;
    outline: none;
    box-sizing: border-box;
}
.sidebar-search-input::placeholder {
    color: #333;
    letter-spacing: 2px;
}
.sidebar-search-input:focus {
    border-color: rgba(197, 160, 89, 0.6);
    color: #aaa;
    background: rgba(197, 160, 89, 0.03);
}

/* ── Sidebar Search Fix: F002 entfernen ── */
.sidebar-search-form::after { display: none !important; content: none !important; }

/* ── Sidebar Search Nexus Gold v2 ── */
.sidebar-search-container { padding: 5px 20px 15px 20px; }
.sidebar-search-input {
    width: 100%;
    background: rgba(0, 0, 0, 0.4);
    border: none;
    border-bottom: 1px dashed rgba(197, 160, 89, 0.3);
    border-left: 2px solid rgba(197, 160, 89, 0.15);
    color: #555;
    padding: 7px 10px;
    font-size: 0.7em;
    font-family: 'Cinzel', serif;
    letter-spacing: 2px;
    text-transform: uppercase;
    outline: none;
    box-sizing: border-box;
    transition: all 0.3s ease;
}
.sidebar-search-input::placeholder {
    color: #2a2a2a;
    letter-spacing: 3px;
}
.sidebar-search-input:focus {
    border-left-color: var(--gold);
    border-bottom-color: rgba(197, 160, 89, 0.5);
    color: #c5a059;
    background: rgba(197, 160, 89, 0.03);
    box-shadow: inset 2px 0 8px rgba(197, 160, 89, 0.05);
}

/* ── Sidebar Search Nexus Gold V3 ── */
.sidebar-search-container { padding: 5px 20px 15px 20px; }
.sidebar-search-input {
    width: 100%;
    background: rgba(197, 160, 89, 0.03);
    border: 1px solid rgba(197, 160, 89, 0.12);
    color: #bbb;
    padding: 5px 10px;
    font-size: 0.72em;
    font-family: 'Cinzel', serif;
    letter-spacing: 2px;
    text-transform: uppercase;
    outline: none;
    box-sizing: border-box;
    transition: all 0.4s ease;
}
.sidebar-search-input::placeholder {
    color: #3a3a3a;
    letter-spacing: 3px;
}
.sidebar-search-input:focus {
    border-color: rgba(197, 160, 89, 0.35);
    color: #c5a059;
    background: rgba(197, 160, 89, 0.05);
    box-shadow: 0 0 8px rgba(197, 160, 89, 0.08),
                inset 0 0 4px rgba(197, 160, 89, 0.04);
}

/* ── Sidebar Links Einrückung ── */
.sidebar ul li a { padding-left: 35px !important; }
.sidebar ul li a:hover { padding-left: 40px !important; }

/* ── Sidebar Links Einrückung ── */
.sidebar ul li a { padding-left: 45px !important; }
.sidebar ul li a:hover { padding-left: 50px !important; }

/* ── Sidebar Links Einrückung Final ── */
.sidebar ul li a { padding-left: 25px !important; }
.sidebar ul li a:hover { padding-left: 30px !important; }

/* ── Link Aufhellung ── */
.sidebar ul li a { color: #bbb !important; }
.sidebar ul li a:hover { color: #c5a059 !important; }
.sidebar h3 { color: #666 !important; }

/* === PROFILE [default] === */

/* ── Account Standing ── */
.profile-standing {
    border: 1px solid rgba(197,160,89,0.07);
    padding: 14px 20px;
    margin-bottom: 25px;
    display: flex;
    align-items: center;
    gap: 14px;
    background: rgba(0,0,0,0.2);
}
.profile-standing-label {
    font-size: 0.65em;
    color: #D3D3D3;
    text-transform: uppercase;
    letter-spacing: 2px;
    display: block;
    font-family: "Cinzel", serif;
}
/* ── Avatar Delete Button ── */
.btn-avatar-delete {
    position: absolute;
    top: -8px; right: -8px;
    background: #050505;
    color: #555;
    border: 1px solid #222;
    border-radius: 50%;
    width: 22px; height: 22px;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer; padding: 0;
    transition: color 0.2s, border-color 0.2s;
}
.btn-avatar-delete:hover { color: #ff4444; border-color: #ff4444; }
/* ── Forum Signature Field ── */
.profile-sig-field {
    border-left: 1px solid rgba(197,160,89,0.15);
    padding-left: 15px;
}
/* ── um-input & um-label global ── */
.um-label {
    display: block;
    font-size: 0.65em;
    color: #D3D3D3;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-bottom: 7px;
    font-family: "Cinzel", serif;
}
.um-input {
    width: 100%;
    padding: 10px 14px;
    background: rgba(0,0,0,0.5);
    border: 1px solid #111;
    color: #777;
    transition: border-color 0.3s, color 0.3s;
    font-family: "Segoe UI", sans-serif;
    font-size: 0.85em;
    box-sizing: border-box;
}
.um-input:focus {
    border-color: rgba(197,160,89,0.25);
    outline: none;
    color: #aaa;
}


/* ── Profile v2 Dezenter ── */
.profile-standing {
    border: 1px solid rgba(197,160,89,0.05) !important;
    padding: 10px 16px !important;
    background: rgba(0,0,0,0.15) !important;
    margin-bottom: 20px !important;
}
.profile-standing-label {
    font-size: 0.6em !important;
    letter-spacing: 1px !important;
}
.profile-standing span:last-child {
    font-size: 0.8em !important;
}
.admin-box {
    padding: 20px !important;
    max-width: 860px !important;
}
.um-label {
    font-size: 0.6em !important;
    letter-spacing: 1px !important;
}
.um-input {
    padding: 7px 10px !important;
    font-size: 0.8em !important;
}

/* === TEAM [default] === */

/* ── Team Grid ── */
.team-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 1px;
    background: rgba(197,160,89,0.06);
}
.team-card {
    text-align: center;
    padding: 35px 25px;
    background: rgba(10,10,10,0.97);
    transition: background 0.3s;
}
.team-card:hover { background: rgba(197,160,89,0.02); }
.team-avatar {
    width: 90px; height: 90px;
    border-radius: 50%;
    object-fit: cover;
    border: 1px solid rgba(197,160,89,0.2);
}
.team-avatar-placeholder {
    width: 90px; height: 90px;
    border-radius: 50%;
    background: #0a0a0a;
    border: 1px solid #111;
    margin: 0 auto;
    display: flex; align-items: center; justify-content: center;
}
.team-name {
    font-family: "Cinzel", serif;
    margin: 0 0 6px 0;
    color: #ccc;
    letter-spacing: 2px;
    font-size: 1em;
    font-weight: 400;
}
.team-role {
    color: rgba(197,160,89,0.5);
    margin-bottom: 14px;
    font-size: 0.72em;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-family: "Cinzel", serif;
}
.team-lang-tag {
    border: 1px solid #1a1a1a;
    padding: 2px 8px;
    font-size: 0.65em;
    color: rgba(197,160,89,0.5);
    text-transform: uppercase;
    letter-spacing: 1px;
    font-family: "Cinzel", serif;
}


/* ── Team Description ── */
.team-description {
    max-width: 700px;
    margin: 0 0 30px 0;
    font-size: 0.85em;
    color: #666;
    line-height: 1.8;
    border-left: 2px solid rgba(197,160,89,0.2);
    padding-left: 16px;
}

/* ── Team Description ── */
.team-description {
    font-size: 0.88em;
    color: #555;
    line-height: 1.8;
    margin-bottom: 30px;
    
}

/* ── Team Description ── */
.team-description {
    font-size: 0.88em;
    color: #555;
    line-height: 1.8;
    margin-bottom: 30px;
}

/* ── Team Description Scroll ── */


/* ── Team Description Scroll ── */
.team-description {
    margin: 0 0 36px 0;
    padding: 20px 28px;
    font-size: 0.85em;
    color: #555;
    line-height: 1.8;
    border-top: 1px solid rgba(197,160,89,0.15);
    border-bottom: 1px solid rgba(197,160,89,0.15);
    border-left: 3px solid rgba(197,160,89,0.08);
    border-right: 3px solid rgba(197,160,89,0.08);
    clip-path: polygon(8px 0%, calc(100% - 8px) 0%, 100% 8px, 100% calc(100% - 8px), calc(100% - 8px) 100%, 8px 100%, 0% calc(100% - 8px), 0% 8px);
    transition: border-color 0.4s, box-shadow 0.4s, color 0.4s;
}
.team-description:hover {
    border-top-color: rgba(197,160,89,0.5);
    border-bottom-color: rgba(197,160,89,0.5);
    border-left-color: rgba(197,160,89,0.25);
    border-right-color: rgba(197,160,89,0.25);
    box-shadow: 0 0 18px rgba(197,160,89,0.07), inset 0 0 30px rgba(197,160,89,0.03);
    color: #777;
}

/* ── Team Description Scroll v2 ── */
.team-description {
    margin: 0 0 36px 0;
    padding: 22px 28px;
    font-size: 0.85em;
    color: #555;
    line-height: 1.8;
    background: rgba(197,160,89,0.02);
    border: 1px solid rgba(197,160,89,0.12);
    clip-path: polygon(
        16px 0%, calc(100% - 16px) 0%,
        100% 16px, 100% calc(100% - 16px),
        calc(100% - 16px) 100%, 16px 100%,
        0% calc(100% - 16px), 0% 16px
    );
    transition: all 0.4s ease;
    position: relative;
}
.team-description::before {
    content: "";
    position: absolute;
    top: 4px; left: 4px; right: 4px; bottom: 4px;
    border: 1px solid rgba(197,160,89,0.05);
    clip-path: polygon(
        12px 0%, calc(100% - 12px) 0%,
        100% 12px, 100% calc(100% - 12px),
        calc(100% - 12px) 100%, 12px 100%,
        0% calc(100% - 12px), 0% 12px
    );
    pointer-events: none;
    transition: border-color 0.4s;
}
.team-description:hover {
    color: #888;
    border-color: rgba(197,160,89,0.4);
    background: rgba(197,160,89,0.04);
    box-shadow:
        0 0 20px rgba(197,160,89,0.06),
        0 0 60px rgba(197,160,89,0.04),
        inset 0 0 30px rgba(197,160,89,0.03);
}
.team-description:hover::before {
    border-color: rgba(197,160,89,0.15);
}

/* ── Team Description Größe ── */
.team-description {
    max-width: 600px !important;
}

/* === MAINTENANCE_BANNER [default] === */
.maintenance-banner {
    background: rgba(180, 100, 0, 0.12);
    border-bottom: 1px solid rgba(212, 175, 55, 0.2);
    color: #c9a84c;
    font-family: Cinzel, serif;
    font-size: 0.72em;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 7px 20px;
    display: flex;
    align-items: center;
    gap: 10px;
}
.maintenance-banner i { opacity: 0.7; font-size: 0.9em; }
.maintenance-banner-link {
    margin-left: auto;
    color: #c9a84c;
    text-decoration: none;
    border: 1px solid rgba(197,160,89,0.3);
    padding: 2px 10px;
    border-radius: 2px;
    font-size: 0.9em;
    transition: background 0.2s, border-color 0.2s;
}
.maintenance-banner-link:hover {
    background: rgba(197,160,89,0.1);
    border-color: rgba(197,160,89,0.6);
}

/* === CUSTOM_CSS_MOBILE [default] === */
/* ── MOBILE NAV BAR ─────────────────────────────────────────── */

/* Standardmäßig versteckt (Desktop) */
.mobile-nav-bar {
    display: none;
}

@media (max-width: 768px) {

    /* Desktop-Sidebar auf Mobile ausblenden */
    .sidebar {
        display: none !important;
    }

    /* Nav Bar direkt unter dem Header kleben */
    .mobile-nav-bar {
        display: flex;
        align-items: center;
        position: relative;
        top: 0;
        z-index: 800;
        background: rgba(8, 6, 4, 0.97);
        border-bottom: 1px solid rgba(197, 160, 89, 0.12);
        height: 44px;
        overflow: hidden;
        backdrop-filter: blur(6px);
        -webkit-backdrop-filter: blur(6px);
        box-shadow: 0 2px 12px rgba(0, 0, 0, 0.6);
    }

    /* Scrollbarer Track */
    .mobile-nav-track {
        display: flex;
        align-items: center;
        overflow-x: auto;
        overflow-y: hidden;
        scroll-snap-type: x proximity;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        gap: 0;
        flex: 1;
        padding: 0 32px; /* Platz für Pfeile */
    }

    .mobile-nav-track::-webkit-scrollbar {
        display: none;
    }

    /* Einzelner Nav-Link */
    .mobile-nav-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 2px;
        flex: 0 0 auto;
        padding: 0 14px;
        height: 44px;
        color: #555;
        text-decoration: none;
        font-family: "Cinzel", serif;
        font-size: 7px;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        transition: color 0.2s, background 0.2s;
        scroll-snap-align: start;
        white-space: nowrap;
        border-right: 1px solid rgba(255,255,255,0.03);
        position: relative;
    }

    .mobile-nav-item i {
        font-size: 13px;
        line-height: 1;
    }

    .mobile-nav-item span {
        line-height: 1;
    }

    .mobile-nav-item:hover {
        color: #c5a059;
        background: rgba(197, 160, 89, 0.05);
    }

    /* Aktiver Link */
    .mobile-nav-item.active {
        color: #c5a059;
    }

    .mobile-nav-item.active::after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 20%;
        right: 20%;
        height: 1px;
        background: linear-gradient(90deg, transparent, #c5a059, transparent);
    }

    /* Scroll-Pfeile */
    .mobile-nav-arrow {
        position: absolute;
        top: 0;
        bottom: 0;
        width: 28px;
        background: transparent;
        border: none;
        cursor: pointer;
        color: #444;
        font-size: 9px;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: opacity 0.2s, color 0.2s;
        padding: 0;
        z-index: 2;
    }

    .mobile-nav-arrow:hover {
        color: #c5a059;
    }

    .mobile-nav-arrow--left {
        left: 0;
        background: linear-gradient(90deg, rgba(8,6,4,0.95) 60%, transparent);
    }

    .mobile-nav-arrow--right {
        right: 0;
        background: linear-gradient(270deg, rgba(8,6,4,0.95) 60%, transparent);
    }
}


/* === SPIKE_EDITOR [default] === */
:root{
--ed-bg:#0c0c0c;
--ed-bg-field:#070707;
--ed-border:#1e1e1e;
--ed-border-act:rgba(197,160,89,0.3);
--ed-text:#c0c0c0;
--ed-text-ph:#444;
--ed-text-label:#666;
--ed-gold:var(--glow-gold,#c5a059);
}

/* Editor Shell */
.spike-editor-box{background:var(--ed-bg);border:1px solid rgba(197,160,89,0.12);border-top:2px solid rgba(197,160,89,0.35);padding:24px 28px;}
.spike-editor-field{margin-bottom:20px;}
.spike-editor-label{display:block;font-family:"Cinzel",serif;font-size:0.6em;letter-spacing:2.5px;color:var(--ed-text-label);text-transform:uppercase;margin-bottom:8px;}

/* Title Input */
.spike-editor-input{width:100%;padding:11px 14px;background:var(--ed-bg-field);border:1px solid var(--ed-border);color:var(--ed-text);font-size:0.92em;font-family:sans-serif;box-sizing:border-box;outline:none;transition:border-color 0.2s,background 0.2s;}
.spike-editor-input:focus{border-color:var(--ed-border-act);background:#090909;}
.spike-editor-input::placeholder{color:var(--ed-text-ph);}

/* Character counter */
.spk-char-counter{font-size:0.62em;color:var(--ed-text-label);font-family:sans-serif;text-align:right;margin-top:4px;letter-spacing:0;transition:color 0.2s;}
.spk-char-counter.warn{color:#c5a059;}
.spk-char-counter.over{color:#ff4444;}

/* Draft saved notice */
.spk-draft-notice{font-size:0.62em;color:#555;font-family:sans-serif;display:flex;align-items:center;gap:6px;margin-top:4px;opacity:0;transition:opacity 0.3s;}
.spk-draft-notice.show{opacity:1;}

/* Prefix Dropdown */
.nt-prefix-select{background:var(--ed-bg-field);border:1px solid var(--ed-border);color:var(--ed-text-label);padding:9px 32px 9px 12px;font-family:"Cinzel",serif;font-size:0.72em;letter-spacing:1px;outline:none;cursor:pointer;transition:border-color 0.2s,color 0.2s;max-width:280px;appearance:none;}
.nt-prefix-select:focus{border-color:var(--ed-border-act);color:#999;}

/* Smart suggest banner */
.nt-prefix-suggest{display:none;margin-top:7px;padding:6px 11px;background:rgba(197,160,89,0.05);border:1px solid rgba(197,160,89,0.18);border-left:2px solid rgba(197,160,89,0.5);font-size:0.63em;font-family:"Cinzel",serif;color:var(--ed-text-label);letter-spacing:1px;flex;align-items:center;gap:9px;cursor:pointer;transition:background 0.2s;}
.nt-prefix-suggest:hover{background:rgba(197,160,89,0.1);}
.nt-prefix-suggest i{color:var(--ed-gold);opacity:0.7;}
.nt-prefix-suggest.hidden{display:none !important;}

/* Quill Dark */
.ql-toolbar.ql-snow{background:#0a0a0a !important;border:1px solid var(--ed-border) !important;border-bottom:none !important;padding:7px !important;}
.ql-toolbar.ql-snow .ql-formats{margin-right:6px;}
.ql-toolbar.ql-snow button svg .ql-stroke{stroke:#666 !important;}
.ql-toolbar.ql-snow button:hover svg .ql-stroke,.ql-toolbar.ql-snow button.ql-active svg .ql-stroke{stroke:var(--ed-gold) !important;}
.ql-toolbar.ql-snow button svg .ql-fill{fill:#666 !important;}
.ql-toolbar.ql-snow button:hover svg .ql-fill,.ql-toolbar.ql-snow button.ql-active svg .ql-fill{fill:var(--ed-gold) !important;}
.ql-toolbar.ql-snow .ql-picker-label{color:#666 !important;}
.ql-toolbar.ql-snow .ql-picker-options{background:#0c0c0c !important;border-color:var(--ed-border) !important;}
.ql-toolbar.ql-snow .ql-picker-item:hover{color:var(--ed-gold) !important;}
.ql-toolbar.ql-snow .ql-separator{border-color:var(--ed-border) !important;}

.ql-container.ql-snow{background:#080808 !important;border:1px solid var(--ed-border) !important;border-top:none !important;font-size:0.93em !important;}
.ql-editor{min-height:280px !important;color:#c2c2c2 !important;line-height:1.8 !important;font-family:sans-serif !important;}
.ql-editor.ql-blank::before{color:var(--ed-text-ph) !important;font-style:italic !important;}
.ql-editor p{color:#c2c2c2 !important;margin-bottom:0.5em !important;}
.ql-editor h1,.ql-editor h2,.ql-editor h3{font-family:"Cinzel",serif !important;color:var(--ed-gold) !important;}
.ql-editor a{color:var(--ed-gold) !important;}
.ql-editor strong{color:#ddd !important;}
.ql-editor blockquote{border-left:3px solid rgba(197,160,89,0.3) !important;background:rgba(197,160,89,0.03) !important;color:#888 !important;padding:8px 14px !important;margin:10px 0 !important;}
.ql-editor pre.ql-syntax{background:rgba(255,255,255,0.04) !important;border:1px solid var(--ed-border) !important;color:#aaa !important;font-family:"Courier New",monospace !important;}
#quill-editor.quill-error .ql-container.ql-snow{border-color:rgba(184,80,80,0.5) !important;}

/* Action Buttons */
.spike-editor-actions{display:flex;gap:12px;align-items:center;margin-top:20px;padding-top:18px;border-top:1px solid var(--ed-border);}
.spike-editor-btn{display:inline-flex;align-items:center;gap:8px;padding:9px 22px;font-family:"Cinzel",serif;font-size:0.68em;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;cursor:pointer;text-decoration:none;transition:all 0.2s;border:1px solid;}
.spike-editor-btn--save{background:rgba(197,160,89,0.07);color:var(--ed-gold);border-color:rgba(197,160,89,0.4);}
.spike-editor-btn--save:hover{background:var(--ed-gold);color:#000;border-color:var(--ed-gold);transform:translateY(-1px);}
.spike-editor-btn--cancel{background:transparent;color:var(--ed-text-label);border-color:var(--ed-border);}
.spike-editor-btn--cancel:hover{background:rgba(255,255,255,0.03);color:#888;border-color:rgba(255,255,255,0.1);}

/* === SPIKE_FORUM [default] === */
:root{
--spk-bg-cat:#0a0a0a;
--spk-bg-board:#0d0d0d;
--spk-bg-board-h:#111111;
--spk-border:#1c1c1c;
--spk-border-soft:#161616;
--spk-text-main:#c8c8c8;
--spk-text-mid:#888;
--spk-text-dim:#555;
--spk-text-ghost:#333;
--spk-gold:var(--glow-gold,#c5a059);
--spk-blue:var(--glow-blue,#ff8c00);
}
.spk-wrap{font-family:"Cinzel",serif;}
.spk-header{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:28px;gap:20px;flex-wrap:wrap;}
.spk-header-title{font-size:1.3em;color:#e0e0e0;letter-spacing:3px;text-transform:uppercase;}
.spk-header-title span{color:var(--spk-gold);}
.spk-header-sub{font-size:0.65em;color:var(--spk-text-dim);letter-spacing:2px;margin-top:4px;font-family:sans-serif;}

/* Stats Strip */
.spk-stats-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--spk-border);margin-bottom:28px;border:1px solid var(--spk-border);}
.spk-stat{background:var(--spk-bg-board);padding:16px 18px;text-align:center;}
.spk-stat-num{font-size:1.6em;color:var(--spk-gold);letter-spacing:1px;}
.spk-stat-lbl{font-size:0.58em;color:var(--spk-text-dim);letter-spacing:2px;text-transform:uppercase;margin-top:4px;font-family:sans-serif;}

/* Layout */
.spk-layout{display:flex;flex-direction:column;gap:24px;}

/* Category */
.spk-cat{margin-bottom:20px;}
.spk-cat-title{font-size:0.72em;letter-spacing:3px;text-transform:uppercase;color:var(--spk-gold);border-bottom:1px solid rgba(197,160,89,0.2);padding-bottom:9px;margin-bottom:0;display:flex;align-items:center;gap:10px;}
.spk-cat-title i{opacity:0.5;}
.spk-readonly-tag{font-size:0.75em;color:var(--spk-text-ghost);letter-spacing:1px;margin-left:auto;}

/* Board Row */
.spk-board{display:grid;grid-template-columns:48px 1fr 100px 100px 210px;align-items:center;background:var(--spk-bg-board);border:1px solid var(--spk-border);border-top:none;cursor:pointer;transition:background 0.18s,border-left-color 0.18s;border-left:3px solid transparent;}
.spk-board:first-of-type{border-top:1px solid var(--spk-border);}
.spk-board:hover{background:var(--spk-bg-board-h);border-left-color:var(--spk-blue);}
.spk-board:hover .spk-board-icon{color:var(--spk-blue);}
.spk-board:hover .spk-board-name{color:#fff;}
.spk-board-icon{text-align:center;padding:18px 0;color:var(--spk-text-ghost);font-size:1.1em;transition:color 0.2s;}
.spk-board-info{padding:14px 16px 14px 8px;min-width:0;}
.spk-board-name{color:var(--spk-text-main);font-size:0.88em;letter-spacing:0.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color 0.18s;}
.spk-board-desc{color:var(--spk-text-dim);font-size:0.72em;font-family:sans-serif;font-style:italic;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:0;}
.spk-board-stat{text-align:center;padding:0 8px;color:var(--spk-text-mid);font-size:0.72em;font-family:sans-serif;}
.spk-board-stat strong{display:block;font-size:1.35em;color:var(--spk-text-main);font-family:"Cinzel",serif;}
.spk-board-last{padding:10px 14px;border-left:1px solid var(--spk-border-soft);}
.spk-board-last-date{font-size:0.63em;color:var(--spk-text-dim);font-family:sans-serif;letter-spacing:0;}
.spk-board-last-user{font-size:0.74em;color:var(--spk-blue);display:block;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.spk-board-empty{color:var(--spk-text-ghost);font-size:0.72em;font-style:italic;font-family:sans-serif;}

/* Sidebar */
.spk-sidebar{display:flex;flex-direction:row;gap:16px;align-items:flex-start;flex-wrap:wrap;}
.spk-sidebar-block{background:var(--spk-bg-board);border:1px solid var(--spk-border);flex:1;min-width:200px;}
.spk-sidebar-head{padding:10px 14px;border-bottom:1px solid var(--spk-border-soft);font-size:0.62em;letter-spacing:2px;text-transform:uppercase;color:var(--spk-text-mid);display:flex;align-items:center;gap:8px;}
.spk-sidebar-head i{color:var(--spk-gold);opacity:0.6;}

/* Legend fix – override inline styles */
.spk-sidebar-block [style*="color:#333"]{color:var(--spk-text-mid) !important;}
.spk-sidebar-block [style*="color:#1a1a1a"]{color:var(--spk-text-dim) !important;}
.spk-sidebar-block [style*="color:#181818"]{color:var(--spk-text-dim) !important;}
.spk-sidebar-block [style*="font-size:0.68em"]{color:var(--spk-text-mid) !important;}

/* Latest Posts */
.spk-latest-item{display:flex;align-items:center;gap:10px;padding:9px 14px;border-bottom:1px solid var(--spk-border-soft);cursor:pointer;transition:background 0.15s;}
.spk-latest-item:last-child{border-bottom:none;}
.spk-latest-item:hover{background:#111;}
.spk-latest-avatar{width:30px;height:30px;object-fit:cover;border:1px solid var(--spk-border);flex-shrink:0;}
.spk-latest-avatar-placeholder{width:30px;height:30px;background:#0a0a0a;border:1px solid var(--spk-border);flex-shrink:0;display:flex;align-items:center;justify-content:center;color:var(--spk-text-ghost);font-size:0.75em;}
.spk-latest-info{min-width:0;flex:1;}
.spk-latest-thread{font-size:0.75em;color:var(--spk-text-mid);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:sans-serif;letter-spacing:0;}
.spk-latest-by{font-size:0.65em;color:var(--spk-text-dim);font-family:sans-serif;margin-top:2px;}
.spk-latest-by span{color:var(--spk-blue);}

/* Online Users */
.spk-online-wrap{padding:10px 14px;}
.spk-online-list{display:flex;flex-wrap:wrap;gap:5px;}
.spk-online-user{font-size:0.7em;font-family:sans-serif;padding:3px 8px;background:#080808;border:1px solid var(--spk-border);letter-spacing:0;transition:border-color 0.15s;}
.spk-online-none{font-size:0.72em;color:var(--spk-text-ghost);font-family:sans-serif;font-style:italic;letter-spacing:0;}

/* Breadcrumbs – global für alle Spike-Seiten */
.spk-breadcrumb{display:flex;align-items:center;gap:6px;font-size:0.72em;font-family:"Cinzel",serif;letter-spacing:1.5px;color:var(--spk-text-dim);margin-bottom:20px;text-transform:uppercase;flex-wrap:wrap;}
.spk-breadcrumb a{color:var(--spk-text-mid);text-decoration:none;transition:color 0.2s,border-color 0.2s;padding:2px 4px;border-bottom:1px solid transparent;}
.spk-breadcrumb a:hover{color:var(--spk-gold);border-bottom-color:rgba(197,160,89,0.3);}
.spk-breadcrumb-sep{color:rgba(197,160,89,0.45);font-size:0.85em;}
.spk-breadcrumb-current{color:#c0c0c0;}

/* Prefix Badge */
.spk-prefix{display:inline-block;font-size:0.6em;font-family:"Cinzel",serif;letter-spacing:0.5px;padding:2px 7px;text-transform:uppercase;border:1px solid currentColor;margin-right:6px;vertical-align:middle;opacity:0.85;}
.spk-breadcrumb .spk-prefix{font-size:0.9em;opacity:0.65;}

/* Pagination – global */
.spk-pagination{display:flex;align-items:center;justify-content:center;gap:4px;margin:22px 0 16px;flex-wrap:wrap;}
.spk-page-btn{background:none;border:1px solid #1c1c1c;color:#555;padding:6px 12px;font-family:"Cinzel",serif;font-size:0.63em;letter-spacing:1px;cursor:pointer;transition:all 0.15s;text-decoration:none;display:inline-block;}
.spk-page-btn:hover{border-color:rgba(255,255,255,0.12);color:#888;background:rgba(255,255,255,0.03);}
.spk-page-btn.active{border-color:rgba(197,160,89,0.5);color:var(--spk-gold);background:rgba(197,160,89,0.06);cursor:default;}
.spk-page-btn.disabled{opacity:0.25;cursor:default;pointer-events:none;}
.spk-page-info{font-size:0.6em;color:#333;font-family:"Cinzel",serif;letter-spacing:1px;padding:0 6px;}

/* New Indicator */
.spk-new-dot{width:7px;height:7px;background:var(--spk-blue);border-radius:50%;display:inline-block;margin-left:6px;vertical-align:middle;animation:spk-pulse 2s infinite;}
@keyframes spk-pulse{0%,100%{opacity:1;}50%{opacity:0.3;}}

/* Unread indicator */
.spk-board.has-unread .spk-board-name::after{content:"";display:inline-block;width:6px;height:6px;background:var(--spk-blue);border-radius:50%;margin-left:8px;vertical-align:middle;animation:spk-pulse 2s infinite;}

/* Sticky Trenner */
.vb-sticky-divider{display:flex;align-items:center;gap:10px;padding:5px 14px;background:#080808;border:1px solid #111;border-top:none;font-size:0.56em;color:#333;font-family:"Cinzel",serif;letter-spacing:2px;text-transform:uppercase;}
.vb-sticky-divider::before,.vb-sticky-divider::after{content:"";flex:1;height:1px;background:rgba(197,160,89,0.12);}

/* Thread-Vorschau Tooltip */
.vb-preview-tooltip{position:absolute;left:14px;top:calc(100% + 4px);z-index:100;background:#0d0d0d;border:1px solid #2a2a2a;border-left:2px solid rgba(197,160,89,0.4);padding:9px 13px;max-width:420px;font-size:0.78em;color:#aaa;font-family:sans-serif;line-height:1.6;letter-spacing:0;pointer-events:none;opacity:0;transition:opacity 0.15s;white-space:normal;}
.vb-row:hover .vb-preview-tooltip{opacity:1;}

/* ══ VIEWBOARD – vb-* ══════════════════════════════════════════ */
.vb-list{background:#0c0c0c;border:1px solid #1c1c1c;}
.vb-list-header{display:grid;grid-template-columns:1fr 140px 95px;background:#080808;border-bottom:1px solid #111;padding:8px 14px;font-family:"Cinzel",serif;font-size:0.57em;letter-spacing:2px;color:#444;text-transform:uppercase;}
.vb-row{display:grid;grid-template-columns:1fr 140px 95px;border-bottom:1px solid #111;transition:background 0.13s;cursor:pointer;position:relative;}
.vb-row:last-child{border-bottom:none;}
.vb-row:hover{background:rgba(197,160,89,0.025);}
.vb-row::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:transparent;transition:background 0.2s;}
.vb-row.is-sticky::before{background:rgba(197,160,89,0.45);}
.vb-row.is-locked{opacity:0.7;}

.vb-cell-title{padding:11px 14px;min-width:0;}
.vb-title-line{display:flex;align-items:center;gap:7px;flex-wrap:wrap;}
.vb-title-text{color:#d4d4d4;font-size:0.88em;font-weight:600;font-family:sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:500px;letter-spacing:0.2px;line-height:1.5;}
.vb-title-icons{display:flex;align-items:center;gap:4px;flex-shrink:0;}
.vb-title-icons i{font-size:0.7em;}
.vb-title-sticky{color:rgba(197,160,89,0.55);}
.vb-title-locked{color:#383838;}
.vb-reply-count{font-size:0.62em;color:#444;font-family:sans-serif;margin-left:2px;}
.vb-last-post{font-size:0.6em;color:#444;font-family:sans-serif;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.vb-last-post span{color:#555;}

.vb-cell-author{padding:11px 8px;display:flex;align-items:center;justify-content:center;}
.vb-author-name{color:#555;font-size:0.76em;font-family:sans-serif;text-align:center;word-break:break-word;}

.vb-cell-date{padding:11px 12px 11px 0;display:flex;flex-direction:column;align-items:flex-end;justify-content:center;}
.vb-date-day{color:#444;font-size:0.68em;font-family:sans-serif;}
.vb-date-time{color:#333;font-size:0.62em;font-family:sans-serif;}

.vb-list.has-mod .vb-list-header,
.vb-list.has-mod .vb-row{grid-template-columns:36px 1fr 140px 95px;}
.vb-cell-check{display:flex;align-items:center;padding-left:12px;}
.vb-empty{padding:50px 16px;text-align:center;color:#333;font-style:italic;font-family:sans-serif;font-size:0.82em;}

.vb-mod-bar{background:#080808;padding:9px 14px;display:flex;align-items:center;flex-wrap:wrap;gap:10px;border:1px solid #111;border-top:none;}
.vb-mod-bar select{background:#080808;border:1px solid #1a1a1a;color:#555;padding:5px 8px;font-size:0.73em;outline:none;transition:border-color 0.2s;}
.vb-mod-bar select:focus{border-color:rgba(255,255,255,0.1);}
.vb-mod-btn{background:transparent;border:1px solid #222;color:#444;padding:5px 12px;font-family:"Cinzel",serif;font-size:0.58em;letter-spacing:1px;text-transform:uppercase;cursor:pointer;transition:all 0.2s;}
.vb-mod-btn:hover{border-color:var(--glow-blue,#00d4ff);color:var(--glow-blue,#00d4ff);}
.vb-select-all-label{margin-left:auto;font-size:0.6em;color:#333;cursor:pointer;display:flex;align-items:center;gap:5px;font-family:"Cinzel",serif;transition:color 0.2s;}
.vb-select-all-label:hover{color:#666;}

/* Zurück-nach-oben Button */
#spk-back-top{position:fixed;bottom:28px;right:28px;width:40px;height:40px;background:#0d0d0d;border:1px solid rgba(197,160,89,0.3);color:rgba(197,160,89,0.6);display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1em;opacity:0;pointer-events:none;transition:all 0.25s;z-index:500;}
#spk-back-top.visible{opacity:1;pointer-events:auto;}
#spk-back-top:hover{background:rgba(197,160,89,0.1);border-color:rgba(197,160,89,0.6);color:var(--glow-gold,#c5a059);}

@media(max-width:900px){
.spk-stats-strip{grid-template-columns:repeat(2,1fr);}
.spk-board{grid-template-columns:40px 1fr;}
.spk-board-stat,.spk-board-last{display:none;}
.spk-sidebar{flex-direction:column;}
}
@media(max-width:768px){
.vb-list-header{display:none;}
.vb-row,.vb-list.has-mod .vb-row{grid-template-columns:1fr 80px;}
.vb-cell-author,.vb-cell-check{display:none;}
.vb-title-text{max-width:250px;}
}
@media(max-width:480px){
.spk-board-desc{display:none;}
}

/* ── Legend Klassen (spike_forum_view.php) ───────────────────── */
.spk-legend-body{padding:10px 14px;}
.spk-legend-row{display:flex;align-items:center;gap:9px;margin-bottom:7px;}
.spk-legend-row:last-child{margin-bottom:0;}
.spk-legend-text{font-size:0.72em;color:#888;font-family:sans-serif;letter-spacing:0;}
.spk-legend-icon{font-size:0.82em;width:14px;text-align:center;}
.spk-legend-icon--open{color:var(--glow-blue,#00d4ff);opacity:0.7;}
.spk-legend-icon--read{color:#444;}

/* ── Sticky Trenner im Viewboard ─────────────────────────────── */
.vb-sticky-divider{
    display:flex;align-items:center;gap:10px;
    padding:6px 14px;
    background:#080808;
    border:1px solid #111;border-top:none;
    font-size:0.56em;color:#444;
    font-family:"Cinzel",serif;letter-spacing:2px;text-transform:uppercase;
}
.vb-sticky-divider::before,.vb-sticky-divider::after{
    content:"";flex:1;height:1px;
    background:rgba(197,160,89,0.12);
}

/* ── Thread-Vorschau Tooltip ─────────────────────────────────── */
.vb-cell-title{position:relative;}
.vb-preview-tooltip{
    position:absolute;
    left:0;top:calc(100% + 2px);
    z-index:100;
    background:#0d0d0d;
    border:1px solid #2a2a2a;
    border-left:2px solid rgba(197,160,89,0.4);
    padding:9px 13px;
    max-width:420px;min-width:220px;
    font-size:0.78em;color:#999;
    font-family:sans-serif;line-height:1.6;letter-spacing:0;
    pointer-events:none;
    opacity:0;transition:opacity 0.15s;
    white-space:normal;
    box-shadow:0 6px 18px rgba(0,0,0,0.6);
}
.vb-row:hover .vb-preview-tooltip{opacity:1;}


/* === SPIKE_MOBILE [default] === */

@media screen and (max-width: 768px) {
    /* Viewboard & Thread Liste */
    .spike-thread-list, .spike-post-wrapper { width: 100% !important; padding: 10px !important; }
    .spike-row { display: flex; flex-direction: column; border-bottom: 1px solid var(--border-line); padding: 15px 0; }
    .spike-cell-meta { order: 2; font-size: 0.75em; color: var(--text-muted); margin-top: 5px; }
    
    /* New Thread & Edit Post (Quill Editor) */
    .ql-toolbar.ql-snow { white-space: nowrap; overflow-x: auto; display: flex; }
    .ql-container.ql-snow { min-height: 200px !important; }
    .spike-form-container { padding: 0 !important; }
    
    /* Buttons im Forum */
    .spike-btn-group { display: flex; flex-direction: column; gap: 10px; width: 100%; }
    .spike-btn { width: 100% !important; justify-content: center; }
}

/* === VIEWTHREAD_MOBILE [default] === */

@media screen and (max-width: 768px) {
    html body .post-container { flex-direction: column !important; min-height: auto !important; }
    html body .post-sidebar { 
        width: 100% !important; display: flex !important; flex-direction: row !important; 
        align-items: center !important; text-align: left !important; border-right: none !important;
        border-bottom: 1px solid rgba(255,255,255,0.05) !important; padding: 12px !important;
    }
    html body .post-sidebar img { width: 45px !important; height: 45px !important; margin: 0 15px 0 0 !important; }
    html body .post-content-body { width: 100% !important; padding: 15px !important; }
    html body .post-count-label { display: none !important; }
    
    /* Meta-Actions (Edit/Quote) */
    html body .post-meta-actions { top: 12px !important; right: 10px !important; gap: 8px !important; }
    html body .btn-post-edit, html body .btn-post-quote { font-size: 0 !important; }
    html body .btn-post-edit i, html body .btn-post-quote i { font-size: 1.1rem !important; margin: 0 !important; }
}