/* Navigationsleiste ganz links (Desktop) bzw. Tab-Leiste unten (Handy) – auf allen Seiten im Apple-Design */
:root{--rail-w:76px;--tab-h:56px;
  --r-bg:rgba(246,246,248,.88);--r-solid:#ffffff;--r-ink:#1c1c1e;--r-ink2:#6e6e73;--r-line:rgba(60,60,67,.16);--r-fill:rgba(118,118,128,.12);--r-acc:#007aff}
@media (prefers-color-scheme:dark){:root{--r-bg:rgba(28,28,30,.88);--r-solid:#3a3a3c;--r-ink:#ffffff;--r-ink2:#98989d;--r-line:rgba(84,84,88,.55);--r-fill:rgba(118,118,128,.24);--r-acc:#0a84ff}}
.ffr{position:fixed;z-index:3000;left:0;top:0;bottom:0;width:var(--rail-w);display:flex;flex-direction:column;align-items:center;gap:4px;
  padding:calc(14px + env(safe-area-inset-top,0px)) 8px calc(14px + env(safe-area-inset-bottom,0px)) calc(8px + env(safe-area-inset-left,0px));
  background:var(--r-bg);border-right:.5px solid var(--r-line);-webkit-backdrop-filter:saturate(180%) blur(30px);backdrop-filter:saturate(180%) blur(30px);
  font:500 11px/1.2 -apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;letter-spacing:0;box-sizing:border-box}
.ffr *{box-sizing:border-box}
.ffr-logo{width:40px;height:40px;border-radius:11px;display:grid;place-items:center;margin-bottom:14px;text-decoration:none;color:#fff;
  background:linear-gradient(160deg,#3ddc6c,#1e8e3e);font:800 15px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;letter-spacing:-.04em;box-shadow:0 1px 3px rgba(0,0,0,.2),inset 0 .5px 0 rgba(255,255,255,.4)}
.ffr a.it{width:60px;display:flex;flex-direction:column;align-items:center;gap:5px;padding:9px 0 7px;border-radius:12px;color:var(--r-ink2);text-decoration:none;transition:background .15s,color .15s}
.ffr a.it svg{width:22px;height:22px}
.ffr a.it:hover{background:var(--r-fill);color:var(--r-ink)}
.ffr a.it[aria-current=page]{color:var(--r-acc);background:color-mix(in srgb,var(--r-acc) 12%,transparent);font-weight:600}
.ffr a.it:focus-visible,.ffr .lg a:focus-visible{outline:2px solid var(--r-acc);outline-offset:1px}
.ffr .sp{flex:1}
.ffr .lg{display:flex;flex-direction:column;gap:2px;padding:2px;border-radius:10px;background:var(--r-fill)}
.ffr .lg a{width:44px;text-align:center;padding:6px 0;border-radius:8px;font-size:12px;font-weight:600;color:var(--r-ink2);text-decoration:none}
.ffr .lg a[aria-current=true]{background:var(--r-solid);color:var(--r-ink);box-shadow:0 1px 3px rgba(0,0,0,.12)}
.ffr a.lgm{display:none}
.ffr .lgm b{display:grid;place-items:center;width:24px;height:22px;border-radius:6px;border:1.6px solid currentColor;font-size:10px;font-weight:700}
/* Karte (Desktop): Glas-Leiste rechts neben der Navigation */
@media (min-width:761px){
  html.rail{--map-pan:492px}
  html.rail #side{left:calc(var(--rail-w) + 12px)}
  html.rail .brandrow .mark{display:none}
  html.rail #langHint{left:calc(var(--rail-w) + 12px)!important}
  html.rail body:not(:has(#app)){padding-left:calc(var(--rail-w) + max(24px,env(safe-area-inset-left,0px)))!important}
  html.rail .ffh{display:none!important}
}
/* Handy: Tab-Leiste unten */
@media (max-width:760px){
  .ffr{top:auto;right:0;width:auto;height:calc(var(--tab-h) + env(safe-area-inset-bottom,0px));flex-direction:row;align-items:stretch;justify-content:space-around;gap:0;
    padding:4px max(4px,env(safe-area-inset-right,0px)) env(safe-area-inset-bottom,0px) max(4px,env(safe-area-inset-left,0px));border-right:0;border-top:.5px solid var(--r-line);font-size:10px}
  .ffr-logo,.ffr .sp,.ffr .lg{display:none}
  .ffr a.it{width:auto;flex:1;padding:5px 0 3px;gap:3px;border-radius:10px}
  .ffr a.it[aria-current=page]{background:none}
  .ffr a.lgm{display:flex}
  html.rail #sheet{bottom:calc(var(--tab-h) + env(safe-area-inset-bottom,0px));height:calc(100dvh - 120px - env(safe-area-inset-top,0px) - var(--tab-h) - env(safe-area-inset-bottom,0px));padding-bottom:0}
  html.rail .fab{bottom:calc(var(--peek,240px) + var(--tab-h) + env(safe-area-inset-bottom,0px) + 16px)}
  html.rail .toast{bottom:calc(var(--peek,240px) + var(--tab-h) + env(safe-area-inset-bottom,0px) + 20px)}
  html.rail #langHint{bottom:calc(var(--tab-h) + env(safe-area-inset-bottom,0px) + 10px)!important}
  html.rail body:not(:has(#app)){padding-bottom:calc(var(--tab-h) + env(safe-area-inset-bottom,0px) + 32px)!important}
}