.bottom-navigation { --navigation-safe-bottom:env(safe-area-inset-bottom,0px);position:absolute;z-index:100;bottom:max(0px,calc(max(8px,var(--navigation-safe-bottom)) + var(--navigation-offset,0px)));left:50%;transform:translateX(-50%);display:flex;gap:6px;width:280px;padding:7px;border:1px solid var(--line);border-radius:var(--radius-dock);background:var(--dock-background);box-shadow:var(--dock-shadow);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px); }
.bottom-tab { flex:1;display:flex;align-items:center;justify-content:center;gap:9px;border:0;border-radius:calc(var(--radius-dock) - 6px);background:transparent;color:var(--muted);padding:12px 18px;font-size:14px;min-height:46px; }
.bottom-tab.active { color:var(--active-text);background:var(--active-background);box-shadow:var(--control-shadow); }
.bottom-tab .icon { width:19px;height:19px; }

/* Navigation geometry is independent of the skin material and application routes. */
.bottom-navigation[data-navigation="standard"],.bottom-navigation[data-navigation="text"] {
  bottom:max(0px,var(--navigation-offset,0px));left:0;transform:none;width:100%;gap:0;padding:7px max(18px,calc((100vw - 520px) / 2)) max(0px,calc(max(7px,var(--navigation-safe-bottom)) + min(0px,var(--navigation-offset,0px))));border:0;border-top:1px solid var(--line);border-radius:0;box-shadow:0 -3px 16px #00000005;
}
.bottom-navigation[data-navigation="standard"] .bottom-tab { flex-direction:column;gap:4px;font-size:11px;padding:5px 15px;min-height:54px;border-radius:0;color:var(--muted); }
.bottom-navigation[data-navigation="standard"] .bottom-tab .icon { width:22px;height:22px; }
.bottom-navigation[data-navigation="standard"] .bottom-tab.active { color:var(--accent);background:transparent;box-shadow:none;border-radius:0;font-weight:600; }
.bottom-navigation[data-navigation="standard"] .bottom-tab.active .icon { fill:var(--soft); }
.bottom-navigation[data-navigation="panel"] { width:min(640px,calc(100% - 32px));border-radius:12px;gap:0;padding:0;overflow:hidden; }
.bottom-navigation[data-navigation="panel"] .bottom-tab { border-radius:0;min-height:58px;padding:16px 20px;font-size:15px; }
.bottom-navigation[data-navigation="panel"] .bottom-tab+ .bottom-tab { border-left:1px solid var(--line); }
.bottom-navigation[data-navigation="panel"] .bottom-tab.active { border-radius:0;box-shadow:inset 0 3px 0 var(--accent);background:var(--soft);color:var(--text); }
.bottom-navigation[data-navigation="text"] { padding-top:0;padding-bottom:max(0px,calc(var(--navigation-safe-bottom) + min(0px,var(--navigation-offset,0px)))); }
.bottom-navigation[data-navigation="text"] .bottom-tab { position:relative;min-height:58px;border-radius:0;font-size:15px;padding:16px 20px;letter-spacing:2px; }
.bottom-navigation[data-navigation="text"] .bottom-tab .icon { display:none; }
.bottom-navigation[data-navigation="text"] .bottom-tab.active { background:transparent;color:var(--text);box-shadow:none;border-radius:0;font-weight:600; }
.bottom-navigation[data-navigation="text"] .bottom-tab.active::after { content:'';position:absolute;bottom:8px;left:calc(50% - 13px);width:26px;height:2px;background:var(--accent); }