:root { color-scheme:light;--bg:#f5f6f8;--surface:#fff;--ink:#232a35;--muted:#6b7280;--green:#375a83;--line:#e0e4ea;--soft:#edf0f5;--accent:#dce6f2;--button-ink:#fff;--input:#fafbfc;--nav:#eaf0f7;--nav-ink:#375a83;--brand:#34465d; }
html[data-theme="dark"] { color-scheme:dark;--bg:#14161b;--surface:#1e2128;--ink:#e6e8ed;--muted:#a6acb8;--green:#94b4da;--line:#343944;--soft:#292e38;--accent:#36465d;--button-ink:#152134;--input:#191c22;--nav:#2c3645;--nav-ink:#c0d2e9;--brand:#3c4b60; }
.theme-toggle { position:absolute;top:20px;right:24px;z-index:5;min-height:36px;padding:8px 13px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);font-size:12px;font-weight:600; }
.private-label { margin-right:125px; }
.private-label>span,.brand-dot { color:var(--muted); }
.sidebar,.job-card,.search-panel,.filter-button,.secondary,.skip-link { background:var(--surface);color:var(--ink); }
.topbar { background:var(--bg); }
.primary,.filter-button.active { background:var(--green);color:var(--button-ink);border-color:var(--green); }
.primary:hover { filter:brightness(1.08);background:var(--green); }
.nav-item { color:var(--muted); }
.nav-item.active { background:var(--nav);color:var(--nav-ink); }
.nav-count { background:var(--soft);color:var(--nav-ink); }
.sidebar-caption { color:var(--muted); }
.brand-mark,.login-intro .brand-mark { background:var(--brand);color:#fff; }
.brand-mark>span { color:#c8d8ea; }
.field input,.field select,.login-form input,.note-input { background:var(--input);color:var(--ink);border-color:var(--line); }
.source-badge,.saved-indicator { background:var(--soft);border-color:var(--line);color:var(--muted); }
.company-avatar { position:relative;overflow:hidden;background:var(--soft);color:var(--muted); }
.company-avatar img { display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:4px;opacity:0; }
.company-avatar.has-logo { background:#fff;border:1px solid #e0e4ea; }
.company-avatar.has-logo img { opacity:1; }
.company-avatar.has-logo>span { visibility:hidden; }
.manual-panel { margin-bottom:24px; }
.manual-panel h2 { font-size:17px;margin:0 0 20px; }
.manual-panel .manual-form { display:grid;grid-template-columns:1fr 1fr;gap:16px; }
.manual-panel .manual-form .field { grid-column:auto; }
.manual-panel .manual-form .full { grid-column:1/-1; }
.manual-form textarea { display:block;width:100%;min-height:80px;padding:12px;border:1px solid var(--line);border-radius:7px;background:var(--input);color:var(--ink);resize:vertical;line-height:1.6; }
.manual-form .manual-actions { display:flex;justify-content:flex-end;gap:10px; }
.manual-panel .manual-actions .primary { grid-column:auto; }
.manual-tag { font-size:10px;color:var(--muted);border:1px solid var(--line);padding:3px 6px;border-radius:4px; }
#add-job { white-space:nowrap; }
@media(max-width:760px) { .page-heading { flex-wrap:wrap;gap:12px; } #add-job { margin-bottom:8px; } }
.company-name,.job-facts,.job-publication,.job-ref,.page-footer { color:var(--muted); }
.card-footer { border-color:var(--line); }
.note-editor { background:var(--bg); }
.loading-dot { background:var(--green); }
.status-select { background:var(--soft);color:var(--ink);border-color:var(--line); }
.status-select[data-status="Angefragt"] { color:#79602a;background:#faf5e8;border-color:#e8dcbf; }
.status-select[data-status="Gemerkt"] { color:#405c80;background:#eef3fa;border-color:#d8e2f0; }
.status-select[data-status="Beworben"] { color:#3d6751;background:#edf5ef;border-color:#c9dfd0; }
.status-select[data-status="Absage"] { color:#956361;background:#faf0ed;border-color:#eddbd4; }
.message.empty { background:var(--surface);color:var(--muted);border-color:var(--line); }
.toast { background:var(--green);color:var(--button-ink); }
.login-intro { background:#293649; }
.login-intro p { color:#c1c9d5; }
:is(button,a,input,select,textarea):focus-visible { outline-color:#809fc5; }
html[data-theme="dark"] .status-select[data-status="Angefragt"] { color:#ebd79d;background:#383225;border-color:#5c5038; }
html[data-theme="dark"] .status-select[data-status="Gemerkt"] { color:#bed1ed;background:#283446;border-color:#435873; }
html[data-theme="dark"] .status-select[data-status="Beworben"] { color:#bfdcc8;background:#29382f;border-color:#496652; }
html[data-theme="dark"] .status-select[data-status="Absage"] { color:#e9bcb4;background:#402d2d;border-color:#654448; }
html[data-theme="dark"] .message,html[data-theme="dark"] .demo-banner { background:#393122;border-color:#655734;color:#ecdbaf; }
html[data-theme="dark"] .message.empty { background:var(--surface);color:var(--muted);border-color:var(--line); }
html[data-theme="dark"] .demo-banner strong,html[data-theme="dark"] .demo-link { color:#edcf8e; }
html[data-theme="dark"] .demo-banner button { background:var(--surface);border-color:#7b6b42;color:#ebdcae; }
html[data-theme="dark"] .error-text { color:#f0b0a4!important; }
html[data-theme="dark"] .login-intro { background:#202631; }
@media(min-width:761px) { .page-footer { display:none; } }
@media(max-width:760px) { .theme-toggle { top:17px;right:20px;font-size:11px;padding:7px 11px; } }
.brand-logo { display:block;flex-shrink:0;width:70px;height:70px; }
.brand-logo.small { width:37px;height:37px; }
.brand { font-size:27px;letter-spacing:-1px; }
.login-intro .brand-logo { margin-bottom:40px; }
.sidebar { z-index:6; }
@media(max-width:760px) {
  .sidebar { position:sticky;top:-70px; }
  .login-intro .brand-logo { width:48px;height:48px;margin-bottom:20px; }
  .brand { font-size:25px; }
}

/* Menü und kompakte Suche */
.account-menu { position:fixed;top:18px;right:20px;z-index:30; }
.menu-toggle { display:grid;place-items:center;width:40px;height:40px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink); }
.account-panel { position:absolute;right:0;top:48px;min-width:185px;padding:6px;background:var(--surface);border:1px solid var(--line);border-radius:10px;box-shadow:0 8px 25px #0002; }
.account-panel button { display:block;width:100%;min-height:44px;padding:10px 12px;border:0;border-radius:6px;text-align:left;background:transparent;color:var(--ink);font-size:13px; }
.account-panel button:hover { background:var(--soft); }
.search-toolbar { display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:16px; }
.sort-control { display:flex;align-items:center;gap:10px;font-size:12px;color:var(--muted); }
.sort-control select { max-width:100%;min-height:40px;padding:8px 10px;border:1px solid var(--line);border-radius:7px;background:var(--surface);color:var(--ink);font-size:12px; }
@media(max-width:760px) {
  .account-menu { top:14px;right:14px; }
  .sidebar .brand { padding-right:45px; }
  .sidebar .main-nav { padding-right:42px;gap:4px; }
  .sidebar .nav-item { gap:5px;padding-left:4px;padding-right:4px; }
  .sidebar .nav-item>span:first-child { display:none; }
  .account-menu:has(~ #app-view:not([hidden])) { top:4px; }
  .sort-control { flex-wrap:wrap;gap:6px; }
}

/* Ruhige Statusfarben auf der gesamten Stellenkarte */
.job-card { --card-tint:var(--surface);--card-edge:var(--line);background:var(--card-tint);border-color:var(--card-edge);border-left-width:4px; }
.job-card[data-status="Offen"] { --card-tint:#f9fafb;--card-edge:#dce1e8; }
.job-card[data-status="Angefragt"] { --card-tint:#faf6e9;--card-edge:#dfd2a9; }
.job-card[data-status="Gemerkt"] { --card-tint:#eff4fa;--card-edge:#c5d5e7; }
.job-card[data-status="Beworben"] { --card-tint:#edf5ef;--card-edge:#c4dccc; }
.job-card[data-status="Absage"] { --card-tint:#faf0ee;--card-edge:#e5c9c3; }
.job-card .note-editor { background:var(--card-tint); }
.job-card .card-footer,.job-card .note-editor { border-color:var(--card-edge); }
.job-card .remove-job { color:var(--muted); }
html[data-theme="dark"] .job-card[data-status="Offen"] { --card-tint:#20232a;--card-edge:#3b414c; }
html[data-theme="dark"] .job-card[data-status="Angefragt"] { --card-tint:#2d2a23;--card-edge:#61563c; }
html[data-theme="dark"] .job-card[data-status="Gemerkt"] { --card-tint:#242d39;--card-edge:#455c78; }
html[data-theme="dark"] .job-card[data-status="Beworben"] { --card-tint:#26322b;--card-edge:#48634f; }
html[data-theme="dark"] .job-card[data-status="Absage"] { --card-tint:#322727;--card-edge:#6b4b47; }

.job-comment { margin:0 23px 18px;padding:13px 15px;border:1px solid var(--card-edge);border-radius:8px;background:var(--surface); }
.job-comment strong { display:block;font-size:10px;font-weight:650;color:var(--muted);margin-bottom:7px; }
.job-comment p { margin:0;font-size:12px;line-height:1.7;white-space:pre-wrap;overflow-wrap:anywhere;color:var(--ink); }
@media(max-width:760px) { .job-comment { margin:0 17px 16px;padding:12px; } }

.ui-icon { flex-shrink:0;display:block; }
.note-autosave-hint { margin:8px 0 0;font-size:11px;line-height:1.5;color:var(--muted); }
.note-help .note-done { min-height:36px;padding:7px 12px;font-size:12px; }
@media(max-width:760px) {
  .note-input,.manual-form textarea,.field input,.field select,.login-form input { font-size:16px; }
  .note-help { gap:8px; }
}
.password-toggle { display:block;margin:6px 0 0 auto;min-height:36px; }
.account-panel #theme-toggle { display:flex;align-items:center;gap:10px; }
.account-panel #theme-toggle svg { flex-shrink:0; }
.account-panel #logout { color:#a84742;border-top:1px solid var(--line);border-radius:0 0 5px 5px;margin-top:4px; }
html[data-theme="dark"] .account-panel #logout { color:#e9a39b; }