/* 6xiBrand Corporate Design – gilt für Finanzen (index.html) und Projekte (projekte.html).
   Schriften aus dem Adobe-Fonts-Kit der Website (jql6wfi): Überschriften all-round-gothic, Text aptos (Ersatz museo-sans/Inter).
   Farben: Mint #78e0c0 / #56aa90 / #3f8f75 · Coral #ffa07a / #fb7647 / #d9734f · Plum #d9b8f5 / #be9dde / #8f7aa3
   Neutral: #1c1b1a · #4b4846 · #6d6a67 · #85837f · #b8b3ac · #fdf6ee · #fff
   Große Buttons metallisch (Pill mit Metallrahmen + Farbschein), kleine Buttons und Karten aus Glas. */
:root{
  --cd-mint:#78e0c0;--cd-mint2:#56aa90;--cd-mint3:#3f8f75;--cd-coral:#fb7647;--cd-coral2:#d9734f;--cd-plum:#be9dde;--cd-plum2:#8f7aa3;
  --cd-schwarz:#1c1b1a;--cd-creme:#fdf6ee;
  --bg:#e9e7e3;--panel:#f8f6f2;--soft:#efece7;--soft2:#f3f0eb;--line:#dcd8d1;--line2:#e7e3dc;--tabbg:#e2ded7;
  --ink:#1c1b1a;--muted:#6d6a67;--faint:#9a958f;--pos:#3f8f75;--neg:#e0663a;--accent:#1c1b1a;
  --navbg:#1c1b1a;--navon:#f8f6f2;--navontext:#1c1b1a;
  --cd-kopf:'all-round-gothic','Nunito',system-ui,sans-serif;--cd-text:'aptos','museo-sans','Inter',system-ui,sans-serif;
  --cd-schatten:0 1px 2px rgba(28,27,26,.06),0 8px 24px rgba(28,27,26,.06);
}
html[data-theme=dark]{--bg:#161514;--panel:#232120;--soft:#2b2927;--soft2:#262422;--line:#393633;--line2:#2f2c2a;--tabbg:#2f2c2a;--ink:#f3efe9;--muted:#b8b3ac;--faint:#85837f;
  --pos:#78e0c0;--neg:#fb7647;--navbg:#0f0e0e;--navon:#3a3734;--navontext:#fff;--cd-schatten:0 1px 2px rgba(0,0,0,.4),0 10px 30px rgba(0,0,0,.35)}
body{font-family:var(--schrift,var(--cd-text));background:var(--bg)}
html[data-theme=dark] body{background:radial-gradient(1200px 600px at 70% -10%,#2b2927 0%,transparent 60%),var(--bg)}
h1,h2,.kpi .v,.brand,.big,.kopfzeile h1,.zitat,.bkachel,.bwahl{font-family:var(--cd-kopf)!important;letter-spacing:-.005em}
h1{font-weight:700}h2{font-weight:600}
.app>nav,body>.app>nav,nav:not(.handy){background:linear-gradient(180deg,#2a2826 0%,#1c1b1a 55%,#141312 100%)}
.card,.kc{border-radius:20px!important;box-shadow:var(--cd-schatten);border-color:var(--line)}
input,select,textarea{border-radius:12px}
/* Große Buttons: kräftig und metallisch – Pill mit Metallrahmen (heller Ring) und farbigem Schein unten (Mint / Coral / Plum) */
.btn{box-sizing:border-box;border-radius:999px!important;padding:8px 20px!important;font-weight:600;color:#fff!important;border:3px solid transparent!important;
  background:linear-gradient(180deg,#8c8782 0%,#64605c 50%,#4b4845 100%) padding-box,linear-gradient(180deg,#ffffff 0%,#d6d0c9 30%,#8e8882 62%,#c9c3bc 82%,#f3efea 100%) border-box!important;
  box-shadow:inset 0 1px 1px rgba(255,255,255,.35),inset 0 -2px 4px rgba(0,0,0,.3),0 3px 0 -1px color-mix(in srgb,var(--cd-glow,var(--cd-mint)) 85%,transparent),0 8px 16px -6px color-mix(in srgb,var(--cd-glow,var(--cd-mint)) 70%,transparent),0 2px 4px rgba(0,0,0,.18)!important;
  text-shadow:0 1px 1px rgba(0,0,0,.25);transition:transform .12s ease,box-shadow .12s ease,filter .12s ease}
.btn:hover{filter:brightness(1.07);transform:translateY(-1px)}
.btn:active{transform:translateY(1px);filter:brightness(.97)}
.btn.ghost,.btn.hell{color:var(--cd-schwarz)!important;text-shadow:0 1px 0 rgba(255,255,255,.6);
  background:linear-gradient(180deg,#f7f1ea 0%,#d8d1c9 50%,#aea79f 100%) padding-box,linear-gradient(180deg,#ffffff 0%,#e3ddd6 30%,#9b958f 62%,#d2ccc5 82%,#f6f2ed 100%) border-box!important}
.btn.coral,.btn.loeschen{--cd-glow:var(--cd-coral)}.btn.plum{--cd-glow:var(--cd-plum)}
/* Kleine Buttons: Glas – durchscheinend, weich unscharf, feiner heller Rand */
.mini,.ico,.ok{box-sizing:border-box;border-radius:999px!important;padding:6px 13px!important;color:var(--ink)!important;
  background:rgba(255,255,255,.42)!important;border:1px solid rgba(255,255,255,.75)!important;
  -webkit-backdrop-filter:blur(12px) saturate(150%);backdrop-filter:blur(12px) saturate(150%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85),inset 0 -1px 0 rgba(0,0,0,.04),0 2px 8px rgba(28,27,26,.08)!important;transition:transform .12s ease,background .12s ease}
.mini:hover,.ico:hover,.ok:hover{background:rgba(255,255,255,.62)!important;transform:translateY(-1px)}
.mini.loeschen{color:var(--cd-coral2)!important}
html[data-theme=dark] .mini,html[data-theme=dark] .ico,html[data-theme=dark] .ok{background:rgba(255,255,255,.07)!important;border-color:rgba(255,255,255,.14)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 2px 10px rgba(0,0,0,.3)!important}
html[data-theme=dark] .mini:hover{background:rgba(255,255,255,.13)!important}
/* Karten und feine Elemente: Glas */
body{background:radial-gradient(900px 520px at 85% -5%,color-mix(in srgb,var(--cd-mint) 16%,transparent),transparent 70%),radial-gradient(700px 480px at 10% 110%,color-mix(in srgb,var(--cd-plum) 16%,transparent),transparent 70%),radial-gradient(600px 400px at 55% 55%,color-mix(in srgb,var(--cd-coral) 7%,transparent),transparent 70%),var(--bg)!important;background-attachment:fixed!important}
html[data-theme=dark] body{background:radial-gradient(900px 520px at 85% -5%,color-mix(in srgb,var(--cd-mint) 9%,transparent),transparent 70%),radial-gradient(700px 480px at 10% 110%,color-mix(in srgb,var(--cd-plum) 9%,transparent),transparent 70%),radial-gradient(1200px 600px at 70% -10%,#2b2927 0%,transparent 60%),var(--bg)!important;background-attachment:fixed!important}
.card,.kc{background:color-mix(in srgb,var(--panel) 68%,transparent)!important;border:1px solid rgba(255,255,255,.7)!important;
  -webkit-backdrop-filter:blur(18px) saturate(160%);backdrop-filter:blur(18px) saturate(160%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.75),0 1px 2px rgba(28,27,26,.05),0 10px 30px rgba(28,27,26,.07)!important}
html[data-theme=dark] .card,html[data-theme=dark] .kc{background:color-mix(in srgb,var(--panel) 62%,transparent)!important;border-color:rgba(255,255,255,.09)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 12px 34px rgba(0,0,0,.35)!important}
.card.modal{background:color-mix(in srgb,var(--panel) 90%,transparent)!important}
.chip{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.tabs{border-radius:999px!important;padding:4px!important}.tabs button{border-radius:999px!important}
.tabs button.on{background:linear-gradient(180deg,#77736f,#4b4846)!important;color:#fff!important;box-shadow:0 3px 0 -1px color-mix(in srgb,var(--cd-mint) 70%,transparent)}
.chip.g{background:color-mix(in srgb,var(--cd-mint) 22%,var(--panel));color:var(--cd-mint3)}
html[data-theme=dark] .chip.g{color:var(--cd-mint)}
.chip.r{background:color-mix(in srgb,var(--cd-coral) 18%,var(--panel));color:var(--cd-coral2)}
.bar.g i,.bar i{background:linear-gradient(90deg,var(--cd-mint2),var(--cd-mint))}.bar.y i{background:linear-gradient(90deg,var(--cd-plum2),var(--cd-plum))}.bar.r i{background:linear-gradient(90deg,var(--cd-coral2),var(--cd-coral))}
.brand i{background:linear-gradient(180deg,#fbf9f5,#d9d4cc)!important;color:var(--cd-schwarz)!important;border-radius:10px!important;box-shadow:0 2px 0 -1px var(--cd-mint)}
.bwahl,.bereich summary{background:linear-gradient(180deg,#3a3734,#2a2826)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 3px 0 -1px color-mix(in srgb,var(--cd-mint) 55%,transparent)}
.banner{border-radius:18px!important}
/* Menüleiste immer über dem Inhalt (Glas-Karten bilden eigene Ebenen) */
nav:not(.handy){z-index:60}.bmenue,#bMenue{z-index:500!important}
/* Inhalt nutzt immer die volle Breite */
main{max-width:none!important}