/* Minimal theme: editorial headings, light login art, webapp safe areas. Loaded after every other stylesheet. */
:root{--serif:ui-serif,"New York","Iowan Old Style",Charter,Georgia,"Noto Serif",serif}
body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
:is(#app,#modal-root) :is(h1,.login-form h2){font-family:var(--serif);font-weight:500;letter-spacing:-.02em}
.badge{border-radius:999px}
#registration-error:empty{display:none} /* same as #login-error: no empty strip under the button */
#staff-error:empty,#staff-library-error:empty{display:none}

/* Login: a light, document-style art panel instead of the dark slab. */
.login-art{background:#eff1f3;color:#171e27;border-right:1px solid #e2e5e9}
.login-art::before{background-image:linear-gradient(#171e270a 1px,transparent 1px),linear-gradient(90deg,#171e270a 1px,transparent 1px)}
.login-art::after{background:radial-gradient(ellipse at 54% 63%,#ffffffb3,transparent 62%)}
.login-art .brand,.login-art h1{color:#131a22}
.login-art h1{font-weight:400}
.login-art h1 em{color:#5b6672;font-style:italic}
.login-art .brand-registered,.login-art .eyebrow,.login-art footer,.login-art footer .icon{color:#5b6672}
.login-art p,.login-art .login-copy p{color:#46515c}

/* Anmeldung am Handy (Nils 29.10.2026): genau eine Bildschirmhöhe, kein Scrollen, Haus groß oben, Formular als Karte darunter.
   Nur Anmelden, die längere Registrierung scrollt weiter. svh = Höhe mit sichtbarer Safari-Leiste, so passt es immer. */
@media(max-width:700px){
 .login.account-login:not(.account-registration){height:100vh;height:100svh;min-height:0;overflow:hidden}
 .account-login:not(.account-registration) .login-art{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;padding:max(20px,env(safe-area-inset-top)) 24px 28px;border:0}
 .account-login:not(.account-registration) .login-art .login-copy{margin-top:16px}
 .account-login:not(.account-registration) .login-art .eyebrow,.account-login:not(.account-registration) .login-art .login-copy p{display:none}
 .account-login:not(.account-registration) .login-art h1{font-size:28px;line-height:1.15}
 .account-login:not(.account-registration) .login-art .login-blueprint.account-house{position:relative;inset:auto;flex:1 1 0;min-height:0;width:calc(100% + 24px);height:auto;margin:8px -12px -20px;opacity:1;filter:drop-shadow(0 12px 18px #47627f24)}
 .account-login:not(.account-registration) .login-art .account-house img{width:100%;height:100%;max-height:none;object-fit:contain;object-position:center bottom}
 .account-login:not(.account-registration) .login-form-side{position:relative;z-index:2;flex:none;margin-top:-16px;padding:24px 24px max(16px,env(safe-area-inset-bottom));background:#ffffff;border-radius:20px 20px 0 0;box-shadow:0 -8px 24px #171e2714}
 .account-login:not(.account-registration) .login-form>.eyebrow,.account-login:not(.account-registration) .login-form>p{display:none}
 .account-login:not(.account-registration) .login-form h2{font-size:24px;margin-bottom:16px}
 .account-login:not(.account-registration) .login-form .field{margin-bottom:12px}
 .account-login:not(.account-registration) .login-form .field input{background:#f7f8f9}
 .account-login:not(.account-registration) .login-form .btn{margin-top:4px}
 .account-login:not(.account-registration) #login-error{margin:12px 0 0}
 /* Registrieren und Sprache teilen sich eine Zeile; Hinweistext und © fallen am Handy weg. */
 .account-login:not(.account-registration) .login-form{display:flex;flex-wrap:wrap;align-items:center}
 .account-login:not(.account-registration) .login-form>*{flex:1 0 100%}
 .account-login:not(.account-registration) .account-switch,.account-login:not(.account-registration) .login-form-bottom{flex:0 1 auto;display:flex;margin:16px 0 0;padding:0;border:0}
 .account-login:not(.account-registration) .login-form-bottom{margin-inline-start:auto}
 .account-login:not(.account-registration) .account-switch>span,.account-login:not(.account-registration) .login-form-bottom>span{display:none}
}
@media(max-width:700px) and (max-height:600px){
 .account-login:not(.account-registration) .login-art h1{font-size:22px}
 .account-login:not(.account-registration) .login-form h2{display:none}
}

/* Full-screen webapp (viewport-fit=cover): keep content clear of a landscape notch and the home indicator. */
body{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}
.sidebar{border-bottom:env(safe-area-inset-bottom) solid transparent}

/* Eingabefelder am Touchgerät mit 16 px: darunter zoomt das iPhone beim Antippen hinein (Design-System-Plan, Schrift). */
@media (pointer:coarse){input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea{font-size:16px!important}}

/* Navigation nach Design-Plan (24.10.2026): Handy unter 768 px Leiste unten,
   Tablet 768-1199 px schmale Seitenleiste nur mit Symbolen, ab 1200 px volle Seitenleiste.
   Vorher bekam alles bis 1366 px (auch iPad quer und kleine Laptops) die Handy-Leiste. */
@media (min-width:768px) and (max-width:1366px){
 .mobile-nav{display:none}
 .sidebar{display:flex}
 .page{padding-bottom:24px}
}
@media (min-width:1200px) and (max-width:1366px){
 .sidebar{width:212px}
 .main{margin-left:212px;width:calc(100% - 212px)}
 [dir=rtl] .main{margin-left:0;margin-right:212px}
}
@media (min-width:768px) and (max-width:1199px){
 .sidebar{width:72px;padding:16px 8px 12px;align-items:center;overflow-y:auto}
 .main{margin-left:72px;width:calc(100% - 72px)}
 [dir=rtl] .main{margin-left:0;margin-right:72px}
 .sidebar .brand{justify-content:center;margin:0 0 16px;padding:0}
 .sidebar .brand>span,.sidebar .brand-tag,.sidebar .nav-caption,.sidebar .count,.sidebar .workshop>div,.sidebar-user>div{display:none}
 .sidebar .nav-group,.sidebar .sidebar-bottom{display:flex;flex-direction:column;align-items:center;gap:4px;width:100%}
 /* Text bleibt für Screenreader erhalten, sichtbar ist nur das Symbol */
 .sidebar .nav-item,.sidebar .workshop{font-size:0;justify-content:center;width:56px;min-width:56px;height:48px;min-height:48px;padding:0;margin:0;border-radius:10px;gap:0}
 .sidebar .nav-item .icon,.sidebar .workshop .icon{width:22px;height:22px;margin:0}
 .sidebar-user{flex-direction:column;align-items:center;gap:8px;padding:12px 0 0;margin-top:8px;width:100%}
 .sidebar-user button{margin:0}
}
/* Logo Kant-F: Zeichen Schieferblau, Schriftzug Dunkel. Gleiche Höhe, Abstand steckt im Schriftzug (wie im Logo-Paket). */
.brand.brand{gap:0;letter-spacing:0}
.brand .brand-logo.brand-logo{width:auto;height:32px;flex:none;color:#47627f}
.brand .brand-wordmark{display:block;width:auto;height:32px;flex:none;color:#1f2933}
.sidebar .brand-tag.brand-tag{margin:8px 0 0;margin-inline-start:0;font-size:12px;letter-spacing:1.6px;white-space:nowrap}
.login-art .brand .brand-logo.brand-logo,.login-art .brand .brand-wordmark{height:36px}
@media (min-width:768px) and (max-width:1199px){
 .sidebar .brand .brand-wordmark{display:none}
 .sidebar .brand .brand-logo.brand-logo{height:30px}
}
/* Filter-Beschriftungen: genug Zeilenhöhe, damit Unterlängen (g, p) unter Windows nicht abgeschnitten werden. */
.shell .filter-row88>.filter-button88 .filter-label88{line-height:1.45}
