/* Shared navigation skin: routes, access rules and unread badges remain unchanged. */
body { --dock-bottom: calc(6px + env(safe-area-inset-bottom)); --dock-height: 50px; --tray-height: 58px; }
#appMain > .farm-bottom-nav {
  left: 50%; right: auto; bottom: var(--dock-bottom); width: min(680px, calc(100% - 24px));
  min-height: var(--dock-height); height: var(--dock-height); padding: 2px 8px;
  border: 1px solid #315e4d; border-radius: 40px; background: #173e2d;
  box-shadow: 0 5px 18px #173e2d24; backdrop-filter: none; transform: translateX(-50%);
}
#appMain > .farm-bottom-nav > button {
  min-height: 44px; height: 44px; padding: 2px; gap: 2px; border: 0; border-radius: 24px;
  color: #f7f6ef; background: transparent; font-weight: 600;
}
#appMain > .farm-bottom-nav .farm-nav-icon { width: 24px; height: 20px; margin: 0; border: 0; color: inherit; background: transparent; box-shadow: none; }
#appMain > .farm-bottom-nav .farm-nav-icon svg { width: 19px; height: 19px; stroke-width: 1.9; }
#appMain > .farm-bottom-nav .farm-nav-label { margin: 0; color: inherit; font-size: 12px; line-height: 1.25; letter-spacing: 0; font-weight: inherit; }
#appMain > .farm-bottom-nav > button.active { color: #173e2d; background: #deefdb; }
#appMain > .farm-bottom-nav > button.active .farm-nav-label::after { display: none; }
#appMain > .farm-bottom-nav > button:active { background: #315e4d; }
#appMain > .farm-bottom-nav > button.active:active { background: #c7dfc4; }
#appMain > .farm-bottom-nav > .farm-nav-back .farm-nav-icon { width: 24px; height: 24px; border-radius: 50%; color: #173e2d; background: #f7f5ec; }
#appMain > .farm-bottom-nav > .farm-nav-back .farm-nav-icon svg { width: 17px; height: 17px; }
#appMain > .farm-bottom-nav > .farm-nav-back:disabled { opacity: .5; }
#appMain > .farm-bottom-nav > .farm-nav-back:active .farm-nav-icon { transform: none; }
#appMain > .farm-bottom-nav > button:focus-visible { outline: 2px solid #fff; outline-offset: -3px; }
#appMain > .farm-bottom-nav > button.active:focus-visible { outline-color: #173e2d; }
#appMain > .farm-bottom-nav .friends-badge { top: 1px; left: 60%; border: 2px solid #173e2d; }
#appMain > .farm-bottom-drawer {
  bottom: calc(var(--dock-bottom) + var(--dock-height) + 4px); width: min(680px, calc(100% - 24px));
  height: var(--tray-height); padding: 10px 10px 2px; border: 1px solid #e2e7df; border-radius: 24px;
  background: #f8f7f0; box-shadow: 0 4px 16px #173e2d14;
  visibility: hidden;
}
body.farm-bottom-drawer-open #appMain > .farm-bottom-drawer { visibility: visible; }
#farmBottomDrawer .farm-bottom-drawer-grid { gap: 4px; height: 100%; }
#farmBottomDrawer .farm-bottom-drawer-grid button { min-height: 44px; padding: 2px; gap: 2px; border-radius: 18px; color: #173e2d; font-weight: 600; }
#farmBottomDrawer .farm-drawer-icon { width: 22px; height: 20px; padding: 0; color: #173e2d; background: transparent; }
#farmBottomDrawer .farm-drawer-icon svg { width: 20px; height: 20px; stroke-width: 1.9; }
#farmBottomDrawer .farm-bottom-drawer-grid button > span:last-child { font-size: 12px; line-height: 1.3; }
#farmBottomDrawer .farm-bottom-drawer-grid button:active { background: #e4edde; }
#farmBottomDrawerToggle {
  bottom: calc(var(--dock-bottom) + var(--dock-height) - 4px); width: 44px; min-height: 28px; height: 28px;
  border-radius: 22px; color: #548265; background: #f8f7f0; transition: bottom .2s ease;
}
#farmBottomDrawerToggle span { width: 22px; height: 4px; }
body.farm-bottom-drawer-open #farmBottomDrawerToggle { bottom: calc(var(--dock-bottom) + var(--dock-height) + 4px + var(--tray-height) - 19px); background: transparent; }
#farmBottomDrawerToggle:focus-visible { outline: 2px solid #548265; outline-offset: -7px; }
body #appMain { padding-bottom: calc(var(--dock-bottom) + var(--dock-height) + 40px); }
body.farm-bottom-drawer-open #appMain { padding-bottom: calc(var(--dock-bottom) + var(--dock-height) + var(--tray-height) + 28px); }
body.farm-bottom-drawer-open #appMain #aiAssistantToggle { top: auto !important; bottom: calc(var(--dock-bottom) + var(--dock-height) + var(--tray-height) + 22px) !important; }
@media (prefers-reduced-motion: reduce) { #farmBottomDrawerToggle, #farmBottomDrawer { transition: none; } }