/*
 * ASENTRA SMART PARKING — mobile-browser demo
 * M00 PART 02 · foundation layer: reset-lite, mobile sizing, app root.
 * All literal values live in css/tokens.css — load tokens.css before this file.
 */

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  height: 100%;
  color-scheme: var(--color-scheme);
  -webkit-text-size-adjust: 100%;
  font-size: var(--font-size-root);
}

body {
  margin: 0;
  min-height: 100vh;
  min-height: var(--layout-viewport-min-height, 100dvh);
  font-family: var(--font-family-base);
  font-size: var(--font-size-300);
  line-height: var(--line-height-normal);
  color: var(--color-text-primary);
  background-color: var(--color-surface-page);
}

/* App root: full-height mobile column, centered within a max width.
   Safe-area gutters are handled by the shell (css/shell.css) inside it. */
.app-root {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: var(--layout-app-max-width);
  height: 100vh;
  height: var(--layout-viewport-min-height, 100dvh);
  margin-inline: auto;
}

.noscript-note {
  margin: var(--space-4);
  font-size: var(--font-size-200);
  text-align: center;
  color: var(--color-danger);
}