
:root{--v27-app-overlay:.58;--v27-header-overlay:.46}
body.v27-shell{position:relative;background:var(--bg,#082e28)!important;background-image:none!important;min-height:100vh}
body.v27-shell::before{content:"";position:fixed;inset:0;z-index:-3;background:var(--v27-app-bg,linear-gradient(180deg,#17231f,#06372e 55%,#082e28));background-size:cover;background-position:center;background-repeat:no-repeat}
body.v27-shell::after{content:"";position:fixed;inset:0;z-index:-2;background:rgba(0,18,20,var(--v27-app-overlay));pointer-events:none}
.v27GlobalHeader{position:sticky;top:0;z-index:100;isolation:isolate;overflow:hidden;color:#fff;min-height:118px;padding:18px max(18px,calc((100vw - 920px)/2 + 18px));display:grid;grid-template-columns:58px 1fr 58px;align-items:center;gap:12px;border-bottom:1px solid #ffffff38;background:#071f2c}
.v27GlobalHeader::before{content:"";position:absolute;inset:0;z-index:-2;background:var(--v27-header-bg,linear-gradient(135deg,#0b2446,#0b665a));background-size:cover;background-position:center;background-repeat:no-repeat}
.v27GlobalHeader::after{content:"";position:absolute;inset:0;z-index:-1;background:rgba(3,16,28,var(--v27-header-overlay))}
.v27HeaderLogo{width:54px;height:54px;border-radius:16px;border:1px solid #ffffff66;background:#0b4da2cc;display:grid;place-items:center;font-weight:900;font-size:17px;overflow:hidden;box-shadow:0 5px 18px #0004}
.v27HeaderLogo img{width:100%;height:100%;object-fit:contain;padding:4px}
.v27HeaderCenter{text-align:center;min-width:0}.v27HeaderBrand{font-size:30px;line-height:1;font-weight:900;letter-spacing:-1px;text-shadow:0 2px 8px #0008}.v27HeaderBrand b{color:#1787ff}.v27HeaderContext{margin-top:9px;font-size:16px;font-weight:800;color:#d8f7ed;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.v27HeaderMenu{width:54px;height:54px;border:0;background:#0003;border-radius:16px;color:#fff;font-size:31px;cursor:pointer;display:grid;place-items:center}
.v27HeaderMenu:hover{background:#0005}
@media(max-width:600px){.v27GlobalHeader{min-height:104px;padding:14px 14px;grid-template-columns:48px 1fr 48px}.v27HeaderLogo,.v27HeaderMenu{width:46px;height:46px;border-radius:14px}.v27HeaderBrand{font-size:25px}.v27HeaderContext{font-size:14px;margin-top:7px}}

.v27HeaderSwitch{grid-column:1/-1;display:flex;justify-content:center;gap:6px;margin-top:8px}
.v27HeaderSwitch button{min-width:125px;border:1px solid #ffffff55;border-radius:999px;padding:8px 15px;background:#ffffff18;color:#fff;font-weight:800;cursor:pointer}
.v27HeaderSwitch button.active{background:#1787ff;border-color:#1787ff}
@media(max-width:600px){.v27HeaderSwitch{margin-top:5px}.v27HeaderSwitch button{min-width:112px;padding:7px 12px}}

/* V2.19 Navigation + Profil */
.v27GlobalHeader{grid-template-columns:58px 1fr 54px 54px}.v27HeaderProfile{width:54px;height:54px;border:1px solid #ffffff55;background:#0b4da2cc;border-radius:50%;padding:0;overflow:hidden;color:#fff;font-weight:900;cursor:pointer;display:grid;place-items:center}.v27HeaderProfile img{width:100%;height:100%;object-fit:cover}.v27HeaderProfile span{font-size:15px}.v27Overlay{position:fixed;inset:0;background:#00111caa;backdrop-filter:blur(5px);z-index:500;display:none}.v27Overlay.show{display:block}.v27Drawer{position:absolute;right:0;top:0;height:100%;width:min(88vw,390px);overflow:auto;background:linear-gradient(180deg,rgba(6,25,53,.98),rgba(4,19,42,.99));color:#fff;padding:18px 14px 28px;box-shadow:-18px 0 60px #0008}.v27DrawerClose{position:absolute;right:14px;top:12px;width:42px;height:42px;border:0;border-radius:12px;background:#ffffff10;color:#fff;font-size:31px;cursor:pointer}.v27DrawerHead,.v27ProfileHead{display:flex;gap:13px;align-items:center;padding:12px 50px 18px 2px;border-bottom:1px solid #ffffff22}.v27DrawerHead strong,.v27ProfileHead strong{display:block;font-size:17px}.v27DrawerHead small,.v27ProfileHead small{display:block;color:#9fc7ff;margin-top:4px;line-height:1.35}.v27DrawerBadge{width:48px;height:48px;border-radius:14px;background:#1688ff;display:grid;place-items:center;font-weight:900;overflow:hidden}.v27DrawerBadge img{width:100%;height:100%;object-fit:contain;padding:3px}.v27ProfileHead img,.v27ProfileAvatar{width:62px;height:62px;border-radius:50%;object-fit:cover;background:#1688ff;display:grid;place-items:center;font-weight:900;font-size:18px;border:2px solid #ffffff88}.v27DrawerSection{margin-top:18px}.v27DrawerSection h4{font-size:11px;letter-spacing:1.6px;color:#70a8e8;margin:0 0 8px 6px}.v27DrawerItem{display:grid;grid-template-columns:42px 1fr 18px;gap:10px;align-items:center;color:#fff;text-decoration:none;padding:11px 10px;border:1px solid #ffffff19;background:#0e315fcc;border-radius:12px;margin:7px 0}.v27DrawerItem:hover{border-color:#2e93ff;background:#124279}.v27DrawerIcon{width:36px;height:36px;border-radius:10px;background:#0b5bb2;display:grid;place-items:center;font-size:20px}.v27DrawerItem b{display:block;font-size:15px}.v27DrawerItem small{display:block;color:#b6c9df;font-size:11px;margin-top:2px}.v27DrawerItem i{font-style:normal;font-size:24px;color:#9ccaff}.v27Logout{width:100%;display:grid;grid-template-columns:42px 1fr;align-items:center;text-align:left;border:1px solid #e55b6d;background:#9d2638;color:#fff;border-radius:12px;padding:11px 10px;margin-top:14px;cursor:pointer}.v27Logout span{font-size:22px}.v27DrawerFoot{margin:28px 6px 8px;color:#aec1d6;font-size:12px;text-align:center}.v27DrawerFoot span{opacity:.7}.v27ProfileDrawer{width:min(82vw,340px)}
@media(max-width:600px){.v27GlobalHeader{grid-template-columns:48px 1fr 44px 44px;gap:8px}.v27HeaderLogo,.v27HeaderMenu,.v27HeaderProfile{width:44px;height:44px}.v27HeaderMenu{border-radius:13px;font-size:26px}.v27HeaderProfile{border-radius:50%}}

.v27DrawerItemHero{position:relative;overflow:hidden;background-image:linear-gradient(90deg,rgba(7,37,77,.92),rgba(10,52,98,.75)),var(--v27-tile-bg,none);background-size:cover;background-position:center}.v27DrawerItemHero>*{position:relative;z-index:1}.v27DrawerItemHero .v27DrawerIcon{background:#0b5bb2dd;backdrop-filter:blur(2px)}

.v27MenuHasBg .v27NavDrawer{background-image:linear-gradient(180deg,rgba(6,25,53,.76),rgba(4,19,42,.86)),var(--v27-menu-bg);background-size:cover;background-position:center;background-repeat:no-repeat;backdrop-filter:blur(5px)}

/* V2.25 Touch-Optimierung */
.v27HeaderMenu,.v27HeaderProfile,.v27DrawerClose,.v27DrawerItem,.v27Logout{touch-action:manipulation;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none}
.v27DrawerItem,.v27HeaderMenu,.v27HeaderProfile,.v27DrawerClose,.v27Logout{transition:transform .06s ease,filter .06s ease,background-color .06s ease,border-color .06s ease}
.v27Pressed,.v27DrawerItem:active,.v27HeaderMenu:active,.v27HeaderProfile:active,.v27DrawerClose:active,.v27Logout:active{transform:scale(.985);filter:brightness(1.14)}


/* V2.29 Einheitliche mobile Hauptnavigation */
.v27AppBottom{
  position:fixed!important;left:0!important;right:0!important;bottom:0!important;z-index:140!important;
  display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:4px!important;background:rgba(22,24,27,.96)!important;
  border-top:1px solid rgba(255,255,255,.12)!important;
  padding:7px max(7px,calc((100vw - 820px)/2 + 7px)) calc(7px + env(safe-area-inset-bottom))!important;
  backdrop-filter:blur(16px)!important;-webkit-backdrop-filter:blur(16px)!important;
}
.v27AppBottom a,.v27AppBottom button{
  appearance:none!important;-webkit-appearance:none!important;border:0!important;margin:0!important;
  min-width:0!important;min-height:54px!important;width:auto!important;max-width:none!important;
  padding:5px 2px!important;border-radius:15px!important;background:transparent!important;color:#fff!important;
  text-decoration:none!important;display:flex!important;flex-direction:column!important;align-items:center!important;
  justify-content:center!important;gap:2px!important;font:inherit!important;font-size:11px!important;font-weight:600!important;
  line-height:1.12!important;opacity:.92!important;cursor:pointer!important;touch-action:manipulation!important;
  -webkit-tap-highlight-color:transparent!important;transition:background-color .08s ease,color .08s ease,box-shadow .08s ease!important;
  transform:none!important;
}
.v27AppBottom a:active,.v27AppBottom button:active{
  transform:none!important;filter:none!important;background:rgba(23,135,255,.12)!important;
}
.v27AppBottom a.active,.v27AppBottom button.active{
  color:#fff!important;background:rgba(23,135,255,.24)!important;
  box-shadow:inset 0 0 0 1px rgba(92,174,255,.20)!important;opacity:1!important;
}
.v27AppBottom .v27BottomIcon{
  width:32px!important;height:26px!important;display:grid!important;place-items:center!important;
  font-size:23px!important;line-height:26px!important;transform:none!important;color:inherit!important;
}
.v27AppBottom .v27BottomIcon svg{width:30px!important;height:23px!important;display:block!important;transform:none!important}
.v27AppBottom .active .v27BottomIcon{color:#2f9cff!important}
.v27AppBottom .v27BottomLabel{display:block!important;font-size:11px!important;line-height:13px!important;transform:none!important}
body.v27HasAppBottom{padding-bottom:82px!important}
body.v27HasAppBottom .app,body.v27HasAppBottom .page,body.v27HasAppBottom main{padding-bottom:max(94px,calc(86px + env(safe-area-inset-bottom)))!important}
body.v27HasAppBottom .own{bottom:76px!important}
@media(max-width:380px){.v27AppBottom a,.v27AppBottom button{font-size:10px!important}.v27AppBottom .v27BottomLabel{font-size:10px!important}.v27AppBottom .v27BottomIcon{font-size:21px!important}}

/* V2.88 mobile overlay safety */
@media(max-width:680px){
 body.v27-app{overflow-x:hidden;padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))}
 body.roles-open,body.v27-modal-open{overflow:hidden!important;touch-action:none}
 .v27Overlay{z-index:30000}
 .v27BottomNav,.bottomTerm{padding-bottom:env(safe-area-inset-bottom,0px)}
}
