/* ===== App-Shell: mobile App-Optik für Go4Pro ===== */
:root{--tab-h:64px;--safe-b:env(safe-area-inset-bottom,0px);--safe-t:env(safe-area-inset-top,0px)}
html{-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%}
body{overscroll-behavior-y:none}
a,button{touch-action:manipulation}

/* Menüleiste oben (Tablet/Desktop) */
.g4p-menu a{display:inline-flex;align-items:center;gap:7px}
.g4p-menu svg{width:18px;height:18px}

/* Tableiste unten (Handy) */
.tabbar{display:none}
@media (max-width:760px){
  .g4p-menu{display:none!important}
  .tabbar{
    display:grid;grid-template-columns:repeat(5,1fr);
    position:fixed;left:0;right:0;bottom:0;z-index:1000;
    height:calc(var(--tab-h) + var(--safe-b));padding-bottom:var(--safe-b);
    background:rgba(4,17,40,.94);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
    border-top:1px solid rgba(255,255,255,.1);
    font-family:system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  }
  .tabbar a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;color:#8fa3bf;text-decoration:none;font-size:11px;font-weight:700;position:relative}
  .tabbar svg{width:25px;height:25px;transition:transform .15s}
  .tabbar a[aria-current=page]{color:#ffdc18}
  .tabbar a[aria-current=page]::before{content:"";position:absolute;top:0;width:28px;height:3px;border-radius:0 0 3px 3px;background:#ffdc18}
  .tabbar a:active svg{transform:scale(.88)}
  body.has-tabbar{padding-bottom:calc(var(--tab-h) + var(--safe-b))}
  body.has-tabbar footer{padding-bottom:24px}

  /* App-Kopfzeile */
  .nav{padding-top:var(--safe-t)}
  .nav-inner{height:56px}
  .brand img{width:36px;height:36px}

  /* Ansichten: immer nur eine sichtbar */
  body.app-views .view{display:none}
  body.app-views .view.active{display:block;animation:viewIn .22s ease-out}
  @keyframes viewIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

  /* Kompakteres Karten-Layout */
  body.member-app main{padding:18px 0 24px}
  body.member-app .container{width:calc(100% - 28px)}
  body.member-app .card{padding:18px;border-radius:18px;margin-bottom:14px}
  body.member-app .card h2{font-size:21px}
  body.member-app h1{font-size:30px}
  body.member-app .lead{font-size:16px;margin-bottom:18px}
  body.member-app .grid3{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;margin-bottom:14px!important}
  body.member-app .grid3 .stat:first-child{grid-column:1/-1}
  body.member-app .stat{padding:10px;border-radius:12px}
  body.member-app .stat b{font-size:15px;display:block;overflow-wrap:break-word}
  body.member-app .stat small{font-size:11px}
  body.member-app .stat .muted.small{display:none}
  body.member-app .download{padding:18px;border-radius:18px;margin-bottom:14px}
  body.member-app .tabs{margin:0 -18px 12px;padding:0 18px 6px}
  footer{font-size:13px}
}
.app-only{display:none}
@media (max-width:760px){ .app-only{display:block} .app-only[hidden]{display:none} }
.app-title{display:none}
@media (max-width:760px){ .app-title{display:block} }
/* Installiert als App: Installationshinweis ausblenden */
@media (display-mode:standalone){ .install-card{display:none!important} }