/* ── Mauvely layout ─────────────────────────────────────────────────── */
:root{
  --container-max:1200px;
  --container-prose:620px;
  --page-gutter:48px;
  --page-gutter-sm:20px;
  --page-top:56px;
  --page-bottom:80px;
  --app-sidebar:264px;
  --app-topbar:60px;             /* web apps (Cloud): sticky top bar */

  /* Native app chrome — tokens.h chrome::, shared by every desktop app */
  --app-titlebar:44px;           /* on the ground, no rule under it */
  --app-statusbar:26px;          /* on the ground, no rule over it */
  --app-rail:72px;               /* icon rail, a chrome panel */
  --app-rail-item:56px;
  --app-rail-footer-item:44px;
  --app-rail-marker-w:2px;       /* teal marker at the rail's edge */
  --app-rail-marker-h:24px;
  --app-list:286px;              /* list column (conversations, threads) */
  --app-list-row:60px;
  --app-list-row-compact:44px;
  --app-header:52px;             /* header band inside a panel */
  --app-gutter:16px;             /* margin round the regions and between them */
  --app-column-max:1000px;       /* reading column cap inside a panel */
  --control-h-sm:32px;
  --control-h:40px;
  --control-h-lg:48px;
}