*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0;background:#14181B;-webkit-text-size-adjust:100%}
body{overscroll-behavior-y:none}
button,select,input,textarea{font:inherit;color:inherit}
button{cursor:pointer}
select{-webkit-appearance:none;appearance:none}
.flex{display:flex}.grid{display:grid}
.flex-1{flex:1 1 0%}.flex-col{flex-direction:column}
.w-full{width:100%}.shrink-0{flex-shrink:0}
.items-center{align-items:center}.items-start{align-items:flex-start}.items-baseline{align-items:baseline}
.justify-between{justify-content:space-between}.justify-center{justify-content:center}
.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}
.gap-x-4{column-gap:1rem}.gap-y-2{row-gap:.5rem}
.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
@keyframes spin{to{transform:rotate(360deg)}}
.animate-spin{animation:spin 1s linear infinite}

/* Feste Höhe: nur der Inhalt scrollt, Kopf und Reiterleiste bleiben stehen */
html,body{height:100%;overflow:hidden}
#root{height:100%}
.shell{
  height:100dvh;
  max-height:100dvh;
  overflow:hidden;
  padding-left:env(safe-area-inset-left);
  padding-right:env(safe-area-inset-right);
}
.shell > header{flex-shrink:0}
.shell > main{min-height:0;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.navbar{flex-shrink:0;padding-bottom:env(safe-area-inset-bottom)}