/**
 * expertaizer-roster.css  —  Grid-Karten, Fotos, Mitgliedschafts-Filter, Sort
 */

/* ── WINDOW ──────────────────────────────────────────────────── */
#expertaizer-roster-window { display:flex; flex-direction:column; overflow:hidden; min-width:400px; min-height:500px; }
.roster-content { display:flex; flex-direction:column; flex:1; overflow:hidden; }

/* ── SEARCH ──────────────────────────────────────────────────── */
.roster-search-bar { display:flex; align-items:center; gap:8px; padding:10px 14px; border-bottom:1px solid rgba(255,255,255,0.07); }
.roster-search-wrap { position:relative; flex:1; }
.roster-search-icon { position:absolute; left:10px; top:50%; transform:translateY(-50%); pointer-events:none; opacity:0.4; color:var(--text-secondary,#94a3b8); }
.roster-search-input { width:100%; background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.1); border-radius:8px; padding:7px 10px 7px 32px; font-size:13px; color:var(--text-primary,#e2e8f0); outline:none; transition:border-color .2s,background .2s; box-sizing:border-box; }
.roster-search-input:focus { border-color:var(--color-primary,#0ea5e9); background:rgba(255,255,255,0.09); }
.roster-search-input::placeholder { color:rgba(148,163,184,0.5); }

/* ── SOURCE TABS ─────────────────────────────────────────────── */
.roster-source-tabs { display:flex; gap:4px; padding:8px 14px 6px; border-bottom:1px solid rgba(255,255,255,0.07); }
.roster-source-tab { background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.08); border-radius:20px; padding:4px 12px; font-size:12px; color:var(--text-secondary,#94a3b8); cursor:pointer; transition:all .15s; white-space:nowrap; display:flex; align-items:center; gap:4px; }
.roster-source-tab:hover { background:rgba(255,255,255,0.1); color:var(--text-primary,#e2e8f0); }
.roster-source-tab.active { background:var(--color-primary,#0ea5e9); border-color:var(--color-primary,#0ea5e9); color:#fff; font-weight:600; }
.roster-count-badge { font-size:10px; opacity:.8; background:rgba(0,0,0,0.2); border-radius:10px; padding:0 5px; line-height:16px; }
.roster-source-tab.active .roster-count-badge { background:rgba(255,255,255,0.2); }

/* ── MEMBERSHIP FILTER ───────────────────────────────────────── */
.roster-membership-bar { display:flex; align-items:center; gap:5px; padding:6px 14px; border-bottom:1px solid rgba(255,255,255,0.07); flex-wrap:wrap; }
.roster-membership-label { font-size:10px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:var(--text-secondary,#94a3b8); opacity:.5; margin-right:2px; white-space:nowrap; }
.roster-mem-chip { border:1px solid transparent; border-radius:20px; padding:3px 11px; font-size:11px; font-weight:600; cursor:pointer; transition:all .15s; background:rgba(255,255,255,0.05); color:var(--text-secondary,#94a3b8); border-color:rgba(255,255,255,0.08); }
.roster-mem-chip:hover { background:rgba(255,255,255,0.1); color:var(--text-primary,#e2e8f0); }
.roster-mem-chip.active { color:#fff; font-weight:700; }
.roster-mem-chip[data-mem="all"].active     { background:rgba(255,255,255,0.15); border-color:rgba(255,255,255,0.3); }
.roster-mem-chip[data-mem="platinum"].active{ background:rgba(59,130,246,0.35); border-color:rgba(59,130,246,0.6); }
.roster-mem-chip[data-mem="gold"].active    { background:rgba(245,158,11,0.35); border-color:rgba(245,158,11,0.65); }
.roster-mem-chip[data-mem="silver"].active  { background:rgba(100,116,139,0.4); border-color:rgba(100,116,139,0.7); }
.roster-mem-chip[data-mem="free"].active    { background:rgba(16,185,129,0.3); border-color:rgba(16,185,129,0.55); }

/* ── SORT + VIEW CONTROLS ────────────────────────────────────── */
.roster-controls-bar { display:flex; align-items:center; gap:8px; padding:6px 14px; border-bottom:1px solid rgba(255,255,255,0.07); }
.roster-sort-wrap { display:flex; align-items:center; gap:6px; flex:1; }
.roster-sort-label { font-size:11px; color:var(--text-secondary,#94a3b8); opacity:.6; white-space:nowrap; }
.roster-sort-select { background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.1); border-radius:6px; padding:4px 8px; font-size:12px; color:var(--text-primary,#e2e8f0); outline:none; cursor:pointer; transition:border-color .2s; }
.roster-sort-select:focus { border-color:var(--color-primary,#0ea5e9); }
.roster-sort-select option { background:#1e293b; }
.roster-view-toggle { display:flex; gap:2px; }
.roster-view-btn { background:none; border:1px solid rgba(255,255,255,0.08); border-radius:6px; width:28px; height:28px; display:flex; align-items:center; justify-content:center; cursor:pointer; color:var(--text-secondary,#94a3b8); transition:all .15s; }
.roster-view-btn:hover { background:rgba(255,255,255,0.08); color:var(--text-primary,#e2e8f0); }
.roster-view-btn.active { background:rgba(14,165,233,0.2); border-color:var(--color-primary,#0ea5e9); color:var(--color-primary,#0ea5e9); }

/* Audio-Info-Button */
.roster-audio-info-btn { background:linear-gradient(135deg,rgba(255,152,0,0.2),rgba(245,124,0,0.15)); border:1px solid rgba(255,152,0,0.35); color:#fbbf24; border-radius:7px; padding:4px 9px; font-size:11px; font-weight:600; cursor:pointer; white-space:nowrap; flex-shrink:0; transition:all .15s; }
.roster-audio-info-btn:hover { background:linear-gradient(135deg,rgba(255,152,0,0.35),rgba(245,124,0,0.28)); border-color:rgba(255,152,0,0.6); }

/* Favoriten-Chip */
.roster-fav-chip { border-color:rgba(239,68,68,0.3) !important; }
.roster-fav-chip.active { background:rgba(239,68,68,0.2) !important; border-color:rgba(239,68,68,0.55) !important; color:#fca5a5 !important; }

/* ── ROSTER LIST ─────────────────────────────────────────────── */
.roster-list { flex:1; overflow-y:auto; padding:10px; scrollbar-width:thin; scrollbar-color:rgba(255,255,255,0.1) transparent; }
.roster-list::-webkit-scrollbar { width:4px; }
.roster-list::-webkit-scrollbar-thumb { background:rgba(255,255,255,0.1); border-radius:4px; }

/* GRID (default) */
.roster-list.view-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(148px,1fr)); gap:10px; align-content:start; }
/* LIST */
.roster-list.view-list { display:flex; flex-direction:column; gap:2px; }

.roster-section-label { font-size:10px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--text-secondary,#94a3b8); padding:8px 4px 4px; opacity:.5; grid-column:1/-1; }
.roster-empty { grid-column:1/-1; text-align:center; color:var(--text-secondary,#94a3b8); font-size:13px; padding:40px 20px; opacity:.6; }

/* ── KARTE (GRID) ────────────────────────────────────────────── */
.roster-item { background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.07); border-radius:12px; padding:14px 10px 12px; cursor:pointer; transition:background .15s,border-color .15s,transform .15s,box-shadow .15s; display:flex; flex-direction:column; align-items:center; gap:8px; text-align:center; position:relative; overflow:clip; min-height:155px; }
.roster-item::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:var(--ri-accent,transparent); border-radius:12px 12px 0 0; }
.roster-item[data-membership="Platinum"]::before,.roster-item[data-membership="platinum"]::before { --ri-accent:#3b82f6; }
.roster-item[data-membership="Gold"]::before,.roster-item[data-membership="gold"]::before         { --ri-accent:#f59e0b; }
.roster-item[data-membership="Silver"]::before,.roster-item[data-membership="silver"]::before     { --ri-accent:#64748b; }
.roster-item[data-membership="Free"]::before,.roster-item[data-membership="free"]::before         { --ri-accent:#10b981; }
.roster-item:hover { background:rgba(255,255,255,0.08); border-color:rgba(255,255,255,0.14); transform:translateY(-2px); box-shadow:0 6px 20px rgba(0,0,0,0.25); }
.roster-item.active { background:rgba(14,165,233,0.12); border-color:rgba(14,165,233,0.4); }
.roster-item.active::before { --ri-accent:var(--color-primary,#0ea5e9) !important; }

/* Favoriten-Herz-Button auf Karte */
.roster-fav-btn { position:absolute; top:5px; left:7px; background:none; border:none; padding:2px; font-size:22px; cursor:pointer; color:rgba(255,255,255,0.22); line-height:1; transition:color .15s,transform .12s; z-index:2; }
.roster-fav-btn:hover { color:rgba(239,68,68,0.75); transform:scale(1.25); }
.roster-fav-btn.active { color:#ef4444; text-shadow:0 0 8px rgba(239,68,68,0.45); }
.roster-fav-btn:focus-visible { outline:1px solid rgba(239,68,68,0.5); border-radius:4px; }
.roster-audio-btn { position:absolute; top:5px; right:7px; background:none; border:none; padding:2px 3px; font-size:14px; cursor:pointer; color:rgba(255,255,255,0.28); line-height:1; transition:color .15s,transform .12s; z-index:2; border-radius:4px; }
.roster-audio-btn:hover { color:rgba(251,146,60,.85); transform:scale(1.2); }
.roster-audio-btn.playing { color:#fb923c; animation:roster-audio-pulse 1.4s ease-in-out infinite; }
@keyframes roster-audio-pulse { 0%,100%{opacity:1} 50%{opacity:.45} }
.view-list .roster-audio-btn { position:static; font-size:13px; padding:0 3px; color:rgba(255,255,255,0.28); }

/* Karten-Footer (Badge + QProg) */
.roster-item-footer { display:flex; align-items:center; gap:5px; flex-wrap:wrap; justify-content:center; margin-top:auto; }

/* Fragenfortschritt-Badge — 4 Farbstufen */
.roster-qprog-badge { font-size:9px; font-weight:700; padding:2px 7px; border-radius:10px; letter-spacing:.04em; white-space:nowrap; cursor:default; }
.roster-qprog-none { background:rgba(100,116,139,0.12); color:rgba(148,163,184,0.5); border:1px solid rgba(100,116,139,0.15); }                    /* 0 %  – grau */
.roster-qprog-low  { background:rgba(245,158,11,0.15);  color:#fbbf24;              border:1px solid rgba(245,158,11,0.3); }                            /* 1–49 % – gelb */
.roster-qprog-mid  { background:rgba(14,165,233,0.15);  color:#38bdf8;              border:1px solid rgba(14,165,233,0.3); }                            /* 50–99 % – blau */
.roster-qprog-done { background:rgba(16,185,129,0.18);  color:#6ee7b7;              border:1px solid rgba(16,185,129,0.35); }                           /* 100 %  – grün */

/* Avatar */
.roster-avatar { width:64px; height:64px; border-radius:50%; background:rgba(255,255,255,0.08); display:flex; align-items:center; justify-content:center; font-size:22px; font-weight:700; color:var(--color-primary,#0ea5e9); flex-shrink:0; overflow:hidden; border:2px solid rgba(255,255,255,0.1); transition:border-color .15s; }
.roster-item[data-membership="Platinum"] .roster-avatar,.roster-item[data-membership="platinum"] .roster-avatar { border-color:rgba(59,130,246,0.65); }
.roster-item[data-membership="Gold"] .roster-avatar,.roster-item[data-membership="gold"] .roster-avatar         { border-color:rgba(245,158,11,0.65); }
.roster-item[data-membership="Silver"] .roster-avatar,.roster-item[data-membership="silver"] .roster-avatar     { border-color:rgba(100,116,139,0.55); }
.roster-item[data-membership="Free"] .roster-avatar,.roster-item[data-membership="free"] .roster-avatar         { border-color:rgba(16,185,129,0.55); }
.roster-avatar img { width:100%; height:100%; object-fit:cover; object-position:center top; border-radius:50%; display:block; }

.roster-item-name  { font-size:12px; font-weight:700; color:var(--text-primary,#e2e8f0); line-height:1.3; word-break:break-word; max-width:100%; }
.roster-item-title { font-size:10px; color:var(--text-secondary,#94a3b8); line-height:1.3; word-break:break-word; max-width:100%; margin-top:-4px; }

.roster-soul-dot { width:6px; height:6px; border-radius:50%; background:#10b981; position:absolute; top:10px; right:10px; }

.roster-badge { font-size:9px; font-weight:700; padding:2px 7px; border-radius:10px; text-transform:uppercase; letter-spacing:.06em; }
.roster-badge.platinum { background:rgba(59,130,246,0.2); color:#93c5fd; border:1px solid rgba(59,130,246,0.35); }
.roster-badge.gold     { background:rgba(245,158,11,0.2); color:#fbbf24; border:1px solid rgba(245,158,11,0.35); }
.roster-badge.silver   { background:rgba(100,116,139,0.25); color:#cbd5e1; border:1px solid rgba(100,116,139,0.4); }
.roster-badge.free     { background:rgba(16,185,129,0.15); color:#6ee7b7; border:1px solid rgba(16,185,129,0.3); }

/* ── LIST-MODE OVERRIDES ─────────────────────────────────────── */
.view-list .roster-item { flex-direction:row; align-items:center; text-align:left; padding:8px 12px; gap:10px; border-radius:8px; margin:0; }
.view-list .roster-item::before { width:3px; height:auto; top:0; bottom:0; left:0; right:auto; border-radius:8px 0 0 8px; }
.view-list .roster-avatar { width:38px; height:38px; font-size:15px; border-radius:50%; }
.view-list .roster-item-info { flex:1; min-width:0; }
.view-list .roster-item-name { font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.view-list .roster-item-title { font-size:11px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:1px; }
.view-list .roster-soul-dot { position:static; flex-shrink:0; }
.view-list .roster-item-badges { display:flex; align-items:center; gap:5px; flex-shrink:0; }
.view-list .roster-fav-btn { position:static; font-size:20px; padding:0 2px; color:rgba(255,255,255,0.22); }
.view-list .roster-fav-btn.active { color:#ef4444; }

/* ── FOOTER ──────────────────────────────────────────────────── */
.roster-footer { padding:5px 14px; border-top:1px solid rgba(255,255,255,0.07); font-size:11px; color:var(--text-secondary,#94a3b8); opacity:.6; text-align:center; }
.roster-spinner { display:inline-block; width:20px; height:20px; border:2px solid rgba(255,255,255,0.1); border-top-color:var(--color-primary,#0ea5e9); border-radius:50%; animation:spin .75s linear infinite; margin:8px auto; }
@keyframes spin { to { transform:rotate(360deg); } }

/* ══ PROFILE WINDOW ══════════════════════════════════════════════ */
#expertaizer-profile-window { display:flex; flex-direction:column; overflow:hidden; min-width:480px; min-height:500px; }
.profile-content { display:flex; flex-direction:column; flex:1; overflow:hidden; }

.profile-hero { display:flex; align-items:center; gap:16px; padding:16px 20px 14px; border-bottom:1px solid rgba(255,255,255,0.08); background:rgba(255,255,255,0.02); }
.profile-avatar { width:80px; height:80px; border-radius:50%; background:rgba(255,255,255,0.1); flex-shrink:0; display:flex; align-items:center; justify-content:center; font-size:26px; font-weight:700; color:var(--color-primary,#0ea5e9); border:2px solid rgba(14,165,233,0.4); overflow:hidden; }
.profile-avatar img { width:100%; height:100%; border-radius:50%; object-fit:cover; object-position:center top; }
.profile-hero-meta { flex:1; min-width:0; }
.profile-name { font-size:18px; font-weight:700; color:var(--text-primary,#e2e8f0); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.profile-title { font-size:12px; color:var(--text-secondary,#94a3b8); margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.profile-hero-badges { display:flex; gap:6px; margin-top:6px; flex-wrap:wrap; }
.profile-actions { display:flex; gap:6px; flex-shrink:0; }

.profile-action-btn { background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.12); border-radius:8px; padding:6px 12px; font-size:12px; color:var(--text-primary,#e2e8f0); cursor:pointer; transition:all .2s; white-space:nowrap; display:flex; align-items:center; gap:5px; }
.profile-action-btn:hover { background:rgba(14,165,233,0.2); border-color:var(--color-primary,#0ea5e9); color:#fff; }
.profile-action-btn.primary { background:var(--color-primary,#0ea5e9); border-color:var(--color-primary,#0ea5e9); color:#fff; }
.profile-action-btn.primary:hover { background:#38bdf8; }

.profile-tabs { display:flex; padding:0 10px; border-bottom:1px solid rgba(255,255,255,0.08); overflow-x:auto; scrollbar-width:none; }
.profile-tabs::-webkit-scrollbar { display:none; }
.profile-tab-btn { background:none; border:none; border-bottom:2px solid transparent; padding:9px 11px; font-size:12px; font-weight:500; color:var(--text-secondary,#94a3b8); cursor:pointer; transition:all .2s; margin-bottom:-1px; white-space:nowrap; flex-shrink:0; }
.profile-tab-btn:hover { color:var(--text-primary,#e2e8f0); }
.profile-tab-btn.active { color:var(--color-primary,#0ea5e9); border-bottom-color:var(--color-primary,#0ea5e9); }

.profile-tab-panels { flex:1; overflow:hidden; position:relative; }
.profile-tab-panel { position:absolute; inset:0; overflow-y:auto; padding:16px 20px; display:none; scrollbar-width:thin; scrollbar-color:rgba(255,255,255,0.1) transparent; }
.profile-tab-panel::-webkit-scrollbar { width:4px; }
.profile-tab-panel::-webkit-scrollbar-thumb { background:rgba(255,255,255,0.1); border-radius:4px; }
.profile-tab-panel.active { display:block; }

.profile-info-section { margin-bottom:20px; }
.profile-section-title { font-size:10px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--text-secondary,#94a3b8); margin-bottom:8px; opacity:.65; }
.profile-bio { font-size:13px; color:var(--text-primary,#e2e8f0); line-height:1.65; opacity:.85; }
.profile-props { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.profile-prop { background:rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.07); border-radius:8px; padding:8px 12px; }
.profile-prop-label { font-size:10px; font-weight:700; color:var(--text-secondary,#94a3b8); text-transform:uppercase; letter-spacing:.06em; margin-bottom:3px; }
.profile-prop-value { font-size:13px; color:var(--text-primary,#e2e8f0); word-break:break-word; }
.profile-traits { display:flex; flex-wrap:wrap; gap:6px; }
.profile-trait-chip { background:rgba(14,165,233,0.1); border:1px solid rgba(14,165,233,0.2); color:#38bdf8; border-radius:20px; padding:3px 10px; font-size:11px; }
.profile-soul-block { background:rgba(139,92,246,0.08); border:1px solid rgba(139,92,246,0.2); border-radius:10px; padding:12px 14px; }
.profile-soul-character { font-size:13px; color:#c4b5fd; font-style:italic; line-height:1.5; margin-bottom:8px; }

/* ── SOUL TAB ACCORDIONS ─────────────────────────────────────── */
.soul-tab-container { display:flex; flex-direction:column; gap:6px; }

.soul-accordion { border:1px solid rgba(255,255,255,0.08); border-radius:10px; background:rgba(255,255,255,0.03); overflow:hidden; transition:border-color .2s; }
.soul-accordion:hover { border-color:rgba(139,92,246,0.25); }
.soul-accordion[open] { border-color:rgba(139,92,246,0.3); background:rgba(139,92,246,0.04); }

.soul-accordion-header { display:flex; align-items:center; gap:8px; padding:10px 14px; cursor:pointer; list-style:none; user-select:none; font-size:13px; font-weight:600; color:var(--text-primary,#e2e8f0); transition:background .15s; }
.soul-accordion-header::-webkit-details-marker { display:none; }
.soul-accordion-header::marker { content:''; }
.soul-accordion-header:hover { background:rgba(255,255,255,0.04); }

.soul-accordion-icon { font-size:15px; flex-shrink:0; width:22px; text-align:center; }
.soul-accordion-title { flex:1; }
.soul-accordion-chevron { font-size:16px; color:var(--text-secondary,#94a3b8); transition:transform .2s ease; flex-shrink:0; }
.soul-accordion[open] .soul-accordion-chevron { transform:rotate(90deg); }

.soul-accordion-body { padding:6px 14px 14px 44px; font-size:13px; color:var(--text-primary,#e2e8f0); line-height:1.65; opacity:.88; animation:soulAccFadeIn .2s ease; }
@keyframes soulAccFadeIn { from { opacity:0; transform:translateY(-6px); } to { opacity:.88; transform:translateY(0); } }

/* Soul meta grid */
.soul-meta-grid { display:flex; flex-direction:column; gap:6px; }
.soul-meta-row { display:flex; align-items:center; gap:10px; }
.soul-meta-label { font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:var(--text-secondary,#94a3b8); min-width:85px; }
.soul-meta-value { font-size:13px; color:var(--text-primary,#e2e8f0); }

/* Soul tone chips */
.soul-chips { display:flex; flex-wrap:wrap; gap:6px; }
.soul-tone-chip { background:rgba(139,92,246,0.12); border:1px solid rgba(139,92,246,0.25); color:#c4b5fd; border-radius:20px; padding:3px 12px; font-size:11px; font-weight:500; }

/* Soul traits list */
.soul-traits-list { display:flex; flex-direction:column; gap:8px; }
.soul-trait-item { display:flex; align-items:flex-start; gap:8px; }
.soul-trait-bullet { color:#c4b5fd; font-size:10px; margin-top:3px; flex-shrink:0; }
.soul-trait-text { font-size:13px; line-height:1.55; }

/* Soul body text */
.soul-body-text { white-space:pre-line; line-height:1.65; }
.soul-body-text p { margin:0 0 8px; }
.soul-body-text ul { margin:4px 0 8px 0; padding-left:6px; list-style:none; }
.soul-body-text li { position:relative; padding-left:14px; margin-bottom:4px; }
.soul-body-text li::before { content:'•'; position:absolute; left:0; color:#c4b5fd; }
.soul-body-text strong { color:#e0d4ff; }
.soul-body-text code { background:rgba(139,92,246,0.12); padding:1px 5px; border-radius:4px; font-size:12px; color:#c4b5fd; }
.soul-body-text ol { margin:4px 0 8px 0; padding-left:6px; list-style:none; }
.soul-body-text ol li { position:relative; padding-left:0; margin-bottom:4px; }
.soul-body-text ol li::before { display:none; }
.soul-body-text .soul-ol-num { color:#c4b5fd; font-weight:600; margin-right:4px; }
.soul-body-text blockquote.soul-blockquote { border-left:3px solid rgba(139,92,246,0.4); padding:4px 12px; margin:6px 0; color:#c4b5fd; font-style:italic; background:rgba(139,92,246,0.05); border-radius:0 6px 6px 0; }

/* Nested accordions (### subsections inside ##) */
.soul-accordion-nested { margin-top:6px; border-color:rgba(255,255,255,0.05); background:rgba(255,255,255,0.02); border-radius:8px; }
.soul-accordion-nested .soul-accordion-header { padding:7px 12px; font-size:12px; font-weight:500; }
.soul-accordion-nested .soul-accordion-icon { font-size:12px; width:20px; font-weight:700; color:#c4b5fd; }
.soul-accordion-nested .soul-accordion-body { padding:4px 12px 10px 40px; font-size:12.5px; }

/* SKILL content divider */
.soul-skill-divider { display:flex; align-items:center; gap:10px; padding:14px 0 6px; margin-top:8px; }
.soul-skill-divider::before, .soul-skill-divider::after { content:''; flex:1; height:1px; background:rgba(139,92,246,0.2); }
.soul-skill-divider-icon { font-size:16px; flex-shrink:0; }
.soul-skill-divider-label { font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.08em; color:#c4b5fd; white-space:nowrap; }

/* Loading hint */
.soul-skill-loading { text-align:center; padding:12px 0; }
.soul-skill-loader-hint { font-size:12px; color:var(--text-secondary,#94a3b8); opacity:.6; font-style:italic; }

.profile-chat-launch { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px; padding:40px 20px; text-align:center; }
.profile-chat-launch p { font-size:13px; color:var(--text-secondary,#94a3b8); max-width:320px; line-height:1.6; }
.profile-chat-btn-large { background:var(--color-primary,#0ea5e9); border:none; border-radius:10px; padding:12px 28px; font-size:15px; font-weight:600; color:#fff; cursor:pointer; transition:all .2s; display:flex; align-items:center; gap:8px; }
.profile-chat-btn-large:hover { background:#38bdf8; transform:translateY(-1px); }
.profile-voice-panel { display:flex; flex-direction:column; gap:14px; }
.profile-voice-info-grid { display:grid; grid-template-columns:1fr 1fr 1fr; gap:8px; }
.profile-voice-launch { display:flex; flex-direction:column; align-items:center; gap:10px; padding:20px; background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.08); border-radius:10px; text-align:center; }
.profile-voice-launch p { font-size:12px; color:var(--text-secondary,#94a3b8); line-height:1.5; }
.profile-empty { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; height:200px; color:var(--text-secondary,#94a3b8); font-size:13px; opacity:.6; }

/* ── PERSONALIZATION FLAG ────────────────────────────────────── */
.profile-pd-flag { display:flex; align-items:center; gap:8px; padding:10px 14px; background:rgba(14,165,233,0.06); border:1px solid rgba(14,165,233,0.15); border-radius:10px; margin-bottom:14px; }
.profile-pd-flag input[type="checkbox"] { width:16px; height:16px; accent-color:var(--color-primary,#0ea5e9); cursor:pointer; flex-shrink:0; }
.profile-pd-flag label { font-size:12px; color:var(--text-primary,#e2e8f0); cursor:pointer; line-height:1.4; }
.profile-pd-flag label span.pd-desc { display:block; font-size:10px; color:var(--text-secondary,#94a3b8); margin-top:2px; }

/* ── TOPICS TAB ──────────────────────────────────────────────── */
.profile-topics-controls { display:flex; align-items:center; gap:8px; margin-bottom:12px; }
.profile-topics-sort { background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.1); border-radius:6px; padding:5px 10px; font-size:12px; color:var(--text-primary,#e2e8f0); outline:none; cursor:pointer; flex:1; }
.profile-topics-sort option { background:#1e293b; }
.profile-topics-count { font-size:11px; color:var(--text-secondary,#94a3b8); opacity:.6; white-space:nowrap; }

/* Topics-Suche */
.profile-topics-search-bar { padding:0 0 8px; }
.profile-topics-search-input { width:100%; box-sizing:border-box; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1); border-radius:8px; color:var(--text-primary,#e2e8f0); font-size:12px; padding:6px 11px; outline:none; transition:border-color .15s, background .15s; }
.profile-topics-search-input:focus { border-color:rgba(14,165,233,.45); background:rgba(14,165,233,.04); }
.profile-topics-search-input::placeholder { color:rgba(148,163,184,.45); }
.profile-topic-subtopics mark { background:rgba(56,189,248,.25); color:#bae6fd; border-radius:2px; padding:0 2px; font-style:normal; }

.profile-topic-group { margin-bottom:10px; border:1px solid rgba(255,255,255,0.07); border-radius:10px; overflow:hidden; }
.profile-topic-header { display:flex; align-items:center; justify-content:space-between; padding:10px 14px; background:rgba(255,255,255,0.04); cursor:pointer; transition:background .15s; user-select:none; gap:8px; }
.profile-topic-header:hover { background:rgba(255,255,255,0.08); }
.profile-topic-name { font-size:13px; font-weight:600; color:var(--text-primary,#e2e8f0); flex:1; }
.profile-topic-meta { display:flex; align-items:center; gap:6px; flex-shrink:0; }
.profile-topic-count { font-size:10px; color:var(--text-secondary,#94a3b8); background:rgba(255,255,255,0.06); border-radius:10px; padding:1px 7px; }
.profile-topic-arrow { font-size:11px; color:var(--text-secondary,#94a3b8); transition:transform .2s; }
.profile-topic-header.expanded .profile-topic-arrow { transform:rotate(90deg); }
.profile-topic-subtopics { display:none; flex-direction:column; gap:4px; padding:6px 8px 8px; }
.profile-topic-header.expanded + .profile-topic-subtopics { display:flex; }
.profile-subtopic-row { display:flex; align-items:center; gap:8px; padding:5px 8px; border-radius:7px; cursor:pointer; transition:background .12s; }
.profile-subtopic-row:hover { background:rgba(14,165,233,0.08); }
.profile-subtopic-text { font-size:12px; color:var(--text-primary,#e2e8f0); opacity:.85; flex:1; line-height:1.35; }
.profile-subtopic-use-btn { font-size:10px; background:rgba(14,165,233,0.12); border:1px solid rgba(14,165,233,0.25); color:#38bdf8; border-radius:6px; padding:2px 8px; cursor:pointer; flex-shrink:0; white-space:nowrap; opacity:0; transition:opacity .15s; }
.profile-subtopic-row:hover .profile-subtopic-use-btn { opacity:1; }
.profile-subtopic-use-btn:hover { background:rgba(14,165,233,0.25); }

/* ── FRAGEN (QUESTIONS) TAB ──────────────────────────────────── */
.profile-questions-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; flex-wrap:wrap; gap:8px; }
.profile-questions-title { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.07em; color:var(--text-secondary,#94a3b8); opacity:.6; }
.profile-questions-actions { display:flex; gap:6px; }
.profile-questions-action-btn { font-size:11px; background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.1); color:var(--text-primary,#e2e8f0); border-radius:6px; padding:4px 10px; cursor:pointer; transition:all .15s; }
.profile-questions-action-btn:hover { background:rgba(255,255,255,0.12); }
.profile-question-item { display:flex; align-items:flex-start; gap:10px; padding:9px 12px; border-radius:8px; border:1px solid rgba(255,255,255,0.06); background:rgba(255,255,255,0.03); margin-bottom:6px; cursor:pointer; transition:background .12s,border-color .12s; }
.profile-question-item:hover { background:rgba(14,165,233,0.06); border-color:rgba(14,165,233,0.2); }
.profile-question-num { font-size:10px; font-weight:700; color:var(--text-secondary,#94a3b8); min-width:20px; padding-top:1px; opacity:.6; flex-shrink:0; }
.profile-question-text { font-size:12px; color:var(--text-primary,#e2e8f0); line-height:1.5; flex:1; }
.profile-question-use-btn { font-size:10px; background:rgba(14,165,233,0.12); border:1px solid rgba(14,165,233,0.25); color:#38bdf8; border-radius:6px; padding:2px 8px; cursor:pointer; white-space:nowrap; flex-shrink:0; opacity:0; transition:opacity .15s; }
.profile-question-item:hover .profile-question-use-btn { opacity:1; }
.profile-question-use-btn:hover { background:rgba(14,165,233,0.25); }
.profile-questions-link { display:flex; align-items:center; justify-content:center; padding:20px; }
.profile-questions-link a { color:var(--color-primary,#0ea5e9); font-size:13px; text-decoration:none; display:flex; align-items:center; gap:6px; }
.profile-questions-link a:hover { text-decoration:underline; }

/* ── KG TAB ──────────────────────────────────────────────────── */
.profile-kg-panel { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:20px; padding:30px 20px; text-align:center; height:100%; }
.profile-kg-panel p { font-size:13px; color:var(--text-secondary,#94a3b8); max-width:300px; line-height:1.6; }
.profile-kg-btn { display:inline-flex; align-items:center; gap:8px; background:var(--color-primary,#0ea5e9); color:#fff; border:none; border-radius:10px; padding:10px 22px; font-size:13px; font-weight:600; cursor:pointer; transition:all .2s; text-decoration:none; }
.profile-kg-btn:hover { background:#38bdf8; transform:translateY(-1px); }

/* ── ABOUT TAB ───────────────────────────────────────────────── */
.profile-about-bio { font-size:13px; color:var(--text-primary,#e2e8f0); line-height:1.75; white-space:pre-wrap; word-break:break-word; }
.profile-about-opening { font-size:13px; color:#38bdf8; font-style:italic; line-height:1.6; padding:10px 14px; border-left:3px solid rgba(56,189,248,0.4); background:rgba(56,189,248,0.06); border-radius:0 8px 8px 0; }

/* ── RADAR TAB ───────────────────────────────────────────────── */
.profile-radar-wrap { display:flex; flex-direction:column; gap:16px; padding:4px 0; }
.profile-radar-bars { display:flex; flex-direction:column; gap:6px; }
.profile-radar-prop { display:grid; grid-template-columns:110px 1fr 32px; align-items:center; gap:8px; }
.profile-radar-label { font-size:10px; color:var(--text-secondary,#94a3b8); text-align:right; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.profile-radar-bar { height:6px; background:rgba(100,116,139,0.18); border-radius:3px; overflow:hidden; }
.profile-radar-fill { height:100%; background:linear-gradient(90deg,#0ea5e9,#38bdf8); border-radius:3px; transition:width .4s ease; }
.profile-radar-val { font-size:10px; font-weight:700; color:var(--text-secondary,#94a3b8); text-align:right; }
.profile-radar-no-data { display:flex; align-items:center; justify-content:center; height:160px; color:var(--text-secondary,#94a3b8); font-size:12px; opacity:.6; }

/* ── KG EMBEDDED GRAPH ───────────────────────────────────────── */
.profile-kg-graph { width:100%; overflow:hidden; flex:1; min-height:280px; position:relative; }
.profile-kg-graph svg { max-height:260px; }
.profile-kg-actions { display:flex; justify-content:center; padding-top:8px; }

/* KG Interactivity: Subtopic-Chips im Info-Panel */
.kg-sub-chip {
  display: inline-block;
  background: rgba(99,102,241,0.18);
  border: 1px solid rgba(99,102,241,0.35);
  color: #a5b8f0;
  border-radius: 5px;
  padding: 2px 8px;
  font-size: 11px;
  line-height: 1.6;
  cursor: default;
  transition: background .15s;
}
.kg-sub-chip:hover {
  background: rgba(99,102,241,0.35);
  color: #d0dcff;
}

/* ── INTERVIEW MODE ──────────────────────────────────────────── */
.profile-iv-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; flex-wrap:wrap; gap:8px; padding:0 2px; }
.profile-iv-stats { display:flex; gap:10px; align-items:center; }
.profile-iv-count { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:var(--text-secondary,#94a3b8); opacity:.65; }
.profile-iv-progress { font-size:11px; color:#38bdf8; font-weight:600; }
.profile-iv-actions { display:flex; gap:6px; }
.profile-iv-start-btn { font-size:11px; background:linear-gradient(135deg,rgba(16,185,129,.18),rgba(5,150,105,.12)); border:1px solid rgba(16,185,129,.35); color:#6ee7b7; border-radius:6px; padding:4px 11px; cursor:pointer; font-weight:600; transition:all .15s; }
.profile-iv-start-btn:hover { background:rgba(16,185,129,.28); }
.profile-iv-clear-btn { font-size:11px; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1); color:var(--text-secondary,#94a3b8); border-radius:6px; padding:4px 10px; cursor:pointer; transition:all .15s; }
.profile-iv-clear-btn:hover { background:rgba(239,68,68,.12); border-color:rgba(239,68,68,.3); color:#fca5a5; }
.profile-interview-item { border-radius:8px; border:1px solid rgba(255,255,255,.06); background:rgba(255,255,255,.025); margin-bottom:8px; overflow:hidden; transition:border-color .15s; }
.profile-interview-item.answered { border-color:rgba(16,185,129,.25); background:rgba(16,185,129,.03); }
.profile-interview-item-header { display:flex; align-items:flex-start; gap:8px; padding:9px 12px 6px; }
.profile-interview-item:hover { border-color:rgba(14,165,233,.25); }
.profile-question-ask-btn { font-size:10px; background:rgba(14,165,233,.12); border:1px solid rgba(14,165,233,.25); color:#38bdf8; border-radius:5px; padding:2px 8px; cursor:pointer; white-space:nowrap; flex-shrink:0; opacity:0; transition:opacity .15s; margin-left:auto; }
.profile-interview-item:hover .profile-question-ask-btn { opacity:1; }
.profile-question-ask-btn:hover { background:rgba(14,165,233,.25); }
.profile-iv-topic-tag { font-size:10px; color:rgba(148,163,184,.5); padding:0 12px 5px; font-style:italic; }
.profile-interview-answer-wrap { padding:0 10px 10px; }
.profile-interview-answer { width:100%; box-sizing:border-box; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); border-radius:6px; color:var(--text-primary,#e2e8f0); font-size:12px; line-height:1.5; padding:6px 10px; resize:vertical; min-height:52px; font-family:inherit; transition:border-color .15s; outline:none; }
.profile-interview-answer:focus { border-color:rgba(14,165,233,.4); background:rgba(14,165,233,.04); }
.profile-interview-answer::placeholder { color:rgba(148,163,184,.4); }
.profile-iv-answer-meta { display:flex; justify-content:flex-end; margin-top:4px; min-height:14px; }
.profile-iv-saved { font-size:10px; color:#6ee7b7; font-weight:600; }
.profile-iv-unsaved { font-size:10px; color:rgba(148,163,184,.35); }
/* ── AUDIO INTRO BUTTON ──────────────────────────────────────── */
.profile-audio-intro-btn {
  background: linear-gradient(135deg, rgba(251,146,60,.18), rgba(234,88,12,.1));
  border: 1px solid rgba(251,146,60,.35);
  color: #fdba74;
}
.profile-audio-intro-btn:hover {
  background: rgba(251,146,60,.28);
  border-color: rgba(251,146,60,.55);
  color: #fed7aa;
}
.profile-audio-intro-btn[data-playing="1"] {
  background: linear-gradient(135deg, rgba(251,146,60,.3), rgba(234,88,12,.2));
  border-color: rgba(251,146,60,.65);
  color: #fed7aa;
  animation: profile-audio-pulse 1.6s ease-in-out infinite;
}
@keyframes profile-audio-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(251,146,60,.35); }
  50%       { box-shadow: 0 0 0 5px rgba(251,146,60,.0); }
}

/* ── PERSONALIZED AI INFO BUTTON (green) ─────────────────────── */
.profile-pai-btn {
  background: linear-gradient(135deg, rgba(16,185,129,.18), rgba(5,150,105,.1));
  border: 1px solid rgba(16,185,129,.35);
  color: #6ee7b7;
}
.profile-pai-btn:hover {
  background: rgba(16,185,129,.28);
  border-color: rgba(16,185,129,.55);
  color: #a7f3d0;
}

/* ── PERSONALIZED AI INFO MODAL ──────────────────────────────── */
.profile-pai-modal {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  max-height: 72%;
  background: rgba(10,15,30,.97);
  border-top: 1px solid rgba(16,185,129,.25);
  border-radius: 12px 12px 0 0;
  display: flex; flex-direction: column;
  z-index: 10;
  animation: profile-pai-slidein .25s ease;
  overflow: hidden;
}
@keyframes profile-pai-slidein {
  from { transform: translateY(100%); opacity: 0; }
  to   { transform: translateY(0);    opacity: 1; }
}
.profile-pai-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 16px 8px;
  border-bottom: 1px solid rgba(255,255,255,.06);
  flex-shrink: 0;
}
.profile-pai-title {
  font-size: 13px; font-weight: 700;
  color: #6ee7b7;
  display: flex; align-items: center; gap: 6px;
}
.profile-pai-close {
  background: none; border: none;
  color: var(--text-secondary,#94a3b8);
  font-size: 16px; cursor: pointer;
  line-height: 1; padding: 2px 4px; border-radius: 4px;
  transition: color .15s, background .15s;
}
.profile-pai-close:hover { color: #e2e8f0; background: rgba(255,255,255,.08); }
.profile-pai-body {
  overflow-y: auto; padding: 12px 16px 16px;
  display: flex; flex-direction: column; gap: 12px;
}
.profile-pai-section-title {
  font-size: 10px; font-weight: 700; letter-spacing: .08em;
  text-transform: uppercase; color: rgba(148,163,184,.5);
  margin-bottom: 6px;
}
.profile-pai-row {
  display: flex; justify-content: space-between; align-items: center;
  font-size: 12px; padding: 3px 0;
  border-bottom: 1px solid rgba(255,255,255,.04);
}
.profile-pai-row:last-child { border-bottom: none; }
.profile-pai-key { color: var(--text-secondary,#94a3b8); flex-shrink: 0; margin-right: 8px; }
.profile-pai-val { color: var(--text-primary,#e2e8f0); font-weight: 600; text-align: right; word-break: break-all; }
.profile-pai-tags { display: flex; flex-wrap: wrap; gap: 4px; justify-content: flex-end; }
.profile-pai-tag {
  font-size: 10px; background: rgba(14,165,233,.12);
  border: 1px solid rgba(14,165,233,.25); color: #38bdf8;
  border-radius: 4px; padding: 2px 7px;
}

/* ── CHAT TAB: BUTTON ROW & COACHING BUTTON ──────────────────── */
.profile-chat-btn-row {
  display: flex; gap: 10px; justify-content: center; flex-wrap: wrap;
}
.profile-coaching-btn {
  display: inline-flex; align-items: center; gap: 7px;
  background: linear-gradient(135deg, rgba(99,102,241,.2), rgba(67,56,202,.12));
  border: 1px solid rgba(99,102,241,.4);
  color: #a5b4fc;
  border-radius: 10px; padding: 10px 20px;
  font-size: 13px; font-weight: 600; cursor: pointer;
  transition: all .2s;
}
.profile-coaching-btn:hover {
  background: rgba(99,102,241,.3);
  border-color: rgba(99,102,241,.6);
  color: #c7d2fe;
  transform: translateY(-1px);
}
.profile-coaching-hint {
  font-size: 11px; color: rgba(148,163,184,.5);
  line-height: 1.5; max-width: 280px;
  margin: 0 auto; text-align: center;
}

/* ── KG CANVAS ───────────────────────────────────────────────── */
.profile-kg-canvas { width: 100% !important; display: block; }

/* ── INLINE CHAT (Chat-Tab) ──────────────────────────────────── */
/* Chat-Panel braucht flex statt block für die Chat-Layout-Logik */
#profile-panel-chat.active {
  display: flex; flex-direction: column;
  padding: 12px 16px 12px;
}

.profile-inline-chat {
  display: flex; flex-direction: column;
  height: 100%; gap: 0;
  /* Füllt den Tab-Panel (absolute, scrolled via messages) */
}

.profile-chat-messages {
  flex: 1; overflow-y: auto; padding: 8px 4px 8px;
  display: flex; flex-direction: column; gap: 8px;
  min-height: 100px;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.1) transparent;
}
.profile-chat-messages::-webkit-scrollbar { width: 3px; }
.profile-chat-messages::-webkit-scrollbar-thumb { background: rgba(255,255,255,.1); border-radius: 3px; }

.profile-chat-msg {
  max-width: 80%; padding: 9px 13px;
  border-radius: 12px; font-size: 13px; line-height: 1.5;
  word-break: break-word;
}
.profile-chat-msg.user {
  align-self: flex-end;
  background: var(--color-primary, #0ea5e9);
  color: #fff;
  border-bottom-right-radius: 4px;
  white-space: pre-wrap;
}
.profile-chat-msg.bot {
  align-self: flex-start;
  background: rgba(255,255,255,.08);
  color: var(--text-primary, #e2e8f0);
  border: 1px solid rgba(255,255,255,.08);
  border-bottom-left-radius: 4px;
  white-space: normal;
}

/* ── Markdown-Rendering in Bot-Bubbles ── */
.profile-chat-msg.bot strong { font-weight: 700; color: #f1f5f9; }
.profile-chat-msg.bot em { font-style: italic; opacity: .85; }
.profile-md-code {
  font-family: 'Fira Code', 'Cascadia Code', monospace;
  font-size: 11.5px; background: rgba(0,0,0,.35);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 4px; padding: 1px 5px; color: #93c5fd;
}
.profile-md-h1, .profile-md-h2, .profile-md-h3 {
  margin: 6px 0 3px; font-weight: 700; line-height: 1.3;
  color: #f1f5f9;
}
.profile-md-h1 { font-size: 15px; }
.profile-md-h2 { font-size: 14px; }
.profile-md-h3 { font-size: 13px; letter-spacing: .01em; opacity: .9; }
.profile-md-list {
  margin: 4px 0 4px 18px; padding: 0;
  display: flex; flex-direction: column; gap: 2px;
}
.profile-md-list li { list-style: inherit; line-height: 1.45; }
.profile-md-bq {
  border-left: 3px solid rgba(14,165,233,.5);
  margin: 4px 0; padding: 4px 10px;
  color: rgba(226,232,240,.7); font-style: italic;
  background: rgba(14,165,233,.06); border-radius: 0 4px 4px 0;
}
.profile-chat-typing { opacity: .55; font-style: italic; }

/* Action-Nachricht mit Bestätigungs-Button */
.profile-chat-action-msg {
  display: flex; flex-direction: column; gap: 10px;
  max-width: 88%;
}
.profile-chat-action-btn {
  align-self: flex-start;
  background: linear-gradient(135deg, rgba(139,92,246,.35), rgba(99,102,241,.35));
  border: 1px solid rgba(139,92,246,.55);
  color: #c4b5fd; border-radius: 8px;
  padding: 7px 16px; font-size: 12px; font-weight: 600;
  cursor: pointer; transition: background .15s, transform .1s;
  white-space: nowrap;
}
.profile-chat-action-btn:hover:not(:disabled) {
  background: linear-gradient(135deg, rgba(139,92,246,.5), rgba(99,102,241,.5));
  transform: translateY(-1px);
}
.profile-chat-action-btn:disabled { opacity: .45; cursor: default; transform: none; }
.profile-chat-action-resolved .profile-chat-action-btn { display: none; }

.profile-chat-input-row {
  display: flex; gap: 8px; align-items: flex-end;
  padding: 8px 0 6px;
  border-top: 1px solid rgba(255,255,255,.07);
}
.profile-chat-input {
  flex: 1; resize: none; min-height: 38px; max-height: 96px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 10px; padding: 9px 13px;
  font-size: 13px; color: var(--text-primary, #e2e8f0);
  font-family: inherit; line-height: 1.45;
  transition: border-color .15s;
}
.profile-chat-input:focus {
  outline: none;
  border-color: rgba(14,165,233,.5);
  background: rgba(255,255,255,.09);
}
.profile-chat-input::placeholder { color: rgba(148,163,184,.5); }
.profile-chat-input:disabled { opacity: .45; }

.profile-chat-send-btn {
  flex-shrink: 0; width: 38px; height: 38px;
  background: var(--color-primary, #0ea5e9);
  border: none; border-radius: 10px;
  color: #fff; font-size: 16px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all .15s;
  line-height: 1;
}
.profile-chat-send-btn:hover { background: #38bdf8; transform: translateY(-1px); }
.profile-chat-send-btn:disabled { opacity: .4; cursor: not-allowed; transform: none; }

.profile-chat-footer-row {
  display: flex; gap: 8px; flex-wrap: wrap;
  padding: 6px 0 0;
}
.profile-chat-footer-row .profile-coaching-btn,
.profile-chat-footer-row .profile-action-btn,
.profile-chat-footer-row .profile-chat-open-ext-btn {
  flex: 1; min-width: 80px;
  padding: 8px 10px; font-size: 12px; border-radius: 9px;
  display: inline-flex; align-items: center; justify-content: center; gap: 5px;
}
.profile-chat-open-ext-btn {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  color: var(--text-secondary, #94a3b8);
  cursor: pointer; transition: all .15s;
}
.profile-chat-open-ext-btn:hover { background: rgba(255,255,255,.1); color: #e2e8f0; }

/* Voice section in Info tab */
.profile-voice-info-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 8px;
}

/* ── PD-FLAG TOGGLE (Hero-Aktionsbereich) ──────────────────── */
.profile-pd-toggle {
  display: inline-flex; align-items: center; gap: 7px;
  cursor: pointer; user-select: none;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 9px; padding: 7px 12px;
  font-size: 12px; font-weight: 600;
  color: var(--text-secondary, #94a3b8);
  transition: all .15s;
  white-space: nowrap;
}
.profile-pd-toggle:hover { background: rgba(255,255,255,.11); color: #e2e8f0; }
.profile-pd-toggle input[type="checkbox"] { display: none; }

.profile-pd-toggle-track {
  display: inline-block; width: 28px; height: 16px;
  background: rgba(255,255,255,.15);
  border-radius: 8px; position: relative;
  flex-shrink: 0; transition: background .2s;
}
.profile-pd-toggle-track::after {
  content: ''; position: absolute;
  top: 2px; left: 2px;
  width: 12px; height: 12px;
  border-radius: 50%;
  background: #fff; opacity: .7;
  transition: transform .2s, opacity .2s;
}
.profile-pd-toggle input:checked ~ .profile-pd-toggle-track {
  background: var(--color-primary, #0ea5e9);
}
.profile-pd-toggle input:checked ~ .profile-pd-toggle-track::after {
  transform: translateX(12px); opacity: 1;
}
.profile-pd-toggle input:checked ~ .profile-pd-toggle-label-text {
  color: #38bdf8;
}

/* Voice-Button im Chat-Footer (größer als normaler action-btn) */
.profile-voice-footer-btn {
  background: linear-gradient(135deg, rgba(99,102,241,.18), rgba(139,92,246,.12));
  border: 1px solid rgba(139,92,246,.35); color: #c4b5fd;
}
.profile-voice-footer-btn:hover {
  background: rgba(139,92,246,.28); border-color: rgba(139,92,246,.55); color: #ddd6fe;
}

/* ── VOICE SESSION BANNER (Profil-Fenster) ──────────────────── */
.profile-voice-banner {
  display: flex; align-items: center; justify-content: space-between;
  gap: 10px; padding: 8px 14px;
  background: rgba(234,179,8,.13);
  border-bottom: 1px solid rgba(234,179,8,.28);
  border-radius: 0; font-size: 12px;
  color: rgba(234,179,8,1); flex-shrink: 0;
  animation: profile-voice-fadein .2s ease;
}
@keyframes profile-voice-fadein { from { opacity:0; transform:translateY(-4px); } to { opacity:1; transform:none; } }
.profile-voice-banner-stop {
  background: rgba(234,179,8,.2); border: 1px solid rgba(234,179,8,.4);
  color: inherit; border-radius: 5px; padding: 2px 10px;
  font-size: 11px; cursor: pointer; flex-shrink: 0;
  transition: background .15s;
}
.profile-voice-banner-stop:hover { background: rgba(234,179,8,.35); }

/* ── VOICE BUTTON ZUSTANDSKLASSEN (Puls-Animationen) ─────────── */
@keyframes voicePulseListening {
  0%, 100% { box-shadow: 0 0 0 0 rgba(139,92,246,.6); }
  50%       { box-shadow: 0 0 0 8px rgba(139,92,246,0); }
}
@keyframes voicePulseSpeaking {
  0%, 100% { box-shadow: 0 0 0 0 rgba(234,179,8,.7); }
  50%       { box-shadow: 0 0 0 8px rgba(234,179,8,0); }
}
@keyframes voicePulseConnecting {
  0%, 100% { opacity: 1; }
  50%       { opacity: .5; }
}

.profile-voice-footer-btn.profile-voice-listening {
  background: rgba(139,92,246,.25) !important;
  border-color: rgba(139,92,246,.6) !important;
  color: #c4b5fd !important;
  animation: voicePulseListening 1.2s ease-in-out infinite;
}
.profile-voice-footer-btn.profile-voice-speaking {
  background: rgba(234,179,8,.2) !important;
  border-color: rgba(234,179,8,.55) !important;
  color: rgba(234,179,8,1) !important;
  animation: voicePulseSpeaking 0.9s ease-in-out infinite;
}
.profile-voice-footer-btn.profile-voice-connecting {
  animation: voicePulseConnecting 0.7s ease-in-out infinite;
  opacity: .75;
}

/* ── CHAT MODELL-BADGE ──────────────────────────────────────── */
.profile-chat-model-badge {
  font-size: 10px;
  color: rgba(148,163,184,.5);
  padding: 2px 6px;
  border-radius: 4px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.06);
  white-space: nowrap;
  margin-left: auto;
  cursor: default;
  user-select: none;
}
/* ── INTERVIEW-TAB-BADGE ────────────────────────────────────── */
.profile-iv-tab-badge {
  display: none;
  align-items: center; justify-content: center;
  min-width: 18px; height: 16px;
  padding: 0 4px;
  margin-left: 5px;
  background: rgba(234,179,8,.25);
  border: 1px solid rgba(234,179,8,.45);
  border-radius: 8px;
  font-size: 9px; font-weight: 700;
  color: rgba(234,179,8,.9);
  line-height: 1;
  vertical-align: middle;
}
.profile-iv-tab-badge--done {
  background: rgba(74,222,128,.2);
  border-color: rgba(74,222,128,.45);
  color: #4ade80;
}

/* ── FRAGENGENERIERUNG-BUTTON ───────────────────────────────── */
.profile-gen-questions-btn {
  margin-top: 4px;
  padding: 8px 18px;
  font-size: 13px; border-radius: 10px;
  background: linear-gradient(135deg, rgba(168,85,247,.2), rgba(99,102,241,.2));
  border: 1px solid rgba(168,85,247,.4);
  color: #c4b5fd; cursor: pointer;
  transition: all .2s;
}
.profile-gen-questions-btn:hover {
  background: linear-gradient(135deg, rgba(168,85,247,.32), rgba(99,102,241,.32));
  border-color: rgba(168,85,247,.65);
  color: #ddd6fe;
}
.profile-gen-questions-btn:active { transform: scale(.97); }
.profile-interview-item[data-ai-generated] .profile-iv-topic-tag::after {
  content: ' · ✨ KI-generiert';
  opacity: .5;
  font-size: 10px;
}
.profile-chat-cancel-btn {
  flex-shrink: 0; width: 38px; height: 38px;
  background: rgba(239,68,68,.15);
  border: 1px solid rgba(239,68,68,.35);
  border-radius: 10px;
  color: #f87171; font-size: 14px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all .15s;
}
.profile-chat-cancel-btn:hover {
  background: rgba(239,68,68,.25);
  border-color: rgba(239,68,68,.6);
}

/* ── CHAT RETRY-MSG ─────────────────────────────────────────── */
.profile-chat-retry-msg {
  display: flex; align-items: center; gap: 8px;
  font-size: 12px; color: rgba(148,163,184,.7);
  align-self: flex-start;
  max-width: 88%;
}
.profile-chat-retry-btn {
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 6px;
  color: #94a3b8; font-size: 11px;
  padding: 3px 9px; cursor: pointer;
  transition: all .15s; white-space: nowrap;
}
.profile-chat-retry-btn:hover { background: rgba(255,255,255,.14); color: #e2e8f0; }

/* ── CHAT EXPORT-BUTTON ─────────────────────────────────────── */
.profile-chat-export-btn {
  flex: 1; min-width: 80px;
  padding: 8px 10px; font-size: 11px; border-radius: 9px;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.1);
  color: rgba(148,163,184,.75);
  cursor: pointer; transition: all .15s;
  display: inline-flex; align-items: center; justify-content: center; gap: 4px;
}
.profile-chat-export-btn:hover { background: rgba(255,255,255,.1); color: #e2e8f0; }

/* ── BOT-NACHRICHTEN: Markdown whitespace fix ───────────────── */
.profile-chat-msg.bot { white-space: normal; }

/* ── MARKDOWN-RENDERING in Bot-Nachrichten ──────────────────── */
.profile-md-list {
  margin: 6px 0 4px 14px;
  padding: 0;
  list-style: disc;
  font-size: 13px;
  line-height: 1.6;
}
.profile-md-list li { margin-bottom: 3px; }
.profile-md-code {
  background: rgba(255,255,255,.09);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 4px;
  padding: 1px 5px;
  font-family: 'Fira Code', 'Consolas', monospace;
  font-size: 12px;
}

/* ── LAST-CHAT BADGE (Roster-Karte) ─────────────────────────────── */
.roster-last-chat-badge {
  font-size: 9px;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 10px;
  background: rgba(56, 189, 248, .15);
  border: 1px solid rgba(56, 189, 248, .3);
  color: #38bdf8;
  white-space: nowrap;
  letter-spacing: .03em;
}

/* ── DOMAIN CHIPS (Roster-Karte) ─────────────────────────────────── */
.roster-item-domains,
.roster-domain-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
  justify-content: center;
  margin: 3px 0 2px;
}
.roster-domain-chip {
  font-size: 9px;
  padding: 2px 7px;
  border-radius: 8px;
  background: rgba(148, 163, 184, .1);
  border: 1px solid rgba(148, 163, 184, .18);
  color: rgba(148, 163, 184, .8);
  white-space: nowrap;
}

/* ── QUOTE-KARTE (Profil Info-Tab) ───────────────────────────────── */
.profile-quote-card {
  position: relative;
  margin-bottom: 14px;
  padding: 14px 18px 14px 22px;
  background: rgba(56, 189, 248, .06);
  border: 1px solid rgba(56, 189, 248, .2);
  border-left: 3px solid rgba(56, 189, 248, .5);
  border-radius: 0 10px 10px 0;
}
.profile-quote-mark {
  position: absolute;
  top: 8px;
  left: 8px;
  font-size: 28px;
  color: rgba(56, 189, 248, .35);
  line-height: 1;
  font-family: Georgia, serif;
}
.profile-quote-text {
  font-size: 13px;
  font-style: italic;
  color: var(--text-primary, #e2e8f0);
  line-height: 1.65;
  padding-left: 10px;
}
.profile-quote-attribution {
  margin-top: 6px;
  font-size: 10px;
  color: rgba(148, 163, 184, .6);
  padding-left: 10px;
  text-align: right;
}

/* ── KATEGORIE-CHIPS im Profil → Roster-Filter ───────────────────── */
.profile-cat-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.profile-cat-chip {
  font-size: 11px;
  padding: 4px 12px;
  border-radius: 16px;
  background: rgba(99, 102, 241, .12);
  border: 1px solid rgba(99, 102, 241, .3);
  color: #a5b4fc;
  cursor: pointer;
  transition: all .15s;
}
.profile-cat-chip:hover {
  background: rgba(99, 102, 241, .22);
  border-color: rgba(99, 102, 241, .5);
  color: #c7d2fe;
}
.profile-cat-chip:active {
  transform: scale(.96);
}

/* ── INTERVIEW FORTSCHRITTSBALKEN ────────────────────────────────── */
.profile-iv-bar-wrap {
  flex: 1;
  min-width: 80px;
  height: 5px;
  background: rgba(100, 116, 139, .18);
  border-radius: 3px;
  overflow: hidden;
  align-self: center;
  margin-left: 8px;
}
.profile-iv-bar-fill {
  height: 100%;
  background: linear-gradient(90deg, #0ea5e9, #38bdf8);
  border-radius: 3px;
  transition: width .5s ease;
}