/* Anpassungen nur für die Android-App: keine Kopfleiste und kein Menü, daher kein Abstand dafür */
:root { --nav-h: 0px; }
main.view { padding-block: 12px 24px; max-width: 560px; }
.so-tabs { top: 6px; }
html, body { overscroll-behavior: none; }
/* Kopf der App: Logo der Webseite in der Mitte, darunter dezent „SO Weitenrechner“ */
.so-head-app { display: grid; grid-template-columns: 64px 1fr 64px; align-items: center; padding: 10px 10px 8px; }
.so-brand { display: grid; justify-items: center; gap: 2px; }
.so-brand img { width: min(58vw, 230px); height: auto; filter: drop-shadow(0 0 10px rgba(0, 248, 255, .45)); }
.so-brand h1 { margin: 0; font: 700 12px/1.2 var(--font-caps); letter-spacing: .22em; text-transform: uppercase; color: #9fc3c6; text-shadow: none; }
/* Sichern/Einspielen (.gswr) oben rechts in der Banner-Ecke, nur Web-App und nur in der Chipliste */
.so-head-app { position: relative; }
.so-tools { position: absolute; top: 8px; right: 8px; display: flex; gap: 6px; }
.so-tools[hidden] { display: none; }
.so-tool { width: 36px; height: 36px; display: grid; place-items: center; padding: 0; border-radius: 11px; cursor: pointer;
  border: 1px solid rgba(245, 197, 24, .6); background: radial-gradient(circle at 30% 25%, rgba(245, 197, 24, .22), rgba(2, 12, 14, .9) 70%);
  box-shadow: 0 0 12px rgba(245, 197, 24, .25), inset 0 0 8px rgba(0, 248, 255, .15); transition: transform .1s, box-shadow .15s; }
.so-tool:active { transform: scale(.94); box-shadow: 0 0 18px rgba(245, 197, 24, .6); }
.so-tool svg { width: 24px; height: 24px; fill: none; stroke-linecap: round; stroke-linejoin: round; }
.so-tool .d { stroke: #9ff7ff; stroke-width: 2; }
.so-tool .g { stroke: var(--gold); stroke-width: 2.2; }
@media (max-width: 380px) { .so-tool { width: 32px; height: 32px; } .so-tool svg { width: 21px; height: 21px; } .so-brand img { width: min(52vw, 200px); } }
/* Hinweis der Web-App, wenn eine neue Version geladen wurde */
#gs-update { position: fixed; z-index: 200; left: 50%; bottom: calc(18px + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%); max-width: calc(100% - 32px);
  padding: 12px 18px; border-radius: 999px; border: 1px solid var(--gold); background: rgba(20, 16, 2, .95); color: var(--gold); font-weight: 800; cursor: pointer;
  box-shadow: 0 0 18px rgba(245, 197, 24, .45); }