/* The phone bottom bar and its contents sheet (Website/Design/projects/blog-post, 2026-10-20), single blog
   posts only (enqueued if is_singular('post')); built by tools/build_single_css.py with css/single.css.
   Posts carry viewport-fit=cover, so the page's side gutters and the bar respect the safe areas. */
.bp .bbar{position:fixed;left:0;right:0;bottom:0;z-index:60;display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:4px var(--px) calc(4px + env(safe-area-inset-bottom));background:rgba(255,255,255,.96);border-top:1px solid var(--line);
  transform:translateY(100%);visibility:hidden;transition:transform .3s,visibility 0s .3s}
.bp .bbar.on{transform:none;visibility:visible;transition-delay:0s}
.bp .bbar>*{position:relative}
.bp .bbar>*::before{content:"";position:absolute;left:0;right:0;top:-8px;bottom:-8px}.bp .bbar:not(:has(button)){justify-content:flex-end}
.bp .bbar button{display:inline-flex;align-items:center;gap:7px;min-height:28px;padding:0;border:0;background:none;color:var(--navy);font:400 13.5px/1 var(--sans);cursor:pointer}
.bp .bbar button svg{width:16px;height:16px}
.bp .bbar a.go{display:inline-flex;align-items:center;gap:6px;min-height:28px;padding:0 12px;border-radius:7px;background:var(--ink);color:#fff;font:500 13.5px/1 var(--sans);text-decoration:none}
.bp .bbar a.go svg{width:14px;height:14px}
.bp .sheet{position:fixed;inset:auto 0 0 0;width:auto;max-width:none;max-height:78vh;max-height:78dvh;margin:0;padding:0;border:0;border-radius:18px 18px 0 0;background:#fff;overscroll-behavior:contain}
.bp .sheet::backdrop{background:rgba(20,32,44,.45)}
.bp .sheet .in{max-height:inherit;overflow:auto;padding:8px 20px calc(24px + env(safe-area-inset-bottom));box-sizing:border-box;overscroll-behavior:contain}
.bp .sheet .grab{width:40px;height:4px;margin:6px auto 12px;border-radius:2px;background:var(--line)}
.bp .sheet h2{margin:0 0 6px;font:400 22px/1.2 var(--serif);color:var(--navy)}
.bp .sheet ol{list-style:none;margin:0;padding:0}
.bp .sheet li{border-top:1px solid var(--line)}
.bp .sheet a{display:flex;gap:10px;min-height:46px;align-items:center;font:400 15.5px/1.35 var(--sans);color:var(--text);text-decoration:none}
.bp .sheet a .n{flex:0 0 1.5em;font:400 16px/1 var(--serif);color:var(--muted)}

.bp .bbar{-webkit-text-size-adjust:100%;text-size-adjust:100%}
.bp .bbar button,.bp .bbar a.go{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.bp .bbar button:active,.bp .bbar a.go:active{opacity:.7}
.bp .bbar :focus-visible{outline:2px solid var(--navy);outline-offset:3px;border-radius:6px}
@media (min-width:900px){ .bp .bbar,.bp .sheet{display:none!important} }
@media (prefers-reduced-motion:reduce){ .bp .bbar{transition:none} }

@media (max-width:899.98px){
  body.has-bbar{padding-bottom:calc(37px + env(safe-area-inset-bottom))}
  html:has(body.has-bbar){scroll-padding-bottom:calc(37px + env(safe-area-inset-bottom))}
}
.bp .wrap,.sh-in,.sf-in,.mm-body,.bp .bbar,.bp .sheet .in{padding-inline:max(var(--px,20px),env(safe-area-inset-left)) max(var(--px,20px),env(safe-area-inset-right))}