/* Shared floating action bar, loaded after the reading scale. */
@media (max-width:1339px) {
  .mobile-dock {
    display:grid;
    grid-template-columns:68px 78px minmax(0,1fr);
    align-items:center;
    gap:8px;
    position:fixed;
    left:max(12px, env(safe-area-inset-left));
    right:max(12px, env(safe-area-inset-right));
    bottom:calc(12px + env(safe-area-inset-bottom));
    max-width:520px;
    margin-inline:auto;
    padding:8px;
    border:1px solid rgb(var(--brand-shadow-rgb) / 0.1255);
    border-radius:24px;
    background:rgb(255 255 255 / 97%);
    box-shadow:0 8px 30px rgb(var(--brand-shadow-rgb) / 0.1255), 0 2px 6px rgb(var(--brand-shadow-rgb) / 0.0314);
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
    z-index:29;
  }
  .mobile-dock > a.dock-action {
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:3px;
    height:58px;
    min-width:0;
    padding:0 2px;
    border-radius:15px;
    color:var(--ink);
    font-size:var(--text-caption);
    font-weight:600;
    line-height:1.25;
    text-align:center;
    text-decoration:none;
  }
  .dock-icon {
    display:grid;
    place-items:center;
    height:32px;
    width:34px;
    border-radius:11px;
    background:var(--brand-wash);
  }
  .mobile-dock .dock-icon svg { width:21px; height:21px; }
@media (hover:hover) and (pointer:fine){.mobile-dock > a.dock-action:hover{ background:var(--brand-wash); }}

@media (hover:hover) and (pointer:fine){.mobile-dock > a.dock-action:hover .dock-icon{ background:var(--brand-wash); }}

  .mobile-dock > .dock-booking.button {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    min-width:0;
    min-height:58px;
    height:58px;
    margin:0;
    padding:10px 18px;
    border:1px solid transparent;
    border-radius:17px;
    background:var(--green);
    box-shadow:inset 0 1px 0 #ffffff16;
    color:#fff;
    font-weight:600;
    line-height:1.2;
  }
  .dock-booking-copy { display:flex; flex-direction:column; gap:4px; align-items:flex-start; }
  .dock-booking-title { font-size:1rem; letter-spacing:-.01em; }
  .dock-booking-note { font-size:var(--text-label); line-height:1.2; color:var(--brand-footer-muted); font-weight:400; }
  .mobile-dock .dock-booking>svg { width:20px; height:20px; }
@media (hover:hover) and (pointer:fine){.mobile-dock > .dock-booking.button:hover{ background:var(--brand-brown-hover); border-color:transparent; }}

  .mobile-dock a:focus-visible { outline:3px solid var(--gold); outline-offset:3px; }
  body:has(dialog[open]) .mobile-dock { visibility:hidden; }
  footer { padding-bottom:calc(125px + env(safe-area-inset-bottom)); }
}
@media (max-width:360px) {
  .mobile-dock { grid-template-columns:58px 70px minmax(0,1fr); gap:4px; padding:7px; left:10px; right:10px; border-radius:23px; }
  .mobile-dock > .dock-booking.button { gap:7px; padding:10px 13px; border-radius:16px; }
  .mobile-dock > a.dock-action { font-size:var(--text-caption); }
  .mobile-dock .dock-booking>svg { width:17px; height:17px; }
}
