/* Phone action bar (pb-): fixed at the bottom on phones, two lines left, one big button right.
   phonebar.js sets the --pb-* colours and button type from the page itself; the fallbacks here only show if it can't. */
.pb{display:none}
/* notch sides: viewport-fit=cover (added with the bar) lets the page run under a landscape phone's notch */
html.pb-on{--pb-h:64px;padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}
@media (max-width:760px){
  html.pb-run{padding-bottom:calc(var(--pb-h) + env(safe-area-inset-bottom))}
  .pb{position:fixed;left:0;right:0;bottom:0;z-index:40;box-sizing:border-box;display:flex;align-items:center;gap:12px;
    min-height:calc(var(--pb-h) + env(safe-area-inset-bottom));padding:8px max(14px,env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left));
    background:var(--pb-bg,#fff);color:var(--pb-fg,#111);border-top:1px solid var(--pb-line,rgba(0,0,0,.14));
    font-family:var(--pb-font,system-ui,sans-serif);font-weight:400;font-style:normal;text-transform:none;letter-spacing:normal;text-align:left;
    visibility:hidden;opacity:0}
  .pb.pb-in{visibility:visible;opacity:1}
  .pb-ctx{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px;line-height:1.25}
  .pb-l1,.pb-l2{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .pb-l1{font-size:15px;font-weight:600}
  .pb-l2{font-size:13px;color:var(--pb-sub,inherit)}
  .pb-dot{display:inline-block;width:7px;height:7px;margin-right:7px;border-radius:50%;background:currentColor;opacity:.4;vertical-align:1px}
  .pb[data-open="1"] .pb-dot{background:#3fae6a;opacity:1}
  .pb .pb-btn{flex:0 0 auto;max-width:62%;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;min-width:48px;min-height:48px;padding:0 22px;
    border-radius:var(--pb-r,999px);background:var(--pb-btn-bg,#111);color:var(--pb-btn-fg,#fff);
    font-family:var(--pb-btn-font,inherit);font-weight:var(--pb-btn-weight,600);letter-spacing:var(--pb-btn-ls,normal);text-transform:var(--pb-btn-tt,none);font-size:var(--pb-btn-size,16px);
    line-height:1.1;text-align:center;text-wrap:balance;text-decoration:none;-webkit-tap-highlight-color:transparent}
  .pb .pb-btn:focus-visible{outline:2px solid var(--pb-fg,#111);outline-offset:2px}
}
/* the short slide-up; with reduced motion (or Movement off, which makes this query false) the bar simply appears */
@media (max-width:760px) and (prefers-reduced-motion:no-preference){
  .pb{transform:translateY(100%);transition:transform .3s cubic-bezier(.2,.7,.2,1),opacity .3s}
  .pb.pb-in{transform:none}
}