:root{--salary-navy:#17365d;--salary-blue:#2f75b5;--salary-green:#70ad47;--salary-red:#c62828;--salary-bg:#f0f2f5;--salary-card:#fff;--salary-text:#1f2733;--salary-muted:#6b7785;--salary-radius:16px}
*{box-sizing:border-box}body{margin:0;background:var(--salary-bg);color:var(--salary-text);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;line-height:1.4;padding-bottom:calc(78px + env(safe-area-inset-bottom,0px))}
.salary-header{background:linear-gradient(135deg,#17365d,#2f75b5);color:#fff;padding:calc(16px + env(safe-area-inset-top,0px)) 18px 30px;border-radius:0 0 24px 24px}.salary-header-inner{max-width:760px;margin:auto}.back-link{color:#fff;text-decoration:none;font-size:.82rem;opacity:.9}.header-row{display:flex;justify-content:space-between;align-items:end;gap:14px;margin-top:14px}.salary-header h1{font-size:1.45rem;margin:2px 0 3px}.salary-header p{margin:0;opacity:.85;font-size:.88rem}.eyebrow{font-size:.67rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.eyebrow.light{opacity:.72}.period-select{display:grid;gap:4px;font-size:.68rem;font-weight:700}.period-select select{min-width:130px;border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.14);color:#fff;border-radius:10px;padding:8px 10px;font:inherit}.period-select option{color:#111}
.salary-main{max-width:760px;margin:auto;padding:16px 14px}.month-card{background:var(--salary-card);border-radius:var(--salary-radius);padding:19px 17px;margin-top:-32px;box-shadow:0 7px 24px rgba(23,54,93,.14);position:relative;z-index:2}.month-card .label,.kpi-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.04em;color:var(--salary-muted);font-weight:700}.netto{font-size:2.15rem;font-weight:850;color:var(--salary-navy);margin:2px 0}.source-note{font-size:.7rem;color:var(--salary-muted);margin-bottom:12px}.diff-row{display:flex;gap:10px}.diff{flex:1;min-width:0;background:#f7f9fc;border-radius:11px;padding:10px 12px}.diff .val{font-weight:750;font-size:.9rem}.diff .sub{font-size:.68rem;color:var(--salary-muted);margin-top:2px}.up{color:#2e7d32}.down{color:var(--salary-red)}.progress-box{margin-top:14px;background:#eef2f6;border-radius:99px;height:8px;overflow:hidden}.progress-bar{height:100%;background:linear-gradient(90deg,var(--salary-green),#8bc34a);border-radius:99px;width:0}.progress-text{font-size:.7rem;color:var(--salary-muted);margin-top:6px}
.kpi-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0}.kpi,.salary-card{background:var(--salary-card);border-radius:14px;box-shadow:0 1px 5px rgba(0,0,0,.06)}.kpi{padding:14px 12px}.kpi-value{font-size:1.22rem;font-weight:750;color:var(--salary-navy);margin-top:3px}.kpi-note{font-size:.68rem;color:var(--salary-muted);margin-top:2px}.salary-card{padding:16px;margin-bottom:14px}.salary-card h2{font-size:.94rem;color:var(--salary-navy);margin:0 0 12px;font-weight:750}.projection{display:flex;justify-content:space-between;align-items:center;gap:12px}.projection-item{flex:1;text-align:center}.projection-value{font-size:1.12rem;font-weight:750;color:var(--salary-navy)}.projection-label{font-size:.7rem;color:var(--salary-muted);margin-top:2px}.projection-arrow{font-size:1.3rem;color:var(--salary-muted)}.projection-note,.card-footnote{font-size:.73rem;color:var(--salary-muted);margin:12px 0 0;text-align:center}.chart-box{height:210px;position:relative}.chart-box.small{height:165px}.chart-empty{position:absolute;inset:0;display:grid;place-items:center;color:var(--salary-muted);font-size:.78rem;text-align:center;padding:20px}.deduction-list{list-style:none;padding:0;margin:0}.deduction-list li{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid #eef1f5}.deduction-list li:last-child{border-bottom:0}.deduction-name{font-size:.86rem}.deduction-right{text-align:right}.deduction-amount{font-weight:750;font-size:.9rem}.deduction-pct{font-size:.68rem;color:var(--salary-muted)}.insights{display:grid;gap:8px}.insight{background:#f8fafc;border-left:4px solid var(--salary-blue);border-radius:0 10px 10px 0;padding:11px 13px;font-size:.83rem}.insight.warn{border-left-color:#d97706}.insight.good{border-left-color:#2e7d32}.more-links a{display:flex;justify-content:space-between;color:var(--salary-navy);text-decoration:none;padding:10px 0;border-bottom:1px solid #eef1f5;font-size:.84rem;font-weight:650}.more-links a:last-child{border-bottom:0}.empty{text-align:center;margin-top:-25px;position:relative;z-index:2}.empty-actions{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}.empty-actions a{padding:9px 12px;border-radius:10px;background:#17365d;color:#fff;text-decoration:none;font-size:.8rem}
html[data-theme="dark"]{--salary-bg:#0f1117;--salary-card:#1b202b;--salary-text:#f3f6fa;--salary-muted:#aab4c3;--salary-navy:#91bff0}html[data-theme="dark"] .diff,html[data-theme="dark"] .insight{background:#222936}html[data-theme="dark"] .progress-box{background:#303845}html[data-theme="dark"] .deduction-list li,html[data-theme="dark"] .more-links a{border-color:#303845}
@media(max-width:520px){.salary-main{padding-left:12px;padding-right:12px}.header-row{align-items:flex-start;flex-direction:column}.period-select{width:100%}.period-select select{width:100%}.netto{font-size:1.95rem}.kpi-value{font-size:1.12rem}.salary-card{padding:15px}.diff .val{font-size:.82rem}}
@media(max-width:360px){.kpi-grid{grid-template-columns:1fr}.diff-row{flex-direction:column}}


/* SETO 1.1.68 – belastbarer Dark-Mode-Kontrast, auch bei System-Darkmode */
html[data-theme="dark"] .salary-card,
html[data-theme="dark"] .month-card,
html[data-theme="dark"] .kpi{
  color:var(--salary-text);
}
html[data-theme="dark"] .salary-card h2,
html[data-theme="dark"] .kpi-value,
html[data-theme="dark"] .projection-value,
html[data-theme="dark"] .netto,
html[data-theme="dark"] .more-links a{
  color:#dcecff;
}
html[data-theme="dark"] .month-card .label,
html[data-theme="dark"] .kpi-label,
html[data-theme="dark"] .source-note,
html[data-theme="dark"] .diff .sub,
html[data-theme="dark"] .progress-text,
html[data-theme="dark"] .kpi-note,
html[data-theme="dark"] .projection-label,
html[data-theme="dark"] .projection-note,
html[data-theme="dark"] .card-footnote,
html[data-theme="dark"] .deduction-pct,
html[data-theme="dark"] .chart-empty{
  color:#c3ccd9;
}
html[data-theme="dark"] .deduction-name,
html[data-theme="dark"] .deduction-amount,
html[data-theme="dark"] .insight{
  color:#f3f6fa;
}
@media (prefers-color-scheme:dark){
  html:not([data-theme="light"]){
    --salary-bg:#0f1117;
    --salary-card:#1b202b;
    --salary-text:#f3f6fa;
    --salary-muted:#c3ccd9;
    --salary-navy:#dcecff;
  }
  html:not([data-theme="light"]) .diff,
  html:not([data-theme="light"]) .insight{background:#222936}
  html:not([data-theme="light"]) .progress-box{background:#303845}
  html:not([data-theme="light"]) .deduction-list li,
  html:not([data-theme="light"]) .more-links a{border-color:#303845}
  html:not([data-theme="light"]) .salary-card h2,
  html:not([data-theme="light"]) .kpi-value,
  html:not([data-theme="light"]) .projection-value,
  html:not([data-theme="light"]) .netto,
  html:not([data-theme="light"]) .more-links a{color:#dcecff}
  html:not([data-theme="light"]) .month-card .label,
  html:not([data-theme="light"]) .kpi-label,
  html:not([data-theme="light"]) .source-note,
  html:not([data-theme="light"]) .diff .sub,
  html:not([data-theme="light"]) .progress-text,
  html:not([data-theme="light"]) .kpi-note,
  html:not([data-theme="light"]) .projection-label,
  html:not([data-theme="light"]) .projection-note,
  html:not([data-theme="light"]) .card-footnote,
  html:not([data-theme="light"]) .deduction-pct,
  html:not([data-theme="light"]) .chart-empty{color:#c3ccd9}
}

/* SETO 1.1.69 – Arbeitsstunden als eigene Dashboard-Kennzahl */
.kpi-hours{grid-column:1 / -1}
.kpi-hours .kpi-value{font-size:1.45rem}

/* SETO 1.1.77 – Lohn-Dashboard als Start-/Analyse-Hub */
.salary-analysis-nav{width:min(980px,calc(100% - 28px));margin:14px auto 0;display:flex;gap:8px;overflow-x:auto;padding:4px 0 8px;scrollbar-width:none}
.salary-analysis-nav::-webkit-scrollbar{display:none}
.salary-analysis-nav a{flex:0 0 auto;text-decoration:none;padding:9px 12px;border-radius:12px;border:1px solid var(--border,#d8dee8);background:var(--card,#fff);color:var(--text,#172033);font-size:12px;font-weight:750;box-shadow:0 5px 14px rgba(15,23,42,.04)}
.salary-analysis-nav a.active{background:#17365D;color:#fff;border-color:#17365D}
@media (prefers-color-scheme:dark){.salary-analysis-nav a{background:#1b2432;color:#f3f6fa;border-color:#344154}.salary-analysis-nav a.active{background:#315f91;border-color:#4877a9}}
:root[data-theme="dark"] .salary-analysis-nav a{background:#1b2432;color:#f3f6fa;border-color:#344154}
:root[data-theme="dark"] .salary-analysis-nav a.active{background:#315f91;border-color:#4877a9}
