/* TREELINE STUDIO · Produktdesign v3 (14.10.2026, Marke 18.10.2026).
   Markenfarben bleiben (Granit, Tanne, Kalk, Fels, Signal), die Oberfläche tritt zurück.
   Archivo als variable Schrift: 400 Text, 500 Bedienung, 600 Betonung, 700 Titel.
   Fraunces Soft für Überschriften, Rubik für Logo und Navigation.
   Signal nur für die eine Hauptaktion und aktive Zustände. Wird als letzte Datei geladen. */
@font-face{font-family:Rubik;src:url("Rubik-Variable.a4a3cbac22a4.woff") format('woff');font-weight:300 900;font-display:swap}
@font-face{font-family:Fraunces;src:url("Fraunces-Variable.be55f75f1668.woff2") format('woff2');font-weight:100 900;font-display:swap}
:root{
  --granit:#1c1d1a;--tanne:#2f3b2f;--kalk:#efebe3;--fels:#8a8578;--signal:#e4572e;
  --signal-strong:#c4421c;--signal-hover:#a8381a;--signal-soft:#fcece6;--signal-text:#9a3414;
  --tanne-soft:#e9eee6;--tanne-text:#2f4a2f;--warn-soft:#fbf0dc;--warn-text:#7a4b0c;--fels-soft:#eeebe5;
  --night:var(--granit);--bone:var(--kalk);--orange:var(--signal);--forest:var(--tanne);
  --bg:#f6f5f1;--surface:#fff;--subtle:#faf9f6;--hover:#f2f0eb;
  --line:#e6e3dc;--line-strong:#d6d2c8;
  --text:#1c1d1a;--text-2:#3b3a36;--muted:#5f5d56;--panel:#fff;
  --radius:12px;--radius-md:10px;--radius-sm:8px;
  --shadow-xs:0 1px 1px rgba(28,29,26,.04);
  --shadow:0 1px 2px rgba(28,29,26,.05),0 1px 3px rgba(28,29,26,.04);
  --shadow-md:0 4px 12px rgba(28,29,26,.07),0 1px 3px rgba(28,29,26,.05);
  --shadow-lg:0 12px 32px rgba(28,29,26,.12),0 2px 6px rgba(28,29,26,.06);
  --ring:0 0 0 3px var(--signal-text);
  --ease:cubic-bezier(.2,.7,.2,1);
  --ctl:38px;--side:240px;--side-collapsed:68px;
}

/* ---------- Grundlagen & Typografie ---------- */
body{background:var(--bg);color:var(--text);font:400 14px/1.5 Archivo,Arial,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-feature-settings:"ss01"}
::selection{background:var(--signal-soft)}
a{color:inherit;text-decoration-color:var(--line-strong);text-underline-offset:3px;transition:color .15s var(--ease),text-decoration-color .15s var(--ease)}
a:hover{text-decoration-color:currentColor}
p{margin-bottom:12px}
h1,h2,h3{font-weight:700;text-transform:none;color:var(--text)}
h1,h2{font-family:Fraunces,Georgia,serif;font-variation-settings:"SOFT" 100,"WONK" 1}
h1,.heading h1,.day-heading h1,.field-title h1{font-size:28px;line-height:1.15;letter-spacing:-.01em;margin:0 0 6px;font-weight:700}
h2{font-size:16px;line-height:1.35;letter-spacing:0;margin-bottom:8px;font-weight:650}
h3{font-size:14px;line-height:1.4;letter-spacing:-.005em;margin-bottom:4px;font-weight:600}
strong,b,.row-title{font-weight:600}
.muted{color:var(--muted)}
.eyebrow,.micro,.nav-group-label,.section-head .micro,.portal-label{font:500 12px/1.45 Archivo,Arial,sans-serif;letter-spacing:0;text-transform:none;color:var(--muted)}
.heading>div>.eyebrow{display:none}
kbd{font:500 11px Archivo,Arial,sans-serif;color:var(--muted);background:var(--surface);border:1px solid var(--line);border-bottom-width:2px;border-radius:5px;padding:1px 6px}
main:focus,main:focus-visible,[tabindex="-1"]:focus:not(:focus-visible){outline:none}
main[tabindex="-1"]:focus,[tabindex="-1"]:focus-visible{outline:none!important;box-shadow:none!important}
.footer{font:400 12px Archivo,Arial,sans-serif;color:var(--muted);padding:24px 32px 32px}
.footer a{color:var(--muted)}
.i{width:18px;height:18px;flex:none;vertical-align:-3px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.loading{gap:14px;color:var(--muted);font-size:14px;align-content:center;justify-items:center}
.loading-mark{width:44px;height:44px;animation:pulse 1.4s var(--ease) infinite}

/* ---------- Bewegung ---------- */
@keyframes route-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.45}}
@keyframes shimmer{to{background-position:-200% 0}}
@keyframes toast-in{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
@keyframes pop-in{from{opacity:0;transform:translateY(-4px) scale(.98)}to{opacity:1;transform:none}}
main.route-enter{animation:route-in .2s var(--ease) both}
dialog[open]{animation:toast-in .18s var(--ease)}
@media(prefers-reduced-motion:reduce){main.route-enter,dialog[open],#notice,.user-menu-panel,.loading-mark,.skeleton span{animation:none!important}*{transition:none!important}}

/* ---------- Rahmen: Seitenleiste ---------- */
.sidebar{width:var(--side);background:#fbfaf8;color:var(--text);border-right:1px solid var(--line);padding:16px 12px 12px;scrollbar-color:#d4cfc4 transparent;overflow-y:auto;transition:width .2s var(--ease)}
.shell{margin-left:var(--side);transition:margin-left .2s var(--ease)}
.sidebar .brand{padding:2px 6px 16px;gap:10px;align-items:center}
.sidebar .logo{display:flex;line-height:0}
.sidebar .logo img{width:auto;height:40px}
.sidebar .brand>img{display:none;width:28px;height:28px}
.nav-collapse{margin-left:auto;min-height:30px;min-width:30px;padding:5px;border-color:transparent;background:transparent;box-shadow:none;color:var(--muted)}
.nav-collapse:hover{background:var(--hover);color:var(--text);border-color:transparent}
.sidebar .workspace{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:10px;background:var(--surface);padding:8px 10px;margin:0 0 14px;font-size:13px;font-weight:600;box-shadow:var(--shadow-xs);min-width:0}
.workspace-text{min-width:0;flex:1;line-height:1.3}
.workspace-text>:first-child{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.workspace small{display:block;color:var(--muted);font-size:12px;font-weight:400;margin-top:1px}
.school-selector select{background:var(--surface);color:var(--text);border-color:var(--line-strong);min-height:32px;padding:4px 8px;font-size:13px;font-weight:600}
.nav{gap:1px}
.nav-group{display:grid;gap:1px;margin-bottom:6px}
.nav a{display:flex;align-items:center;justify-content:flex-start;gap:10px;min-height:34px;border-radius:var(--radius-sm);border:0;color:var(--text-2);font:500 14px/1.3 Rubik,Archivo,sans-serif;padding:6px 10px;text-decoration:none;position:relative;transition:background-color .15s var(--ease),color .15s var(--ease)}
.nav a .i{color:#7a776f;transition:color .15s var(--ease)}
.nav a:hover{background:var(--hover);color:var(--text)}
.nav a:hover .i{color:var(--text-2)}
.nav a.active{background:var(--surface);color:var(--text);font-weight:600;box-shadow:0 0 0 1px var(--line),var(--shadow-xs)}
.nav a.active .i{color:var(--signal-strong)}
.nav a.active::before{content:"";position:absolute;left:-12px;top:8px;bottom:8px;width:3px;border-radius:0 3px 3px 0;background:var(--signal)}
.nav-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nav-count{font:500 11px Archivo,sans-serif;color:var(--muted);opacity:1;margin-left:auto}
.nav-more{margin-top:6px;padding-top:6px;border-top:1px solid var(--line)}
.nav-more summary{cursor:pointer;list-style:none;display:flex;gap:10px;align-items:center;padding:6px 10px;min-height:34px;border-radius:var(--radius-sm);color:var(--muted);font:500 13px Rubik,Archivo,sans-serif}
.nav-more summary .i{color:#7a776f}
.nav-more summary:hover{background:var(--hover);color:var(--text)}
.nav-more summary::-webkit-details-marker{display:none}
.nav-more summary::after{content:"";width:6px;height:6px;margin-left:auto;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(-45deg);transition:transform .15s var(--ease)}
.nav-more[open] summary::after{transform:rotate(45deg)}
.nav a:focus-visible,.nav-more summary:focus-visible{outline:none;box-shadow:var(--ring)}
.mobile-menu-toggle{color:var(--text)!important;background:var(--surface)!important;border:1px solid var(--line-strong)!important;gap:6px}

/* Eingeklappte Seitenleiste (nur Desktop) */
@media(min-width:901px){
  .nav-collapsed .sidebar{width:var(--side-collapsed);overflow:visible;padding-inline:10px;z-index:30}
  .nav-collapsed div:not(.focus-layout)>.shell{margin-left:var(--side-collapsed)}
  .nav-collapsed .sidebar .logo,.nav-collapsed .workspace-text,.nav-collapsed .nav-more summary::after{display:none}
  .nav-collapsed .sidebar .brand{flex-direction:column;gap:12px;padding:2px 0 14px}
  .nav-collapsed .sidebar .brand>img{display:block}
  .nav-collapsed .nav-collapse{margin:0}
  .nav-collapsed .nav-collapse .i{transform:scaleX(-1)}
  .nav-collapsed .sidebar .workspace{justify-content:center;padding:6px;border-color:transparent;box-shadow:none;background:transparent}
  .nav-collapsed .nav a,.nav-collapsed .nav-more summary{justify-content:center;padding:8px}
  .nav-collapsed .nav a.active::before{left:-10px}
  .nav-collapsed .nav-label{position:absolute;left:calc(100% + 10px);top:50%;transform:translateY(-50%);background:var(--granit);color:#fff;font:500 12px Archivo,sans-serif;padding:5px 9px;border-radius:6px;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .12s var(--ease);z-index:60;box-shadow:var(--shadow-md)}
  .nav-collapsed .nav a:hover .nav-label,.nav-collapsed .nav a:focus-visible .nav-label,.nav-collapsed .nav-more summary:hover .nav-label{opacity:1}
  .nav-collapsed .nav-more summary{position:relative}
}

/* ---------- Kopfzeile ---------- */
.shell>header{background:rgba(255,255,255,.82);backdrop-filter:saturate(1.4) blur(10px);height:56px;position:sticky;top:0;z-index:20;border-bottom:1px solid var(--line);padding:0 32px}
.crumb{color:var(--muted);font-size:13px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.crumb b{color:var(--text);font-weight:600}
.header-tools{gap:10px;align-items:center}
.studio-search-trigger{min-width:280px;min-height:36px;justify-content:flex-start;gap:8px;color:var(--muted);background:var(--subtle);font-size:13px;font-weight:400;box-shadow:none;padding:6px 8px 6px 12px}
.studio-search-trigger kbd{margin-left:auto}
.studio-search-trigger:hover{background:var(--surface);border-color:#c6c1b6;color:var(--text-2)}
.connection{color:var(--tanne-text);font-size:12px;font-weight:600;background:var(--tanne-soft);padding:5px 10px;border-radius:999px}
.connection:before{background:#4c8a59}
.user-menu{position:relative}
.user-menu summary{list-style:none;cursor:pointer;border-radius:999px;display:grid;place-items:center;min-height:36px;min-width:36px;transition:box-shadow .15s var(--ease)}
.user-menu summary::-webkit-details-marker{display:none}
.user-menu summary:hover .avatar{box-shadow:0 0 0 3px var(--hover)}
.user-menu-panel{position:absolute;right:0;top:calc(100% + 8px);width:260px;background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow-lg);padding:6px;z-index:50;animation:pop-in .16s var(--ease)}
.user-menu-head{padding:10px 10px 12px;border-bottom:1px solid var(--line);margin-bottom:6px}
.user-menu-head strong{display:block;font-size:14px}
.user-menu-head small{display:block;color:var(--muted);font-size:12px;margin-top:2px}
.user-menu-panel button{width:100%;justify-content:flex-start;gap:10px;border:0;background:transparent;box-shadow:none;min-height:36px;padding:6px 10px;font-weight:500;color:var(--text-2)}
.user-menu-panel button:hover{background:var(--hover);color:var(--text)}
.user-menu-panel button .i{color:var(--muted)}
main.content{padding:32px 32px 24px;max-width:1360px}

/* Avatare: feste Markentöne pro Name */
.avatar{display:inline-grid;place-items:center;flex:none;width:32px;height:32px;border-radius:50%;font:650 12px/1 Archivo,sans-serif;letter-spacing:.01em;background:var(--tanne-soft);color:var(--tanne-text);transition:box-shadow .15s var(--ease)}
.avatar.tone-1{background:var(--signal-soft);color:var(--signal-text)}
.avatar.tone-2{background:var(--kalk);color:var(--granit)}
.avatar.tone-3{background:var(--fels-soft);color:#58544b}
.avatar.tone-4{background:var(--tanne);color:var(--kalk)}
.school-avatar{width:32px;height:32px;border-radius:8px}
.user-avatar{width:32px;height:32px}

/* ---------- Seitenkopf ---------- */
.heading,.day-heading{align-items:flex-end;gap:16px 24px;margin-bottom:24px;flex-wrap:wrap}
.heading>div:first-child,.day-heading>div:first-child{min-width:0;flex:1 1 320px}
.heading p,.day-heading p{color:var(--muted);font-size:14px;margin:0;max-width:70ch}
.heading>div:last-child:not(:first-child){gap:8px;align-items:center}
.day-heading .eyebrow{margin-bottom:4px;display:block}
.quiet-link,.section-head a{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:500;color:var(--muted);text-decoration:none}
.section-head a .i{width:15px;height:15px;transition:transform .15s var(--ease)}
.section-head a:hover .i{transform:translateX(2px)}
.quiet-link:hover,.section-head a:hover{color:var(--text)}
.back-link{font-size:13px;font-weight:500;color:var(--muted);text-decoration:none}

/* ---------- Knöpfe ---------- */
button,.button{display:inline-flex;align-items:center;justify-content:center;gap:7px;border-radius:var(--radius-sm);font:500 14px/1.2 Archivo,Arial,sans-serif;min-height:var(--ctl);padding:8px 14px;background:var(--surface);border:1px solid var(--line-strong);color:var(--text);box-shadow:var(--shadow-xs);text-decoration:none;transition:background-color .15s var(--ease),border-color .15s var(--ease),box-shadow .15s var(--ease),transform .1s var(--ease),color .15s var(--ease)}
button .i,.button .i{width:17px;height:17px;margin-left:-2px}
button:hover,.button:hover{background:var(--hover);border-color:#c6c1b6}
button:active,.button:active{transform:translateY(1px) scale(.99)}
button.primary,.button.primary{background:var(--signal-strong);border-color:var(--signal-strong);color:#fff;font-weight:600;letter-spacing:0;text-transform:none;white-space:nowrap;box-shadow:0 1px 2px rgba(150,45,15,.3),inset 0 1px 0 rgba(255,255,255,.14)}
button.primary:hover,.button.primary:hover{background:var(--signal-hover);border-color:var(--signal-hover);color:#fff;box-shadow:0 3px 8px rgba(150,45,15,.25),inset 0 1px 0 rgba(255,255,255,.14)}
button:disabled,.button[aria-disabled=true]{opacity:.5;box-shadow:none;transform:none}
.small-button,button.small-button,.button.small-button{min-height:32px;padding:5px 11px;font-size:13px}
.text-action{display:inline-flex;align-items:center;gap:5px;color:var(--signal-strong);font-size:13px;font-weight:600;box-shadow:none;background:transparent;border:0;min-height:0;padding:4px 0}
.text-action .i{width:15px;height:15px}
.text-action:hover{color:var(--signal-hover);background:transparent;text-decoration:underline}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:none;box-shadow:var(--ring)}
dialog .section-head [data-close],dialog .section-head>button:last-child:not(.primary){min-height:32px;min-width:32px;padding:4px 8px;border-color:transparent;box-shadow:none;color:var(--muted)}
dialog .section-head [data-close]:hover{background:var(--hover);color:var(--text)}

/* ---------- Formulare ---------- */
input:not([type=checkbox]):not([type=radio]),select,textarea{border-radius:var(--radius-sm)!important;border:1px solid var(--line-strong);background:var(--surface);color:var(--text);min-height:var(--ctl);padding:8px 11px;font:400 14px Archivo,Arial,sans-serif;box-shadow:var(--shadow-xs);transition:border-color .15s var(--ease),box-shadow .15s var(--ease)}
input::placeholder,textarea::placeholder{color:#8f8b82}
input:hover:not(:focus),select:hover:not(:focus),textarea:hover:not(:focus){border-color:#c6c1b6}
input:focus,select:focus,textarea:focus{border-color:var(--signal);outline:none;box-shadow:var(--ring)}
select{padding-right:30px}
main label{font-weight:400}
.finance-toolbar>label,.finance-filters>label,.inbox-toolbar label{font-weight:500;font-size:13px;color:var(--text-2)}
label.field{font-size:13px;margin-bottom:14px}
label.field>span{font-weight:500;color:var(--text-2);margin-bottom:6px}
.field small{color:var(--muted)}
input[type=checkbox],input[type=radio]{accent-color:var(--signal-strong)}
fieldset{border:1px solid var(--line);border-radius:var(--radius-sm)}
.form-grid{gap:0 16px}
.form-actions{gap:8px;padding-top:16px;margin-top:8px;border-top:1px solid var(--line)}
.search{position:relative;display:block}
.search .search-icon{position:absolute;left:11px;top:50%;transform:translateY(-50%);color:var(--muted);pointer-events:none}
.search input{padding-left:36px!important}

/* ---------- Flächen ---------- */
.panel,.plan-card,.template-card,.goal-panel,.plan-sidebar,.builder-step,.field-card,.team-hub,.team-card,.inbox-message,.portal-card,.workflow-overview,.office-grid>.panel{background:var(--surface)!important;border:1px solid var(--line)!important;border-radius:var(--radius)!important;box-shadow:var(--shadow)!important}
.panel,.plan-card{padding:20px 22px}
.plan-card,.team-card,.template-card{transition:box-shadow .18s var(--ease),border-color .18s var(--ease),transform .18s var(--ease)}
.plan-card:hover,.template-card:hover,.team-card:hover{border-color:var(--line-strong)!important;box-shadow:var(--shadow-md)!important}
.section-head{margin-bottom:14px;gap:12px}
.section-head h2,.panel>h2:first-child{font-size:16px}
.stack{gap:16px}
.columns,.work-columns{gap:20px}
.accent-panel{background:var(--surface)!important;color:var(--text)!important}
.accent-panel h2{font-size:18px;letter-spacing:-.01em}
.accent-panel p,.accent-panel .eyebrow{color:var(--muted)}
.accent-panel a{color:var(--signal-strong)}

/* Hinweise, Fehler */
.info{background:var(--tanne-soft);border:0;border-left:0;border-radius:var(--radius-sm);color:var(--tanne-text);padding:12px 14px;font-size:13px}
.error{background:var(--signal-soft);color:var(--signal-text);border:0;border-radius:var(--radius-sm);padding:12px 14px}

/* Leerstellen: Symbol, Überschrift, ein Satz, eine Aktion */
.empty-state{display:grid;justify-items:center;text-align:center;gap:6px;padding:36px 24px;background:var(--subtle);border:1px dashed var(--line-strong);border-radius:var(--radius);color:var(--muted);grid-column:1/-1}
.empty-state .empty-icon{width:40px;height:40px;padding:9px;border-radius:12px;background:var(--surface);color:var(--signal-strong);box-shadow:0 0 0 1px var(--line),var(--shadow-xs);margin-bottom:8px}
.empty-state h3{font-size:15px;font-weight:650;margin:0;color:var(--text)}
.empty-state p{margin:0 0 6px;max-width:46ch;font-size:14px}
.empty-state>button,.empty-state>.button{margin-top:6px}
.empty,.inline-empty,.history-empty,.empty-plan,.portal-empty{background:var(--subtle)!important;border:1px dashed var(--line-strong)!important;border-radius:var(--radius)!important;color:var(--muted);box-shadow:none!important}
.empty{padding:32px 20px}
.empty h3,.empty-plan h3,.empty strong{color:var(--text);font-size:15px;font-weight:650}
.empty-plan{padding:20px 22px;flex-wrap:wrap;min-width:0}
.empty-plan>*{min-width:0}
.history-empty{padding:18px 20px}
.empty,.empty-plan{display:grid!important;justify-items:center;text-align:center;gap:6px;padding:32px 24px!important}
.empty::before,.empty-plan::before{content:"";width:40px;height:40px;border-radius:12px;margin-bottom:8px;background:var(--surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c4421c' stroke-width='1.75' stroke-linecap='round'%3E%3Cpath d='M12 6v12M6 12h12'/%3E%3C/svg%3E") center/20px no-repeat;box-shadow:0 0 0 1px var(--line),var(--shadow-xs)}
.empty-plan .step-index{display:none}
.empty-plan h2{font-size:15px;font-weight:650;margin:0}
.empty p,.empty-plan p{margin:0 auto 6px;max-width:46ch}
.inline-empty{padding:14px 16px}

/* Platzhalter beim Laden */
.skeleton{display:grid;gap:10px;margin-top:16px}
.skeleton span,section.panel[role=status]::after{display:block;height:14px;border-radius:6px;background:linear-gradient(90deg,#efede8 25%,#f7f6f2 50%,#efede8 75%) 0 0/200% 100%;animation:shimmer 1.3s linear infinite}
.skeleton span:nth-child(1){width:62%;height:18px}
.skeleton span:nth-child(2){width:88%}
.skeleton span:nth-child(3){width:74%}
section.panel[role=status]{color:var(--muted)}
section.panel[role=status]::after{content:"";height:56px;margin-top:14px}

/* Hinweis als Toast */
#notice{left:auto;right:24px;bottom:24px;transform:none;max-width:min(420px,calc(100vw - 32px));background:var(--granit);color:#fff;border:0;border-radius:12px;padding:12px 16px 12px 40px;font:500 14px/1.45 Archivo,sans-serif;box-shadow:var(--shadow-lg);animation:toast-in .2s var(--ease)}
#notice::before{content:"";position:absolute;left:16px;top:16px;width:12px;height:12px;border-radius:50%;background:var(--signal);box-shadow:0 0 0 4px rgba(228,87,46,.25)}

/* ---------- Status-Chips ---------- */
.badge,.discipline{display:inline-flex;align-items:center;gap:4px;border-radius:999px;font:500 12px/1 Archivo,Arial,sans-serif;letter-spacing:0;text-transform:none;padding:4px 9px;background:var(--tanne-soft);color:var(--tanne-text);white-space:nowrap}
.badge::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.7}
.badge.warn{background:var(--signal-soft);color:var(--signal-text)}
.discipline{background:#f0eee8;color:var(--text-2)}
.discipline.igp{background:var(--tanne-soft);color:var(--tanne-text)}
.discipline.scentwork{background:var(--signal-soft);color:var(--signal-text)}
.date-chip,.kind-chip{display:inline-flex;align-items:center;gap:5px;border-radius:999px;font:500 12px/1 Archivo,sans-serif;padding:5px 9px;background:var(--fels-soft);color:var(--text-2);white-space:nowrap}
.date-chip .i{width:14px;height:14px;color:var(--muted)}
.kind-chip.course{background:var(--tanne-soft);color:var(--tanne-text)}
.kind-chip.training{background:var(--signal-soft);color:var(--signal-text)}
.inbox-health{border-radius:999px;font-size:12px;font-weight:500;padding:4px 10px;background:var(--warn-soft);color:var(--warn-text)}
.inbox-health.is-current{background:var(--tanne-soft);color:var(--tanne-text)}

/* ---------- Tabellen ---------- */
.table-wrap{border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--surface)}
table{font-size:14px}
th{font:500 12px Archivo,Arial,sans-serif!important;text-transform:none!important;letter-spacing:0!important;color:var(--muted);background:var(--subtle);white-space:nowrap}
th,td{padding:10px 14px;border-bottom:1px solid var(--line);vertical-align:middle}
th:first-child,td:first-child{padding-left:14px}
tbody tr:last-child td{border-bottom:0}
tbody tr td{transition:background-color .12s var(--ease)}
tbody tr:hover td{background:#fcfbf9}
td .secondary{color:var(--muted);font-size:12px}
td .row-title{font-weight:600}

/* ---------- Reiter & Segmente ---------- */
.office-tabs,.section-tabs,.finance-tabs{display:flex;gap:4px;flex-wrap:nowrap;overflow-x:auto;border-bottom:1px solid var(--line);scrollbar-width:none;margin:0 0 20px;padding:0}
.office-tabs>*,.section-tabs>*,.finance-tabs>*{background:transparent!important;border:0!important;border-bottom:2px solid transparent!important;border-radius:0!important;box-shadow:none!important;color:var(--muted)!important;padding:10px 10px 9px!important;white-space:nowrap;font-weight:500;min-height:40px;text-decoration:none;margin-bottom:-1px;transform:none!important}
.office-tabs>*:hover,.section-tabs>*:hover,.finance-tabs>*:hover{color:var(--text)!important}
.office-tabs>[aria-pressed="true"],.office-tabs>[aria-selected="true"],.office-tabs>.selected,.section-tabs>.selected,.section-tabs>[aria-current],.finance-tabs>[aria-pressed=true]{color:var(--text)!important;border-bottom-color:var(--signal)!important;font-weight:600}
.cal-modes,.workspace-tabs,.academy-tabs,.filter-pills{display:inline-flex;flex-wrap:wrap;gap:2px;padding:3px;background:#ecebe5;border-radius:10px;margin:0 0 20px}
.cal-modes{margin:0}
.cal-modes button,.workspace-tabs button,.academy-tabs button,.filter-pills button{background:transparent;border:0;box-shadow:none;border-radius:8px;min-height:32px;padding:5px 12px;color:var(--text-2);font-size:13px;font-weight:500}
.cal-modes button:hover,.workspace-tabs button:hover,.academy-tabs button:hover,.filter-pills button:hover{background:rgba(255,255,255,.6)}
.cal-modes button[aria-pressed=true],.workspace-tabs [aria-pressed=true],.academy-tabs button[aria-pressed=true],.filter-pills button.selected,.filter-pills button[aria-pressed="true"]{background:var(--surface);color:var(--text);font-weight:600;box-shadow:0 1px 2px rgba(28,29,26,.1),0 0 0 1px rgba(28,29,26,.04);border:0}
.workspace-tabs button span{opacity:1;color:var(--muted);margin-right:2px;font-variant-numeric:tabular-nums}
.workspace-actions [aria-pressed=true],.office-roster [aria-pressed=true],.office-tabs button[aria-pressed=true]{background:var(--tanne);border-color:var(--tanne);color:#fff}

/* ---------- Kennzahlen ---------- */
.kpi-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin:0 0 16px}
.kpi{display:grid;gap:2px;align-content:start;padding:14px 16px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);text-decoration:none;color:var(--text);min-width:0;transition:box-shadow .18s var(--ease),border-color .18s var(--ease),transform .18s var(--ease)}
a.kpi:hover{border-color:var(--line-strong);box-shadow:var(--shadow-md);transform:translateY(-1px)}
.kpi-label{display:flex;align-items:center;gap:7px;font-size:13px;font-weight:500;color:var(--muted)}
.kpi-label .i{width:16px;height:16px}
.kpi strong{font-size:28px;font-weight:650;letter-spacing:-.03em;line-height:1.15;margin-top:6px;font-variant-numeric:tabular-nums}
.kpi small{font-size:12px;color:var(--muted)}
.meter,.capacity-bar{display:block;height:6px;border-radius:999px;background:#ecebe5;overflow:hidden;margin:6px 0 4px}
.meter i,.capacity-bar i{display:block;height:100%;border-radius:inherit;background:var(--tanne);transition:width .4s var(--ease)}
.capacity-bar i.is-full{background:var(--signal-strong)}
.stats{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);padding:16px 0;box-shadow:var(--shadow);margin-bottom:24px}
.stat{padding:0 20px;border-color:var(--line)}
.stat:first-child{padding-left:20px}
.stat strong{font-size:24px;font-weight:650;letter-spacing:-.02em;line-height:1.25;font-variant-numeric:tabular-nums}
.stat span{font-size:13px;color:var(--muted)}
.inbox-stat-grid{gap:10px;margin:0 0 16px}
.inbox-stat-grid button{border-radius:var(--radius);padding:14px 16px;gap:4px;align-items:flex-start;justify-content:flex-start;background:var(--surface);box-shadow:var(--shadow)}
.inbox-stat-grid strong{font-size:26px;font-weight:650;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.inbox-stat-grid span{font-size:13px;color:var(--muted);font-weight:500}
.inbox-stat-grid button[aria-pressed=true]{border-color:var(--signal);background:var(--surface);box-shadow:inset 0 0 0 1px var(--signal),var(--shadow)}
.workspace-facts strong{font-size:18px;font-weight:650}
.setup-progress strong,.morning-counts strong{font-size:22px;font-weight:650;letter-spacing:-.02em}
.workspace-facts span{font-size:12px;color:var(--muted)}
.setup-progress{background:var(--tanne-soft);border-radius:var(--radius);padding:16px 20px}
.office-balance{font-size:30px;font-weight:650;letter-spacing:-.02em}
.workspace-summary{border-bottom:1px solid var(--line);padding:4px 0 20px}

/* Eine Hauptaktion pro Ansicht: wiederholte Aktionen in Karten, Leerstellen und Seitenteilen werden sekundär */
main:has(.heading .primary,.next-up .primary,.running-today .primary) :is(.empty-plan,.empty,.inline-empty,.empty-state,.plan-card,.panel:not(.running-today),.team-hub) .primary{background:var(--surface);border-color:var(--line-strong);color:var(--text);box-shadow:var(--shadow-xs)}
main:has(.heading .primary,.next-up .primary,.running-today .primary) :is(.empty-plan,.empty,.inline-empty,.empty-state,.plan-card,.panel:not(.running-today),.team-hub) .primary:hover{background:var(--hover);color:var(--text)}

.heading .office-actions button,.heading .office-actions .button{font-size:14px}
main .makeup-panel{max-width:none;margin:0}
main .makeup-panel>h2:first-child{font-size:28px;letter-spacing:-.028em;margin-bottom:4px;font-weight:700}
main .makeup-panel>p{color:var(--muted);margin-bottom:20px}
.makeup-panel article,.makeup-panel details{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px 20px}
.makeup-panel h3{margin-top:24px}

/* ---------- Dialoge ---------- */
dialog{border:0;border-radius:14px;box-shadow:0 24px 64px rgba(28,29,26,.24),0 0 0 1px rgba(28,29,26,.06);background:var(--surface);padding:24px}
dialog::backdrop{background:rgba(28,29,26,.4);backdrop-filter:blur(3px)}
dialog .section-head{background:var(--surface);top:-24px;padding:8px 0 12px;margin-bottom:12px;border-bottom:1px solid var(--line)}
dialog h2{font-size:18px;margin:0;font-weight:700}

/* ---------- Mein Tag ---------- */
.day-heading h1{font-size:30px}
.week-strip{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;margin:0 0 20px;padding:6px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.week-day{display:grid;justify-items:center;gap:1px;padding:8px 4px;border-radius:9px;text-decoration:none;color:var(--text-2);transition:background-color .15s var(--ease)}
.week-day:hover{background:var(--hover)}
.week-day span{font-size:12px;font-weight:500;color:var(--muted)}
.week-day strong{font-size:17px;font-weight:650;font-variant-numeric:tabular-nums;line-height:1.3}
.week-day small{display:flex;gap:3px;height:6px;align-items:center;font-size:11px;color:#a9a59b;line-height:1}
.week-day small i{width:6px;height:6px;border-radius:50%;background:var(--tanne)}
.week-day.is-past{opacity:1}
.week-day.is-today{background:var(--signal-soft);color:var(--signal-text)}
.week-day.is-today span{color:var(--signal-text)}
.week-day.is-today small i{background:var(--signal-strong)}
.dash-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(300px,1fr);gap:20px;align-items:start;margin-bottom:24px}
.dash-side{display:grid;gap:16px}
.dash-side>.panel,.dash-main>.panel{margin:0}
.dash-side:empty{display:none}
.dash-grid:has(.dash-side:empty){grid-template-columns:1fr}
.agenda-group+.agenda-group{margin-top:12px}
.agenda-day{display:flex;align-items:baseline;gap:8px;font-size:13px;font-weight:600;color:var(--text);margin:0;padding:8px 0 6px;border-bottom:1px solid var(--line)}
.agenda-day small{font-weight:400;color:var(--muted);font-size:12px}
.agenda-row{display:grid;text-decoration:none;color:var(--text);border:0;padding:10px 8px;margin:0 -8px;width:calc(100% + 16px);border-radius:var(--radius-sm);box-shadow:none;grid-template-columns:64px minmax(0,1fr) auto 18px;gap:14px;align-items:center;min-height:52px;background:transparent;text-align:left;font-weight:400}
.agenda-row:hover{background:var(--subtle);border:0}
.agenda-row strong{font-size:14px;font-weight:600}
.agenda-row small{display:block;font-size:13px;color:var(--muted);margin-top:1px}
.agenda-row .row-chevron{color:#a9a59b;transition:transform .15s var(--ease),color .15s var(--ease)}
.agenda-row:hover .row-chevron{transform:translateX(2px);color:var(--text-2)}
.agenda-date{font:600 13px Archivo,sans-serif;color:var(--text);font-variant-numeric:tabular-nums}
.agenda-actions{display:flex;gap:18px;flex-wrap:wrap;margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}
.next-row,.schedule,.workspace-person,.office-roster,.setup-row,.setup-checklist li,.morning-task,.workflow-connection{border-color:var(--line)!important}
.schedule .entry{border-left-color:var(--signal)}
.step-index{font:500 12px Archivo,sans-serif;color:var(--muted);border-color:var(--line-strong)}
.next-up,.running-today{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:24px;row-gap:2px;align-items:center;border-radius:var(--radius)!important;padding:20px 22px!important;margin-bottom:20px;background:var(--surface)!important;color:var(--text)!important;border:1px solid var(--line)!important;box-shadow:var(--shadow),inset 3px 0 0 var(--signal)!important}
.running-today{box-shadow:var(--shadow),inset 3px 0 0 var(--tanne)!important;background:var(--tanne-soft)!important}
.next-up>*,.running-today>*{grid-column:1}
.next-up>.primary,.next-up>.button,.running-today>.primary,.running-today>.button{grid-column:2;grid-row:1/span 3;justify-self:end;align-self:center}
.next-up .micro{color:var(--signal-text);font-weight:600}
.running-today .micro{color:var(--tanne-text);font-weight:600}
.next-up h2,.running-today h2{font-size:20px;letter-spacing:-.02em;margin:2px 0;color:var(--text);font-weight:700}
.next-up p{color:var(--muted);margin:0}
.next-up .primary,.running-today .primary{background:var(--signal-strong);border-color:var(--signal-strong);color:#fff}
.next-up .primary:hover,.running-today .primary:hover{background:var(--signal-hover);border-color:var(--signal-hover);color:#fff}
.morning-work .section-head{align-items:flex-start}
.morning-counts{margin:4px 0 12px}
.history-row{transition:box-shadow .18s var(--ease),border-color .18s var(--ease)}
.history-row:hover{box-shadow:var(--shadow-md)}
.studio-note p{font-size:18px;letter-spacing:-.01em}

/* ---------- Teams ---------- */
.toolbar{margin-bottom:16px}
.team-grid{gap:16px}
.team-card{padding:18px 20px!important}
.team-identity{gap:12px}
.team-identity>div{min-width:0;flex:1}
.team-initial{width:44px!important;height:44px!important;font-size:15px!important;border-radius:50%}
.team-identity h2{font-size:17px;font-weight:650;letter-spacing:-.015em}
.team-identity h2 a{text-decoration:none}
.team-identity h2 a:hover{color:var(--signal-strong)}
.team-identity p{font-size:13px}
.team-goal{margin:16px 0 12px;flex:0}
.team-goal .micro{font-size:12px}
.team-goal p{font-size:14px;margin-top:2px}
.team-meta{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0 0 14px;padding:10px 12px;background:var(--subtle);border-radius:var(--radius-sm);flex:1;align-content:start}
.team-meta dt{display:flex;align-items:center;gap:5px;font-size:12px;color:var(--muted);font-weight:500}
.team-meta dt .i{width:14px;height:14px}
.team-meta dd{margin:2px 0 0;font-size:13px;font-weight:600;color:var(--text)}
.team-actions{display:grid!important;grid-template-columns:1fr 1fr;gap:8px;border-color:var(--line);padding-top:12px}
.team-actions>.text-action{grid-column:1/-1;margin:0!important;justify-self:start}
.team-actions>*{min-width:0}
.team-actions .small-button{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line-strong);border-radius:var(--radius-sm);background:var(--surface);padding:5px 10px;font-size:13px;font-weight:500;text-decoration:none;min-height:32px}
.team-actions a.small-button:hover{background:var(--hover)}

/* ---------- Kurse ---------- */
.course-card .plan-card-top{gap:8px}
.capacity{display:grid;gap:2px;margin:8px 0 12px}
.capacity small{font-size:12px;color:var(--muted)}
.capacity-bar{margin:2px 0}
.roster-dots>span{border-color:var(--surface);background:var(--tanne-soft);color:var(--tanne-text);font-weight:600}
.roster-dots small{font-size:12px}

/* ---------- Trainingspläne & Platzmodus ---------- */
.plan-title{text-decoration:none}
.plan-title h3{font-size:17px;font-weight:650;letter-spacing:-.015em}
.plan-title:hover h3{color:var(--signal-strong)}
.plan-card-top{margin-bottom:12px}
.plan-card>p{margin:6px 0 16px;font-size:14px}
.plan-card-bottom{padding-top:14px;border-color:var(--line)}
.plan-card-bottom>span{font-size:13px;font-weight:500}
.plan-card-bottom small{font-size:12px;font-weight:400}
.plan-grid,.template-grid,.cards{gap:16px}
.template-card{padding:20px!important;min-height:0!important;border-top:1px solid var(--line)!important;box-shadow:var(--shadow),inset 0 3px 0 var(--fels)!important}
.template-card.igp{box-shadow:var(--shadow),inset 0 3px 0 var(--tanne)!important}
.template-card.scentwork{box-shadow:var(--shadow),inset 0 3px 0 var(--signal)!important}
.template-card h3{font-size:18px!important;font-weight:650!important;letter-spacing:-.015em!important;margin:8px 0!important}
.template-card p{font-weight:400!important;color:var(--muted)}
.template-section{margin-top:32px}
.field-progress{gap:6px}
.field-progress button{border-radius:999px;border:0;background:#e6e3dc;color:var(--text-2);font:600 12px Archivo,sans-serif;min-height:32px;box-shadow:none}
.field-progress button:hover{background:#dcd8cf}
.field-progress button.done{background:var(--tanne-soft);color:var(--tanne-text)}
.field-progress button.current{background:var(--tanne);color:#fff;box-shadow:0 0 0 2px var(--surface),0 0 0 4px rgba(47,59,47,.25)}
.field-title h1{font-size:28px}
.focus-layout .shell>header{background:transparent;border-bottom:0;backdrop-filter:none}
.tally{display:flex;align-items:center;gap:10px;margin:4px 0 14px;flex-wrap:wrap}
.tally button{min-width:64px;min-height:56px;font-size:22px;border-radius:12px}
.tally output{font:500 14px Archivo,sans-serif;color:var(--muted)}
.success-box{border-radius:var(--radius-sm)}
.layout-properties{background:var(--subtle);border:1px solid var(--line);border-radius:var(--radius-sm)}

/* ---------- Kalender ---------- */
.cal-topbar{margin:0 0 12px;gap:12px}
.cal-navigation{gap:6px}
.cal-navigation h2{font-size:18px;margin-left:8px;font-weight:700;letter-spacing:-.015em}
.cal-navigation>button{min-width:38px;padding:8px 10px}
.cal-controls label{gap:8px;display:inline-flex;align-items:center;font-weight:500}
.cal-legend{font-size:12px;color:var(--muted);margin-bottom:12px}
.cal-legend small{color:var(--muted)}
.cal-workspace{gap:20px}
.cal-board{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow)}
.cal-weekdays{background:var(--surface);border-bottom:1px solid var(--line)}
.cal-weekdays span{font:500 12px Archivo,sans-serif;color:var(--muted);padding:10px 12px;text-align:left}
.cal-day{border-color:var(--line);padding:4px 6px 6px;transition:background-color .12s var(--ease)}
.cal-day:hover{background:#fdfcfa}
.cal-outside{background:var(--subtle)}
.cal-outside .cal-date{color:#6f6c64}
.cal-selected{background:#fffaf7;box-shadow:inset 0 0 0 2px var(--signal)}
.cal-date{font-size:13px;font-weight:500;box-shadow:none;min-height:30px;border:0}
.cal-date:hover{background:transparent}
.cal-date span{width:26px;height:26px}
.cal-today .cal-date span{background:var(--signal-strong);color:#fff;font-weight:600}
.cal-date small{color:var(--muted)}
.cal-event{border-radius:6px;border-left-width:3px;padding:6px 8px;box-shadow:none;color:var(--text);gap:2px;font-weight:400;transition:filter .12s var(--ease),transform .12s var(--ease)}
.cal-event:hover{filter:brightness(.97)}
.cal-event strong{font-size:12px;font-weight:600}
.cal-event span,.cal-event small{font-size:11px;color:var(--muted)}
.cal-day .cal-event strong{font-size:12px}
.cal-more{color:var(--signal-strong);font-size:12px;font-weight:600;box-shadow:none;min-height:0;border:0}
.cal-detail{background:var(--surface);color:var(--text);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px}
.cal-detail h2{font-size:17px;margin:2px 0 0;color:var(--text)}
.cal-detail .micro{color:var(--muted)}
.cal-detail .cal-count{border:0;background:var(--hover);color:var(--text-2);border-radius:999px;padding:3px 10px;font-size:12px;font-weight:600}
.cal-detail .section-head{align-items:flex-start;margin-bottom:12px}
.cal-detail>.primary,.cal-detail>button{width:100%;margin-top:8px}
.cal-detail>.primary{background:var(--surface);border-color:var(--line-strong);color:var(--text);box-shadow:var(--shadow-xs)}
.cal-detail>.primary:hover{background:var(--hover);color:var(--text)}
.cal-free{color:var(--muted);padding:8px 0 4px}
.cal-free strong{color:var(--text)}
.cal-agenda article{border-color:var(--line)}
.cal-agenda-date strong{font-size:22px;font-weight:650}
.cal-agenda-date span{color:var(--muted)}
.cal-connection{border-color:var(--line)}
.cal-connection p{color:var(--muted)}

/* ---------- Postfach ---------- */
.inbox-brief{background:var(--surface);color:var(--text);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:24px}
.inbox-brief h2{font-size:20px;margin:6px 0 10px}
.inbox-brief .micro,.inbox-brief aside small{color:var(--muted)}
.inbox-brief aside{border-color:var(--line)}
.inbox-message{padding:18px 20px}
.inbox-message h2{font-size:16px;margin:10px 0 4px}
.inbox-next{background:var(--subtle);border-left:2px solid var(--signal);border-radius:0 var(--radius-sm) var(--radius-sm) 0}
.inbox-toolbar{margin:16px 0}
.inbox-owner{font-weight:600}

/* ---------- Kurse & Arbeitsplatz ---------- */
.workspace-tabs{margin:20px 0}
.workspace-tabs button{padding:6px 14px}
.workspace-warning{border-left:3px solid #b58b45!important}
.office-row h2{font-size:16px}
.office-check input{accent-color:var(--signal-strong)}
.office-payment-settings summary,.integration-setup-details summary,.workflow-toggle,.workflow-topics legend{font-weight:600}

/* ---------- Buchhaltung, Rechnungen, Bank ---------- */
.finance-totals{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow);padding:16px 20px;gap:20px;margin-bottom:8px}
.finance-totals strong,.finance-open-values strong{font-size:24px;font-weight:650;letter-spacing:-.02em}
.finance-totals span,.finance-open-values span{font-size:13px}
.finance-open{border-radius:var(--radius);background:var(--surface);border-color:var(--line);box-shadow:var(--shadow);padding:20px 22px}
.finance-open-head h2{font-size:16px}
.finance-open-head p{font-size:13px}
.invoice-list{gap:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.invoice-row{background:var(--surface);padding:14px 18px;border-top:1px solid var(--line)}
.invoice-row:first-child{border-top:0}
.invoice-row:hover{background:var(--subtle)}
.invoice-row h3{font-size:15px}
.invoice-row .invoice-amount{font-size:15px;font-weight:650;font-variant-numeric:tabular-nums}
.invoice-summary,.invoice-line{border-color:var(--line);border-radius:var(--radius-sm);background:var(--surface)}
.invoice-warning{border-left:2px solid var(--signal);border-radius:0 var(--radius-sm) var(--radius-sm) 0;background:var(--subtle)}
.invoice-status{font-weight:600}
.finance-sourcebar{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:14px 18px}
.journal-date,.duration{font:500 12px Archivo,Arial,sans-serif}

/* ---------- Abläufe, Einrichtung, Fachzentrum ---------- */
.workflow-overview{padding:22px}
.workflow-overview li:before{background:var(--tanne);color:#fff}
.workflow-worker{background:var(--tanne-soft);border-left:0;border-radius:var(--radius-sm);color:var(--tanne-text)}
.workflow-worker.is-pending{background:var(--warn-soft);color:var(--warn-text)}
.workflow-run{background:var(--subtle);border:1px solid var(--line);border-radius:var(--radius-sm)}
.workflow-topics{border-color:var(--line);border-radius:var(--radius-sm)}
.academy-feedback{background:var(--subtle);border-left:2px solid var(--signal);border-radius:0 var(--radius-sm) var(--radius-sm) 0}
.setup-check.done{color:var(--tanne)}
.team-hub{padding:22px}
.team-hub-goal{font-size:17px}

/* ---------- Suche ---------- */
.studio-search-result{border-radius:var(--radius-sm);padding:12px 10px;border-color:var(--line);min-height:52px}
.studio-search-result:hover,.studio-search-result:focus-visible{background:var(--subtle)}

/* ---------- Anmeldung ---------- */
.login{display:grid;grid-template-columns:minmax(420px,1fr) minmax(0,.95fr);min-height:100dvh;background:var(--subtle)}
.login-form{display:flex;flex-direction:column;align-items:stretch;justify-content:space-between;gap:40px;min-width:0;padding:40px clamp(32px,6vw,96px)}
.login-form .logo{display:block;align-self:flex-start;margin:0;line-height:0}
.login-form .logo img{width:auto;height:44px}
.login-body{width:100%;max-width:400px;margin:8px auto}
.login-form form{width:100%;max-width:none;margin:0;background:transparent;border:0;box-shadow:none;padding:0}
.login-form .login-eyebrow{font:400 11px/1.5 Mono,monospace;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin:0 0 12px}
.login-form h1{font-size:32px;line-height:1.14;letter-spacing:-.035em;margin:0 0 10px}
.login-form #login-intro{font-size:15px;line-height:1.6;margin:0 0 30px;max-width:34ch}
.login-form label.field{font-size:14px;margin:0}
.login-form label.field>span{font-weight:500;margin-bottom:8px}
.login-form input:not([type=checkbox]){min-height:48px;font-size:16px;padding:12px 14px;border-color:#aaa69a;box-shadow:none}
.login-form .login-field-help{font-size:12px;color:var(--muted);margin:7px 0 22px}
.login-password-field{position:relative;margin-bottom:24px}
.login-form .login-password-field input{padding-right:98px}
.login-form .login-password-toggle{position:absolute;right:4px;bottom:2px;width:auto;min-width:84px;min-height:44px;margin:0;padding:8px;font-size:12px;font-weight:500;background:transparent;border:0;box-shadow:none;color:var(--text-2)}
.login-form .login-password-toggle:hover{background:var(--hover)}
.login-form .login-submit{width:100%;min-height:48px;margin:0;gap:14px;font-size:15px;font-weight:600;background:var(--tanne);border-color:var(--tanne);color:var(--kalk);box-shadow:none}
.login-form .login-submit:hover{background:var(--granit);border-color:var(--granit)}
.login-form .login-submit span{color:#ff956f;font-size:18px}
.login-form .login-submit:disabled{opacity:.75;cursor:wait}
.login-help{margin:12px 0 0;font-size:13px;color:var(--muted)}
.login-help summary{cursor:pointer;min-height:44px;display:flex;align-items:center;gap:8px;list-style:none;line-height:1.5}
.login-help summary::-webkit-details-marker{display:none}
.login-help summary::before{content:'+';font:16px Mono,monospace;color:var(--text-2)}
.login-help[open] summary::before{content:'−'}
.login-help p{margin:0 0 12px;line-height:1.6;max-width:46ch}
.login-customer{display:flex;flex-direction:column;align-items:flex-start;border-top:1px solid var(--line-strong);margin-top:24px;padding-top:22px;font-size:13px;color:var(--muted)}
.login-customer a{display:inline-flex;align-items:center;gap:10px;min-height:44px;font-size:14px;font-weight:500;color:var(--tanne)}
.login-foot{display:flex;gap:24px;flex-wrap:wrap;margin:0;font-size:12px;color:var(--muted)}
.login-foot a{display:inline-flex;align-items:center;min-height:44px;color:inherit}
.login-showcase{position:relative;overflow:hidden;isolation:isolate;display:flex;flex-direction:column;min-width:0;min-height:680px;margin:20px 20px 20px 0;border-radius:12px;background:var(--tanne);color:var(--kalk);padding:0}
.showcase-copy{position:relative;z-index:1;max-width:540px;padding:40px 40px 36px}
.showcase-copy .eyebrow{color:#d6dacf;font:400 10px/1.5 Mono,monospace;letter-spacing:.09em;text-transform:uppercase}
.showcase-copy h2{font-size:clamp(28px,2.8vw,40px);line-height:1.1;letter-spacing:-.035em;color:var(--kalk);margin:12px 0;font-weight:600}
.showcase-copy p{color:#d6dacf;font-size:14px;line-height:1.6;margin:0}
.showcase-shot{margin:0;position:relative;flex:1;min-height:380px;overflow:hidden}
.showcase-shot img{position:absolute;inset:0;display:block;width:100%;max-width:100%;height:100%;object-fit:cover;object-position:50% 44%;border:0;border-radius:0;box-shadow:none}
@media(min-width:1500px){.showcase-shot img{object-position:50% 38%}}

/* ---------- Handy ---------- */
.tabbar{display:none}
@media(max-width:1100px){main.content{padding:24px}.shell>header{padding:0 24px}.studio-search-trigger{min-width:200px}.dash-grid{grid-template-columns:1fr}.login{grid-template-columns:1fr 1fr}}
@media(max-width:900px){
  .nav-collapse{display:none}
  .tabbar{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;inset:auto 0 0;z-index:40;background:rgba(255,255,255,.95);backdrop-filter:blur(12px);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom)}
  .tabbar a,.tabbar button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:58px;color:var(--muted);background:transparent;border:0;box-shadow:none;border-radius:0;font:500 11px Rubik,Archivo,sans-serif;text-decoration:none;padding:0;position:relative}
  .tabbar .i{width:22px;height:22px;margin:0}
  .tabbar a[aria-current="page"]{color:var(--signal-text);font-weight:600}
  .tabbar a[aria-current="page"] .i{color:var(--signal-strong)}
  .tabbar a[aria-current="page"]::before{content:"";position:absolute;top:0;left:30%;right:30%;height:2px;border-radius:2px;background:var(--signal)}
  .shell{padding-bottom:72px}
  #notice{right:16px;left:16px;bottom:calc(76px + env(safe-area-inset-bottom));max-width:none}
  .sidebar.menu-open .nav{grid-template-columns:1fr!important}
  .sidebar.menu-open .nav-group{grid-template-columns:1fr 1fr}
  .sidebar.menu-open .nav-more summary{grid-column:1/-1}
  .shell>header{position:static}
  .login{grid-template-columns:1fr}
  .login-showcase{display:none}
}
@media(max-width:760px){
  body{font-size:15px}
  .sidebar{width:100%;padding:10px 16px;border-right:0;border-bottom:1px solid var(--line)}
  .shell{margin-left:0}
  .sidebar .brand{align-items:center;padding:0}
  .sidebar .logo{font-size:20px;min-height:44px;display:inline-flex;align-items:center}
  .mobile-menu-toggle{min-height:44px!important;padding:6px 12px!important;font-size:14px!important;font-weight:500}
  .sidebar.menu-open .nav{gap:2px;margin-top:12px}
  .sidebar:not(.menu-open) .workspace{display:none}
  .sidebar.menu-open .workspace{display:flex!important;padding:10px 12px;margin-top:12px}
  .sidebar.menu-open .nav a{min-height:44px;font-size:15px}
  .nav a.active::before{left:-6px}
  .nav-more summary{min-height:44px}
  .shell>header{height:auto;min-height:0;padding:8px 16px;gap:8px}
  .shell>header .crumb{display:none}
  .header-tools{flex:1;display:flex}
  .header-tools .connection{display:inline-flex!important}
  .studio-search-trigger{flex:1;min-width:0;min-height:44px}
  .studio-search-trigger kbd{display:none}
  .user-menu summary{min-height:44px;min-width:44px}
  .user-menu-panel{width:min(280px,calc(100vw - 32px))}
  .user-menu-panel button{min-height:44px}
  main.content{padding:20px 16px}
  h1,.heading h1,.day-heading h1{font-size:24px!important;letter-spacing:-.02em!important}
  .heading,.day-heading{display:flex;flex-direction:column;align-items:stretch;gap:12px;margin-bottom:18px;text-align:left}
  .heading>div,.day-heading>div,.day-heading>*{flex:none!important}
  .heading>div:last-child:not(:first-child){display:flex;flex-wrap:wrap}
  .heading>div:last-child:not(:first-child)>*{flex:1 1 auto}
  button,.button,input:not([type=checkbox]):not([type=radio]),select{min-height:44px}
  .small-button,button.small-button,.button.small-button,.team-actions .small-button{min-height:44px}
  .text-action,.quiet-link,.back-link,.section-head a,summary,.plan-title,.footer a,.login-foot a{display:inline-flex;align-items:center;min-height:44px}
  .cal-modes button,.workspace-tabs button,.academy-tabs button,.filter-pills button{min-height:44px}
  .office-tabs>*,.section-tabs>*,.finance-tabs>*{min-height:44px}
  .panel,.plan-card{padding:16px}
  .kpi-row{grid-template-columns:1fr 1fr;gap:10px}
  .kpi{padding:12px 14px}
  .kpi strong{font-size:24px}
  .week-strip{gap:2px;padding:4px}
  .week-day{padding:6px 0;min-height:56px}
  .week-day strong{font-size:15px}
  .next-up,.running-today{grid-template-columns:1fr;padding:18px!important}
  .next-up>.primary,.next-up>.button,.running-today>.primary,.running-today>.button{grid-column:1;grid-row:auto;justify-self:stretch;margin-top:12px}
  .agenda-row{grid-template-columns:52px minmax(0,1fr) 16px;gap:10px;margin:0 -6px;width:calc(100% + 12px);padding:10px 6px}
  .agenda-row .kind-chip{display:none}
  .section-head h2,.today-agenda .section-head h2,.morning-work h2{font-size:16px}
  .section-head>a,.section-head>.text-action{margin-left:auto}
  .team-meta{grid-template-columns:1fr 1fr}
  .stats{padding:12px 0}
  .stat{padding:0 12px}.stat:first-child{padding-left:12px}
  .stat strong{font-size:20px}
  .login-form{padding:24px 20px;min-height:100dvh;gap:32px}
  .login-form form{margin:0}.login-body{margin:8px auto}.login-form .login-customer{margin-top:18px;padding-top:16px}
  .login-form h1{font-size:28px}
  .cal-weekdays span{text-align:center;padding:8px 2px}
  dialog{padding:20px 16px}
  dialog .section-head{top:-20px}
  .footer{padding:16px}
}
@media print{.tabbar,.user-menu,.nav-collapse{display:none}}

/* Keep keyboard focus visible even on controls that suppress their box shadow. */
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible,.nav a:focus-visible,.nav-more summary:focus-visible{outline:3px solid var(--signal-text);outline-offset:3px}
.tabbar button:focus-visible,.tabbar a:focus-visible{outline-offset:-4px}

/* ---------- Demo-Schule: schmaler Hinweis über der Kopfzeile ---------- */
.demo-banner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:2px 16px;background:var(--tanne);color:var(--kalk);font:500 13px/1.4 Archivo,Arial,sans-serif;padding:8px 32px}
.demo-banner b{font-weight:650}
.demo-banner b::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--signal);margin-right:8px;vertical-align:1px}
.demo-banner a{color:var(--kalk);font-weight:600;text-decoration-color:rgba(239,235,227,.55);white-space:nowrap}
.demo-banner a:hover{text-decoration-color:currentColor}
.demo-banner a:focus-visible{outline-color:var(--kalk)}
@media(max-width:1100px){.demo-banner{padding:8px 24px}}
@media(max-width:760px){.demo-banner{padding:8px 16px;font-size:12px}}