:root{
  --ground:#FBFBFA; --surface:#FFFFFF; --sunk:#F0F0EC;
  --ink:#111111; --steel:#3B3B37; --faint:#575752;
  --rule:#CFCFC8; --hair:#E3E3DD;
  --th:#131313; --th-on:#FFFFFF; --th-text:#131313;
  --th-hell:color-mix(in srgb,var(--th) 9%,var(--surface));
}
[data-thema="steuern"]   {--th:#D8231B;--th-on:#FFFFFF;--th-text:#BE1E12}
[data-thema="lohn"]      {--th:#1F48C9;--th-on:#FFFFFF;--th-text:#1F48C9}
[data-thema="vorsorge"]  {--th:#0A7A4F;--th-on:#FFFFFF;--th-text:#0A7A4F}
[data-thema="wohnen"]    {--th:#F5B800;--th-on:#111111;--th-text:#7A5800}
[data-thema="gesundheit"]{--th:#007C89;--th-on:#FFFFFF;--th-text:#00707C}
[data-thema="mwst"]      {--th:#5B34B7;--th-on:#FFFFFF;--th-text:#5B34B7}
[data-thema="neutral"]   {--th:#131313;--th-on:#FFFFFF;--th-text:#131313}
[data-thema]{--th-hell:color-mix(in srgb,var(--th) 9%,var(--surface))}

:root{--p-ink:var(--ink);--p-steel:var(--steel);--p-faint:var(--faint);--p-rule:var(--rule);--p-hair:var(--hair)}

@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --ground:#111110; --surface:#1A1A19; --sunk:#232321;
    --ink:#EFEEE9; --steel:#B4B3AD; --faint:#A3A29C; --rule:#3A3A37; --hair:#2B2B29;
  }
  :root:not([data-theme="light"]) [data-thema="steuern"],:root:not([data-theme="light"])[data-thema="steuern"]{--th-text:#FF7A6E}
  :root:not([data-theme="light"]) [data-thema="lohn"],:root:not([data-theme="light"])[data-thema="lohn"]{--th-text:#93AAFF}
  :root:not([data-theme="light"]) [data-thema="vorsorge"],:root:not([data-theme="light"])[data-thema="vorsorge"]{--th-text:#4FD39A}
  :root:not([data-theme="light"]) [data-thema="wohnen"],:root:not([data-theme="light"])[data-thema="wohnen"]{--th-text:#F5B800}
  :root:not([data-theme="light"]) [data-thema="gesundheit"],:root:not([data-theme="light"])[data-thema="gesundheit"]{--th-text:#3FCAD6}
  :root:not([data-theme="light"]) [data-thema="mwst"],:root:not([data-theme="light"])[data-thema="mwst"]{--th-text:#B39BFF}
  :root:not([data-theme="light"]) [data-thema="neutral"],:root:not([data-theme="light"])[data-thema="neutral"]{--th:#EFEEE9;--th-on:#111111;--th-text:#EFEEE9}
  :root:not([data-theme="light"]) [data-thema]{--th-hell:color-mix(in srgb,var(--th) 16%,var(--surface))}
}
:root[data-theme="dark"]{
  --ground:#111110; --surface:#1A1A19; --sunk:#232321;
  --ink:#EFEEE9; --steel:#B4B3AD; --faint:#A3A29C; --rule:#3A3A37; --hair:#2B2B29;
}
:root[data-theme="dark"] [data-thema="steuern"],:root[data-theme="dark"][data-thema="steuern"]{--th-text:#FF7A6E}
:root[data-theme="dark"] [data-thema="lohn"],:root[data-theme="dark"][data-thema="lohn"]{--th-text:#93AAFF}
:root[data-theme="dark"] [data-thema="vorsorge"],:root[data-theme="dark"][data-thema="vorsorge"]{--th-text:#4FD39A}
:root[data-theme="dark"] [data-thema="wohnen"],:root[data-theme="dark"][data-thema="wohnen"]{--th-text:#F5B800}
:root[data-theme="dark"] [data-thema="gesundheit"],:root[data-theme="dark"][data-thema="gesundheit"]{--th-text:#3FCAD6}
:root[data-theme="dark"] [data-thema="mwst"],:root[data-theme="dark"][data-thema="mwst"]{--th-text:#B39BFF}
:root[data-theme="dark"] [data-thema="neutral"],:root[data-theme="dark"][data-thema="neutral"]{--th:#EFEEE9;--th-on:#111111;--th-text:#EFEEE9}
:root[data-theme="dark"] [data-thema]{--th-hell:color-mix(in srgb,var(--th) 16%,var(--surface))}

h1{font-weight:900;font-stretch:104%;letter-spacing:-.025em}
@media (min-width:600px){h1{font-stretch:110%}}
h2{font-weight:900}
@media (min-width:600px){h2{font-stretch:112%}}

.lbl::before{width:12px;height:12px;background:var(--th)}
.lbl{color:var(--ink)}
a{color:var(--th-text);text-decoration-color:var(--th);text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--th);outline-offset:3px}
::selection{background:var(--th);color:var(--th-on)}

.top{background:var(--surface);border-bottom:0}

.top::after{
  height:6px;opacity:1;bottom:0;
  background:linear-gradient(90deg,
    #D8231B 0 16.666%,#1F48C9 16.666% 33.333%,#0A7A4F 33.333% 50%,
    #F5B800 50% 66.666%,#007C89 66.666% 83.333%,#5B34B7 83.333% 100%);
}

.top-in{padding-bottom:6px}
.nav a{border-bottom:0;padding:.5rem .65rem}
.nav a[aria-current="page"],.nav a.on{background:var(--th);color:var(--th-on)}
.nav a:hover{color:var(--ink);background:var(--sunk)}
.nav a[aria-current="page"]:hover,.nav a.on:hover{background:var(--th);color:var(--th-on)}
.menu>summary{border:2px solid var(--ink)}
.menu-panel h3{color:var(--ink);border-bottom:4px solid var(--th);padding-bottom:.3rem}
.menu-panel a:hover{color:var(--th-text)}
.sprache{border:2px solid var(--ink)}
.sprache+.sprache{margin-left:-2px}

.stand dl{border-top:4px solid var(--th)}

.tool{border:2px solid var(--ink);box-shadow:none}
.tool-head{background:var(--ink);border-bottom:0;color:var(--ground)}
.tool-head h2,.tool-head .tool-title{color:var(--ground)}
.tool-head>.lbl{color:color-mix(in srgb,var(--ground) 72%,var(--ink))}
input[type="text"],select{border:2px solid var(--ink)}
.money .cur,.money .suf{border:2px solid var(--ink)}
.money .cur{border-right:0}
.money .suf{border-left:0}
input:focus{outline:3px solid var(--th);outline-offset:-1px;border-color:var(--ink)}
.seg{border:2px solid var(--ink)}
.seg button{border-right-width:2px}
.seg button[aria-pressed="true"]{background:var(--th);color:var(--th-on);box-shadow:none}
.btn{
  background:var(--th);border:2px solid var(--th);color:var(--th-on);
  box-shadow:0 4px 0 var(--ink);
}
.btn:hover{background:var(--ink);border-color:var(--ink);color:var(--ground)}
.btn:active{transform:translateY(3px);box-shadow:0 1px 0 var(--ink)}

.pane-out{
  background:var(--th);color:var(--th-on);container-type:inline-size;

  --ink:var(--th-on);--steel:var(--th-on);--faint:var(--th-on);
  --rule:color-mix(in srgb,var(--th-on) 35%,var(--th));--hair:color-mix(in srgb,var(--th-on) 28%,var(--th));
}
.pane-out .vcard,.pane-out .warn,.pane-out .tbl-wrap,.pane-out input,.pane-out select,.pane-out .money,.pane-out .seg{
  --ink:var(--p-ink);--steel:var(--p-steel);--faint:var(--p-faint);--rule:var(--p-rule);--hair:var(--p-hair);
}
.pane+.pane-out{border-color:var(--ink)}
.pane-out .out-lab{color:var(--th-on);opacity:1;font-weight:700}
.pane-out .out-val{
  color:var(--th-on);font-weight:900;font-stretch:108%;
  font-size:clamp(1.55rem,9.6cqi,3.1rem);letter-spacing:-.035em;overflow-wrap:normal;
  background:
    repeating-linear-gradient(90deg,var(--th-on) 0 2px,transparent 2px 40px) left bottom/100% 9px no-repeat,
    repeating-linear-gradient(90deg,var(--th-on) 0 1px,transparent 1px 8px) left bottom/100% 4px no-repeat;
}

.pane-out .out-val.lab-eins{white-space:nowrap}
.pane-out .mech{border-top:3px solid var(--th-on)}
.pane-out .mech-row{border-bottom:1px solid color-mix(in srgb,var(--th-on) 30%,var(--th))}
.pane-out .mech-row span:first-child{color:var(--th-on)}
.pane-out .mech-row.total{border-top:2px solid var(--th-on)}
.pane-out .mech-row.total span:first-child{color:var(--th-on)}
.pane-out .src,.pane-out .formula{color:var(--th-on);border-top-color:color-mix(in srgb,var(--th-on) 35%,var(--th))}
.pane-out .vresult{border-top:3px solid var(--th-on)}
.pane-out .vresult b{color:var(--th);background:var(--th-on);padding:0 .22em;font-weight:800}
.pane-out a{color:var(--th-on);text-decoration-color:var(--th-on)}
.pane-out .lbl{color:var(--th-on)}
.pane-out .lbl::before{background:var(--th-on)}
.pane-out .warn{background:var(--surface);color:var(--ink);border-left:6px solid var(--ink)}
.pane-out .vcard{background:var(--surface);color:var(--ink);border:2px solid var(--ink)}
.pane-out .vcard a{color:var(--th-text);text-decoration-color:var(--th)}
.pane-out .tbl-wrap{border-color:var(--th-on)}
.pane-out table{background:var(--surface);color:var(--ink)}

.callout{background:var(--th-hell);border:0;border-left:6px solid var(--th)}
.warn{background:color-mix(in srgb,#D8231B 9%,var(--surface));border-left:6px solid #D8231B}
.tbl-wrap{border:2px solid var(--ink)}
th,.tool .tbl-wrap th{background:var(--ink);color:var(--ground);border-bottom:0}
th.num{color:var(--ground)}
tr.total td{background:var(--th);color:var(--th-on)}
.r-luecke td{background:var(--sunk)}
.rang-btn{border:2px solid var(--ink)}
.rang-btn:hover{background:var(--th);color:var(--th-on);border-color:var(--th)}
@media (max-width:560px){
  .tbl-wrap:not(.rangliste) th:first-child{background:var(--ink)}
}

.messblatt{border:2px solid var(--ink)}
.messblatt-head{background:var(--ink);color:var(--ground)}
.messblatt-head h2,.messblatt-head span{color:var(--ground)}
.messblatt li{position:relative}
.messblatt li a{padding-left:1.6rem}
.messblatt li::before{content:"";position:absolute;left:.7rem;top:50%;width:10px;height:10px;margin-top:-5px;background:var(--th);pointer-events:none}
.schnell{border:2px solid var(--ink)}
.schnell .btn{--th:#D8231B;--th-on:#fff}

.thema{border-top:0;padding-top:0}
.thema>h3{background:var(--th);color:var(--th-on);padding:.55rem .75rem;font-stretch:108%;font-weight:800}
.thema a b::after{color:var(--th-text)}
.thema a:hover b{color:var(--th-text)}

.termine{border:2px solid var(--ink)}
.termin{border-right:2px solid var(--ink);border-bottom:0;border-top:8px solid var(--th)}
.termin:last-child{border-right:0}
@media (max-width:759px){.termin{border-right:0;border-bottom:2px solid var(--ink)}.termin:last-child{border-bottom:0}}
.termin-datum{font-weight:900}
.termin-datum small{color:var(--th-text)}

.rk-grid{border:2px solid var(--ink)}
.rk{border-top:8px solid var(--th)}
.rk-no{color:var(--th-text)}
a.rk h3::after{color:var(--th-text)}
a.rk:hover{background:var(--th-hell)}
a.rk:hover h3{color:var(--ink)}

.kt-grid{border-top:3px solid var(--ink)}
a.kt-link:hover{background:#D8231B;color:#fff}
a.kt-link:hover span{color:#fff}
.kt-self{background:var(--th);color:var(--th-on)}
.kt-self span{color:var(--th-on);opacity:1}

.method{border-top:3px solid var(--ink)}
.m-no{color:var(--ink);font-weight:900;font-stretch:112%}

details:first-of-type{border-top:3px solid var(--ink)}
.seiten-index ol{border-left:2px solid var(--rule)}
.seiten-index a{margin-left:-2px;border-left:4px solid transparent}
.seiten-index a[aria-current]{border-left-color:var(--th);color:var(--ink)}

footer{background:#111111;color:#F2F2EE;border-top:0;position:relative}
footer::before{
  content:"";position:absolute;left:0;right:0;top:0;height:6px;
  background:linear-gradient(90deg,
    #D8231B 0 16.666%,#1F48C9 16.666% 33.333%,#0A7A4F 33.333% 50%,
    #F5B800 50% 66.666%,#007C89 66.666% 83.333%,#5B34B7 83.333% 100%);
}
footer .brand{color:#FFFFFF}
footer .brand span{color:#FF5A4E}
footer p,footer .foot-marke p{color:#D9D9D3}
footer .foot-marke .disclaimer{color:#BDBDB6}
footer .foot-nav>.lbl{color:#FFFFFF}
footer .foot-nav a,footer .foot-nav .linkbtn{color:#D9D9D3}
footer .foot-nav a:hover,footer .foot-nav .linkbtn:hover{color:#FFFFFF;text-decoration:underline}
footer .foot-base{border-top-color:#3A3A37;color:#BDBDB6}
footer .seg{border:2px solid #F2F2EE;background:transparent}
footer .seg button{color:#F2F2EE;background:transparent;border-color:#F2F2EE}
footer .seg button[aria-pressed="true"]{background:#F2F2EE;color:#111111}
footer .seg button:hover{background:#2A2A28;color:#FFFFFF}
.oben{border:2px solid var(--ink);background:var(--ink);color:var(--ground)}
.oben:hover{background:var(--th);color:var(--th-on);border-color:var(--th)}

.lab-skala{margin-top:.9rem}
.lab-skala-bar{position:relative;height:30px}
.lab-skala-bar::before{content:"";position:absolute;left:0;right:0;top:14px;height:2px;background:var(--th-on)}
.lab-skala-bar i{position:absolute;top:8px;width:2px;height:14px;background:var(--th-on)}
.lab-skala-zeiger{
  position:absolute;top:0;width:0;height:30px;
  transition:left .55s cubic-bezier(.2,.8,.2,1);
}
.lab-skala-zeiger::before{content:"";position:absolute;left:-9px;top:0;border:9px solid transparent;border-top:11px solid var(--th-on);border-bottom:0}
.lab-skala-zeiger::after{content:"";position:absolute;left:-2px;top:10px;width:4px;height:20px;background:var(--th-on)}
.lab-skala-enden{display:flex;justify-content:space-between;gap:1rem;font-size:var(--t-xs);font-weight:600;line-height:1.35;margin-top:.15rem}
.lab-skala-enden span:last-child{text-align:right}
.lab-skala-satz{margin-top:.45rem;font-size:var(--t-sm);font-weight:700}

.lab-delta{
  display:inline-block;margin-top:.55rem;padding:.18rem .6rem;
  border:2px solid var(--th-on);color:var(--th-on);
  font-size:var(--t-sm);font-weight:800;font-variant-numeric:tabular-nums;
}
.lab-delta[hidden]{display:none}
.lab-delta.lab-golpe{animation:lab-golpe .38s cubic-bezier(.2,.9,.3,1.3)}
@keyframes lab-golpe{0%{transform:translateY(5px) scale(.94);opacity:.2}100%{transform:none;opacity:1}}
.out-val.lab-cuenta{animation:lab-asienta .5s cubic-bezier(.2,.8,.2,1)}
@keyframes lab-asienta{0%{transform:translateY(3px)}100%{transform:none}}
@media (prefers-reduced-motion:reduce){
  .lab-skala-zeiger{transition:none}
  .lab-delta.lab-golpe,.out-val.lab-cuenta{animation:none}
}

.lab-tag{
  flex:none;align-self:center;padding:.2rem .5rem;font-size:var(--t-xs);font-weight:700;line-height:1.3;
  background:#F5B800;color:#111111;text-decoration:none;white-space:nowrap;
}
.lab-tag span{font-weight:600}
.lab-tag:hover{background:#111111;color:#F5B800}
@media (max-width:640px){.lab-tag span{display:none}}

@media (max-width:400px){.lab-tag{display:none}}
@media print{.lab-tag,.lab-delta,.lab-skala{display:none!important}}