:root {
    --bg:#fff; --surface:#fff; --text:#17162b; --muted:#69677d;
    --primary:#6956e8; --primary-dark:#5542d4; --border:#dfdeea;
    --danger:#b42318; --success:#067647; --warning:#fff8db;
    --page-title-size:clamp(1.25rem,4vw,2.35rem);
    --page-title-weight:700;
    --page-title-tracking:-.025em;
    --page-title-line-height:1.08;
    --section-title-size:1.25rem;
    --section-title-weight:750;
    --space-1:1.5rem;
    --space-2:1rem;
    --space-3:.75rem;
    --card-radius:20px;
    font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
}
*{box-sizing:border-box} body{margin:0;background:var(--bg);color:var(--text)} a{color:inherit}
.topbar{background:#fff;border-bottom:1px solid #efedf4;border-radius:0 0 26px 26px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:34px;padding:18px max(24px,calc((100% - 1180px)/2));position:sticky;top:0;z-index:30}
.brand{align-items:center;display:flex;text-decoration:none;white-space:nowrap}.brand-logo{display:block;height:38px;max-width:100%;width:auto}.topbar .brand-logo{height:32px}
nav{display:flex;gap:18px;flex-wrap:wrap}nav a{color:var(--muted);font-weight:650;text-decoration:none}nav a:hover{color:var(--primary)}
.app-nav{justify-content:center}.app-nav a{border-radius:999px;padding:8px 11px}.app-nav a.active{color:#17162b;font-weight:850}.app-nav a:hover{background:#f5f3fb}.nav-actions{align-items:center;display:flex;gap:9px;justify-self:end}.nav-actions form{margin:0}.user-menu{position:relative}.user-menu summary{border-radius:999px;color:var(--muted);cursor:pointer;font-size:.85rem;font-weight:750;list-style:none;padding:10px 12px}.user-menu summary:hover{background:#f5f3fb;color:var(--text)}.user-menu summary::-webkit-details-marker{display:none}.user-menu>div{background:#fff;border:1px solid var(--border);border-radius:12px;box-shadow:0 15px 35px rgba(32,27,72,.14);display:grid;gap:3px;min-width:190px;padding:9px;position:absolute;right:0;top:45px}.user-menu strong{padding:8px 9px}.user-menu a{border-radius:7px;color:var(--muted);font-size:.88rem;font-weight:650;padding:8px 9px;text-decoration:none}.user-menu a:hover{background:#f2f0fd;color:var(--primary)}.logout-button{background:transparent;border:1.5px solid #272532;border-radius:999px;color:#272532;cursor:pointer;font-family:inherit;font-size:.85rem;font-weight:800;padding:9px 17px;text-decoration:none}.logout-button:hover{background:#272532;color:#fff}
.container{max-width:1080px;margin:auto;padding:30px 20px 70px}
.hero,.toolbar,.form-actions,.entry-title,.button-row{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
.hero{margin-bottom:24px}.eyebrow{color:var(--primary);font-weight:750;letter-spacing:.05em;margin:0 0 6px;text-transform:uppercase}
h1{font-size:clamp(1.8rem,5vw,2.6rem);margin:0 0 8px}h2{margin-top:28px}h3,p{margin-top:0}.muted{color:var(--muted)}
.button{border:0;border-radius:10px;cursor:pointer;display:inline-block;font:inherit;font-weight:700;padding:12px 17px;text-align:center;text-decoration:none}
.primary{background:var(--primary);color:#fff}.primary:hover{background:var(--primary-dark)}
.secondary{background:var(--surface);border:1px solid var(--border)}
.card{background:var(--surface);border:1px solid var(--border);border-radius:14px;box-shadow:0 4px 14px rgba(16,42,67,.04)}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:28px}.stat{padding:17px}.stat span,.calc span{color:var(--muted);display:block}.stat strong{display:block;font-size:1.25rem;margin:7px 0 3px}.stat small,.calc small{color:var(--muted)}
.toolbar{border-bottom:1px solid var(--border);margin-bottom:15px;padding-bottom:15px}.toolbar form label{display:flex;align-items:center;gap:10px}
.month-tabs{display:flex;gap:6px;margin:0 0 18px;overflow-x:auto;padding:2px 0 8px;flex-wrap:nowrap}
.month-tabs a{background:var(--surface);border:1px solid var(--border);border-radius:999px;color:var(--muted);font-size:.86rem;padding:7px 11px;text-decoration:none;white-space:nowrap}
.month-tabs a.active{background:var(--primary);border-color:var(--primary);color:#fff}
/* ==========================================================================
   TAGEBUCH: Kennzahlenkarten unter der Monatsnavigation
   HTML dazu: templates/index.html, Abschnitt "MONATSKENNZAHLEN"
   Bilder dazu: static/icons/generated/status-*-3d.png
   ========================================================================== */
.calendar-hero{margin-bottom:16px}
.month-check{display:grid;grid-template-columns:1.35fr repeat(4,1fr);gap:10px;margin:14px 0 22px}
.month-check article{background:var(--surface);border:1px solid var(--border);border-radius:14px;box-shadow:0 4px 14px rgba(16,42,67,.035);min-height:92px;padding:14px}
.month-check span{color:var(--muted);display:block;font-size:.76rem;font-weight:700;letter-spacing:.01em}
.month-check strong{display:block;font-size:1.35rem;margin-top:3px}
.month-check strong small{color:var(--muted);font-size:.72rem}

/* Normale Karten: Text links, große Illustration rechts. */
.status-card{align-items:center;display:flex;gap:5px;justify-content:space-between;overflow:hidden;position:relative}
.status-card .status-copy{min-width:0;position:relative;z-index:1}
.status-card small{color:var(--muted);display:block;font-size:.72rem;margin-top:1px}
.status-illustration{display:block;flex:0 0 78px;height:78px;margin:-5px -10px -8px 0;object-fit:contain;width:78px}
.status-card.home .status-illustration{height:82px;width:82px}
.status-card.travel .status-illustration{height:84px;width:84px}

/* Erste Karte: Das Symbol ist unabhängig von Balken und Text fest verankert.
   top/right entsprechen optisch exakt der Symbolposition der Nachbarkarten.
   Balken und Prozentwert enden vor der reservierten Symbolspalte. */
.month-progress{display:block;overflow:hidden;position:relative}
.month-progress-top{display:block}
.month-progress-top .status-copy{max-width:calc(100% - 82px);min-width:0;position:relative;z-index:1}
.month-progress .status-illustration{
    height:78px;
    margin:0;
    position:absolute;
    right:4px;
    top:20px;
    width:78px;
}
.month-progress em{
    bottom:11px;
    color:var(--success);
    font-size:.78rem;
    font-style:normal;
    font-weight:800;
    left:14px;
    position:absolute;
}
.progress-track{
    background:#e7edef;
    border-radius:999px;
    bottom:29px;
    height:6px;
    left:14px;
    overflow:hidden;
    position:absolute;
    right:92px;
}
.progress-track i{background:linear-gradient(90deg,#17a673,var(--primary));border-radius:inherit;display:block;height:100%}
.view-bar{align-items:center;display:flex;justify-content:space-between;gap:12px;margin-bottom:15px}.view-switch{background:#e5ecef;border-radius:10px;display:flex;padding:3px}.view-switch a{border-radius:8px;color:var(--muted);font-weight:700;padding:8px 13px;text-decoration:none}.view-switch a.active{background:var(--surface);box-shadow:0 1px 4px rgba(16,42,67,.1);color:var(--text)}
.calendar-scroll{overflow-x:auto;padding-bottom:8px}.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(112px,1fr));min-width:800px}.weekday-row{color:var(--muted);font-size:.76rem;font-weight:750;text-align:center;text-transform:uppercase}.weekday-row div{padding:7px}
.month-weeks{display:grid;gap:7px;min-width:800px}.calendar-week{display:grid;gap:3px}.week-days-grid{gap:7px}.event-lanes{gap:2px;grid-auto-rows:2px}.calendar-event{border-radius:999px;display:block;min-width:0;overflow:hidden;padding:0}.calendar-event.housing{background:#f6dce6;color:#83405b}.calendar-event.family{background:#e0f0df;color:#3e7044}.day-tile{border-radius:11px;display:flex;flex-direction:column;min-height:130px;padding:11px;text-decoration:none;transition:transform .12s ease,box-shadow .12s ease}.day-tile:hover{box-shadow:0 6px 16px rgba(16,42,67,.11);transform:translateY(-1px)}.day-tile.outside{background:transparent;min-height:130px}.empty-day{background:#e8edef;border:1px dashed #bac6cc;color:var(--muted)}
.day-head{border-bottom:1px solid rgba(16,42,67,.12);display:flex;flex-direction:column;gap:2px;padding-bottom:7px}.day-head strong{color:var(--text);font-size:.88rem}.day-head span{font-size:.72rem}.day-content{display:flex;flex:1;flex-direction:column;gap:5px;justify-content:flex-end;padding-top:9px}.day-content b{font-size:.84rem}.day-content span{font-size:.77rem;line-height:1.3}
.tax-chip{align-self:flex-start;background:rgba(255,255,255,.72);border:1px solid rgba(16,42,67,.12);border-radius:999px;color:var(--primary-dark);font-size:.76rem;margin-top:3px;padding:4px 7px}.tax-formula{color:var(--muted);font-size:.64rem;line-height:1.2}
.filled{border:1px solid rgba(16,42,67,.14);color:var(--text)}.filled.homeoffice{background:var(--tile-homeoffice)}.filled.office{background:var(--tile-office)}.filled.business_trip{background:var(--tile-business-trip)}.filled.family_trip{background:var(--tile-family-trip)}.filled.vacation{background:var(--tile-vacation)}.filled.sick{background:var(--tile-sick)}.filled.holiday{background:var(--tile-holiday)}.filled.other{background:var(--tile-other)}.filled.public_holiday{background:var(--tile-public-holiday);border-color:rgba(126,91,0,.22)}
.analysis-heading{align-items:flex-end;display:flex;justify-content:space-between;margin:8px 0 18px}
.analysis-heading h2{font-size:1.55rem;margin:0 0 5px}.analysis-heading p:last-child{margin-bottom:0}

/* Strukturierte Einstellungen */
.settings-heading p:last-child{margin:8px 0 0}.settings-stack{display:grid;gap:16px}
.settings-section{overflow:hidden;padding:0}.settings-section>summary{cursor:pointer;list-style:none}.settings-section>summary::-webkit-details-marker{display:none}
.settings-section-head{align-items:flex-start;display:grid;gap:16px;grid-template-columns:42px 1fr auto;padding:22px 24px}
.settings-section-head h2{font-size:1.35rem;margin:0 0 5px}.settings-section-head p{color:var(--muted);margin:0}.settings-section-head .eyebrow{color:var(--primary);font-size:.68rem;margin-bottom:5px}
.settings-number{align-items:center;background:#eeeafd;border-radius:12px;color:#5741d6;display:flex;font-size:.74rem;font-weight:900;height:42px;justify-content:center;width:42px}
.settings-chevron{color:var(--muted);font-size:1.5rem;transition:transform .15s}.settings-section[open] .settings-chevron{transform:rotate(180deg)}
.settings-body{border-top:1px solid #eceaf2;display:grid;gap:20px;padding:24px}.settings-fields{display:grid;gap:15px;grid-template-columns:repeat(2,minmax(0,1fr))}
.settings-inline-form{align-items:end;border-top:1px solid #eceaf2;display:grid;gap:14px;grid-template-columns:minmax(220px,420px) auto;padding:20px 24px}.settings-inline-form .button{justify-self:start}
.location-add{margin-bottom:15px}.location-add>summary{display:inline-block;list-style:none}.location-add>summary::-webkit-details-marker{display:none}
.location-edit-form{background:#faf9fd;border:1px solid #ebe8f3;border-radius:16px;display:grid;gap:14px;grid-template-columns:2fr 1fr 1fr; margin-top:14px;padding:18px}.location-edit-form .checkbox{grid-column:1/-1}.location-edit-form .button{justify-self:start}
.location-list{border:1px solid #ebe8f3;border-radius:16px;overflow:hidden}.location-editor+.location-editor{border-top:1px solid #ebe8f3}
.location-editor>summary{align-items:center;cursor:pointer;display:grid;gap:14px;grid-template-columns:1fr auto auto;list-style:none;padding:16px 18px}.location-editor>summary::-webkit-details-marker{display:none}
.location-editor>summary small{color:var(--muted);display:block;margin-top:4px}.location-editor[open]>summary{background:#f8f7fc}.location-status{background:#e2f4e9;border-radius:999px;color:#087443;font-size:.72rem;font-weight:750;padding:5px 9px}.edit-label{color:var(--primary);font-size:.78rem;font-weight:800}.location-editor .location-edit-form{border:0;border-radius:0;border-top:1px solid #ebe8f3;margin:0}
@media(max-width:720px){.settings-fields{grid-template-columns:1fr}.settings-inline-form{grid-template-columns:1fr}.location-edit-form{grid-template-columns:1fr}.location-editor>summary{grid-template-columns:1fr}.location-status,.edit-label{justify-self:start}.settings-section-head{padding:18px}}
.entry-list{display:grid;gap:11px}.entry{display:grid;grid-template-columns:62px 1fr auto;gap:17px;padding:16px}.date-box{align-items:center;background:#e3f3f2;border-radius:10px;display:flex;flex-direction:column;justify-content:center;padding:8px}.date-box strong{font-size:1.35rem}.date-box span{color:var(--primary);font-size:.8rem;font-weight:750;text-transform:uppercase}
.entry-main h3{margin:0}.entry-main p{margin:7px 0}.badge{background:#edf1f4;border-radius:999px;color:var(--muted);font-size:.82rem;padding:5px 9px}.badge.homeoffice{background:#e6f6ed;color:#087443}.badge.business_trip{background:#fff0dd;color:#965d00}.badge.family_trip{background:#eeeafa;color:#5b3aa8}
.meta{color:var(--muted);display:flex;flex-wrap:wrap;font-size:.88rem;gap:7px 15px}.meta a{color:var(--primary);font-weight:700}
.actions{align-items:flex-end;display:flex;flex-direction:column;gap:7px}.actions a,.link{background:none;border:0;cursor:pointer;font:inherit;padding:0;text-decoration:underline}.danger{color:var(--danger)}
.empty{text-align:center;padding:35px}.form{display:grid;gap:20px;padding:23px}.compact{margin-bottom:26px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px}
label{display:grid;font-weight:700;gap:7px}input,select,textarea{background:#fff;border:1px solid #b8c5ce;border-radius:9px;color:var(--text);font:inherit;padding:11px;width:100%}textarea{resize:vertical}
.form-section{background:#f7faf9;border:1px solid var(--border);border-radius:12px;padding:17px}.form-section h2{font-size:1.15rem;margin:0}.section-heading{align-items:flex-start;display:flex;justify-content:space-between;gap:16px;margin-bottom:15px}.section-heading .eyebrow{font-size:.69rem}.section-heading>small{color:var(--muted);max-width:300px;text-align:right}[hidden]{display:none!important}
.color-settings{margin-top:20px}.color-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.color-select-row{align-items:center;display:flex;gap:9px}.color-preview{border:1px solid rgba(16,42,67,.18);border-radius:8px;display:block;flex:0 0 34px;height:34px}.color-select-row select{flex:1}
input:focus,select:focus,textarea:focus{border-color:var(--primary);outline:3px solid rgba(8,127,127,.14)}small{font-weight:400}.checkbox{align-items:center;display:flex}.checkbox input{width:auto}
.back{color:var(--primary);display:inline-block;font-weight:700;margin-bottom:16px}.hint,.warning{background:var(--warning);border:1px solid #efd990;border-radius:10px;padding:13px}.notice{border-radius:10px;margin-bottom:16px;padding:12px 15px}.notice.success{background:#dcfae6;color:var(--success)}.notice.error{background:#fee4e2;color:var(--danger)}
.calc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin:22px 0}.calc{padding:19px}.calc strong{display:block;font-size:1.45rem;margin:8px 0}.deduction{border-color:#efb4ae}.total{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px}.total strong{color:var(--primary);font-size:1.8rem}.legal{margin-top:18px}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:18px}.result{display:flex;justify-content:space-between;margin-top:18px;padding:20px}
.table-wrap{overflow-x:auto}table{border-collapse:collapse;width:100%;background:var(--surface)}th,td{border-bottom:1px solid var(--border);padding:11px;text-align:left}th{color:var(--muted);font-size:.85rem}
.tax-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:18px 0 24px}.tax-summary article{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:16px}.tax-summary span{color:var(--muted);display:block;font-size:.82rem}.tax-summary strong{display:block;font-size:1.25rem;margin-top:7px}.tax-summary .highlight{background:#dff4e7;border-color:#a8dabc}.tax-summary .highlight strong,.tax-amount{color:var(--success)}.tax-table{box-shadow:none}.tax-table td{vertical-align:top}.tax-table td:nth-child(n+3),.tax-table th:nth-child(n+3){text-align:right;white-space:nowrap}.tax-table small{color:var(--muted);display:block;line-height:1.35;margin-top:3px;max-width:390px}.tax-activity{font-weight:750}.tax-table tfoot th{background:#f4f8f7;color:var(--text);font-size:.9rem}
.period-costs{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:28px}.period-panel{padding:18px}.period-heading{align-items:flex-start;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;gap:16px;margin-bottom:8px;padding-bottom:13px}.period-heading h2{font-size:1.2rem;margin:0}.period-heading .eyebrow{font-size:.72rem}.period-heading>strong{color:var(--primary);font-size:1.25rem;white-space:nowrap}.period-row{align-items:center;display:flex;justify-content:space-between;gap:14px;padding:10px 0}.period-row+.period-row{border-top:1px solid #edf1f3}.period-row small{color:var(--muted);display:block;margin-top:3px}.period-row>span{font-weight:800;white-space:nowrap}.section-title{font-size:1.25rem;margin-bottom:12px}
.housing-hero .eyebrow,.housing-form .eyebrow,.housing-table .eyebrow{color:#9a4f73}.housing-button{background:#f6dce6;color:#783b59}.housing-primary{background:#9a4f73;color:#fff}.housing-primary:hover{background:#803c5e}.housing-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:11px;margin:18px 0 25px}.housing-summary article{background:#fff;border:1px solid #ead0dc;border-top:4px solid #bd6d91;border-radius:13px;padding:16px}.housing-summary span,.housing-summary small{color:var(--muted);display:block}.housing-summary span{font-size:.8rem}.housing-summary strong{display:block;font-size:1.3rem;margin:7px 0 3px}.housing-form{border-color:#e7cad8;margin-bottom:25px}.housing-table{padding:18px}.housing-table td{vertical-align:top}.housing-group{border-radius:999px;display:inline-block;font-size:.72rem;padding:4px 7px;white-space:nowrap}.group-unterkunft{background:#f6dce6;color:#783b59}.group-einrichtung{background:#eee7fb;color:#59459a}.group-umzug{background:#dcebf9;color:#27628a}.group-sonstiges{background:#ecebef;color:#56606f}
.master-shell{background:#f4f3fb;border-radius:20px;margin:-10px -14px;padding:28px}.master-hero{background:linear-gradient(135deg,#17233f,#6657b8);border-radius:16px;color:#fff;padding:25px}.master-hero .eyebrow{color:#d9d4ff}.master-hero p{margin-bottom:0}.master-pdf{background:#fff;color:#3d317d}.master-total{align-items:center;background:#fff;border:1px solid #d9d4f5;border-radius:15px;display:flex;justify-content:space-between;gap:25px;margin:18px 0 28px;padding:20px}.master-total span{color:#6657b8;font-size:.8rem;font-weight:750;text-transform:uppercase}.master-total strong{display:block;font-size:2rem;margin-top:4px}.master-total p{color:var(--muted);margin:0;max-width:480px}.master-day-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}
.master-day-symbol{align-items:center;background:#f2efff;border-radius:14px;color:#4b3e93;display:flex;font-size:1.45rem;font-weight:850;height:48px;justify-content:center;width:48px}.master-day-grid article{background:#fff;border:1px solid #ddd9f2;border-radius:12px;padding:14px}.master-day-grid span,.master-day-grid small{color:var(--muted);display:block;font-size:.75rem}.master-day-grid strong{color:#4b3e93;font-size:1.65rem}.master-columns{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:25px}.master-panel{border-color:#dcd8ef;padding:18px}.master-panel .eyebrow{color:#6657b8}.master-line{align-items:center;border-bottom:1px solid #eceaf5;display:flex;justify-content:space-between;gap:14px;padding:9px 0}.master-line strong{white-space:nowrap}.total-line{background:#eeeafd;border:0;border-radius:9px;color:#3d317d;margin-top:9px;padding:12px}.master-months{margin-top:14px}.master-months td:nth-child(n+2),.master-months th:nth-child(n+2){text-align:right}.cap-track{background:#e8e5f4;border-radius:999px;height:7px;min-width:100px;overflow:hidden}.cap-track i{background:#6657b8;border-radius:inherit;display:block;height:100%}.master-note{color:#6c7382;font-size:.78rem;margin:16px 4px 0}
@media(max-width:900px){.month-check{grid-template-columns:repeat(4,1fr)}.month-progress{grid-column:span 2}.master-day-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:780px){.topbar{align-items:flex-start;flex-direction:column}nav{gap:11px 16px}.stats,.calc-grid,.tax-summary,.housing-summary{grid-template-columns:1fr 1fr}.two-col,.period-costs,.master-columns{grid-template-columns:1fr}.month-check{grid-template-columns:repeat(2,1fr)}.color-grid{grid-template-columns:1fr 1fr}.master-shell{margin:0;padding:16px}.master-total{align-items:flex-start;flex-direction:column}}
@media(max-width:560px){.stats,.calc-grid,.form-grid{grid-template-columns:1fr}.entry{grid-template-columns:52px 1fr}.actions{align-items:center;flex-direction:row;grid-column:2}.total{align-items:flex-start;flex-direction:column}.view-bar{align-items:stretch;flex-direction:column}.view-switch{justify-content:space-between}.month-check{grid-template-columns:1fr 1fr}.month-progress{grid-column:1/-1}.tax-summary,.color-grid,.housing-summary,.master-day-grid{grid-template-columns:1fr}.master-shell{padding:10px}.master-hero{padding:19px}}

/* Öffentliche Startseite */
.landing-page{background:#fff;padding:0}.landing-shell{background:#fff;margin:auto;max-width:1500px;overflow:hidden}.landing-nav{align-items:center;background:#fff;border-radius:0 0 26px 26px;display:grid;grid-template-columns:1fr auto 1fr;gap:28px;padding:22px 6%;position:relative;z-index:3}.landing-nav nav{justify-content:center}.landing-nav nav a{padding:8px 5px}.login-button{border:1.5px solid #201f29;border-radius:999px;font-weight:750;justify-self:end;padding:10px 27px;text-decoration:none}.login-button:hover{background:#201f29;color:#fff}
.landing-hero{background:radial-gradient(circle at 83% 20%,rgba(255,181,59,.5),transparent 24%),radial-gradient(circle at 55% 90%,rgba(29,223,210,.38),transparent 26%),linear-gradient(135deg,#713bf1,#a42df0 58%,#ec43bc);border-radius:0 0 42px 42px;color:#fff;display:grid;grid-template-columns:1.12fr .88fr;min-height:650px;overflow:hidden;padding:70px 6%;position:relative}.landing-hero:before{background-image:radial-gradient(rgba(255,255,255,.24) 1px,transparent 1px);background-size:5px 5px;content:"";inset:0;mix-blend-mode:soft-light;opacity:.42;position:absolute}.landing-copy{max-width:730px;position:relative;z-index:2}.landing-kicker{display:block;font-size:.75rem;font-weight:850;letter-spacing:.13em;margin-bottom:16px;text-transform:uppercase}.landing-copy h1{font-size:clamp(3rem,6.5vw,6rem);letter-spacing:-.065em;line-height:.93;margin-bottom:30px}.landing-copy h1 mark{background:#fff45c;border-radius:13px;color:#181629;display:inline-block;margin-top:12px;padding:2px 12px 9px}.landing-copy>p{font-size:1.08rem;line-height:1.65;max-width:650px}.landing-actions{align-items:center;display:flex;gap:22px;margin:32px 0}.landing-primary{align-items:center;background:#fff45c;border:0;border-radius:999px;color:#17162b;cursor:pointer;display:inline-flex;font:inherit;font-weight:850;gap:24px;justify-content:center;padding:15px 23px;text-decoration:none}.landing-primary:hover{background:#fff}.landing-primary span{font-size:1.25rem}.landing-link{color:#fff;font-weight:750}.trust-row{display:flex;flex-wrap:wrap;font-size:.83rem;font-weight:700;gap:18px}
.tax-visual{min-height:500px;perspective:900px;position:relative;z-index:2}.visual-card{background:rgba(255,255,255,.96);box-shadow:0 25px 50px rgba(37,10,83,.25);color:#1b1931;position:absolute}.visual-main{border-radius:26px;left:7%;padding:28px;top:13%;transform:rotate(4deg) rotateY(-8deg);width:min(430px,88%)}.visual-main>span,.visual-card small{color:#747187;font-size:.78rem}.visual-main>strong{display:block;font-size:2rem;margin:8px 0 25px}.mini-bars{align-items:end;display:flex;gap:9px;height:105px}.mini-bars i{background:linear-gradient(#7756ee,#c68cff);border-radius:8px 8px 2px 2px;display:block;flex:1}.mini-bars i:nth-child(1){height:48%}.mini-bars i:nth-child(2){height:82%}.mini-bars i:nth-child(3){height:62%}.mini-bars i:nth-child(4){height:100%;background:linear-gradient(#ff9350,#ffcf4d)}.visual-total{align-items:end;border-top:1px solid #e8e5f0;display:flex;justify-content:space-between;margin-top:18px;padding-top:16px}.visual-total small{display:block}.visual-total b{font-size:1.3rem}.visual-day{border-radius:17px;left:-4%;padding:16px 20px;top:60%;transform:rotate(-5deg)}.visual-day span,.visual-day small,.visual-home small{display:block;color:#747187}.visual-day b,.visual-home b{display:block;margin:5px 0}.visual-home{border-radius:17px;padding:15px 18px;right:-2%;top:51%;transform:rotate(8deg)}.visual-home>span{background:#fff0dc;border-radius:10px;color:#df6c20;display:inline-flex;font-size:1.4rem;padding:7px}.visual-coin{align-items:center;border:5px solid rgba(255,255,255,.8);border-radius:50%;box-shadow:0 12px 25px rgba(38,17,74,.25);display:flex;font-size:1.5rem;font-weight:900;height:70px;justify-content:center;position:absolute;width:70px}.coin-one{background:#fff45c;color:#1c1930;right:3%;top:8%;transform:rotate(12deg)}.coin-two{background:#24dfd0;bottom:12%;color:#173f45;right:16%;transform:rotate(-10deg)}.visual-orbit{border:1px solid rgba(255,255,255,.27);border-radius:50%;position:absolute}.orbit-one{height:470px;left:0;top:0;width:470px}.orbit-two{height:340px;left:65px;top:65px;width:340px}
.landing-reasons{display:grid;gap:18px;grid-template-columns:repeat(3,1fr);padding:55px 6%}.landing-reasons>div{border:1px solid #ebe9f2;border-radius:20px;padding:26px}.landing-reasons span{color:#7556e8;font-size:.75rem;font-weight:850}.landing-reasons h2{font-size:1.3rem;margin:10px 0}.landing-reasons p{color:var(--muted);line-height:1.55;margin:0}.feature-section{background:#f7f6fb;padding:70px 6%}.feature-section>div:first-child{max-width:720px}.feature-section h2{font-size:clamp(2rem,4vw,3.6rem);letter-spacing:-.045em;margin:0 0 35px}.feature-cards{display:grid;gap:16px;grid-template-columns:repeat(3,1fr)}.feature-cards article{align-items:center;background:#fff;border:1px solid #ebe9f2;border-radius:20px;display:flex;gap:18px;padding:22px}.feature-cards h3{margin:0 0 7px}.feature-cards p{color:var(--muted);line-height:1.45;margin:0}.feature-icon{align-items:center;border-radius:16px;display:flex;flex:0 0 72px;font-size:1rem;font-weight:900;height:72px;justify-content:center}.feature-icon.purple{background:#eae5ff;color:#6249db}.feature-icon.orange{background:#fff0dc;color:#e57225}.feature-icon.cyan{background:#daf9f6;color:#138b83}.privacy-strip{align-items:center;background:#17162b;color:#fff;display:flex;justify-content:space-between;gap:25px;padding:45px 6%}.privacy-strip span{color:#8f82eb;font-size:.75rem;font-weight:850;text-transform:uppercase}.privacy-strip h2{margin:5px 0 0}.privacy-strip a{background:#fff;border-radius:999px;font-weight:800;padding:13px 20px;text-decoration:none}.landing-footer{color:var(--muted);display:flex;justify-content:space-between;gap:20px;padding:24px 6%;font-size:.8rem}

/* Login */
.login-page{align-items:center;background:radial-gradient(circle at 15% 20%,#9b55ef,transparent 34%),radial-gradient(circle at 85% 80%,#24dacc,transparent 28%),#5d42dc;display:flex;min-height:100vh;padding:25px}.login-shell{margin:auto;max-width:470px;width:100%}.login-shell>.brand{background:#fff;border-radius:14px;justify-content:center;margin-bottom:18px;padding:10px 14px}.login-card{background:#fff;border-radius:24px;box-shadow:0 25px 65px rgba(34,20,91,.35);padding:36px}.login-icon{align-items:center;background:#fff45c;border-radius:14px;display:flex;font-size:1.5rem;font-weight:900;height:50px;justify-content:center;margin-bottom:24px;width:50px}.login-card h1{font-size:2.2rem;letter-spacing:-.05em}.login-card form{display:grid;gap:18px;margin:25px 0}.login-card .landing-primary{width:100%}.login-card>small{color:var(--muted);display:block;line-height:1.5}.back-home{color:#fff;display:block;font-weight:700;margin-top:18px;text-align:center}

@media(max-width:1000px){.landing-hero{grid-template-columns:1fr}.tax-visual{margin:auto;max-width:620px;width:100%}.feature-cards{grid-template-columns:1fr}.topbar{grid-template-columns:1fr auto}.app-nav{grid-column:1/-1;grid-row:2;justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap}.nav-actions{grid-column:2;grid-row:1}.landing-nav{grid-template-columns:1fr auto}.landing-nav nav{display:none}}
@media(max-width:720px){.landing-page{padding:0}.landing-shell{border-radius:0}.landing-hero{min-height:auto;padding:55px 7%}.landing-copy h1{font-size:3.15rem}.tax-visual{min-height:430px}.visual-main{left:2%;width:96%}.visual-day{left:0}.visual-home{right:0}.landing-reasons{grid-template-columns:1fr}.landing-reasons,.feature-section{padding:45px 7%}.privacy-strip{align-items:flex-start;flex-direction:column}.landing-footer{flex-direction:column}.topbar{padding:12px 15px}.app-nav{gap:7px}.app-nav a{font-size:.8rem;white-space:nowrap}.master-nav{padding:7px 9px}}

/* Einheitliches modernes Oberflächen-Update */
.app-nav .master-link{background:linear-gradient(135deg,#6b55e8,#a13fe1);color:#fff!important;padding:9px 14px}
.app-nav .master-link:hover,.app-nav .master-link.active{background:linear-gradient(135deg,#5741d6,#8e2dcc);box-shadow:0 6px 16px rgba(103,75,220,.25)}
.container{max-width:1180px;padding:38px 24px 80px}
.hero{background:linear-gradient(135deg,#f7f5ff,#fff8f1);border:1px solid #ece8f7;border-radius:24px;margin-bottom:25px;padding:26px 28px}
.eyebrow{font-size:.72rem;font-weight:850;letter-spacing:.11em;margin-bottom:7px}
h1{font-size:clamp(2rem,5vw,3rem);font-weight:850;letter-spacing:-.045em;line-height:1.02;margin-bottom:0}
h2{font-weight:800;letter-spacing:-.025em}
.page-heading{background:linear-gradient(135deg,#f7f5ff,#fff);border:1px solid #ece8f7;border-radius:22px;margin-bottom:24px;padding:24px 27px}
.card{border-color:#e8e6ef;border-radius:20px;box-shadow:0 10px 30px rgba(35,30,72,.055)}
.form{padding:27px}
.month-tabs{align-items:center;background:#fff;border:1px solid #e9e7ef;border-radius:18px;box-shadow:0 8px 24px rgba(35,30,72,.045);gap:3px;justify-content:space-between;margin-bottom:22px;padding:7px}
.month-tabs a{background:transparent;border:0;border-radius:12px;font-size:.84rem;font-weight:720;padding:9px 12px;text-align:center}
.month-tabs a:hover{background:#f6f4fb;color:var(--text)}
.month-tabs a.active{background:#242231;color:#fff}
.month-check article,.tax-summary article{border-color:#e8e6ef;border-radius:18px;box-shadow:0 8px 24px rgba(35,30,72,.045)}
.view-switch{background:#f2f0f7;border:1px solid #e6e3ed;border-radius:13px}
.view-switch a{border-radius:10px}
.button{border-radius:999px}
input,select,textarea{border-color:#d8d5e2;border-radius:12px;padding:12px}
.form-section{background:#faf9fd;border-color:#e8e5f0;border-radius:17px}
.table-wrap{border-radius:16px}
.landing-hero{border-radius:42px;margin:0 24px;padding-left:5%;padding-right:5%}
.dashboard-mockup{background:rgba(255,255,255,.97);border:1px solid rgba(255,255,255,.7);border-radius:27px;box-shadow:0 32px 65px rgba(42,12,89,.3);color:#1b1931;left:3%;padding:23px;position:absolute;top:9%;transform:rotate(2.5deg);width:min(465px,94%)}
.mockup-top{align-items:center;border-bottom:1px solid #ece9f3;display:flex;gap:7px;padding-bottom:14px}.mockup-top i{background:#dedbe8;border-radius:50%;height:7px;width:7px}.mockup-logo{align-items:center;background:#242231;border-radius:8px;color:#fff;display:flex;font-size:.72rem;font-weight:900;height:27px;justify-content:center;margin-right:auto;width:27px}
.mockup-title{padding:18px 0}.mockup-title small{color:#827e90;display:block;font-size:.7rem;margin-bottom:3px}.mockup-title strong{font-size:1.35rem;letter-spacing:-.03em}
.mockup-stats{display:grid;gap:8px;grid-template-columns:repeat(3,1fr)}.mockup-stats span{background:#f5f3fb;border-radius:11px;padding:10px}.mockup-stats small{color:#817d90;display:block;font-size:.59rem}.mockup-stats b{display:block;font-size:.82rem;margin-top:4px}
.mockup-calendar{display:grid;gap:6px;grid-template-columns:repeat(7,1fr);margin-top:15px}.mockup-calendar i{align-items:center;background:#f1eff5;border-radius:7px;color:#8a8696;display:flex;font-size:.58rem;font-style:normal;height:32px;justify-content:center}.mockup-calendar i.filled{background:#e7e1ff;color:#5c43d2;font-weight:850}.mockup-calendar i:nth-child(8),.mockup-calendar i:nth-child(15){background:#fff0d9;color:#d66f21}
.visual-day{left:-3%;top:67%;transform:rotate(-4deg)}.visual-home{align-items:center;display:flex;gap:10px;right:-3%;top:57%;transform:rotate(5deg)}.visual-home div{min-width:0}.visual-home strong{color:#16857c;margin-left:4px}
@media(max-width:720px){.landing-hero{border-radius:28px;margin:0 12px}.dashboard-mockup{left:0}.month-tabs{justify-content:flex-start}.hero{padding:22px}.container{padding-left:16px;padding-right:16px}}

/* Thematisch gruppierte Kosten */
.housing-summary article.cluster-housing{border-top-color:#bd6d91}.housing-summary article.cluster-it{border-top-color:#6956e8}.housing-summary article.cluster-books{border-top-color:#e79a38}.housing-summary article.cluster-professional{border-top-color:#1aa59c}
.cost-clusters{display:grid;gap:16px;grid-template-columns:1fr 1fr}.cost-cluster{border:1px solid #e8e6ef;border-radius:18px;overflow:hidden}.cost-cluster>header{align-items:center;background:#f8f7fb;display:flex;justify-content:space-between;gap:18px;padding:17px 18px}.cost-cluster>header span{display:block;font-size:1rem;font-weight:850}.cost-cluster>header small{color:var(--muted);display:block;margin-top:3px}.cost-cluster>header>strong{font-size:1.2rem;white-space:nowrap}.cost-cluster.cluster-housing>header{background:#fff5f8}.cost-cluster.cluster-it>header{background:#f4f1ff}.cost-cluster.cluster-books>header{background:#fff8ed}.cost-cluster.cluster-professional>header{background:#effaf8}.cost-cluster>p{padding:18px}.cost-item{align-items:center;border-top:1px solid #eeecf2;display:grid;gap:12px;grid-template-columns:45px 1fr auto auto;padding:13px 16px}.cost-item time{color:var(--muted);font-size:.75rem}.cost-item b,.cost-item small,.cost-item a{display:block}.cost-item small{color:var(--muted);line-height:1.35;margin-top:3px}.cost-item a{color:var(--primary);font-size:.75rem;font-weight:700;margin-top:3px}.cost-item>strong{white-space:nowrap}
@media(max-width:780px){.cost-clusters{grid-template-columns:1fr}.cost-item{grid-template-columns:40px 1fr auto}.cost-item form{grid-column:2}}
.excel-reconciliation{background:#fff;border:1px solid #ded9f5;border-radius:18px;display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin:-12px 0 28px;overflow:hidden}.excel-reconciliation>div{background:#f8f7fd;padding:15px 18px}.excel-reconciliation span{color:var(--muted);display:block;font-size:.75rem}.excel-reconciliation strong{display:block;font-size:1.15rem;margin-top:5px}.excel-reconciliation .has-difference{background:#fff5e8}.excel-reconciliation p{color:var(--muted);font-size:.76rem;grid-column:1/-1;margin:0;padding:11px 18px}@media(max-width:650px){.excel-reconciliation{grid-template-columns:1fr}}

/* Editoriales Dashboard-Design */
body:not(.landing-page):not(.login-page):not(.pricing-page):not(.public-info-page){background:#fff}
.topbar{border-radius:0;padding-bottom:15px;padding-top:15px}
.app-nav{gap:8px}.app-nav a{color:#464350;font-size:.86rem;padding:9px 13px}.app-nav a.active:not(.master-link){background:#f1eff8;color:#2c2840}
.container{max-width:1220px}
.calendar-hero{background:linear-gradient(115deg,#f2f2f7,#faf9fc);border-color:#e3e2e8;border-radius:22px;padding:25px 27px}
.calendar-hero .primary{background:linear-gradient(135deg,#647dc7,#6956e8);box-shadow:0 8px 20px rgba(79,91,183,.18)}
.month-check{gap:12px}.month-check article{background:#fff;min-height:100px}
.day-tile{border:1px solid rgba(55,51,73,.1);box-shadow:0 5px 14px rgba(38,34,61,.04)}.empty-day{background:#f3f3f5;border-style:dashed;box-shadow:none}

.landing-nav{padding-bottom:17px;padding-top:17px}
.landing-hero{background:radial-gradient(circle at 84% 13%,rgba(255,157,94,.5),transparent 27%),radial-gradient(circle at 62% 94%,rgba(255,80,177,.28),transparent 32%),linear-gradient(120deg,#7838ef 0%,#8c2eed 48%,#c837de 100%);border-radius:24px;margin:0;min-height:650px;padding:64px max(6%,calc((100% - 1320px)/2))}
.landing-copy{align-self:center}.landing-copy h1{font-size:clamp(3.6rem,6.3vw,6.35rem);max-width:760px}.landing-copy h1 mark{box-decoration-break:clone;-webkit-box-decoration-break:clone}.landing-copy>p{max-width:620px}
.tax-visual{margin-left:-35px;min-height:540px}
.dashboard-mockup{border:0;border-radius:24px 0 0 24px;box-shadow:0 35px 80px rgba(35,9,79,.34);left:0;padding:22px;top:8%;transform:none;width:650px}
.mockup-title{align-items:center;display:flex;justify-content:space-between;padding:0 0 16px}.mockup-title span{display:block}.mockup-title small{color:#716d80;display:block;font-size:.63rem;text-transform:uppercase}.mockup-title strong{display:block;font-size:1.55rem;letter-spacing:-.04em;margin-top:2px}.mockup-title>b{background:#6956e8;border-radius:999px;color:#fff;font-size:.7rem;padding:10px 13px}
.mockup-months{border:1px solid #e8e6ed;border-radius:11px;display:grid;grid-template-columns:repeat(12,1fr);padding:5px}.mockup-months i{border-radius:7px;font-size:.54rem;font-style:normal;padding:6px 2px;text-align:center}.mockup-months i.active{background:#242231;color:#fff;font-weight:800}
.mockup-stats{display:grid;gap:7px;grid-template-columns:1.3fr repeat(3,1fr);margin-top:10px}.mockup-stats span{background:#fff;border:1px solid #e8e6ed;border-radius:11px;min-height:65px;padding:9px}.mockup-stats small{color:#716d80;display:block;font-size:.54rem}.mockup-stats b{display:block;font-size:1.15rem;margin-top:4px}.mockup-stats em{color:#716d80;font-size:.48rem;font-style:normal;font-weight:500}.mockup-stats .done i{background:linear-gradient(90deg,#50b77e 74%,#e4e5e9 74%);border-radius:9px;display:block;height:4px;margin-top:6px}
.mockup-view{align-items:center;background:#efeff3;border-radius:8px;display:flex;font-size:.55rem;gap:4px;margin:13px 0 10px;padding:3px;width:max-content}.mockup-view>*{padding:5px 8px}.mockup-view b{background:#fff;border-radius:6px}
.mockup-weekdays,.mockup-days{display:grid;gap:5px;grid-template-columns:repeat(5,1fr)}.mockup-weekdays span{color:#716d80;font-size:.48rem;text-align:center;text-transform:uppercase}
.mockup-event{border-radius:4px;font-size:.45rem;font-weight:750;height:11px;margin:5px 0;padding:2px 5px}.mockup-event.family{background:#ddf1dc;color:#3f7146}.mockup-event.housing{background:#f5dce5;color:#84405c}
.mockup-days>span{border:1px solid rgba(60,56,76,.1);border-radius:8px;display:flex;flex-direction:column;height:118px;padding:8px}.mockup-days b{font-size:.62rem}.mockup-days small{font-size:.5rem;line-height:1.4;margin-top:22px}.mockup-days em{align-self:flex-start;background:rgba(255,255,255,.7);border-radius:5px;font-size:.48rem;font-style:normal;font-weight:800;margin-top:auto;padding:3px 5px}.mockup-days .home{background:#e3f3e6}.mockup-days .office{background:#e0eff8}.mockup-days .travel{background:#fff0d8}.mockup-days .empty{background:#f4f4f5;color:#777382}

@media(max-width:1100px){.landing-hero{grid-template-columns:1fr}.tax-visual{margin:20px 0 0;min-height:500px}.dashboard-mockup{border-radius:24px;left:0;width:100%}}
@media(max-width:720px){.landing-hero{border-radius:0;margin:0;padding:50px 7%}.landing-copy h1{font-size:clamp(3rem,15vw,4.6rem)}.tax-visual{min-height:390px}.dashboard-mockup{min-width:620px;transform:scale(.72);transform-origin:left top}.topbar .brand-logo{max-width:38px;object-fit:cover;object-position:left}}

/* Startseiten-Kalender und Kennzahlen wie im gewählten Entwurf */
@media(min-width:821px){
    .landing-hero{grid-template-columns:56% 44%}
    .tax-visual{margin-left:18px;min-height:560px}
    .dashboard-mockup{border-radius:27px 0 0 27px;left:4%;padding:24px;top:2%;width:730px}
    .mockup-days>span{height:135px}
}

/* ==========================================================================
   STEUER-MASTER: kontrastreicher Abschlussbereich
   Diese Regeln stehen absichtlich am Dateiende, damit die allgemeine
   .hero-Gestaltung den dunklen Master-Hintergrund nicht überschreibt.
   ========================================================================== */
.hero.master-hero{
    background:
        radial-gradient(circle at 88% 18%,rgba(238,130,255,.52),transparent 27%),
        radial-gradient(circle at 58% 110%,rgba(53,218,204,.25),transparent 38%),
        linear-gradient(125deg,#202044 0%,#5537b5 48%,#922fd2 100%);
    border:1px solid rgba(255,255,255,.18);
    box-shadow:0 18px 42px rgba(60,39,142,.2);
    color:#fff;
}
.hero.master-hero .eyebrow{color:#dcd5ff}
.hero.master-hero h1,.hero.master-hero p{color:#fff}
.hero.master-hero .master-pdf{background:#fff;color:#3d317d}

/* Ruhige Kalenderkacheln: Überblick zuerst, Details im seitlichen Dialog. */
.day-tile{overflow:hidden;padding:0}
.day-tile-summary,.empty-day-action{background:transparent;border:0;color:inherit;cursor:pointer;display:flex;flex:1;flex-direction:column;font:inherit;min-height:130px;padding:11px;text-align:left;text-decoration:none;width:100%}
.day-tile-summary:focus-visible,.empty-day-action:focus-visible{outline:3px solid rgba(105,86,232,.35);outline-offset:-3px}
.day-tile .day-head{width:100%}
.day-overview{align-content:center;align-items:start;display:grid;flex:1;gap:7px;grid-template-rows:29px 24px;padding:10px 0}
.day-status-chip{align-items:center;background:rgba(255,255,255,.72);border:1px solid rgba(16,42,67,.12);border-radius:999px;box-sizing:border-box;display:inline-flex;gap:7px;grid-row:1;max-width:100%;min-width:0;padding:5px 9px}
.day-status-chip i{background:#807a94;border-radius:50%;flex:0 0 8px;height:8px;width:8px}
.day-status-chip b{font-size:.76rem;line-height:1.2;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.day-status-chip.status-homeoffice i{background:#15945f}.day-status-chip.status-office i{background:#247bc5}.day-status-chip.status-business_trip i{background:#dd9700}.day-status-chip.status-family_trip i{background:#7654d6}.day-status-chip.status-vacation i{background:#238e91}.day-status-chip.status-sick i{background:#ca6074}.day-status-chip.status-holiday i,.day-status-chip.status-public_holiday i{background:#b88a00}.day-status-chip.status-other i{background:#7654d6}
.more-entries{align-self:start;background:rgba(255,255,255,.62);border-radius:999px;color:var(--muted);font-size:.7rem;font-weight:800;grid-row:2;padding:4px 7px}
.day-total{align-items:center;border-top:1px solid rgba(16,42,67,.12);display:flex;justify-content:space-between;margin-top:auto;padding-top:8px;width:100%}
.day-total span{color:var(--muted);font-size:.64rem;font-weight:750}
.day-total strong{color:var(--text);font-size:.78rem}
.empty-day-action{justify-content:space-between}
.empty-day-action>b{align-self:center;color:var(--muted);font-size:.78rem;margin:auto 0}
.empty-day.tile-weekend{background:#f7f4fb;border:1px solid #e7e0f1;color:var(--muted)}
.tile-homeoffice{background:var(--tile-homeoffice)}.tile-office{background:var(--tile-office)}.tile-business_trip{background:var(--tile-business-trip)}.tile-family_trip{background:var(--tile-family-trip)}.tile-vacation{background:var(--tile-vacation)}.tile-sick{background:var(--tile-sick)}.tile-holiday{background:var(--tile-holiday)}.tile-other{background:var(--tile-other)}.day-tile.tile-public_holiday{background:var(--tile-public-holiday,#fff6bf);border-color:rgba(126,91,0,.22)}
.calendar-event.period-homeoffice{background:var(--tile-homeoffice);color:#276647}.calendar-event.period-office{background:var(--tile-office);color:#285f91}.calendar-event.period-business-trip{background:var(--tile-business-trip);color:#845a00}.calendar-event.period-family-trip{background:var(--tile-family-trip);color:#584092}.calendar-event.period-vacation{background:var(--tile-vacation);color:#216d70}.calendar-event.period-sick{background:var(--tile-sick);color:#913f50}.calendar-event.period-other{background:var(--tile-other);color:#575166}
.day-detail-dialog{background:transparent;border:0;height:100%;margin:0 0 0 auto;max-height:none;max-width:min(460px,100%);padding:0;width:100%}
.day-detail-dialog::backdrop{background:rgba(27,25,42,.35);backdrop-filter:blur(2px)}
.day-detail-panel{background:#fff;box-shadow:-18px 0 45px rgba(31,27,65,.16);display:flex;flex-direction:column;height:100%;padding:26px}
.day-detail-head{align-items:flex-start;border-bottom:1px solid #eceaf2;display:flex;justify-content:space-between;padding-bottom:18px}
.day-detail-head span{color:var(--muted);font-size:.76rem;font-weight:800;text-transform:uppercase}.day-detail-head h2{font-size:1.55rem;margin:4px 0 0}
.dialog-close{align-items:center;background:#f2f0f7;border:0;border-radius:999px;color:var(--text);cursor:pointer;display:flex;font-size:1.5rem;height:38px;justify-content:center;line-height:1;width:38px}
.day-detail-content{display:grid;gap:12px;overflow-y:auto;padding:20px 2px}
.day-detail-entry{background:#faf9fd;border:1px solid #e9e6f1;border-left:5px solid #c8c3da;border-radius:14px;display:grid;gap:12px;grid-template-columns:1fr auto;padding:16px}
.day-detail-entry.homeoffice{border-left-color:#6abb8a}.day-detail-entry.office{border-left-color:#69a8e8}.day-detail-entry.business_trip{border-left-color:#e2ad37}.day-detail-entry.family_trip{border-left-color:#9c7bd7}.day-detail-entry.vacation{border-left-color:#58b9ba}.day-detail-entry.sick{border-left-color:#d78997}.day-detail-entry.public_holiday{border-left-color:#c9a33c}
.day-detail-entry small{color:var(--muted);font-size:.7rem;font-weight:800;text-transform:uppercase}.day-detail-entry h3{font-size:1rem;margin:3px 0}.day-detail-entry p{color:var(--muted);font-size:.82rem;margin:0}
.day-detail-amount{font-size:.9rem;white-space:nowrap}.day-detail-actions{align-items:center;display:flex;gap:10px;grid-column:1/-1}.day-detail-actions form{margin:0}.day-detail-actions .button{font-size:.76rem;padding:7px 10px}
.danger-button{background:#fff;border:1px solid #e1a9ad;color:var(--danger)}
.day-detail-footer{align-items:center;border-top:1px solid #eceaf2;display:flex;gap:16px;justify-content:space-between;margin-top:auto;padding-top:18px}.day-detail-footer span{color:var(--muted);display:block;font-size:.72rem}.day-detail-footer strong{display:block;font-size:1.25rem;margin-top:3px}.day-detail-footer .button{font-size:.8rem}
body:has(.day-detail-dialog[open]){overflow:hidden}
@media(max-width:640px){.day-detail-dialog{height:min(82vh,720px);margin:auto 0 0;max-width:none;width:100%}.day-detail-panel{border-radius:22px 22px 0 0;box-shadow:0 -18px 45px rgba(31,27,65,.16);padding:20px}.day-detail-footer{align-items:stretch;flex-direction:column}.day-detail-footer .button{justify-content:center}.day-detail-entry{grid-template-columns:1fr}}
@media(min-width:821px) and (max-width:1000px){
    .landing-hero{grid-template-columns:55% 45%;padding-left:5%;padding-right:0}
    .landing-copy h1{font-size:clamp(3.45rem,7vw,4.7rem)}
    .landing-copy>p{font-size:.96rem;max-width:520px}
    .tax-visual{margin-left:8px}
    .dashboard-mockup{left:0;transform:scale(.9);transform-origin:left top;width:700px}
}
@media(max-width:820px){
    .landing-hero{grid-template-columns:1fr}
    .tax-visual{margin:24px 0 0;min-height:400px}
}
.cost-more{border-top:1px solid #eeecf2}
.cost-more>summary{background:#faf9fd;color:var(--primary);cursor:pointer;font-size:.82rem;font-weight:800;list-style:none;padding:14px 18px;text-align:center}
.cost-more>summary::-webkit-details-marker{display:none}
.cost-more>summary:after{content:"  ↓"}
.cost-more[open]>summary:after{content:"  ↑"}
.cost-more>summary:hover{background:#f2effd}


/* Aktueller Tag und unsichtbare Monatsränder. */
.day-tile.is-today{border-color:var(--primary);box-shadow:0 0 0 3px rgba(105,86,232,.28);position:relative;z-index:1}
.day-tile.is-today:hover{box-shadow:0 0 0 3px rgba(105,86,232,.34),0 6px 16px rgba(16,42,67,.11)}
.day-tile.outside{background:transparent;border:0;box-shadow:none;pointer-events:none;visibility:hidden}

/* Löschbereich in den Einstellungen. */
.danger-zone{border-color:#efc7ca}.danger-zone .settings-number{background:#fff0f1;color:var(--danger)}
.danger-zone .settings-body{background:#fffafa}.danger-confirm{align-items:flex-start;display:flex;gap:10px;max-width:760px}.danger-confirm input{flex:0 0 auto;margin-top:3px;width:auto}
.danger-zone .danger-button{justify-self:start;padding:12px 17px}.danger-zone .danger-button:hover{background:#fff0f1;border-color:var(--danger)}


/* Kalenderfokus: ausgewähltes Jahr, tatsächlicher Monat und kompakter Fortschritt. */
.calendar-hero-actions{align-items:center;display:flex;flex-wrap:wrap;gap:10px}
.calendar-hero-actions .year-current{background:#f1effd;border-color:#cfc8f8;color:var(--primary-dark);cursor:default;font-weight:850;pointer-events:none}
.month-tabs a.current-month{box-shadow:inset 0 0 0 1.5px rgba(105,86,232,.48);color:var(--text)}
.month-tabs a.active.current-month{box-shadow:inset 0 0 0 2px rgba(255,255,255,.72),0 0 0 1px rgba(105,86,232,.42);color:#fff}
.month-progress>.status-copy{max-width:calc(100% - 82px);min-width:0;position:relative;z-index:1}
.month-progress>.status-copy strong{margin-top:4px}
.month-progress>.status-illustration{top:7px}
.month-progress>.progress-track{height:4px}

/* Monatsüberschrift: ruhiger, einheitlich und unabhängig vom Monatsnamen einzeilig. */
.calendar-hero h1{
    font-size:var(--page-title-size);
    font-weight:var(--page-title-weight);
    letter-spacing:var(--page-title-tracking);
    line-height:var(--page-title-line-height);
    white-space:nowrap;
}
/* ==========================================================================
   TOPBAR: rechteckige Navigation aus den vorhandenen Menü-Komponenten
   ========================================================================== */
.topbar {
    padding-left: max(24px, calc((100% - 1132px) / 2));
    padding-right: max(24px, calc((100% - 1132px) / 2));
}

.app-nav a,
.user-menu > summary,
.account-menu > summary {
    background: #fff;
    border: 1px solid #e4e2eb;
    border-radius: 12px;
    box-shadow: 0 2px 7px rgba(20, 26, 56, .035);
    min-height: 42px;
}

.app-nav a {
    align-items: center;
    display: inline-flex;
    padding: 10px 15px;
}

.app-nav a:hover,
.user-menu > summary:hover,
.account-menu > summary:hover {
    background: #f7f5fc;
    border-color: #d8d3e9;
    color: var(--text);
}

.app-nav a.active:not(.master-link) {
    background: #f1eff8;
    border-color: #d9d4e8;
    color: #2c2840;
}

.app-nav .master-link,
.app-nav .master-link:hover,
.app-nav .master-link.active {
    border-radius: 12px;
}

.user-menu > summary {
    align-items: center;
    display: flex;
    padding: 10px 14px;
}

.account-menu {
    position: relative;
}

.account-menu > summary {
    align-items: center;
    cursor: pointer;
    display: flex;
    gap: 10px;
    list-style: none;
    padding: 6px 10px 6px 7px;
}

.account-menu > summary::-webkit-details-marker {
    display: none;
}

.account-avatar {
    align-items: center;
    background: #eeeafd;
    border-radius: 9px;
    color: var(--primary-dark);
    display: inline-flex;
    flex: 0 0 30px;
    font-size: .72rem;
    font-weight: 850;
    height: 30px;
    justify-content: center;
}

.account-copy {
    display: grid;
    line-height: 1.15;
    text-align: left;
}

.account-copy b {
    font-size: .82rem;
}

.account-copy small {
    color: var(--muted);
    font-size: .67rem;
    margin-top: 3px;
    max-width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.account-chevron {
    color: var(--muted);
    font-size: .9rem;
}

.account-popover {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 12px;
    box-shadow: 0 15px 35px rgba(32, 27, 72, .14);
    display: grid;
    gap: 4px;
    min-width: 230px;
    padding: 9px;
    position: absolute;
    right: 0;
    top: 49px;
}

.account-popover-head {
    align-items: center;
    border-bottom: 1px solid #eceaf2;
    display: flex;
    gap: 10px;
    margin-bottom: 3px;
    padding: 7px;
}

.account-popover-head div {
    display: grid;
}

.account-popover-head small {
    color: var(--muted);
    font-size: .72rem;
    margin-top: 3px;
}

.account-popover a,
.account-popover button {
    background: transparent;
    border: 0;
    border-radius: 8px;
    color: var(--muted);
    cursor: pointer;
    display: block;
    font: inherit;
    font-size: .84rem;
    font-weight: 700;
    padding: 9px;
    text-align: left;
    text-decoration: none;
    width: 100%;
}

.account-popover a:hover,
.account-popover button:hover {
    background: #f2f0fd;
    color: var(--primary);
}

@media (max-width: 720px) {
    .topbar {
        padding-left: 15px;
        padding-right: 15px;
    }

    .account-copy small {
        display: none;
    }
}


/* Gemeinsame Produktvorschau: entspricht dem aktuellen Kalenderdesign. */
.dashboard-mockup{background:#fff}
.mockup-stats{grid-template-columns:1.3fr repeat(4,1fr)}
.mockup-stats>span{align-items:center;display:flex;gap:4px;justify-content:space-between;overflow:hidden;padding:7px 5px 7px 9px;position:relative}
.mockup-stats>span>span{min-width:0;position:relative;z-index:1}
.mockup-stats img{flex:0 0 43px;height:43px;margin:-2px -7px -4px 0;object-fit:contain;width:43px}
.mockup-stats .mockup-progress{padding-bottom:13px}
.mockup-stats .mockup-progress img{height:46px;width:46px}
.mockup-stats .mockup-progress>i{background:linear-gradient(90deg,#17a673 74%,#e7edef 74%);border-radius:999px;bottom:7px;height:3px;left:9px;position:absolute;right:50px}
.mockup-stats .mockup-progress>strong{bottom:3px;color:#067647;font-size:.42rem;position:absolute;right:9px}
.mockup-view{width:auto}
.mockup-days>span{padding:8px}
.mockup-days>span>b{border-bottom:1px solid rgba(20,26,56,.11);padding-bottom:5px}
.mockup-days>span>small{color:#716d80;font-size:.43rem;margin-top:2px}
.mockup-days>span>i{align-items:center;background:rgba(255,255,255,.72);border:1px solid rgba(20,26,56,.1);border-radius:999px;display:flex;font-size:.46rem;font-style:normal;font-weight:750;gap:4px;margin-top:13px;max-width:100%;overflow:hidden;padding:4px 5px;white-space:nowrap}
.mockup-days>span>i u{background:#7654d6;border-radius:50%;flex:0 0 5px;height:5px;text-decoration:none;width:5px}
.mockup-days .home>i u{background:#15945f}.mockup-days .office>i u{background:#247bc5}.mockup-days .travel>i u{background:#dd9700}
.mockup-days>span>em{align-items:center;background:transparent;border-radius:0;border-top:1px solid rgba(20,26,56,.11);display:flex;justify-content:space-between;padding:5px 0 0;width:100%}
.mockup-days>span>em small{color:#716d80;font-size:.4rem;font-style:normal;font-weight:650}
.mockup-days .empty strong{align-self:center;color:#777382;font-size:.5rem;margin:auto}

/* Zweigeteilte Anmeldung im selben hellen, ruhigen Design wie die App. */
.login-page{align-items:stretch;background:#f7f6fb;display:block;padding:0}
.login-header{align-items:center;background:#fff;border-bottom:1px solid #ebe9f2;display:flex;justify-content:space-between;padding:17px max(5%,calc((100% - 1280px)/2))}
.login-header .back-home{color:var(--muted);margin:0;text-decoration:none}
.login-layout{display:grid;grid-template-columns:minmax(360px,42%) minmax(0,58%);min-height:calc(100vh - 72px)}
.login-panel{align-items:center;background:#fff;display:flex;padding:56px max(7%,calc((100vw - 1280px)/2))}
.login-card{box-shadow:none;max-width:470px;padding:0;width:100%}
.login-card h1{font-size:clamp(2.6rem,4.7vw,4.8rem);line-height:.96;margin:10px 0 20px}
.login-card>.muted{font-size:1rem;line-height:1.65;margin-bottom:28px}
.login-preview{background:radial-gradient(circle at 87% 10%,rgba(255,157,94,.48),transparent 28%),radial-gradient(circle at 55% 100%,rgba(255,80,177,.25),transparent 34%),linear-gradient(125deg,#7838ef,#aa31e5);color:#fff;display:flex;flex-direction:column;justify-content:center;overflow:hidden;padding:52px 0 52px 7%}
.login-preview>div:first-child{max-width:540px;padding-right:7%}
.login-preview h2{font-size:clamp(2.5rem,4.5vw,5rem);letter-spacing:-.055em;line-height:.95;margin:10px 0 18px}
.login-preview p{line-height:1.55;max-width:520px}
.login-preview .landing-kicker{color:#fff}
.login-mockup-wrap{margin-top:30px;min-height:410px;position:relative}
.login-mockup-wrap .dashboard-mockup{left:0;position:absolute;top:0;transform:scale(.76);transform-origin:left top;width:730px}
.login-card hanko-auth{display:block;margin-top:8px}

@media(max-width:980px){
    .login-layout{grid-template-columns:1fr}
    .login-panel{padding:52px 8%}
    .login-card{margin:auto}
    .login-preview{min-height:640px;padding-left:8%}
}
@media(max-width:640px){
    .login-header{padding:14px 6%}.login-header .back-home{font-size:.8rem}
    .login-panel{padding:45px 7%}.login-card h1{font-size:3rem}
    .login-preview{min-height:530px;padding:42px 0 42px 7%}
    .login-mockup-wrap{min-height:320px}
    .login-mockup-wrap .dashboard-mockup{transform:scale(.58)}
}


/* Kompakte Produktvorschau: aktuelles Design mit klarer Kalenderstruktur. */
.dashboard-mockup{
    background:#fbfafc;
    border-radius:26px;
    box-shadow:0 24px 60px rgba(25,20,70,.20);
    color:#151936;
    left:0;
    overflow:hidden;
    padding:24px;
    position:absolute;
    top:0;
    width:860px;
}
.preview-heading{align-items:center;display:flex;justify-content:space-between;margin-bottom:14px}
.preview-heading>div{display:grid;gap:5px}
.preview-heading small{color:#777386;font-size:10px;font-weight:750;letter-spacing:.07em;text-transform:uppercase}
.preview-heading strong{font-size:27px;letter-spacing:-.035em;line-height:1}
.preview-heading em{
    background:#6956e8;
    border-radius:11px;
    color:#fff;
    font-size:10px;
    font-style:normal;
    font-weight:800;
    padding:10px 14px;
}
.preview-months{
    background:#fff;
    border:1px solid #e3e2eb;
    border-radius:12px;
    display:grid;
    gap:3px;
    grid-template-columns:repeat(12,1fr);
    padding:4px;
}
.preview-months i{
    align-items:center;
    border-radius:7px;
    display:flex;
    font-size:8px;
    font-style:normal;
    font-weight:700;
    height:26px;
    justify-content:center;
}
.preview-months i.active{background:#262334;color:#fff}
.preview-stats{display:grid;gap:8px;grid-template-columns:1.3fr repeat(4,1fr);margin-top:10px}
.preview-stats article{
    align-items:center;
    background:transparent;
    border:0;
    border-radius:0;
    display:flex;
    height:78px;
    justify-content:space-between;
    overflow:hidden;
    padding:9px;
    position:relative;
}
.preview-stats article>div{display:grid;gap:1px;min-width:0;position:relative;z-index:1}
.preview-stats article small,.preview-stats article span{color:#777386;font-size:8px;font-weight:650}
.preview-stats article b{font-size:19px;line-height:1.1}
.preview-stats article b span{font-size:7px}
.preview-stats article img{
    background:transparent;
    border:0;
    border-radius:0;
    flex:0 0 48px;
    height:48px;
    margin-right:-4px;
    object-fit:contain;
    width:48px;
}
.preview-stats .preview-progress{padding-bottom:17px}
.preview-progress>i{
    background:linear-gradient(90deg,#38b779 74%,#e2e4e9 74%);
    border-radius:999px;
    bottom:9px;
    height:3px;
    left:9px;
    position:absolute;
    right:42px;
}
.preview-progress>em{bottom:5px;color:#168157;font-size:7px;font-style:normal;font-weight:850;position:absolute;right:9px}
.preview-view{
    background:#ececf2;
    border-radius:8px;
    display:flex;
    gap:2px;
    margin-top:10px;
    padding:3px;
    width:max-content;
}
.preview-view>*{border-radius:6px;font-size:8px;padding:6px 10px}
.preview-view b{background:#fff;box-shadow:0 1px 3px rgba(16,42,67,.1)}
.preview-weekdays,.preview-days{display:grid;gap:6px;grid-template-columns:repeat(7,1fr)}
.preview-weekdays{margin-top:10px}
.preview-weekdays span{
    background:transparent;
    border:0;
    border-radius:0;
    color:#777386;
    font-size:7px;
    font-weight:750;
    padding:0;
    text-align:center;
    text-transform:uppercase;
}
.preview-calendar{margin-top:5px}
.preview-event{
    border-radius:4px;
    font-size:6px;
    font-weight:800;
    height:10px;
    line-height:10px;
    margin:4px 0;
    overflow:hidden;
    padding:0 5px;
}
.preview-event.family{background:#ddefda;color:#36733f}
.preview-event.housing{background:#f4d9e4;color:#8d4662}
.preview-days article{
    border:1px solid rgba(20,26,56,.12);
    border-radius:9px;
    display:flex;
    flex-direction:column;
    height:107px;
    min-width:0;
    padding:8px;
}
.preview-days article.home{background:#dff1e3}
.preview-days article.office{background:#dcecf6}
.preview-days article.travel{background:#fff0d7}
.preview-days article.empty{background:#f2f2f4;color:#777386}
.preview-days article>b{background:transparent;border:0;border-radius:0;font-size:8px;padding:0}
.preview-days article>small{background:transparent;border:0;border-radius:0;color:#716d80;font-size:6px;margin-top:2px;padding:0}
.preview-days article>div{color:#625e70;display:grid;font-size:6px;gap:2px;line-height:1.25;margin:auto 0}
.preview-days article>div strong{color:#302d3d;font-size:7px}
.preview-days article>em{
    align-self:flex-start;
    background:#fff;
    border-radius:5px;
    color:#262334;
    font-size:6px;
    font-style:normal;
    font-weight:850;
    margin-top:auto;
    padding:4px 5px;
}
.preview-days-secondary article{height:43px}
.preview-days-secondary article>small{margin-top:4px}
.tax-visual .dashboard-mockup{left:2%;transform:scale(.9);transform-origin:left top}
.login-mockup-wrap .dashboard-mockup{transform:scale(.78);transform-origin:left top}
.login-mockup-wrap{min-height:470px}

@media(max-width:1100px){
    .tax-visual .dashboard-mockup{transform:scale(.68)}
    .login-mockup-wrap .dashboard-mockup{transform:scale(.68)}
}
@media(max-width:820px){
    .tax-visual .dashboard-mockup{transform:scale(.72)}
    .login-mockup-wrap .dashboard-mockup{transform:scale(.65)}
}
@media(max-width:640px){
    .tax-visual .dashboard-mockup,
    .login-mockup-wrap .dashboard-mockup{transform:scale(.43)}
    .login-mockup-wrap{min-height:290px}
}


/* Produktvorschau: freie Kennzahlen und mehr vertikaler Kalenderraum. */
.preview-stats article,
.preview-stats article > div {
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    outline: 0;
}
.preview-stats article > div {
    padding: 0;
}
.preview-days article {
    height: 132px;
}
.preview-days-secondary article {
    height: 68px;
}
.tax-visual {
    min-height: 650px;
}
.login-mockup-wrap {
    min-height: 550px;
}
@media (min-width: 1101px) {
    .tax-visual .dashboard-mockup {
        transform: scale(.96);
    }
    .login-mockup-wrap .dashboard-mockup {
        transform: scale(.84);
    }
}
@media (max-width: 1100px) and (min-width: 821px) {
    .tax-visual {
        min-height: 600px;
    }
    .login-mockup-wrap {
        min-height: 520px;
    }
}
@media (max-width: 820px) {
    .tax-visual {
        min-height: 475px;
    }
}
@media (max-width: 640px) {
    .tax-visual {
        min-height: 365px;
    }
    .login-mockup-wrap {
        min-height: 340px;
    }
}


/* Eintrags-Pills wie im echten Kalender; die zweite Woche bleibt bewusst angeschnitten. */
.preview-days article.family { background: #e4f1df; }
.preview-days article { overflow: hidden; }
.preview-entry-pill,
.preview-days article > div.preview-entry-pill {
    align-items: center;
    align-self: stretch;
    background: rgba(255,255,255,.9);
    border: 1px solid rgba(20,26,56,.12);
    border-radius: 999px;
    display: flex;
    gap: 6px;
    margin: auto 0 9px;
    min-height: 27px;
    min-width: 0;
    padding: 6px 8px;
}
.preview-entry-pill u {
    border-radius: 50%;
    flex: 0 0 7px;
    height: 7px;
    text-decoration: none;
    width: 7px;
}
.preview-entry-pill.home u { background: #15945f; }
.preview-entry-pill.office u { background: #247bc5; }
.preview-entry-pill.travel u { background: #dd9700; }
.preview-entry-pill.family u { background: #6b9f4a; }
.preview-entry-pill strong {
    color: #302d3d;
    flex: 1 1 auto;
    font-size: 7.5px;
    font-weight: 750;
    line-height: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.preview-entry-pill em {
    color: #302d3d;
    flex: 0 0 auto;
    font-size: 7px;
    font-style: normal;
    font-weight: 850;
    margin-left: auto;
    white-space: nowrap;
}
.preview-days article footer {
    align-items: center;
    border-top: 1px solid rgba(20,26,56,.11);
    display: flex;
    flex: 0 0 auto;
    gap: 6px;
    justify-content: space-between;
    min-height: 19px;
    padding-top: 7px;
    width: 100%;
}
.preview-days article footer span {
    color: #716d80;
    font-size: 6px;
    font-weight: 650;
}
.preview-days article footer b {
    color: #302d3d;
    font-size: 7px;
    font-weight: 850;
    white-space: nowrap;
}
.preview-no-entry {
    align-self: center;
    color: #777386 !important;
    font-size: 6px !important;
    margin: auto !important;
}


/* Produktvorschau: echte Kalender-Komponenten statt separatem Nachbau. */
.dashboard-mockup {
    height: 650px;
    padding: 18px;
}
.dashboard-mockup .hero.calendar-hero {
    margin-bottom: 16px;
    padding: 20px 22px;
}
.dashboard-mockup .calendar-hero h1 {
    font-size: 2rem;
}
.dashboard-mockup .calendar-hero-actions {
    flex-wrap: nowrap;
    gap: 7px;
}
.dashboard-mockup .calendar-hero-actions .button {
    font-size: .72rem;
    padding: 9px 12px;
    white-space: nowrap;
}
.dashboard-mockup .month-tabs {
    margin-bottom: 14px;
    overflow: hidden;
    padding: 5px;
}
.dashboard-mockup .month-tabs span {
    border: 0;
    border-radius: 12px;
    color: var(--muted);
    flex: 1 0 auto;
    font-size: .72rem;
    font-weight: 720;
    padding: 8px 9px;
    text-align: center;
}
.dashboard-mockup .month-tabs span.active {
    background: var(--primary);
    color: #fff;
}
.dashboard-mockup .month-check {
    gap: 8px;
    margin: 0 0 14px;
}
.dashboard-mockup .month-check article {
    min-height: 82px;
    padding: 11px;
}
.dashboard-mockup .month-check span {
    font-size: .67rem;
}
.dashboard-mockup .month-check strong {
    font-size: 1.15rem;
}
.dashboard-mockup .month-check strong small,
.dashboard-mockup .month-check .status-card small {
    font-size: .62rem;
}
.dashboard-mockup .status-illustration,
.dashboard-mockup .status-card.home .status-illustration,
.dashboard-mockup .status-card.travel .status-illustration {
    flex-basis: 66px;
    height: 66px;
    width: 66px;
}
.dashboard-mockup .month-progress .status-illustration {
    right: 1px;
    top: 7px;
}
.dashboard-mockup .month-progress em {
    bottom: 7px;
    font-size: .65rem;
    left: 11px;
}
.dashboard-mockup .progress-track {
    bottom: 22px;
    left: 11px;
    right: 76px;
}
.dashboard-mockup .view-bar {
    margin-bottom: 8px;
}
.dashboard-mockup .view-switch span {
    border-radius: 10px;
    color: var(--muted);
    font-size: .72rem;
    font-weight: 700;
    padding: 7px 11px;
}
.dashboard-mockup .view-switch span.active {
    background: #fff;
    box-shadow: 0 1px 4px rgba(16,42,67,.1);
    color: var(--text);
}
.dashboard-mockup .calendar-grid,
.dashboard-mockup .month-weeks {
    min-width: 0;
}
.dashboard-mockup .weekday-row {
    font-size: .62rem;
}
.dashboard-mockup .weekday-row div {
    padding: 5px;
}
.dashboard-mockup .month-weeks {
    gap: 7px;
}
.dashboard-mockup .week-days-grid {
    gap: 6px;
}
.dashboard-mockup .day-tile,
.dashboard-mockup .day-tile-summary,
.dashboard-mockup .empty-day-action {
    min-height: 128px;
}
.dashboard-mockup .day-tile-summary,
.dashboard-mockup .empty-day-action {
    cursor: default;
    padding: 9px;
}
.dashboard-mockup .day-head {
    padding-bottom: 6px;
}
.dashboard-mockup .day-head strong {
    font-size: .72rem;
}
.dashboard-mockup .day-head span {
    font-size: .58rem;
}
.dashboard-mockup .day-overview {
    gap: 5px;
    grid-template-rows: 27px 20px;
    padding: 8px 0;
}
.dashboard-mockup .day-status-chip {
    gap: 5px;
    padding: 5px 7px;
}
.dashboard-mockup .day-status-chip i {
    flex-basis: 6px;
    height: 6px;
    width: 6px;
}
.dashboard-mockup .day-status-chip b {
    font-size: .61rem;
}
.dashboard-mockup .day-total {
    padding-top: 6px;
}
.dashboard-mockup .day-total span {
    font-size: .52rem;
}
.dashboard-mockup .day-total strong {
    font-size: .63rem;
}
.dashboard-mockup .empty-day-action > b {
    font-size: .63rem;
}
.dashboard-mockup .event-lanes {
    grid-auto-rows: 4px;
}
.dashboard-mockup .calendar-event {
    border-radius: 999px;
}
.dashboard-mockup .preview-secondary-week {
    margin-top: 1px;
}


/* Produktvorschau: Kategoriefarben bewahren und erst unter der zweiten Woche abschneiden. */
.dashboard-mockup {
    height: 690px;
}
.dashboard-mockup .day-tile.tile-homeoffice {
    background: var(--tile-homeoffice);
}
.dashboard-mockup .day-tile.tile-office {
    background: var(--tile-office);
}
.dashboard-mockup .day-tile.tile-business_trip {
    background: var(--tile-business-trip);
}
.dashboard-mockup .day-tile.tile-family_trip {
    background: var(--tile-family-trip);
}
.tax-visual {
    min-height: 690px;
}
.login-mockup-wrap {
    min-height: 590px;
}
@media (max-width: 1100px) {
    .tax-visual {
        min-height: 600px;
    }
}
@media (max-width: 820px) {
    .tax-visual {
        min-height: 500px;
    }
}
@media (max-width: 640px) {
    .tax-visual {
        min-height: 380px;
    }
    .login-mockup-wrap {
        min-height: 350px;
    }
}


/* Öffentliche Homepage: Rhythmus, Typografie und Preise */
.landing-nav nav{gap:24px}
.landing-copy h1{letter-spacing:-.035em;line-height:1.02}
.landing-copy h1>span{display:block;max-width:720px}
.landing-copy h1 mark{line-height:1.08;margin-top:18px}
.landing-page .dashboard-mockup .day-total strong{color:var(--success)}
.landing-reasons{padding-bottom:72px;padding-top:72px}
.feature-section{padding-bottom:88px;padding-top:88px}
.pricing-section{align-items:center;background:#fff;display:grid;gap:64px;grid-template-columns:minmax(0,1fr) minmax(340px,480px);padding:88px 6%}
.pricing-copy{max-width:680px}
.pricing-copy .landing-kicker{color:#6956e8}
.pricing-copy h2{font-size:clamp(2.2rem,4.6vw,4.2rem);letter-spacing:-.05em;line-height:1.02;margin:0 0 22px}
.pricing-copy p{color:var(--muted);font-size:1.05rem;line-height:1.65;max-width:620px}
.pricing-card{background:linear-gradient(145deg,#f7f4ff,#fff8fb);border:1px solid #e7e1f5;border-radius:24px;box-shadow:0 18px 50px rgba(54,39,104,.1);padding:32px}
.pricing-card>span{color:#6956e8;font-size:.78rem;font-weight:850;letter-spacing:.08em;text-transform:uppercase}
.pricing-card>strong{display:block;font-size:clamp(2.1rem,4vw,3.2rem);letter-spacing:-.05em;margin:12px 0 4px}
.pricing-card>p{color:var(--muted);margin:0 0 24px}
.pricing-card ul{display:grid;gap:12px;list-style:none;margin:0 0 28px;padding:0}
.pricing-card li{padding-left:27px;position:relative}
.pricing-card li:before{color:#6956e8;content:"✓";font-weight:900;left:0;position:absolute}
.pricing-card .landing-primary{background:#6956e8;color:#fff}
.pricing-card .landing-primary:hover{background:#5741d6}
@media(max-width:1100px){
    .landing-copy h1>span{max-width:820px}
    .pricing-section{gap:36px}
}
@media(max-width:1000px){
    .landing-nav nav{display:flex;grid-column:1/-1;grid-row:2;justify-content:flex-start;overflow-x:auto;padding-bottom:2px;scrollbar-width:none;white-space:nowrap}
    .landing-nav nav::-webkit-scrollbar{display:none}
    .pricing-section{grid-template-columns:1fr}
    .pricing-card{max-width:620px;width:100%}
}
@media(max-width:720px){
    .landing-nav{gap:14px;padding:14px 7%}
    .landing-nav nav{gap:12px}
    .landing-nav nav a{font-size:.82rem;padding:7px 4px}
    .login-button{padding:9px 18px}
    .landing-copy h1{font-size:clamp(2.8rem,14vw,4.4rem);line-height:1.04}
    .landing-copy h1 mark{margin-top:15px;padding-left:9px;padding-right:9px}
    .landing-copy>p{font-size:1rem}
    .landing-actions{align-items:flex-start;flex-direction:column;gap:15px}
    .landing-reasons,.feature-section,.pricing-section{padding-bottom:56px;padding-top:56px}
    .pricing-card{padding:25px}
}


/* Kontomenü und Profileinstellungen */
.nav-actions > .invite-button {
    order: 1;
}
.nav-actions > .account-menu {
    order: 2;
    position: relative;
}
.account-menu > summary {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 50%;
    box-shadow: none;
    display: flex;
    font-size: 0;
    gap: 0;
    height: 48px;
    justify-content: center;
    line-height: 0;
    min-height: 48px;
    padding: 0;
    position: relative;
    width: 48px;
}
.account-menu > summary:hover {
    background: #f5f2ff;
    border: 0;
}
.account-menu > summary:focus-visible,
.invite-button:focus-visible,
.account-menu-item:focus-visible,
.invite-dialog-close:focus-visible,
.profile-upload-label:focus-within {
    outline: 3px solid rgba(105,86,232,.28);
    outline-offset: 2px;
}
.account-avatar {
    border-radius: 50%;
    flex: 0 0 40px;
    height: 40px;
    overflow: hidden;
    width: 40px;
}
.account-avatar-image {
    display: block;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    width: 100%;
}
.account-menu > summary > .account-avatar {
    border: 2px solid #d8ccff;
    flex: none;
    height: 48px;
    left: 50%;
    margin: 0;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 48px;
}
.invite-button {
    align-items: center;
    background: #f1edff;
    border: 1px solid #ddd5ff;
    border-radius: 11px;
    color: #5542d4;
    cursor: pointer;
    display: inline-flex;
    font: inherit;
    font-size: .82rem;
    font-weight: 800;
    gap: 6px;
    min-height: 38px;
    padding: 8px 11px;
}
.invite-button:hover { background: #e8e1ff; }
.invite-button > span {
    font-size: 1.15rem;
    font-weight: 600;
    line-height: .8;
}
.account-popover {
    border: 1px solid #e9e5f2;
    border-radius: 18px;
    box-shadow: 0 22px 55px rgba(36,28,75,.16);
    gap: 0;
    min-width: 300px;
    padding: 10px;
    top: 50px;
    z-index: 50;
}
.account-popover-head {
    gap: 12px;
    margin-bottom: 7px;
    padding: 10px 9px 14px;
}
.account-popover-head .account-avatar {
    flex-basis: 44px;
    height: 44px;
    width: 44px;
}
.account-popover-head b {
    font-size: .9rem;
    overflow-wrap: anywhere;
}
.account-popover-head small {
    max-width: 205px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.account-popover-nav {
    display: grid;
    gap: 2px;
}
.account-popover .account-menu-item {
    align-items: center;
    border-radius: 10px;
    color: #4d4960;
    display: flex;
    gap: 11px;
    min-height: 42px;
    padding: 10px 11px;
}
.account-popover .account-menu-item:hover {
    background: #f2efff;
    color: #5542d4;
}
.account-menu-item svg {
    fill: none;
    flex: 0 0 19px;
    height: 19px;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.8;
    width: 19px;
}
.account-menu-item > span:nth-of-type(1) { flex: 1; }
.pro-badge {
    background: #e9e2ff;
    border-radius: 999px;
    color: #6956e8;
    flex: 0 0 auto !important;
    font-size: .62rem;
    font-weight: 900;
    letter-spacing: .05em;
    padding: 4px 7px;
}
.account-logout-form {
    border-top: 1px solid #eeeaf4;
    margin-top: 7px !important;
    padding-top: 7px;
}
.account-popover .account-menu-item-danger { color: #a43b35; }
.account-popover .account-menu-item-danger:hover {
    background: #fff0ef;
    color: #942d28;
}
.invite-dialog {
    background: transparent;
    border: 0;
    max-width: 440px;
    padding: 18px;
    width: calc(100% - 28px);
}
.invite-dialog::backdrop { background: rgba(24,20,45,.42); }
.invite-dialog-card {
    background: #fff;
    border: 1px solid #e8e4f0;
    border-radius: 20px;
    box-shadow: 0 25px 70px rgba(28,21,66,.22);
    display: grid;
    gap: 13px;
    padding: 26px;
    position: relative;
}
.invite-dialog-card h2 { margin: 0; }
.invite-dialog-card label { font-size: .85rem; font-weight: 750; }
.invite-dialog-card input {
    border: 1px solid var(--border);
    border-radius: 10px;
    font: inherit;
    padding: 12px;
    width: 100%;
}
.invite-dialog-card .button:disabled {
    cursor: not-allowed;
    opacity: .5;
}
.invite-dialog-close {
    background: #f4f1fa;
    border: 0;
    border-radius: 50%;
    color: var(--muted);
    cursor: pointer;
    font-size: 1.2rem;
    height: 32px;
    position: absolute;
    right: 16px;
    top: 16px;
    width: 32px;
}
.profile-settings-form { display: grid; gap: 20px; }
.profile-settings-form > label {
    display: grid;
    font-weight: 750;
    gap: 8px;
    max-width: 520px;
}
.profile-settings-form > label input {
    border: 1px solid var(--border);
    border-radius: 10px;
    font: inherit;
    padding: 12px 13px;
}
.profile-avatar-editor {
    align-items: center;
    display: flex;
    gap: 18px;
}
.profile-avatar-preview .account-avatar {
    flex-basis: 76px;
    font-size: 1.2rem;
    height: 76px;
    width: 76px;
}
.profile-avatar-editor > div:last-child {
    align-items: flex-start;
    display: grid;
    gap: 8px;
}
.profile-avatar-editor input[type="file"] {
    height: 1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    width: 1px;
}
.profile-upload-label {
    background: #f1edff;
    border: 1px solid #ddd5ff;
    border-radius: 9px;
    color: #5542d4;
    cursor: pointer;
    font-size: .82rem;
    font-weight: 800;
    padding: 9px 12px;
}
.profile-avatar-editor small { color: var(--muted); }
.profile-remove {
    align-items: center;
    color: #8f3732;
    display: flex;
    font-size: .8rem;
    font-weight: 700;
    gap: 7px;
    margin-top: 3px;
}
.profile-settings-form > .button { justify-self: start; }

@media (max-width: 720px) {
    .nav-actions { gap: 5px; }
    .invite-button { padding: 8px 9px; }
    .account-popover {
        min-width: min(300px, calc(100vw - 30px));
        position: fixed;
        right: 15px;
        top: 65px;
    }
}
@media (max-width: 430px) {
    .invite-button { font-size: .76rem; }
    .profile-avatar-editor { align-items: flex-start; flex-direction: column; }
}

/* Kalenderseite: kompakter vertikaler Rhythmus ohne Größenverlust bei Icons. */
.container:has(> .calendar-hero) {
    padding-top: 18px;
}

.calendar-hero + .month-tabs {
    margin-bottom: 10px;
    padding-bottom: 4px;
}

.calendar-hero + .month-tabs a {
    padding-bottom: 6px;
    padding-top: 6px;
}

/* Gemeinsame Monatsübersicht */
.calendar-hero {
    background: transparent;
    border: 0;
    box-shadow: none;
    margin-bottom: 8px;
    padding: 4px 2px 2px;
}

.month-overview {
    background: #fff;
    border: 1px solid #ddd7f5;
    border-radius: 20px;
    box-shadow: 0 10px 28px rgba(53, 42, 112, .055);
    display: block;
    margin: 10px 0 20px;
    overflow: hidden;
}

.month-overview .month-overview-metrics {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    padding: 18px 18px 14px;
}

.month-overview .month-overview-metric {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    min-height: 150px;
    overflow: visible;
    padding: 0 18px;
    position: relative;
}

.month-overview .month-overview-metric + .month-overview-metric {
    border-left: 1px solid #e7e3ef;
}

.month-overview .status-illustration {
    display: block;
    flex: 0 0 96px;
    height: 96px;
    margin: 0 0 8px;
    object-fit: contain;
    width: 96px;
}

.month-overview .status-card.home .status-illustration,
.month-overview .status-card.travel .status-illustration {
    height: 100px;
    width: 100px;
}

.month-overview .status-copy {
    min-width: 0;
    position: static;
    text-align: center;
    width: 100%;
}

.month-overview .status-copy span {
    color: var(--text);
    font-size: .88rem;
    font-weight: 750;
    line-height: 1.25;
}

.month-overview .status-copy strong {
    align-items: baseline;
    display: flex;
    font-size: 1.18rem;
    gap: .3rem;
    justify-content: center;
    line-height: 1.25;
    margin-top: 6px;
}

.month-overview .status-copy strong small {
    color: var(--text);
    font-size: .88rem;
    font-weight: 600;
}

.month-progress-ring {
    align-items: center;
    background: conic-gradient(var(--primary) var(--progress), #ebe7fb 0);
    border-radius: 50%;
    display: flex;
    flex: 0 0 96px;
    height: 96px;
    justify-content: center;
    margin-bottom: 8px;
    position: relative;
    width: 96px;
}

.month-progress-ring::before {
    background: #fff;
    border-radius: 50%;
    content: "";
    inset: 11px;
    position: absolute;
}

.month-progress-ring span {
    color: var(--primary-dark);
    font-size: 1.35rem;
    font-weight: 850;
    position: relative;
    z-index: 1;
}

.month-overview-footer {
    align-items: center;
    border-top: 1px solid #e7e3ef;
    display: flex;
    gap: 24px;
    justify-content: space-between;
    margin: 0 24px;
    padding: 12px 6px 14px;
}

.month-overview-footer p {
    color: var(--muted);
    font-size: .9rem;
    margin: 0;
}

.month-overview-footer .view-switch {
    flex: 0 0 auto;
}

.month-overview-footer .button {
    flex: 0 0 auto;
}

@media (max-width: 900px) {
    .month-overview .month-overview-metrics {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .month-overview .month-overview-metric:nth-child(4) {
        border-left: 0;
    }

    .month-overview .month-overview-metric:nth-child(n+4) {
        border-top: 1px solid #e7e3ef;
        padding-top: 24px;
    }
}

@media (max-width: 650px) {
    .calendar-hero {
        padding-left: 0;
        padding-right: 0;
    }

    .month-overview .month-overview-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        padding: 14px 12px;
    }

    .month-overview .month-overview-metric {
        min-height: 152px;
        padding: 12px 10px;
    }

    .month-overview .month-overview-metric:nth-child(odd) {
        border-left: 0;
    }

    .month-overview .month-overview-metric:nth-child(even) {
        border-left: 1px solid #e7e3ef;
    }

    .month-overview .month-overview-metric:nth-child(n+3) {
        border-top: 1px solid #e7e3ef;
    }

    .month-overview .month-overview-metric:last-child {
        border-left: 0;
        grid-column: 1 / -1;
    }

    .month-overview-footer {
        align-items: stretch;
        flex-direction: column;
        margin: 0 18px;
    }

    .month-overview-footer .view-switch {
        width: 100%;
    }

    .month-overview-footer .view-switch a {
        flex: 1;
        text-align: center;
    }

    .month-overview-footer .button {
        justify-content: center;
        text-align: center;
        width: 100%;
    }
}



/* Monatsdashboard als ein zusammenhaengender, kompakter Block. */
.dashboard-summary-card {
    background: var(--surface);
    border: 1px solid #ddd7f5;
    border-radius: 20px;
    box-shadow: 0 10px 28px rgba(53, 42, 112, .055);
    margin: 0 0 18px;
    overflow: hidden;
}

.dashboard-summary-card > .calendar-hero {
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    margin: 0;
    padding: 16px 22px 14px;
}

.dashboard-summary-card > .month-tabs {
    border-bottom: 1px solid #e7e3ef;
    gap: 5px;
    margin: 0;
    padding: 8px 16px;
}

.dashboard-summary-card > .month-tabs a {
    padding-bottom: 6px;
    padding-top: 6px;
}

.dashboard-summary-card > .month-overview {
    border: 0;
    border-radius: 0;
    box-shadow: none;
    margin: 0;
    overflow: visible;
}

.dashboard-summary-card .month-overview-metrics {
    padding: 14px 18px 10px;
}

.dashboard-summary-card .month-overview-metric {
    min-height: 146px;
}

.dashboard-summary-card .month-overview-footer {
    margin: 0 24px;
    padding: 10px 6px 12px;
}

@media (max-width: 780px) {
    .dashboard-summary-card > .calendar-hero {
        padding: 14px 16px 12px;
    }

    .dashboard-summary-card > .month-tabs {
        padding: 7px 12px;
    }

    .dashboard-summary-card .month-overview-metrics {
        padding-bottom: 10px;
        padding-top: 12px;
    }
}

@media (max-width: 650px) {
    .dashboard-summary-card {
        border-radius: 16px;
    }

    .dashboard-summary-card > .calendar-hero {
        padding-left: 14px;
        padding-right: 14px;
    }

    .dashboard-summary-card .month-overview-footer {
        margin: 0 14px;
    }
}


main.container:has(> .dashboard-summary-card) {
    padding-top: 18px;
}

@media (max-width: 780px) {
    main.container:has(> .dashboard-summary-card) {
        padding-top: 14px;
    }
}


/* Kalenderdashboard: weisse, rahmenlose Oberflaeche. */
body:has(main.container > .dashboard-summary-card) {
    background: #fff;
}

.dashboard-summary-card {
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    overflow: visible;
}

.dashboard-summary-card > .calendar-hero,
.dashboard-summary-card > .month-tabs,
.dashboard-summary-card > .month-overview {
    background: transparent;
}

@media (max-width: 650px) {
    .dashboard-summary-card {
        border-radius: 0;
    }
}


/* Einheitliche Navigation und Auswahlfelder; Einladen bleibt bewusst unveraendert. */
.app-nav {
    gap: 8px;
}

.app-nav a,
.app-nav .master-link {
    align-items: center;
    background: #fff;
    border: 1px solid transparent;
    border-radius: 11px;
    box-shadow: none;
    color: var(--muted) !important;
    display: inline-flex;
    min-height: 38px;
    padding: 8px 12px;
}

.app-nav a:hover,
.app-nav .master-link:hover {
    background: #fff;
    border-color: #ddd5ff;
    box-shadow: 0 3px 10px rgba(83, 65, 173, .08);
    color: var(--primary-dark) !important;
}

.app-nav a.active,
.app-nav .master-link.active {
    background: #fff;
    border-color: #c9beff;
    box-shadow: 0 3px 10px rgba(83, 65, 173, .1);
    color: var(--primary-dark) !important;
    font-weight: 850;
}

.calendar-hero-actions {
    gap: 8px;
}

.calendar-hero-actions .button.secondary {
    align-items: center;
    background: #fff;
    border: 1px solid #ddd5ff;
    border-radius: 11px;
    box-shadow: none;
    color: var(--muted);
    display: inline-flex;
    justify-content: center;
    min-height: 38px;
    padding: 8px 12px;
}

.calendar-hero-actions a.button.secondary:hover {
    background: #fff;
    border-color: #bfb2ff;
    box-shadow: 0 3px 10px rgba(83, 65, 173, .08);
    color: var(--primary-dark);
}

.calendar-hero-actions .year-current {
    background: var(--primary);
    border-color: var(--primary);
    color: #fff;
}

.dashboard-summary-card > .month-tabs {
    background: #fff;
    border: 1px solid #ddd5ff;
    border-radius: 13px;
    box-shadow: none;
    overflow: hidden;
    padding: 4px;
}

.dashboard-summary-card > .month-tabs a {
    align-items: center;
    background: #fff;
    border: 1px solid transparent;
    border-radius: 9px;
    display: inline-flex;
    justify-content: center;
    min-height: 34px;
    padding: 6px 10px;
}

.dashboard-summary-card > .month-tabs a:hover {
    background: #fff;
    border-color: #ddd5ff;
    color: var(--primary-dark);
}

.dashboard-summary-card > .month-tabs a.active,
.dashboard-summary-card > .month-tabs a.active.current-month {
    background: var(--primary);
    border-color: var(--primary);
    box-shadow: none;
    color: #fff;
}

.dashboard-summary-card .view-switch {
    background: #fff;
    border: 1px solid #ddd5ff;
    border-radius: 11px;
    box-shadow: none;
    gap: 2px;
    padding: 3px;
}

.dashboard-summary-card .view-switch a {
    align-items: center;
    background: #fff;
    border: 1px solid transparent;
    border-radius: 8px;
    display: inline-flex;
    justify-content: center;
    min-height: 32px;
    padding: 6px 11px;
}

.dashboard-summary-card .view-switch a:hover {
    background: #fff;
    border-color: #ddd5ff;
    color: var(--primary-dark);
}

.dashboard-summary-card .view-switch a.active {
    background: var(--primary);
    border-color: var(--primary);
    box-shadow: none;
    color: #fff;
}

@media (max-width: 720px) {
    .app-nav a,
    .app-nav .master-link {
        min-height: 34px;
        padding: 7px 10px;
    }
}


/* Navigation als gemeinsames Segment; Hauptaktion dimensionsgleich. */
.app-nav {
    background: #fff;
    border: 1px solid #ddd5ff;
    border-radius: 11px;
    gap: 2px;
    padding: 3px;
}

.app-nav a,
.app-nav .master-link {
    border-radius: 8px;
    min-height: 32px;
    padding: 6px 11px;
}

.app-nav a.active,
.app-nav .master-link.active {
    background: var(--primary);
    border-color: var(--primary);
    box-shadow: none;
    color: #fff !important;
}

.month-overview-footer .button.primary {
    align-items: center;
    border: 1px solid var(--primary);
    border-radius: 11px;
    display: inline-flex;
    justify-content: center;
    min-height: 40px;
    padding: 7px 14px;
}

@media (max-width: 720px) {
    .app-nav {
        overflow-x: auto;
        scrollbar-width: none;
    }

    .app-nav::-webkit-scrollbar {
        display: none;
    }

    .app-nav a,
    .app-nav .master-link {
        flex: 0 0 auto;
        white-space: nowrap;
    }
}


/* Gemeinsame Button-Sprache fuer Navigation und Aktionen. */
.app-nav,
.dashboard-summary-card .view-switch {
    background: #fff;
    border: 1px solid #ddd5ff;
    border-radius: 11px;
    box-shadow: none;
    gap: 2px;
    padding: 3px;
}

.app-nav a,
.app-nav .master-link,
.dashboard-summary-card .view-switch a {
    align-items: center;
    background: #fff;
    border: 1px solid transparent;
    border-radius: 8px;
    box-shadow: none;
    color: var(--muted) !important;
    display: inline-flex;
    font-weight: 700;
    justify-content: center;
    min-height: 32px;
    padding: 6px 11px;
    text-decoration: none;
}

.app-nav a:hover,
.app-nav .master-link:hover,
.dashboard-summary-card .view-switch a:hover {
    background: #fff;
    border-color: #ddd5ff;
    color: var(--primary-dark) !important;
}

.app-nav a.active,
.app-nav .master-link.active,
.dashboard-summary-card .view-switch a.active {
    background: var(--primary) !important;
    border-color: var(--primary) !important;
    box-shadow: none;
    color: #fff !important;
    font-weight: 850;
}

.app-nav a.active *,
.app-nav .master-link.active *,
.dashboard-summary-card .view-switch a.active * {
    color: #fff !important;
}

.invite-button,
.month-overview-footer .button.primary {
    align-items: center;
    background: #fff;
    border: 1px solid #ddd5ff;
    border-radius: 11px;
    box-shadow: none;
    color: var(--primary-dark);
    display: inline-flex;
    font: inherit;
    font-size: .82rem;
    font-weight: 800;
    justify-content: center;
    min-height: 40px;
    padding: 7px 14px;
    text-decoration: none;
}

.invite-button:hover,
.month-overview-footer .button.primary:hover {
    background: #fff;
    border-color: #bfb2ff;
    box-shadow: 0 3px 10px rgba(83, 65, 173, .08);
    color: var(--primary-dark);
}

.invite-button:focus-visible,
.month-overview-footer .button.primary:focus-visible,
.app-nav a:focus-visible,
.dashboard-summary-card .view-switch a:focus-visible {
    outline: 3px solid rgba(105, 86, 232, .28);
    outline-offset: 2px;
}

/* Finaler, konfliktfreier Komponentenstil fuer Header-Navigation und Aktionen. */
.app-nav .master-link:not(.active) {
    background: #fff !important;
    border-color: transparent !important;
    color: var(--muted) !important;
}

.app-nav .master-link:not(.active):hover {
    background: #fff !important;
    border-color: #ddd5ff !important;
    color: var(--primary-dark) !important;
}

/* Dashboard-Bedienelemente: eine gemeinsame Segment-Sprache. */
.app-nav,
.dashboard-summary-card .view-switch,
.dashboard-summary-card .year-switch {
    align-items: center;
    background: #fff;
    border: 1px solid #ddd5ff;
    border-radius: 11px;
    box-shadow: none;
    display: flex;
    gap: 2px;
    padding: 3px;
}

.app-nav a,
.app-nav .master-link,
.dashboard-summary-card .view-switch a,
.dashboard-summary-card .year-switch a,
.dashboard-summary-card .year-switch .year-current {
    align-items: center;
    background: #fff !important;
    border: 1px solid transparent !important;
    border-radius: 8px;
    box-shadow: none !important;
    color: var(--muted) !important;
    display: inline-flex;
    font-size: .86rem;
    font-weight: 700;
    justify-content: center;
    min-height: 32px;
    padding: 6px 11px;
    text-decoration: none;
}

.app-nav a:hover,
.app-nav .master-link:hover,
.dashboard-summary-card .view-switch a:hover,
.dashboard-summary-card .year-switch a:hover {
    background: #fff !important;
    border-color: #ddd5ff !important;
    color: var(--primary-dark) !important;
}

.app-nav a.active,
.app-nav .master-link.active,
.dashboard-summary-card .view-switch a.active,
.dashboard-summary-card .year-switch .year-current {
    background: var(--primary) !important;
    border-color: var(--primary) !important;
    color: #fff !important;
    font-weight: 850;
}

.dashboard-summary-card .year-switch {
    flex-wrap: nowrap;
}

.dashboard-summary-card .year-switch .year-current {
    cursor: default;
    pointer-events: none;
}

/* Fortschritt: kompakte, zusammenhängende Beschriftung unter dem Ring. */
.month-overview .month-progress-copy {
    display: grid;
    gap: 5px;
    justify-items: center;
}

.month-overview .month-progress-copy > strong {
    align-items: baseline;
    color: var(--muted);
    display: inline-flex;
    font-size: .95rem;
    gap: .28rem;
    line-height: 1.3;
    margin: 0;
    white-space: nowrap;
}

.month-overview .month-progress-copy > strong small {
    color: var(--muted);
    font-size: .8rem;
    margin: 0;
}

.month-overview .month-progress-copy > strong small::after {
    content: " erfasst";
}

@media (max-width: 650px) {
    .dashboard-summary-card .year-switch a,
    .dashboard-summary-card .year-switch .year-current {
        min-height: 30px;
        padding: 5px 9px;
    }

    .month-overview .month-progress-copy > strong {
        white-space: normal;
    }
}

.invite-button,
.month-overview-footer .button.primary {
    background: #fff !important;
    border: 1px solid #ddd5ff !important;
    border-radius: 11px;
    box-shadow: none !important;
    color: var(--primary-dark) !important;
}

.invite-button:hover,
.month-overview-footer .button.primary:hover {
    background: #fff !important;
    border-color: #bfb2ff !important;
    box-shadow: 0 3px 10px rgba(83, 65, 173, .08) !important;
    color: var(--primary-dark) !important;
}

/* Dashboard-Kopf: moderate Verdichtung fuer mehr sichtbaren Kalender. */
main.container:has(> .dashboard-summary-card) {
    padding-top: 8px;
}

.dashboard-summary-card > .calendar-hero {
    padding-bottom: 8px;
    padding-top: 10px;
}

.dashboard-summary-card > .calendar-hero > div {
    display: grid;
    gap: 2px;
}

.dashboard-summary-card > .calendar-hero .eyebrow {
    line-height: 1.15;
    margin: 0;
}

.dashboard-summary-card > .calendar-hero h1 {
    font-size: var(--page-title-size);
    font-weight: var(--page-title-weight);
    letter-spacing: var(--page-title-tracking);
    line-height: var(--page-title-line-height);
    margin: 0;
}

@media (max-width: 780px) {
    main.container:has(> .dashboard-summary-card) {
        padding-top: 10px;
    }

    .dashboard-summary-card > .calendar-hero {
        padding-bottom: 8px;
        padding-top: 10px;
    }
}

/* Hauptansichten: einheitlich weisser Seitenhintergrund. */
body:has(main.container > .housing-hero),
body:has(main.container > .master-shell) {
    background: #fff;
}

.master-shell {
    background: #fff;
}

/* Unterseiten im gemeinsamen Steuerjahr-Design */
.tax-year-label {
    color: var(--primary);
    font-size: .72rem;
    font-weight: 850;
    letter-spacing: .11em;
    line-height: 1.15;
    margin: 0;
    text-transform: uppercase;
}

.page-year-copy {
    display: grid;
    gap: 2px;
}

.page-year-copy h1 {
    font-size: var(--page-title-size);
    font-weight: var(--page-title-weight);
    letter-spacing: var(--page-title-tracking);
    line-height: var(--page-title-line-height);
    margin: 0;
}

.page-year-hero {
    align-items: flex-end;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0;
    box-shadow: none;
    margin-bottom: 14px;
    padding: 10px 0 12px;
}

.page-year-hero .muted {
    color: var(--muted);
    line-height: 1.5;
    margin: 7px 0 0;
    max-width: 680px;
}

main.container:has(> .housing-hero),
main.container:has(> .master-shell) {
    padding-top: 8px;
}

/* Kosten & Belege: dieselbe ruhige Weiss-/Violettsprache wie das Tagebuch. */
.housing-hero .eyebrow,
.housing-form .eyebrow,
.housing-table .eyebrow {
    color: var(--primary);
}

.housing-hero .housing-button {
    background: #fff;
    border: 1px solid #c9beff;
    color: var(--primary-dark);
}

.housing-hero .housing-button:hover {
    background: #f7f5ff;
    border-color: #aa9cff;
}

.housing-summary {
    border: 1px solid #ddd5ff;
    border-radius: 18px;
    gap: 0;
    margin: 0 0 24px;
    overflow: hidden;
}

.housing-summary > article,
.housing-summary > article.cluster-housing,
.housing-summary > article.cluster-it,
.housing-summary > article.cluster-books,
.housing-summary > article.cluster-professional {
    background: #fff;
    border: 0;
    border-radius: 0;
    border-right: 1px solid #ece8fb;
    min-width: 0;
    padding: 18px 20px;
}

.housing-summary > article:last-child {
    border-right: 0;
}

.housing-summary > article::before {
    background: var(--primary);
    border-radius: 999px;
    content: "";
    display: block;
    height: 4px;
    margin-bottom: 12px;
    width: 34px;
}

.housing-summary span {
    color: var(--muted);
    font-size: .78rem;
    font-weight: 750;
}

.housing-summary strong {
    color: var(--text);
    font-size: 1.35rem;
    letter-spacing: -.02em;
    margin: 6px 0 4px;
}

.housing-summary small {
    line-height: 1.4;
}

.housing-form,
.housing-table {
    border-color: #ddd5ff;
    box-shadow: 0 10px 28px rgba(53, 42, 112, .055);
}

.housing-form .section-heading {
    border-bottom-color: #e9e5f8;
}

.housing-primary {
    background: var(--primary);
}

.housing-primary:hover {
    background: var(--primary-dark);
}

.cost-cluster {
    border-color: #e5e0f8;
}

.cost-cluster.cluster-housing > header,
.cost-cluster.cluster-it > header,
.cost-cluster.cluster-books > header,
.cost-cluster.cluster-professional > header {
    background: #f8f7ff;
}

.cost-cluster > header > strong,
.cost-item > strong {
    color: var(--primary-dark);
}

/* Steuer-Master: heller Jahresabschluss statt eigenstaendiger Farbwelt. */
.master-shell {
    background: #fff;
    margin: 0;
    padding: 0;
}

.hero.master-hero {
    background: transparent !important;
    border: 0 !important;
    color: var(--text);
    padding: 10px 0 12px;
}

.hero.master-hero .tax-year-label {
    color: var(--primary);
}

.hero.master-hero h1 {
    color: var(--text);
}

.hero.master-hero p,
.hero.master-hero .muted {
    color: var(--muted);
}

.hero.master-hero .master-pdf {
    background: var(--primary);
    color: #fff;
}

.hero.master-hero .master-pdf:hover {
    background: var(--primary-dark);
}

.master-total {
    border-color: #dcd5ff;
    border-radius: 18px;
    box-shadow: 0 10px 28px rgba(53, 42, 112, .055);
    margin: 0 0 26px;
}

.master-total span {
    color: var(--primary);
}

.master-total strong {
    color: var(--text);
}

.master-shell > h2 {
    font-size: var(--section-title-size);
    margin: 0 0 12px;
}

.master-day-grid {
    gap: 11px;
}

.master-day-grid article {
    align-items: center;
    border-color: #e2ddf7;
    border-radius: 16px;
    display: grid;
    gap: 8px;
    grid-template-columns: 48px minmax(0, 1fr);
    min-height: 94px;
    padding: 12px 11px;
}

.master-day-icon {
    display: block;
    height: 48px;
    object-fit: contain;
    width: 48px;
}

.master-day-copy {
    min-width: 0;
}

.master-day-copy span {
    line-height: 1.25;
}

.master-day-copy strong {
    color: var(--primary-dark);
    display: inline-block;
    font-size: 1.55rem;
    line-height: 1;
    margin: 5px 5px 0 0;
}

.master-day-copy small {
    display: inline;
}

.master-columns {
    margin-top: 22px;
}

.master-panel {
    border-color: #e2ddf7;
    box-shadow: 0 10px 28px rgba(53, 42, 112, .045);
}

.master-panel .eyebrow {
    color: var(--primary);
}

.total-line {
    background: #f2efff;
    color: var(--primary-dark);
}

.master-months {
    border-color: #e2ddf7;
}

.cap-track i {
    background: var(--primary);
}

@media (max-width: 780px) {
    .page-year-hero {
        align-items: flex-start;
        padding-top: 8px;
    }

    .housing-summary > article {
        border-bottom: 1px solid #ece8fb;
    }

    .housing-summary > article:nth-child(2n) {
        border-right: 0;
    }

    .housing-summary > article:nth-last-child(-n + 2) {
        border-bottom: 0;
    }
}

@media (max-width: 560px) {
    .page-year-hero {
        gap: 14px;
    }

    .housing-summary > article {
        border-bottom: 1px solid #ece8fb !important;
        border-right: 0;
    }

    .housing-summary > article:last-child {
        border-bottom: 0 !important;
    }

    .master-total {
        padding: 18px;
    }
}

/* Tagebuch-Kopf exakt an den gemeinsamen Dreizeiler angleichen. */
.dashboard-summary-card > .calendar-hero.page-year-hero {
    margin: 0 0 14px;
    padding: 10px 0 12px;
}

.dashboard-summary-card > .calendar-hero.page-year-hero > .page-year-copy {
    align-items: start;
    justify-items: start;
    text-align: left;
}

.dashboard-summary-card > .calendar-hero.page-year-hero .page-year-description {
    display: block;
    margin: 7px 0 0;
    visibility: visible;
}

@media (max-width: 780px) {
    .dashboard-summary-card > .calendar-hero.page-year-hero {
        padding-top: 8px;
    }
}


/* Gemeinsame Startkante fuer alle drei Hauptseiten. */
main.container:has(> .dashboard-summary-card),
main.container:has(> .housing-hero),
main.container:has(> .master-shell) {
    padding-top: 8px;
}

main.container > .dashboard-summary-card > .page-year-hero,
main.container > .housing-hero.page-year-hero,
main.container > .master-shell > .page-year-hero {
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.page-year-hero > .page-year-copy {
    margin-left: 0 !important;
    padding-left: 0 !important;
}

@media(max-width:780px){.master-day-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.master-day-grid{grid-template-columns:1fr}}


/* Gemeinsame Beleguebersicht */
.sr-only {
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
    height: 1px;
    overflow: hidden;
    position: absolute;
    white-space: nowrap;
    width: 1px;
}

.receipt-overview {
    padding: 26px;
}

.receipt-overview-heading {
    align-items: flex-start;
    display: flex;
    gap: 24px;
    justify-content: space-between;
}

.receipt-overview-heading h2 {
    font-size: 1.35rem;
    margin: 0;
}

.receipt-overview-heading .eyebrow {
    margin-bottom: 5px;
}

.receipt-overview-heading > small {
    color: var(--muted);
    padding-top: 20px;
    white-space: nowrap;
}

.expense-category-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 22px 0 18px;
}

.expense-filter {
    align-items: center;
    background: #fff;
    border: 1px solid #dedbea;
    border-radius: 10px;
    color: #504c5e;
    cursor: pointer;
    display: inline-flex;
    font: inherit;
    font-size: .84rem;
    font-weight: 700;
    gap: 9px;
    padding: 10px 13px;
}

.expense-filter:hover {
    background: #faf9ff;
    border-color: #c8c0f2;
    color: var(--primary);
}

.expense-filter.active {
    background: #f5f2ff;
    border-color: var(--primary);
    box-shadow: 0 4px 12px rgba(98, 73, 219, .1);
    color: var(--primary-dark);
}

.expense-filter > span {
    align-items: center;
    background: #efedf4;
    border-radius: 999px;
    color: #6e697b;
    display: inline-flex;
    font-size: .72rem;
    height: 22px;
    justify-content: center;
    min-width: 22px;
    padding: 0 6px;
}

.expense-filter.active > span {
    background: var(--primary);
    color: #fff;
}

.expense-overview-tools {
    align-items: center;
    border: 1px solid #e3e0ec;
    border-radius: 12px;
    display: flex;
    gap: 12px;
    margin-bottom: 18px;
    padding: 9px;
}

.expense-search {
    flex: 1 1 auto;
    min-width: 180px;
    position: relative;
}

.expense-search::before {
    color: #8c8799;
    content: "⌕";
    font-size: 1.35rem;
    left: 12px;
    line-height: 1;
    pointer-events: none;
    position: absolute;
    top: 50%;
    transform: translateY(-52%);
}

.expense-search input,
.expense-receipt-filter select {
    background: #fff;
    border-color: transparent;
    margin: 0;
}

.expense-search input {
    padding-left: 39px;
    width: 100%;
}

.expense-receipt-filter select {
    min-width: 160px;
}

.receipt-table-wrap {
    border: 1px solid #e4e1ec;
    border-radius: 12px;
}

.receipt-table {
    min-width: 840px;
}

.receipt-table th {
    background: #faf9fc;
    border-bottom-color: #e4e1ec;
    color: #696476;
    font-size: .78rem;
    font-weight: 800;
    padding: 12px 14px;
}

.receipt-table td {
    padding: 14px;
    vertical-align: middle;
}

.receipt-table tbody tr:last-child td {
    border-bottom: 0;
}

.receipt-table time {
    color: #5f5a69;
    font-size: .8rem;
    white-space: nowrap;
}

.receipt-table td:nth-child(2) strong,
.receipt-table td:nth-child(2) small,
.receipt-table td:nth-child(2) em {
    display: block;
}

.receipt-table td:nth-child(2) strong {
    color: var(--text);
    font-size: .9rem;
}

.receipt-table td:nth-child(2) small {
    color: var(--muted);
    line-height: 1.35;
    margin-top: 3px;
    max-width: 310px;
}

.receipt-table td:nth-child(2) em {
    color: #766fa0;
    font-size: .7rem;
    font-style: normal;
    margin-top: 5px;
}

.expense-category-badge,
.receipt-status {
    border-radius: 999px;
    display: inline-flex;
    font-size: .72rem;
    font-weight: 750;
    padding: 5px 8px;
    white-space: nowrap;
}

.expense-category-badge {
    background: #f0edff;
    color: #5947b8;
}

.expense-category-badge.cluster-housing {
    background: #f9edf2;
    color: #8b4667;
}

.expense-category-badge.cluster-it {
    background: #eaf1ff;
    color: #3c63a8;
}

.expense-category-badge.cluster-books {
    background: #fff3e2;
    color: #9c641d;
}

.expense-category-badge.cluster-professional {
    background: #e8f7f4;
    color: #29796f;
}

.receipt-status {
    text-decoration: none;
}

.has-receipt {
    background: #e9f7ef;
    color: #237a4b;
}

.missing-receipt {
    background: #f2f1f5;
    color: #746f7c;
}

.receipt-amount {
    color: var(--primary-dark);
    font-weight: 850;
    white-space: nowrap;
}

.expense-row-actions {
    text-align: right;
}

.expense-row-actions .series-delete-form {
    align-items: flex-end;
    display: flex;
    gap: 7px;
    justify-content: flex-end;
}

.expense-row-actions .series-delete-form label {
    margin: 0;
}

.expense-row-actions .series-delete-form label > span {
    display: none;
}

.expense-row-actions .series-delete-form select {
    font-size: .72rem;
    max-width: 190px;
    padding: 7px;
}

.expense-row-actions .link {
    font-size: .75rem;
    white-space: nowrap;
}

.receipt-empty-state,
.receipt-filter-empty {
    align-items: center;
    display: flex;
    flex-direction: column;
    text-align: center;
}

.receipt-empty-state {
    min-height: 315px;
    justify-content: center;
    padding: 40px 20px;
}

.receipt-empty-icon {
    align-items: center;
    background: #f0ecff;
    border-radius: 50%;
    display: inline-flex;
    height: 86px;
    justify-content: center;
    margin-bottom: 18px;
    width: 86px;
}

.receipt-empty-icon svg {
    fill: none;
    height: 46px;
    stroke: var(--primary);
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2;
    width: 46px;
}

.receipt-empty-state h3,
.receipt-filter-empty strong {
    color: var(--text);
}

.receipt-empty-state h3 {
    font-size: 1.2rem;
    margin: 0 0 7px;
}

.receipt-empty-state p {
    color: var(--muted);
    line-height: 1.55;
    margin: 0 auto 18px;
    max-width: 430px;
}

.receipt-filter-empty {
    justify-content: center;
    min-height: 190px;
    padding: 30px;
}

.receipt-filter-empty span {
    color: var(--muted);
    margin-top: 5px;
}

@media (max-width: 780px) {
    .receipt-overview {
        padding: 20px;
    }

    .receipt-overview-heading {
        display: block;
    }

    .receipt-overview-heading > small {
        display: block;
        padding-top: 7px;
    }

    .expense-overview-tools {
        align-items: stretch;
        flex-direction: column;
    }

    .expense-receipt-filter select {
        width: 100%;
    }
}

@media (max-width: 560px) {
    .expense-category-filters {
        flex-wrap: nowrap;
        margin-left: -2px;
        margin-right: -2px;
        overflow-x: auto;
        padding: 2px 2px 7px;
    }

    .expense-filter {
        flex: 0 0 auto;
    }

    .receipt-empty-state {
        min-height: 270px;
        padding-left: 4px;
        padding-right: 4px;
    }
}


/* Bearbeiten und Serienaktionen in der Beleguebersicht */
.expense-row-action-bar {
    align-items: center;
    display: inline-flex;
    gap: 8px;
    justify-content: flex-end;
    position: relative;
}

.expense-edit-trigger {
    color: var(--primary-dark);
    font-weight: 800;
    text-decoration: none;
}

.expense-row-menu {
    position: relative;
}

.expense-row-menu > summary {
    align-items: center;
    border: 1px solid #dedbea;
    border-radius: 8px;
    color: #655f72;
    cursor: pointer;
    display: inline-flex;
    font-size: .75rem;
    font-weight: 900;
    height: 32px;
    justify-content: center;
    letter-spacing: .08em;
    list-style: none;
    width: 38px;
}

.expense-row-menu > summary::-webkit-details-marker {
    display: none;
}

.expense-row-menu[open] > summary,
.expense-row-menu > summary:hover {
    background: #f7f5ff;
    border-color: #bfb4f5;
    color: var(--primary-dark);
}

.expense-row-menu-panel {
    background: #fff;
    border: 1px solid #dedbea;
    border-radius: 11px;
    box-shadow: 0 14px 34px rgba(39, 31, 78, .16);
    min-width: 245px;
    padding: 11px;
    position: absolute;
    right: 0;
    top: calc(100% + 7px);
    z-index: 20;
}

.expense-row-menu-panel .series-delete-form {
    align-items: stretch;
    display: grid;
    gap: 8px;
}

.expense-row-menu-panel .series-delete-form label,
.expense-row-menu-panel .series-delete-form select {
    max-width: none;
    width: 100%;
}

.expense-row-menu-panel .series-delete-form .danger {
    justify-self: end;
}

.expense-edit-dialog {
    background: #fff;
    border: 1px solid #dcd5ff;
    border-radius: 18px;
    box-shadow: 0 24px 70px rgba(34, 25, 76, .25);
    color: var(--text);
    max-height: min(90vh, 760px);
    max-width: 680px;
    padding: 0;
    width: calc(100% - 32px);
}

.expense-edit-dialog::backdrop {
    background: rgba(35, 29, 61, .42);
    backdrop-filter: blur(2px);
}

.expense-edit-dialog > form {
    display: grid;
    gap: 15px;
    margin: 0;
    overflow-y: auto;
    padding: 24px;
}

.expense-edit-heading {
    align-items: flex-start;
    display: flex;
    gap: 20px;
    justify-content: space-between;
}

.expense-edit-heading h2 {
    font-size: 1.3rem;
    margin: 3px 0 0;
}

.expense-edit-heading .eyebrow {
    color: var(--primary);
    margin: 0;
}

.expense-dialog-close {
    align-items: center;
    background: #f5f3fa;
    border: 0;
    border-radius: 50%;
    color: #655f72;
    cursor: pointer;
    display: inline-flex;
    flex: 0 0 auto;
    font-size: 1.35rem;
    height: 34px;
    justify-content: center;
    line-height: 1;
    width: 34px;
}

.expense-current-receipt {
    background: #f7f5ff;
    border-radius: 9px;
    color: #655d86;
    font-size: .8rem;
    margin: 0;
    padding: 9px 11px;
}

.expense-remove-receipt {
    align-items: center;
    display: flex;
    font-size: .82rem;
    gap: 8px;
}

.expense-remove-receipt input {
    margin: 0;
    width: auto;
}

.expense-edit-actions {
    border-top: 1px solid #ebe7f7;
    justify-content: flex-end;
    margin-top: 3px;
    padding-top: 17px;
}

@media (max-width: 560px) {
    .expense-edit-dialog > form {
        padding: 19px;
    }

    .expense-edit-dialog .form-grid {
        grid-template-columns: 1fr;
    }

    .expense-edit-actions {
        align-items: stretch;
        flex-direction: column-reverse;
    }

    .expense-edit-actions .button {
        width: 100%;
    }
}


/* Eigene Kategorien im Ausgabeformular */
.custom-category-fields {
    align-items: end;
    background: #faf9ff;
    border: 1px solid #e4dff8;
    border-radius: 12px;
    display: grid;
    gap: 12px;
    grid-template-columns: minmax(0, 1.2fr) minmax(180px, .8fr);
    margin: -2px 0 18px;
    padding: 14px;
}

.custom-category-fields[hidden] {
    display: none;
}

.custom-category-fields > small {
    color: var(--muted);
    grid-column: 1 / -1;
    line-height: 1.45;
}

.custom-topic-field {
    grid-column: 2;
}

@media (max-width: 560px) {
    .custom-category-fields {
        grid-template-columns: 1fr;
    }

    .custom-category-fields > small,
    .custom-topic-field {
        grid-column: auto;
    }
}