:root {
      --topbarHeight: 96px; /* misura reale della tua topbar */
    }

    :root{
      /* DARK default */
      --bg:#0b0f14;
      --panel:#151b22;
      --text:#e6edf3;
      --muted:#8b949e;
      --border:#2b3440;

      /* UI extras */
      --panel-shadow: rgba(0,0,0,.35);
      --hover-bg: rgba(255,255,255,0.08);
      --danger: #f44336;
      --info: #2196f3;
    }

    /* LIGHT UI THEME */
    body.theme-light{
      --bg:#f4f6f8;
      --panel:#ffffff;
      --text:#111827;
      --muted:#6b7280;
      --border:#d1d5db;

      --panel-shadow: rgba(0,0,0,.15);
      --hover-bg: rgba(0,0,0,.06);
      --danger: #d32f2f;
      --info: #1976d2;
    }


    :root {
      --safe-top: 0px;
      --safe-bottom: 0px;
    }

    /* Solo dispositivi Apple */
    @supports (-webkit-touch-callout: none) {
      :root {
        --safe-top: env(safe-area-inset-top);
        --safe-bottom: env(safe-area-inset-bottom);
      }
    }

    html, body {
      /* height: 100%; */
      background: var(--bg); color: var(--text);
      font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; /* ← niente Times */
    }

    html, body {
      margin: 0;
      padding: 0;
      height: 100dvh;   /* 👈 invece di 100% */
      overflow: hidden; /* 👈 evita scroll strani */
      overflow-x: hidden;
    }

    #map {
      position: absolute;
      top: var(--topbarHeight);
      left: 0;
      right: 0;
      bottom: 0;
      z-index: 1;
      /* height: calc(100dvh - var(--topbarHeight)); */
      height: calc(var(--real-vh) - var(--topbarHeight));
    }


    body {
      padding: 0;
    }