/* An alert from porch to everyone, across the top of every page. */
.pa-alert{position:relative;z-index:60;padding-top:env(safe-area-inset-top);font:14px/1.42 -apple-system,BlinkMacSystemFont,"SF Pro Text","Helvetica Neue",sans-serif;-webkit-font-smoothing:antialiased;text-align:left}
.pa-in{display:flex;align-items:flex-start;gap:12px;max-width:1100px;margin:0 auto;padding:12px max(16px,env(safe-area-inset-right)) 12px max(16px,env(safe-area-inset-left))}
.pa-ic{width:20px;height:20px;flex:none;margin-top:1px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pa-alert p{flex:1;min-width:0;margin:0}
.pa-k,.pa-area{font-size:11px;font-weight:800;letter-spacing:.9px;text-transform:uppercase;opacity:.92}
.pa-area:before{content:"·";margin:0 6px}
.pa-t{display:block;font-weight:700;font-size:15px;margin-top:1px}
.pa-b{opacity:.92}
.pa-alert a{color:inherit;font-weight:700;text-decoration:underline;text-underline-offset:2px;white-space:nowrap}
.pa-x{flex:none;width:30px;height:30px;margin:-5px -7px -5px 0;border:0;border-radius:15px;background:transparent;color:inherit;font:400 22px/1 -apple-system,sans-serif;cursor:pointer;opacity:.8}
.pa-x:hover{opacity:1;background:rgba(255,255,255,.18)}
.pa-emergency{background:#c8281e;color:#fff}
.pa-emergency .pa-ic{animation:pa-pulse 1.6s ease-in-out infinite}
.pa-warning{background:#ffb020;color:#1d1408}
.pa-warning .pa-x:hover{background:rgba(0,0,0,.08)}
.pa-info{background:#1d1d1f;color:#fff}
@keyframes pa-pulse{50%{opacity:.45}}
@media (prefers-reduced-motion:reduce){.pa-emergency .pa-ic{animation:none}}
/* The app fills the screen, so the banner takes its share of it. */
body:has(>.pa-alert):has(>.app){height:100vh;height:100dvh;display:flex;flex-direction:column;overflow:hidden}
body:has(>.pa-alert)>.app{flex:1;min-height:0;height:auto}
@media (max-width:760px){body:has(>.pa-alert) .app .tool{padding-top:6px}}
/* Pages on a sheet: the banner runs edge to edge. */
@media (min-width:560px){body.pf>.pa-alert{margin:-36px -16px 26px}}
/* An admin with a sample page open. */
.pa-acting{background:#2a2350;color:#fff}
.pa-acting .pa-in{align-items:center}
.pa-acting a{font-weight:600}
.pa-back{flex:none;height:32px;padding:0 14px;border:0;border-radius:16px;background:#fff;color:#2a2350;font:650 13px/1 -apple-system,sans-serif;cursor:pointer}