/* Web app layout: the same panel as the extension, as a calm centred column.
   On a phone it fills the screen; on a computer it sits in the middle like a notebook. */
html { background: var(--band); }
body.web { max-width: 560px; margin: 0 auto; background: var(--bg); box-shadow: 0 0 0 1px var(--line); }
body.web .top { padding-top: max(12px, env(safe-area-inset-top)); }
body.web .add { padding-bottom: max(12px, env(safe-area-inset-bottom)); }
@media (max-width: 560px) { body.web { box-shadow: none; } }
body.web { height: 100vh; height: 100dvh; }