/* ATLAS MAP 8.0 — atlas-ui.css
   Interfaccia Light/Field condivisa da Mappa e Picchettamento.
   Unisce, nello stesso ordine di prima, i fogli 7.x (tokens, mobile, dialogs,
   field, layers). Caricare DOPO i CSS originali dell'app. */

/* ========================================================================
   1) TOKEN Light / Field
   ======================================================================== */
/* ============================================================================
   ATLAS MAP 7.2 — Token unici Light / Field (Fase 0)
   ----------------------------------------------------------------------------
   Unica sorgente dei colori per Mappa e Picchettamento.
   I tre vecchi gruppi di variabili (--atlas-*, --shell-*, --stake-*) restano
   nei rispettivi CSS, ma qui vengono ridefiniti come ALIAS dei token canonici:
   chi modifica un colore lo fa solo in questo file.

   Specificità: le vecchie variabili sono dichiarate su :root, su
   [data-atlas-theme="dark"] e su body.staking-prototype. Il selettore
   body:not(#atlas-tokens) vale (1,0,1) e le supera tutte senza !important.
   Caricare DOPO gli altri fogli di stile.
   ========================================================================== */

/* ---------- Light (predefinito) ---------- */
html body:not(#atlas-tokens) {
  /* marca */
  --atlas-navy: #1e3a5f;
  --atlas-navy-2: #17304e;
  --atlas-orange: #f39200;
  --atlas-orange-ink: #995700;      /* testo arancio su fondo chiaro */
  --atlas-cyan: #1ba6e8;
  --atlas-accent-text: #0b7cb0;     /* testi informativi: ciano scuro in Light, arancio in Field */
  --atlas-green: #7cb342;
  --atlas-danger: #b93232;
  --atlas-danger-soft: #fbe6e6;
  /* colori di marca fissi (uguali in Light e Field: header, avatar, Cerca) */
  --atlas-brand-orange: #f39200;
  --atlas-brand-cyan: #1ba6e8;
  --atlas-brand-green: #7cb342;

  /* superfici */
  --atlas-bg: #fafaf7;
  --atlas-surface: #ffffff;
  --atlas-surface-2: #f2f2ee;
  --atlas-surface-3: #f4f4ef;
  --atlas-hover: #f2f2ee;
  --atlas-ink: #1a1d24;
  --atlas-muted: #5a6270;
  --atlas-line: #e5e5e0;
  --atlas-line-strong: #d2d2ca;
  --atlas-map-bg: #e8ebee;
  --atlas-scrim: rgba(15, 33, 55, .42);
  --atlas-shadow: 0 1px 2px rgba(15, 33, 55, .08);
  --atlas-shadow-pop: 0 4px 14px rgba(15, 33, 55, .12);
  --atlas-shadow-menu: 0 18px 44px rgba(15, 33, 55, .22);

  /* header (resta navy anche in Light, come la mappa) */
  --atlas-header-bg: #1e3a5f;
  --atlas-header-line: #17304e;
  --atlas-header-ink: #eaf1f8;
  --atlas-header-muted: rgba(226, 236, 247, .68);
  --atlas-header-chip: rgba(255, 255, 255, .08);
  --atlas-header-chip-line: rgba(255, 255, 255, .16);

  /* menu a tendina (scuro in entrambi i temi, come nella mappa) */
  --atlas-menu-bg: #12161b;
  --atlas-menu-ink: #d6dee7;
  --atlas-menu-line: rgba(255, 255, 255, .10);

  /* tipografia e forma */
  --atlas-font-ui: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --atlas-font-mono: "JetBrains Mono", ui-monospace, monospace;
  --atlas-radius-sm: 4px;
  --atlas-radius-md: 6px;
  --atlas-radius-lg: 8px;
  --atlas-focus: 0 0 0 3px rgba(27, 166, 232, .32);
  --atlas-touch: 44px;              /* area minima comandi touch */

  /* ---------- alias: shell della mappa ---------- */
  --shell-navy: var(--atlas-navy);
  --shell-navy-2: var(--atlas-navy-2);
  --shell-orange: var(--atlas-brand-orange);
  --shell-cyan: var(--atlas-brand-cyan);
  --shell-green: var(--atlas-brand-green);
  --shell-surface: var(--atlas-surface);
  --shell-text: var(--atlas-ink);
  --shell-muted: var(--atlas-muted);
  --shell-border: var(--atlas-line);
  --shell-hover: var(--atlas-hover);

  /* ---------- alias: picchettamento ---------- */
  --stake-surface: var(--atlas-surface);
  --stake-soft: var(--atlas-surface-3);
  --stake-hover: var(--atlas-hover);
  --stake-text: var(--atlas-ink);
  --stake-muted: var(--atlas-muted);
  --stake-line: var(--atlas-line);
  --stake-border-strong: var(--atlas-line-strong);
  --stake-accent: var(--atlas-orange);
  --stake-active-text: var(--atlas-orange-ink);
  --stake-info: var(--atlas-accent-text);
  --stake-success: var(--atlas-green);
  --stake-danger: var(--atlas-danger);
  --stake-danger-soft: var(--atlas-danger-soft);
  --stake-scrim: var(--atlas-scrim);
  --stake-modal-shadow: var(--atlas-shadow-pop);
  --stake-font-ui: var(--atlas-font-ui);
  --stake-font-mono: var(--atlas-font-mono);
}

/* ---------- Field (scuro) ---------- */
html[data-atlas-theme="dark"] body:not(#atlas-tokens) {
  --atlas-orange: #ff9e12;
  --atlas-orange-ink: #ffb54a;
  --atlas-cyan: #3fbdf9;
  --atlas-accent-text: #ff9e12;     /* in Field niente azzurro per i testi */
  --atlas-green: #93cc57;
  --atlas-danger: #f16a6a;
  --atlas-danger-soft: #2a1414;

  --atlas-bg: #0e1114;
  --atlas-surface: #161a1f;
  --atlas-surface-2: #1c2127;
  --atlas-surface-3: #1c2127;
  --atlas-hover: #1f242b;
  --atlas-ink: #f2f2f0;
  --atlas-muted: #a7b0bd;
  --atlas-line: #2a2f36;
  --atlas-line-strong: #3a414a;
  --atlas-map-bg: #1a1f25;
  --atlas-scrim: rgba(0, 0, 0, .6);
  --atlas-shadow: 0 1px 2px rgba(0, 0, 0, .4);
  --atlas-shadow-pop: 0 6px 20px rgba(0, 0, 0, .5);
  --atlas-shadow-menu: 0 24px 60px rgba(0, 0, 0, .55);

  --atlas-header-bg: #10161f;
  --atlas-header-line: #22303f;
  --atlas-focus: 0 0 0 3px rgba(63, 189, 249, .4);
}

/* ========================================================================
   2) MAPPA SU TELEFONO
   ======================================================================== */
/* ============================================================================
   ATLAS MAP 7.2 — Mappa su telefono e tablet provvisorio (Fase 2)
   ----------------------------------------------------------------------------
   Stesso linguaggio visivo dell'header/rail desktop, colori SOLO da token
   (assets/atlas-tokens.css) → Light / Field / Auto automatici.
   Attivo sotto 901 px e solo quando atlasmap-mobile-tools.js ha montato
   l'interfaccia mobile (body.atlas-mobile-ui-ready).

   Specificità: prefisso  body.atlas-mobile-ui-ready:not(#m7)  (1 id + 1 classe)
   per superare le regole legacy con !important senza toccarle.
   Nessun ID, handler, layer, calcolo o permesso viene modificato.
   Caricare DOPO atlas-tokens.css.
   ========================================================================== */
@media (max-width: 900px) {

  /* =======================================================================
     1) HEADER — stesso navy del desktop, marchio leggibile, avatar + notifiche
     ======================================================================= */
  body.atlas-mobile-ui-ready:not(#m7) > header {
    height: 56px !important; min-height: 56px !important; max-height: 56px !important;
    padding: 0 8px 0 12px !important; gap: 8px !important;
    display: flex !important; align-items: center !important; justify-content: space-between !important;
    background: #1e3a5f !important; border-bottom: 1px solid #17304e !important; box-shadow: none !important;
  }
  html[data-atlas-theme="dark"] body.atlas-mobile-ui-ready:not(#m7) > header { background: #10161f !important; border-color: #22303f !important; }

  body.atlas-mobile-ui-ready:not(#m7) > header .atlasmap-header-left,
  body.atlas-mobile-ui-ready:not(#m7) > header .atlasmap-brand {
    display: flex !important; align-items: center !important; gap: 0 !important;
    width: auto !important; min-width: 0 !important; max-width: none !important; flex: 0 1 auto !important;
    padding: 0 !important; margin: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) > header .atlas-shell-brandmark {
    display: block !important; height: 26px !important; width: auto !important; max-width: none !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) > header :is(.atlasmap-brand-logo, .atlasmap-header-descriptor, .atlasmap-header-meta, .atlas-shell-brandtag, .header-status, .performance-notice) {
    display: none !important;
  }

  body.atlas-mobile-ui-ready:not(#m7) > header :is(.header-right, .atlasmap-header-actions, .atlasmap-header-tools, .atlasmap-header-account) {
    display: flex !important; align-items: center !important; gap: 4px !important;
    width: auto !important; min-width: 0 !important; flex: 0 0 auto !important;
    padding: 0 !important; margin: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important;
  }

  /* notifiche: prima dell'avatar, come su desktop */
  body.atlas-mobile-ui-ready:not(#m7) > header #atlasNotificationWrap { order: 1 !important; position: relative !important; }
  body.atlas-mobile-ui-ready:not(#m7) > header #atlasUserProjects { order: 2 !important; }
  body.atlas-mobile-ui-ready:not(#m7) > header #atlasNotificationBell {
    position: relative !important; display: grid !important; place-items: center !important;
    width: 44px !important; height: 44px !important; min-width: 44px !important; min-height: 44px !important; padding: 0 !important; margin: 0 !important;
    border: 0 !important; border-radius: 10px !important; background: transparent !important; color: #fff !important; box-shadow: none !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) > header #atlasNotificationBell svg {
    width: 22px !important; height: 22px !important; fill: none !important; stroke: currentColor !important; stroke-width: 1.8 !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) > header #atlasNotificationBell:active { background: rgba(255, 255, 255, .12) !important; }
  body.atlas-mobile-ui-ready:not(#m7) > header #atlasNotificationBadge {
    position: absolute !important; top: 6px !important; right: 6px !important; left: auto !important;
    min-width: 17px !important; height: 17px !important; padding: 0 4px !important; box-sizing: border-box !important;
    display: grid !important; place-items: center !important; border-radius: 999px !important; border: 0 !important;
    background: #ef4444 !important; color: #fff !important; font: 700 9px/1 var(--atlas-font-ui) !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) > header #atlasNotificationBadge[hidden] { display: none !important; }

  /* avatar (tocco = Area utente e progetti, handler originale) */
  body.atlas-mobile-ui-ready:not(#m7) > header #atlasUserProjects {
    position: relative !important; display: grid !important; place-items: center !important;
    width: 44px !important; height: 44px !important; min-width: 44px !important; min-height: 44px !important;
    padding: 0 !important; margin: 0 !important; border: 0 !important; border-radius: 50% !important;
    background: transparent !important; color: #1a1d24 !important; box-shadow: none !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) > header #atlasUserProjects::before {
    content: "" !important; position: absolute !important; inset: 6px !important; border-radius: 50% !important;
    background: #f39200 !important; z-index: 0 !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) > header #atlasUserProjects > * { position: relative !important; z-index: 1 !important; }
  body.atlas-mobile-ui-ready:not(#m7) > header #atlasUserProjects svg {
    width: 18px !important; height: 18px !important; fill: none !important; stroke: #1a1d24 !important; stroke-width: 1.9 !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) > header #atlasUserProjects.has-initials svg { display: none !important; }
  body.atlas-mobile-ui-ready:not(#m7) > header #atlasUserProjects .atlas-m7-initials {
    font: 800 12px/1 var(--atlas-font-ui) !important; letter-spacing: .5px !important; color: #1a1d24 !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) > header :is(#atlasNotificationBell, #atlasUserProjects):focus-visible {
    outline: 2px solid #1ba6e8 !important; outline-offset: 0 !important;
  }

  /* =======================================================================
     2) CONTROLLI SULLA MAPPA — sfondi (in alto a sinistra) e navigazione
        (in basso a destra) con lo stesso stile: card, icone, arancio attivo
     ======================================================================= */
  body.atlas-mobile-ui-ready:not(#m7) #atlasBasemapBar,
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileNavRail .atlas-mobile-nav-rail__body {
    display: flex !important; gap: 4px !important; padding: 4px !important; box-sizing: border-box !important;
    background: var(--atlas-surface) !important; border: 1px solid var(--atlas-line) !important;
    border-radius: 12px !important; box-shadow: var(--atlas-shadow-pop) !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasBasemapBar { top: 12px !important; left: 12px !important; width: auto !important; height: auto !important; flex-direction: row !important; align-items: center !important; }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileNavRail {
    width: auto !important; height: auto !important; padding: 0 !important; background: transparent !important;
    border: 0 !important; box-shadow: none !important; right: 12px !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileNavRail .atlas-mobile-nav-rail__body { flex-direction: column !important; align-items: center !important; }

  body.atlas-mobile-ui-ready:not(#m7) #atlasBasemapBar > button,
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileNavRail .atlas-mobile-nav-rail__body > button {
    position: relative !important; display: grid !important; place-items: center !important;
    width: 44px !important; height: 44px !important; min-width: 44px !important; min-height: 44px !important;
    max-width: 44px !important; max-height: 44px !important; padding: 0 !important; margin: 0 !important;
    border: 0 !important; border-radius: 8px !important; background: transparent !important;
    color: var(--atlas-ink) !important; box-shadow: none !important; outline-offset: -2px;
    font: 400 24px/1 var(--atlas-font-ui) !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasBasemapBar > button :is(.atlas-map-action-label),
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileNavRail button .atlas-map-action-label { display: none !important; }
  body.atlas-mobile-ui-ready:not(#m7) #atlasBasemapBar > button .atlas-tool-glyph,
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileNavRail button .atlas-tool-glyph {
    display: grid !important; place-items: center !important; width: 22px !important; height: 22px !important;
    margin: 0 !important; padding: 0 !important; background: transparent !important; border: 0 !important; color: inherit !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasBasemapBar > button svg,
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileNavRail button svg {
    width: 22px !important; height: 22px !important; color: inherit !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasBasemapBar > button:active,
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileNavRail .atlas-mobile-nav-rail__body > button:active { background: var(--atlas-hover) !important; }
  /* stato attivo = come la rail desktop: fondo arancio tenue, icona arancio */
  body.atlas-mobile-ui-ready:not(#m7) #atlasBasemapBar > button:is(.is-active, [aria-pressed="true"], [aria-expanded="true"]),
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileNavRail button:is(.is-active, .active, [aria-pressed="true"], [aria-expanded="true"]) {
    background: rgba(243, 146, 0, .14) !important; color: var(--atlas-orange-ink) !important;
  }
  /* localizza: stessa forma degli altri, accento arancio (niente verde) */
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileNavRail #atlasLocateBtn { color: var(--atlas-orange) !important; }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileNavRail #atlasAttributionToggle { color: var(--atlas-muted) !important; }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileNavRail #atlasZoomOut::after {
    content: "" !important; position: absolute !important; left: 10px !important; right: 10px !important; bottom: -3px !important;
    height: 1px !important; background: var(--atlas-line) !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) :is(#atlasBasemapBar, #atlasMobileNavRail) button:focus-visible {
    outline: 2px solid var(--atlas-cyan) !important;
  }

  /* pannello opacità sfondo, sotto la barra sfondi */
  body.atlas-mobile-ui-ready:not(#m7) #atlasBasemapOpacityPanel:not(.is-dock-hidden) {
    background: var(--atlas-surface) !important; color: var(--atlas-ink) !important;
    border: 1px solid var(--atlas-line) !important; border-radius: 12px !important; box-shadow: var(--atlas-shadow-pop) !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasBasemapOpacityPanel :is(span, output, button) { color: var(--atlas-ink) !important; }
  body.atlas-mobile-ui-ready:not(#m7) #atlasBasemapOpacityPanel input[type="range"] { accent-color: var(--atlas-orange) !important; }

  /* =======================================================================
     3) BARRA INFERIORE — superficie, voce attiva arancio con indicatore
     ======================================================================= */
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileToolbar {
    background: var(--atlas-surface) !important; border-top: 1px solid var(--atlas-line) !important;
    box-shadow: 0 -4px 16px rgba(15, 33, 55, .06) !important;
    padding-bottom: env(safe-area-inset-bottom, 0px) !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileToolbar .atlas-mobile-tool {
    position: relative !important; min-height: 56px !important; margin: 0 !important; border: 0 !important; border-radius: 0 !important;
    background: transparent !important; color: var(--atlas-muted) !important; box-shadow: none !important;
    font: 600 11px/1.1 var(--atlas-font-ui) !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileToolbar .atlas-mobile-tool svg { width: 22px !important; height: 22px !important; color: inherit !important; }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileToolbar .atlas-mobile-tool.is-active {
    background: transparent !important; color: var(--atlas-orange-ink) !important; box-shadow: none !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileToolbar .atlas-mobile-tool.is-active::before {
    content: "" !important; position: absolute !important; top: 0 !important; left: 22% !important; right: 22% !important;
    height: 3px !important; border-radius: 0 0 3px 3px !important; background: var(--atlas-orange) !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileToolbar .atlas-mobile-tool:focus-visible { outline: 2px solid var(--atlas-cyan) !important; outline-offset: -3px !important; }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileToolbar :is(.atlas-mobile-badge, .atlas-mobile-dot)[hidden] { display: none !important; }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileToolbar .atlas-mobile-badge {
    background: var(--atlas-orange) !important; color: #1a1d24 !important; border: 2px solid var(--atlas-surface) !important;
  }

  /* =======================================================================
     4) SCHEDE (Livelli, Punto, Strumenti, Legende)
     ======================================================================= */
  body.atlas-mobile-ui-ready:not(#m7) .atlas-mobile-sheet {
    background: var(--atlas-surface) !important; color: var(--atlas-ink) !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) .atlas-mobile-sheet__head {
    min-height: 60px !important; padding: 10px 12px 10px 16px !important; box-sizing: border-box !important;
    display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important;
    background: var(--atlas-surface) !important; border-bottom: 1px solid var(--atlas-line) !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) .atlas-mobile-sheet__eyebrow {
    color: var(--atlas-muted) !important; font: 700 10px/1.2 var(--atlas-font-ui) !important; letter-spacing: 1.4px !important; text-transform: uppercase !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) .atlas-mobile-sheet__head strong {
    display: block !important; color: var(--atlas-ink) !important; font: 600 17px/1.25 var(--atlas-font-ui) !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) .atlas-mobile-sheet__close {
    display: grid !important; place-items: center !important; flex: 0 0 44px !important;
    width: 44px !important; height: 44px !important; min-width: 44px !important; min-height: 44px !important; padding: 0 !important; margin: 0 !important;
    border: 1px solid var(--atlas-line) !important; border-radius: 10px !important;
    background: var(--atlas-surface-2) !important; color: var(--atlas-ink) !important; box-shadow: none !important;
    font: 400 24px/1 var(--atlas-font-ui) !important; outline: none !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) .atlas-mobile-sheet__close:focus-visible { outline: 2px solid var(--atlas-cyan) !important; outline-offset: 2px !important; }
  body.atlas-mobile-ui-ready:not(#m7) .atlas-mobile-sheet__body { background: var(--atlas-surface) !important; color: var(--atlas-ink) !important; }
  body.atlas-mobile-ui-ready:not(#m7) .atlas-mobile-sheet__handle { background: var(--atlas-line-strong) !important; }

  /* ---- Punto e verifiche: in Field le card restavano bianche ---- */
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobilePointMount > .field-group {
    background: var(--atlas-surface-2) !important; color: var(--atlas-ink) !important;
    border: 1px solid var(--atlas-line) !important; border-radius: 12px !important; box-shadow: none !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobilePointMount > .field-group > :is(summary, .label),
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobilePointMount > .field-group > summary * {
    background: transparent !important; color: var(--atlas-ink) !important; border: 0 !important; box-shadow: none !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobilePointMount :is(.hint, small, p) { color: var(--atlas-muted) !important; }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobilePointMount :is(.hint, p) strong { color: var(--atlas-ink) !important; }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobilePointMount :is(input[type="text"], input:not([type]), input[inputmode], select, textarea) {
    min-height: 44px !important; background: var(--atlas-surface) !important; color: var(--atlas-ink) !important;
    border: 1px solid var(--atlas-line-strong) !important; border-radius: 8px !important; box-shadow: none !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobilePointMount :is(input, textarea)::placeholder { color: var(--atlas-muted) !important; opacity: .8 !important; }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobilePointMount :is(input, select, textarea):focus { outline: none !important; border-color: var(--atlas-cyan) !important; box-shadow: var(--atlas-focus) !important; }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobilePointMount #clearAddressBtn,
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobilePointMount .btn-outline:not(#searchBtn) {
    min-height: 44px !important; background: var(--atlas-surface) !important; color: var(--atlas-ink) !important;
    border: 1px solid var(--atlas-line-strong) !important; border-radius: 8px !important; box-shadow: none !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobilePointMount #searchBtn {
    min-height: 44px !important; background: var(--atlas-surface) !important; color: var(--atlas-ink) !important;
    border: 1px solid var(--atlas-line-strong) !important; border-radius: 8px !important; font-weight: 700 !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobilePointMount .address-results.is-open,
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobilePointMount .address-result {
    background: var(--atlas-surface) !important; color: var(--atlas-ink) !important; border-color: var(--atlas-line) !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobilePointMount .address-result__title { color: var(--atlas-ink) !important; }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobilePointMount .address-result__meta { color: var(--atlas-muted) !important; }

  /* ---- Strumenti: riquadri uniformi (niente mix navy/grigio) ---- */
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileToolsMount {
    display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 8px !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileToolsMount > button {
    display: flex !important; align-items: center !important; justify-content: flex-start !important; gap: 10px !important;
    width: 100% !important; min-height: 56px !important; height: auto !important; padding: 0 14px !important; margin: 0 !important;
    border: 1px solid var(--atlas-line) !important; border-radius: 12px !important;
    background: var(--atlas-surface-2) !important; color: var(--atlas-ink) !important; box-shadow: none !important;
    font: 600 14px/1.2 var(--atlas-font-ui) !important; text-align: left !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileToolsMount > button .atlas-tool-glyph {
    display: grid !important; place-items: center !important; flex: 0 0 22px !important; width: 22px !important; height: 22px !important;
    margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important;
    color: var(--atlas-orange) !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileToolsMount > button svg { width: 22px !important; height: 22px !important; color: inherit !important; }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileToolsMount > button :is(.atlas-tool-label, .atlas-map-action-label) {
    display: inline !important; position: static !important; width: auto !important; height: auto !important;
    clip: auto !important; overflow: visible !important; color: inherit !important; font: inherit !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileToolsMount > button:active { background: var(--atlas-hover) !important; }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileToolsMount > button:is(.is-active, .active, [aria-pressed="true"]) {
    background: rgba(243, 146, 0, .14) !important; border-color: var(--atlas-orange) !important; color: var(--atlas-orange-ink) !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileToolsMount > button:disabled { opacity: .5 !important; }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileToolsMount > button:focus-visible { outline: 2px solid var(--atlas-cyan) !important; outline-offset: 2px !important; }

  body.atlas-mobile-ui-ready:not(#m7) .atlas-mobile-appearance > strong,
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileThemeTitle { color: var(--atlas-ink) !important; font: 600 14px/1.3 var(--atlas-font-ui) !important; }

  /* collegamenti (Picchettamento, Atlasmap.it, Logout) */
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileLinksMount { display: flex !important; flex-direction: column !important; gap: 8px !important; }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileLinksMount > a {
    display: flex !important; align-items: center !important; justify-content: flex-start !important; gap: 12px !important;
    width: 100% !important; min-height: 48px !important; padding: 0 14px !important; margin: 0 !important; box-sizing: border-box !important;
    border: 1px solid var(--atlas-line) !important; border-radius: 12px !important;
    background: var(--atlas-surface-2) !important; color: var(--atlas-ink) !important; box-shadow: none !important;
    font: 600 14px/1.2 var(--atlas-font-ui) !important; text-decoration: none !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileLinksMount > a > span:first-child {
    display: grid !important; place-items: center !important; width: 22px !important; flex: 0 0 22px !important;
    color: var(--atlas-orange) !important; font-size: 17px !important; background: transparent !important; border: 0 !important; margin: 0 !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileLinksMount > a > span:not(:first-child) { display: inline !important; color: inherit !important; }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileLinksMount > a.atlasmap-header-btn--logout { color: var(--atlas-danger) !important; }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileLinksMount > a.atlasmap-header-btn--logout > span:first-child { color: var(--atlas-danger) !important; }

  /* ---- Legende ---- */
  body.atlas-mobile-ui-ready:not(#m7) .atlas-mobile-empty {
    background: var(--atlas-surface-2) !important; color: var(--atlas-muted) !important;
    border: 1px dashed var(--atlas-line-strong) !important; border-radius: 12px !important;
  }

  /* velo dietro le schede */
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileBackdrop.is-open { background: var(--atlas-scrim) !important; }

  /* =======================================================================
     5) CORREZIONI emerse dalla verifica
     ======================================================================= */
  /* icone Strumenti: il CSS legacy le forzava bianche (invisibili in Light) */
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileToolsMount > button svg,
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileToolsMount > button svg :is(path, rect, circle, line, polyline, polygon, ellipse) {
    fill: none !important; stroke: var(--atlas-orange) !important; opacity: 1 !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileToolsMount > button :is(svg, .atlas-tool-glyph) { opacity: 1 !important; filter: none !important; }
  /* barra sfondi: niente contorno bianco sul pulsante attivo */
  body.atlas-mobile-ui-ready:not(#m7) #atlasBasemapBar > button,
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileNavRail .atlas-mobile-nav-rail__body > button { outline: none !important; }
  body.atlas-mobile-ui-ready:not(#m7) :is(#atlasBasemapBar, #atlasMobileNavRail) button:focus-visible { outline: 2px solid var(--atlas-cyan) !important; }
  /* barra inferiore: l'icona attiva non ha più il cerchio navy */
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileToolbar .atlas-mobile-tool .atlas-mobile-tool__icon {
    background: transparent !important; color: inherit !important; box-shadow: none !important; border: 0 !important;
  }
  /* sfondo della mappa prima delle tile */
  body.atlas-mobile-ui-ready:not(#m7) #map { background: var(--atlas-map-bg) !important; }

  /* Punto e verifiche: riquadri risultati leggibili in Field */
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobilePointMount :is(#addressResults, #catastalResults, #pointAnalysis, #pointResults) {
    background: var(--atlas-surface) !important; color: var(--atlas-ink) !important; border-color: var(--atlas-line) !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobilePointMount :is(.catastal-results__head, .point-analysis__head, .point-results__head) {
    background: var(--atlas-surface-2) !important; color: var(--atlas-ink) !important; border-color: var(--atlas-line) !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobilePointMount :is(.catastal-results__body, .point-analysis__item) {
    background: var(--atlas-surface-2) !important; color: var(--atlas-ink) !important; border-color: var(--atlas-line) !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobilePointMount .catastal-note {
    background: rgba(243, 146, 0, .10) !important; color: var(--atlas-ink) !important; border-color: var(--atlas-orange) !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobilePointMount .point-analysis__badge {
    background: rgba(243, 146, 0, .14) !important; color: var(--atlas-accent-text) !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobilePointMount input[type="date"] {
    min-height: 44px !important; background: var(--atlas-surface) !important; color: var(--atlas-ink) !important;
    border: 1px solid var(--atlas-line-strong) !important; border-radius: 8px !important; color-scheme: light dark;
  }
  html[data-atlas-theme="dark"] body.atlas-mobile-ui-ready:not(#m7) #atlasMobilePointMount :is(#catastalResults, #pointAnalysis, #pointResults)
    :is(h3, h4, strong, b, p, li, dt, dd, label, .catastal-results__title, .point-analysis__title, .point-results__title) {
    color: var(--atlas-ink) !important;
  }
}

@media (max-width: 900px) {
  /* indicatore "punto selezionato" nella barra: arancio come il resto */
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileToolbar .atlas-mobile-dot { background: var(--atlas-orange) !important; box-shadow: 0 0 0 2px var(--atlas-surface) !important; }
}

/* selettore tema nell'header: solo telefono/tablet (su desktop c'è quello originale) */
body:not(#m7) #atlasM7HeaderTheme { display: none !important; }
@media (max-width: 900px) {
  body.atlas-mobile-ui-ready:not(#m7) > header #atlasM7HeaderTheme {
    order: 0 !important; display: inline-flex !important; align-items: center !important; gap: 2px !important;
    padding: 2px !important; margin: 0 4px 0 0 !important; flex: 0 0 auto !important;
    background: rgba(255, 255, 255, .1) !important; border: 1px solid rgba(255, 255, 255, .18) !important; border-radius: 6px !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) > header #atlasM7HeaderTheme button {
    display: grid !important; place-items: center !important;
    width: 34px !important; min-width: 34px !important; height: 34px !important; min-height: 34px !important;
    padding: 0 !important; margin: 0 !important; border: 0 !important; border-radius: 4px !important;
    background: transparent !important; color: rgba(255, 255, 255, .75) !important; box-shadow: none !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) > header #atlasM7HeaderTheme button svg { width: 17px !important; height: 17px !important; }
  body.atlas-mobile-ui-ready:not(#m7) > header #atlasM7HeaderTheme .atlas-theme-label { display: none !important; }
  body.atlas-mobile-ui-ready:not(#m7) > header #atlasM7HeaderTheme button[aria-pressed="true"] { background: #fff !important; color: #1e3a5f !important; }
  body.atlas-mobile-ui-ready:not(#m7) > header #atlasM7HeaderTheme button:focus-visible { outline: 2px solid #1ba6e8 !important; outline-offset: 1px !important; }
}
@media (max-width: 374px) {
  body.atlas-mobile-ui-ready:not(#m7) > header .atlas-shell-brandmark { height: 22px !important; }
  body.atlas-mobile-ui-ready:not(#m7) > header #atlasM7HeaderTheme button { width: 30px !important; min-width: 30px !important; }
}

/* avviso relazione del punto (telefono/tablet) */
body:not(#m7) .atlas-m7-toast[hidden] { display: none !important; }
@media (max-width: 900px) {
  body:not(#m7) .atlas-m7-toast {
    position: fixed; left: 12px; right: 12px; bottom: calc(76px + env(safe-area-inset-bottom, 0px)); z-index: 130000;
    display: flex; align-items: center; gap: 12px; padding: 12px 14px;
    background: var(--atlas-surface); color: var(--atlas-ink);
    border: 1px solid var(--atlas-line); border-left: 3px solid var(--atlas-orange); border-radius: 12px;
    box-shadow: 0 12px 30px rgba(15, 33, 55, .25); font: 400 13px/1.4 var(--atlas-font-ui);
  }
  body:not(#m7) .atlas-m7-toast b { display: block; font-weight: 700; font-size: 14px; margin-bottom: 2px; }
  body:not(#m7) .atlas-m7-toast.is-error { border-left-color: var(--atlas-danger); }
  body:not(#m7) .atlas-m7-spin {
    flex: 0 0 22px; width: 22px; height: 22px; border-radius: 50%;
    border: 3px solid var(--atlas-line-strong); border-top-color: var(--atlas-orange);
    animation: atlasM7spin .8s linear infinite;
  }
}
@keyframes atlasM7spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { body:not(#m7) .atlas-m7-spin { animation-duration: 2.4s; } }

/* =========================================================================
   7.10 — Strumenti su telefono: icone dei collegamenti coerenti
   (al posto dei glifi ⚑ ⌂ ↪ della vecchia UI)
   ========================================================================= */
@media (max-width: 900px) {
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileLinksMount > a > span:first-child {
    font-size: 0 !important; line-height: 0 !important; width: 20px !important; height: 20px !important; flex: 0 0 20px !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileLinksMount > a > span:first-child::before {
    content: "" !important; display: block !important; width: 20px !important; height: 20px !important;
    background: currentColor !important; -webkit-mask: var(--lnk-ico) center / contain no-repeat; mask: var(--lnk-ico) center / contain no-repeat;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileLinksMount > a.atlasmap-header-maplink { --lnk-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 21V4'/%3E%3Cpath d='M5 4h11l-2 4 2 4H5'/%3E%3C/svg%3E"); }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileLinksMount > a.atlasmap-header-btn--home { --lnk-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11 12 4l9 7'/%3E%3Cpath d='M5 10v10h14V10'/%3E%3Cpath d='M10 20v-5h4v5'/%3E%3C/svg%3E"); }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileLinksMount > a.atlasmap-header-btn--logout { --lnk-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/%3E%3Cpath d='m16 17 5-5-5-5'/%3E%3Cpath d='M21 12H9'/%3E%3C/svg%3E"); }
  /* Logout: stesso stile degli altri collegamenti, in rosso solo testo e icona */
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileLinksMount > a.atlasmap-header-btn--logout {
    background: transparent !important; border-color: color-mix(in srgb, var(--atlas-danger) 45%, var(--atlas-line)) !important;
  }
}

/* =========================================================================
   7.13 — Controlli mappa nell'header (telefono e tablet provvisorio)
   Riga navy di 48 px sotto l'header: a sinistra Mappa · Satellite · Opacità,
   a destra Posizione e Crediti (Leaflet, OpenStreetMap, TINITALY, WMS…).
   Zoom con due dita o doppio tocco: niente pulsanti + / − sulla mappa.
   ========================================================================= */
body:not(#m7) #atlasM7MapBar { display: none; }
@media (max-width: 900px) {
  body.atlas-mobile-ui-ready:not(#m7) #atlasM7MapBar {
    display: block; position: fixed; left: 0; right: 0; top: 56px; height: 48px; z-index: 1190;
    background: #24476f; border-bottom: 1px solid rgba(255, 255, 255, .08);
  }
  html[data-atlas-theme="dark"] body.atlas-mobile-ui-ready:not(#m7) #atlasM7MapBar { background: #172130; }
  body.atlas-mobile-ui-ready:not(#m7) #map { top: 104px !important; }

  /* sfondi e opacità: a sinistra nella riga */
  body.atlas-mobile-ui-ready:not(#m7) #atlasM7MapBar #atlasBasemapBar {
    position: absolute !important; top: 4px !important; left: 8px !important; right: auto !important; bottom: auto !important; width: auto !important; height: auto !important;
    z-index: 1200 !important; gap: 2px !important; padding: 0 !important;
    background: transparent !important; border: 0 !important; box-shadow: none !important; border-radius: 0 !important;
  }
  /* posizione e crediti: a destra nella riga; zoom solo a gesti */
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileNavRail {
    position: fixed !important; top: 60px !important; right: 8px !important; bottom: auto !important; left: auto !important;
    width: auto !important; height: auto !important; z-index: 1200 !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileNavRail .atlas-mobile-nav-rail__body {
    flex-direction: row !important; gap: 2px !important; padding: 0 !important;
    background: transparent !important; border: 0 !important; box-shadow: none !important; border-radius: 0 !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileNavRail :is(#atlasZoomIn, #atlasZoomOut) { display: none !important; }

  body.atlas-mobile-ui-ready:not(#m7) #atlasBasemapBar > button,
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileNavRail .atlas-mobile-nav-rail__body > button {
    width: 40px !important; height: 40px !important; min-width: 40px !important; min-height: 40px !important;
    max-width: 40px !important; max-height: 40px !important; border-radius: 6px !important;
    background: transparent !important; color: rgba(255, 255, 255, .8) !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasBasemapBar > button svg,
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileNavRail button svg { width: 20px !important; height: 20px !important; }
  body.atlas-mobile-ui-ready:not(#m7) #atlasBasemapBar > button:is(.is-active, [aria-pressed="true"], [aria-expanded="true"]),
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileNavRail button:is(.is-active, .active, [aria-pressed="true"], [aria-expanded="true"]),
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileNavRail #atlasAttributionToggle.is-open {
    background: #ffffff !important; color: #1e3a5f !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileNavRail #atlasLocateBtn { color: #f39200 !important; }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileNavRail #atlasAttributionToggle { color: rgba(255, 255, 255, .8) !important; }
  body.atlas-mobile-ui-ready:not(#m7) #atlasMobileNavRail #atlasZoomOut::after { display: none !important; }
  body.atlas-mobile-ui-ready:not(#m7) :is(#atlasBasemapBar, #atlasMobileNavRail) button:focus-visible { outline: 2px solid #1ba6e8 !important; outline-offset: -2px !important; }
  /* separatore tra sfondi e opacità */
  body.atlas-mobile-ui-ready:not(#m7) #atlasBaseOpacityBtn { margin-left: 6px !important; }
  body.atlas-mobile-ui-ready:not(#m7) #atlasBaseOpacityBtn::before {
    content: "" !important; position: absolute !important; left: -5px !important; top: 10px !important; bottom: 10px !important;
    width: 1px !important; background: rgba(255, 255, 255, .22) !important;
  }

  /* pannelli che si aprono dai pulsanti: sotto la riga */
  body.atlas-mobile-ui-ready:not(#m7) #atlasBasemapOpacityPanel:not(.is-dock-hidden) {
    position: fixed !important; top: 112px !important; left: 8px !important; right: auto !important; z-index: 1210 !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasAttributionDrawer.is-open {
    position: fixed !important; top: 112px !important; right: 8px !important; left: auto !important; bottom: auto !important;
    max-width: calc(100vw - 16px) !important; z-index: 1210 !important;
    background: var(--atlas-surface) !important; color: var(--atlas-ink) !important;
    border: 1px solid var(--atlas-line) !important; border-radius: 12px !important; box-shadow: var(--atlas-shadow-pop) !important;
    padding: 10px 12px !important; font: 400 12px/1.45 var(--atlas-font-ui) !important;
  }
  body.atlas-mobile-ui-ready:not(#m7) #atlasAttributionDrawer.is-open a { color: var(--atlas-orange-ink) !important; }
}
@media (max-width: 900px) {
  html body.atlas-mobile-ui-ready:not(#m7):not(#m8) #atlasMobileNavRail,
  html body.atlas-mobile-ui-ready:not(#m7):not(#m8) #atlasMobileNavRail .atlas-mobile-nav-rail__body {
    width: auto !important; min-width: 0 !important; max-width: none !important; height: auto !important; max-height: none !important;
  }
}

/* ========================================================================
   3) FINESTRE: Area personale, Notifiche, Misura/Area, pulsanti icona
   ======================================================================== */
/* ============================================================================
   ATLAS MAP 7.2 — Area personale / I miei progetti (#atlasProjects)
   ----------------------------------------------------------------------------
   Stesso linguaggio di header e pannelli: colori SOLO da token → Light/Field.
   Desktop: finestra centrata 560 px. Telefono/tablet (≤ 900 px): scheda a
   schermo intero con intestazione fissa e chiusura 44 px sempre visibile.
   Nessun handler modificato: #apClose, #apSave, #apExport… restano quelli
   di atlas-projects.js. Caricare dopo atlas-tokens.css.
   ========================================================================== */

html body:not(#d7) dialog#atlasProjects {
  width: min(560px, calc(100vw - 48px)) !important; max-width: none !important;
  max-height: min(88dvh, 820px) !important; margin: auto !important; padding: 0 !important;
  display: none; flex-direction: column !important; overflow: hidden !important;
  border: 1px solid var(--atlas-line) !important; border-radius: 12px !important;
  background: var(--atlas-surface) !important; color: var(--atlas-ink) !important;
  box-shadow: 0 24px 60px rgba(8, 18, 32, .35) !important;
  font: 400 14px/1.5 var(--atlas-font-ui) !important; -webkit-font-smoothing: antialiased;
}
html body:not(#d7) dialog#atlasProjects[open] { display: flex !important; }
html body:not(#d7) dialog#atlasProjects::backdrop { background: var(--atlas-scrim) !important; backdrop-filter: none !important; }

/* ---------- intestazione ---------- */
html body:not(#d7) dialog#atlasProjects > header {
  position: static !important; inset: auto !important; z-index: auto !important;
  display: flex !important; align-items: flex-start !important; justify-content: space-between !important; gap: 12px !important;
  flex: 0 0 auto !important; height: auto !important; min-height: 0 !important; max-height: none !important;
  padding: 18px 16px 16px 20px !important; margin: 0 !important;
  background: var(--atlas-surface) !important; color: var(--atlas-ink) !important;
  border: 0 !important; border-bottom: 1px solid var(--atlas-line) !important; box-shadow: none !important;
}
html body:not(#d7) dialog#atlasProjects > header > div { min-width: 0 !important; flex: 1 1 auto !important; }
html body:not(#d7) dialog#atlasProjects > header small {
  display: block !important; margin: 0 0 4px !important;
  color: var(--atlas-muted) !important; font: 700 10px/1.2 var(--atlas-font-ui) !important;
  letter-spacing: 1.4px !important; text-transform: uppercase !important;
}
html body:not(#d7) dialog#atlasProjects > header h2 {
  margin: 0 0 4px !important; color: var(--atlas-ink) !important;
  font: 600 19px/1.25 var(--atlas-font-ui) !important; word-break: normal !important; overflow-wrap: anywhere;
}
html body:not(#d7) dialog#atlasProjects > header p { margin: 0 !important; color: var(--atlas-muted) !important; font: 500 13px/1.4 var(--atlas-font-ui) !important; }
html body:not(#d7) dialog#atlasProjects #apClose {
  position: static !important; display: grid !important; place-items: center !important; flex: 0 0 40px !important;
  width: 40px !important; height: 40px !important; min-width: 40px !important; min-height: 40px !important;
  max-width: 40px !important; max-height: 40px !important; padding: 0 !important; margin: -4px 0 0 !important;
  border: 1px solid var(--atlas-line) !important; border-radius: 10px !important;
  background: var(--atlas-surface-2) !important; color: var(--atlas-ink) !important; box-shadow: none !important;
  font: 400 22px/1 var(--atlas-font-ui) !important; opacity: 1 !important; visibility: visible !important; cursor: pointer;
}
html body:not(#d7) dialog#atlasProjects #apClose:hover { background: var(--atlas-hover) !important; }
html body:not(#d7) dialog#atlasProjects #apClose:focus-visible { outline: 2px solid var(--atlas-cyan) !important; outline-offset: 2px !important; }

/* ---------- corpo ---------- */
html body:not(#d7) dialog#atlasProjects .ap-body {
  flex: 1 1 auto !important; min-height: 0 !important; overflow-y: auto !important; -webkit-overflow-scrolling: touch;
  padding: 16px 20px 20px !important; background: var(--atlas-surface) !important; color: var(--atlas-ink) !important;
}
html body:not(#d7) dialog#atlasProjects :is(.ap-save, .ap-local, article) {
  margin: 0 0 12px !important; padding: 16px !important;
  background: var(--atlas-surface-2) !important; color: var(--atlas-ink) !important;
  border: 1px solid var(--atlas-line) !important; border-radius: 12px !important; box-shadow: none !important;
}
html body:not(#d7) dialog#atlasProjects :is(h3, label, strong) { color: var(--atlas-ink) !important; }
html body:not(#d7) dialog#atlasProjects h3 { margin: 0 0 6px !important; font: 600 15px/1.3 var(--atlas-font-ui) !important; }
html body:not(#d7) dialog#atlasProjects label { display: block !important; margin: 0 0 8px !important; font: 600 13px/1.3 var(--atlas-font-ui) !important; }
html body:not(#d7) dialog#atlasProjects :is(p, small, .ap-empty) { color: var(--atlas-muted) !important; font-size: 13px !important; }
html body:not(#d7) dialog#atlasProjects small { display: block !important; margin-top: 10px !important; font-size: 12px !important; line-height: 1.45 !important; }
html body:not(#d7) dialog#atlasProjects #apStatus { margin: 4px 0 12px !important; color: var(--atlas-muted) !important; }
html body:not(#d7) dialog#atlasProjects #apStatus:empty { display: none !important; }

html body:not(#d7) dialog#atlasProjects input:not([type="file"]) {
  box-sizing: border-box !important; width: 100% !important; min-height: 44px !important; padding: 0 12px !important; margin: 0 !important;
  border: 1px solid var(--atlas-line-strong) !important; border-radius: 8px !important;
  background: var(--atlas-surface) !important; color: var(--atlas-ink) !important; box-shadow: none !important;
  font: 400 14px/1.2 var(--atlas-font-ui) !important;
}
html body:not(#d7) dialog#atlasProjects input::placeholder { color: var(--atlas-muted) !important; opacity: .8 !important; }
html body:not(#d7) dialog#atlasProjects input:focus { outline: none !important; border-color: var(--atlas-cyan) !important; box-shadow: var(--atlas-focus) !important; }

/* pulsanti: primario arancio come "Cerca", secondari neutri */
html body:not(#d7) dialog#atlasProjects .ap-actions { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; margin-top: 12px !important; }
html body:not(#d7) dialog#atlasProjects .ap-body button {
  display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 6px !important;
  width: auto !important; min-height: 40px !important; height: auto !important; padding: 0 14px !important; margin: 0 !important;
  border: 1px solid var(--atlas-line-strong) !important; border-radius: 8px !important;
  background: var(--atlas-surface) !important; color: var(--atlas-ink) !important; box-shadow: none !important;
  font: 600 13px/1.2 var(--atlas-font-ui) !important; cursor: pointer;
}
html body:not(#d7) dialog#atlasProjects .ap-body button:hover { background: var(--atlas-hover) !important; }
html body:not(#d7) dialog#atlasProjects .ap-body button.ap-primary {
  background: #f39200 !important; border-color: #f39200 !important; color: #1a1205 !important; font-weight: 700 !important;
}
html body:not(#d7) dialog#atlasProjects .ap-body button.ap-primary:hover { background: #e08700 !important; }
html body:not(#d7) dialog#atlasProjects .ap-body button:disabled { opacity: .55 !important; cursor: not-allowed !important; }
html body:not(#d7) dialog#atlasProjects .ap-body button:focus-visible { outline: 2px solid var(--atlas-cyan) !important; outline-offset: 2px !important; }
html body:not(#d7) dialog#atlasProjects .ap-body button[hidden] { display: none !important; }

html body:not(#d7) dialog#atlasProjects .ap-list-head {
  display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important;
  margin: 8px 0 10px !important;
}
html body:not(#d7) dialog#atlasProjects .ap-list-head h3 { margin: 0 !important; }
/* elenco progetti: pulsanti allineati in basso anche con testi di lunghezza diversa */
html body:not(#d7) dialog#atlasProjects #apList article { display: flex !important; flex-direction: column !important; }
html body:not(#d7) dialog#atlasProjects #apList article .ap-actions { margin-top: auto !important; padding-top: 12px !important; }

/* ---------- telefono e tablet: scheda a schermo intero ---------- */
@media (max-width: 900px) {
  html body:not(#d7) dialog#atlasProjects {
    width: 100vw !important; height: 100dvh !important; max-width: 100vw !important; max-height: 100dvh !important;
    margin: 0 !important; inset: 0 !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
  }
  html body:not(#d7) dialog#atlasProjects > header {
    align-items: center !important; min-height: 64px !important;
    padding: calc(10px + env(safe-area-inset-top, 0px)) 12px 10px 16px !important;
  }
  html body:not(#d7) dialog#atlasProjects > header h2 { font-size: 17px !important; }
  html body:not(#d7) dialog#atlasProjects > header p { font-size: 12px !important; }
  html body:not(#d7) dialog#atlasProjects #apClose {
    flex-basis: 44px !important; width: 44px !important; height: 44px !important;
    min-width: 44px !important; min-height: 44px !important; max-width: 44px !important; max-height: 44px !important; margin: 0 !important; font-size: 24px !important;
  }
  html body:not(#d7) dialog#atlasProjects .ap-body { padding: 16px 16px calc(20px + env(safe-area-inset-bottom, 0px)) !important; }
  html body:not(#d7) dialog#atlasProjects .ap-body button { min-height: 44px !important; }
  html body:not(#d7) dialog#atlasProjects .ap-save .ap-actions > button,
  html body:not(#d7) dialog#atlasProjects .ap-local .ap-actions > button { flex: 1 1 140px !important; }
}

/* ============================================================================
   7.5 — Notifiche (#atlasNotificationsDialog), Mappa e Picchettamento
   Stessa finestra dell'Area personale; × neutra sempre visibile; ogni avviso
   ha la sua ×; colori per tipo: informazione (accento), errore (rosso).
   ========================================================================== */
html body:not(#d7) dialog#atlasNotificationsDialog {
  position: fixed !important; inset: 0 !important; margin: auto !important;
  width: min(440px, calc(100vw - 24px)) !important; max-width: none !important;
  height: fit-content !important; max-height: min(78dvh, 640px) !important; padding: 0 !important;
  display: none; flex-direction: column !important; overflow: hidden !important;
  border: 1px solid var(--atlas-line) !important; border-radius: 12px !important;
  background: var(--atlas-surface) !important; color: var(--atlas-ink) !important;
  box-shadow: 0 24px 60px rgba(8, 18, 32, .35) !important;
  font: 400 14px/1.45 var(--atlas-font-ui) !important;
}
html body:not(#d7) dialog#atlasNotificationsDialog[open] { display: flex !important; }
html body:not(#d7) dialog#atlasNotificationsDialog::backdrop { background: var(--atlas-scrim) !important; backdrop-filter: none !important; }
html body:not(#d7) dialog#atlasNotificationsDialog .an-head {
  position: static !important; display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important;
  flex: 0 0 auto !important; min-height: 0 !important; height: auto !important; margin: 0 !important;
  padding: 14px 12px 14px 18px !important; background: var(--atlas-surface) !important; color: var(--atlas-ink) !important;
  border: 0 !important; border-bottom: 1px solid var(--atlas-line) !important; box-shadow: none !important;
}
html body:not(#d7) dialog#atlasNotificationsDialog .an-head small {
  display: block !important; margin: 0 0 2px !important; color: var(--atlas-muted) !important;
  font: 700 10px/1.2 var(--atlas-font-ui) !important; letter-spacing: 1.4px !important; text-transform: uppercase !important;
}
html body:not(#d7) dialog#atlasNotificationsDialog .an-head h2 { margin: 0 !important; color: var(--atlas-ink) !important; font: 600 18px/1.25 var(--atlas-font-ui) !important; }
html body:not(#d7) dialog#atlasNotificationsDialog .an-head-actions { display: flex !important; align-items: center !important; gap: 8px !important; }
html body:not(#d7) dialog#atlasNotificationsDialog .an-clear {
  min-height: 36px !important; padding: 0 12px !important; margin: 0 !important;
  border: 1px solid var(--atlas-line-strong) !important; border-radius: 8px !important;
  background: transparent !important; color: var(--atlas-muted) !important; font: 600 12px/1 var(--atlas-font-ui) !important; box-shadow: none !important; cursor: pointer;
}
html body:not(#d7) dialog#atlasNotificationsDialog .an-clear[hidden] { display: none !important; }
html body:not(#d7) dialog#atlasNotificationsDialog .an-close,
html body:not(#d7) dialog#atlasNotificationsDialog .an-close.an-close--mac {
  position: static !important; display: grid !important; place-items: center !important;
  width: 40px !important; height: 40px !important; min-width: 40px !important; min-height: 40px !important;
  max-width: 40px !important; max-height: 40px !important; flex: 0 0 40px !important; padding: 0 !important; margin: 0 !important;
  border: 1px solid var(--atlas-line) !important; border-radius: 10px !important;
  background: var(--atlas-surface-2) !important; color: var(--atlas-ink) !important; box-shadow: none !important;
  font: 400 22px/1 var(--atlas-font-ui) !important; opacity: 1 !important; visibility: visible !important; cursor: pointer;
}
html body:not(#d7) dialog#atlasNotificationsDialog :is(.an-close, .an-clear):hover { background: var(--atlas-hover) !important; color: var(--atlas-ink) !important; }
html body:not(#d7) dialog#atlasNotificationsDialog :is(.an-close, .an-clear, .atlas-notification-item__dismiss):focus-visible { outline: 2px solid var(--atlas-cyan) !important; outline-offset: 2px !important; }
html body:not(#d7) dialog#atlasNotificationsDialog .an-mobile-close { display: none !important; }

html body:not(#d7) dialog#atlasNotificationsDialog .an-content {
  flex: 1 1 auto !important; min-height: 0 !important; overflow-y: auto !important; padding: 14px !important; background: var(--atlas-surface) !important;
}
html body:not(#d7) dialog#atlasNotificationsDialog :is(#atlasNotificationPanel, #stakingNotificationPanel) {
  position: static !important; display: block !important; width: auto !important; max-height: none !important; margin: 0 !important; padding: 0 !important;
  background: transparent !important; border: 0 !important; box-shadow: none !important; transform: none !important;
}
html body:not(#d7) dialog#atlasNotificationsDialog :is(.atlas-notification-head, .staking-notification-head) { display: none !important; }
html body:not(#d7) dialog#atlasNotificationsDialog .atlas-notification-list { display: flex !important; flex-direction: column !important; gap: 8px !important; max-height: none !important; overflow: visible !important; }

/* singolo avviso */
html body:not(#d7) dialog#atlasNotificationsDialog :is(.atlas-notification-item, .staking-notification-message) {
  position: relative !important; display: block !important; margin: 0 !important;
  padding: 12px 48px 12px 14px !important; box-sizing: border-box !important;
  background: var(--atlas-surface-2) !important; color: var(--atlas-ink) !important;
  border: 1px solid var(--atlas-line) !important; border-left: 4px solid var(--atlas-accent-text) !important; border-radius: 10px !important;
  font: 500 14px/1.45 var(--atlas-font-ui) !important; box-shadow: none !important;
}
html body:not(#d7) dialog#atlasNotificationsDialog .atlas-notification-item.is-error {
  background: var(--atlas-danger-soft) !important; border-color: color-mix(in srgb, var(--atlas-danger) 40%, var(--atlas-line)) !important;
  border-left-color: var(--atlas-danger) !important; color: var(--atlas-ink) !important;
}
html body:not(#d7) dialog#atlasNotificationsDialog .atlas-notification-item > span:first-child { display: block !important; color: inherit !important; }
html body:not(#d7) dialog#atlasNotificationsDialog .atlas-notification-item__time {
  display: block !important; margin-top: 6px !important; color: var(--atlas-muted) !important; font: 500 11px/1.2 var(--atlas-font-mono) !important;
}
html body:not(#d7) dialog#atlasNotificationsDialog .atlas-notification-item__actions { margin-top: 8px !important; }
html body:not(#d7) dialog#atlasNotificationsDialog .atlas-notification-item__actions button {
  min-height: 36px !important; padding: 0 12px !important; border: 1px solid var(--atlas-line-strong) !important; border-radius: 8px !important;
  background: var(--atlas-surface) !important; color: var(--atlas-ink) !important; font: 600 12px/1 var(--atlas-font-ui) !important;
}
/* × del singolo avviso */
html body:not(#d7) dialog#atlasNotificationsDialog .atlas-notification-item__dismiss {
  position: absolute !important; top: 6px !important; right: 6px !important;
  display: grid !important; place-items: center !important;
  width: 34px !important; height: 34px !important; min-width: 34px !important; min-height: 34px !important; padding: 0 !important; margin: 0 !important;
  border: 0 !important; border-radius: 8px !important; background: transparent !important;
  color: var(--atlas-muted) !important; font: 400 20px/1 var(--atlas-font-ui) !important; box-shadow: none !important; cursor: pointer;
}
html body:not(#d7) dialog#atlasNotificationsDialog .atlas-notification-item__dismiss:hover { background: var(--atlas-hover) !important; color: var(--atlas-ink) !important; }
html body:not(#d7) dialog#atlasNotificationsDialog .atlas-notification-item__dismiss[hidden] { display: none !important; }
/* Picchettamento: la × sta dentro il riquadro del messaggio */
html body:not(#d7) dialog#atlasNotificationsDialog #stakingNotificationPanel { position: relative !important; }
html body:not(#d7) dialog#atlasNotificationsDialog #stakingNotificationPanel > .an-msg-dismiss { top: 6px !important; right: 6px !important; }
html body:not(#d7) dialog#atlasNotificationsDialog #stakingNotificationPanel.is-empty .staking-notification-message { border-left-color: var(--atlas-line-strong) !important; padding-right: 14px !important; color: var(--atlas-muted) !important; }
html body:not(#d7) dialog#atlasNotificationsDialog #stakingNotificationPanel.is-empty .staking-notification-message::before { content: "Nessuna notifica."; }
html body:not(#d7) dialog#atlasNotificationsDialog .atlas-notification-empty {
  padding: 18px 14px !important; text-align: center !important; color: var(--atlas-muted) !important;
  background: var(--atlas-surface-2) !important; border: 1px dashed var(--atlas-line-strong) !important; border-radius: 10px !important;
}

@media (max-width: 900px) {
  html body:not(#d7) dialog#atlasNotificationsDialog {
    inset: calc(64px + env(safe-area-inset-top, 0px)) 12px auto 12px !important; margin: 0 !important;
    width: auto !important; max-height: calc(100dvh - 160px) !important;
  }
  html body:not(#d7) dialog#atlasNotificationsDialog .an-close { width: 44px !important; height: 44px !important; min-width: 44px !important; min-height: 44px !important; max-width: 44px !important; max-height: 44px !important; flex-basis: 44px !important; }
  html body:not(#d7) dialog#atlasNotificationsDialog .atlas-notification-item__dismiss { width: 44px !important; height: 44px !important; min-width: 44px !important; min-height: 44px !important; top: 2px !important; right: 2px !important; }
  html body:not(#d7) dialog#atlasNotificationsDialog :is(.atlas-notification-item, .staking-notification-message) { padding-right: 52px !important; }
}

/* ============================================================================
   7.8 — Niente più pallini rosso/giallo/verde della vecchia UI (Mappa)
   Tutti i comandi .atlas-mac-dot (Misura/Area, legende, pannelli) diventano
   pulsanti icona neutri. Stessi pulsanti, ID e gestori:
     giallo (Riduci) = freccia giù · verde (Espandi/Apri) = freccia su ·
     rosso (Chiudi) = ×
   ========================================================================== */
html body:not(#d7) .atlas-mac-dot {
  position: relative !important; display: inline-grid !important; place-items: center !important;
  width: 32px !important; height: 32px !important; min-width: 32px !important; min-height: 32px !important;
  max-width: 32px !important; max-height: 32px !important; flex: 0 0 32px !important;
  padding: 0 !important; margin: 0 !important; border: 1px solid var(--atlas-line) !important; border-radius: 8px !important;
  background: var(--atlas-surface-2) !important; color: var(--atlas-ink) !important; box-shadow: none !important;
  font-size: 0 !important; line-height: 0 !important; cursor: pointer; opacity: 1 !important;
}
html body:not(#d7) .atlas-mac-dot::before {
  content: "" !important; display: block !important; width: 16px !important; height: 16px !important;
  background: currentColor !important; border: 0 !important; border-radius: 0 !important; position: static !important; transform: none !important;
  -webkit-mask: var(--mac-ico) center / contain no-repeat; mask: var(--mac-ico) center / contain no-repeat;
}
html body:not(#d7) .atlas-mac-dot::after { content: none !important; display: none !important; }
html body:not(#d7) .atlas-mac-dot--yellow { --mac-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); }
html body:not(#d7) .atlas-mac-dot--green  { --mac-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 15 6-6 6 6'/%3E%3C/svg%3E"); }
html body:not(#d7) .atlas-mac-dot--red    { --mac-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6 6 18'/%3E%3C/svg%3E"); }
html body:not(#d7) .atlas-mac-dot:hover { background: var(--atlas-hover) !important; }
html body:not(#d7) .atlas-mac-dot--red:hover { color: var(--atlas-danger) !important; }
html body:not(#d7) .atlas-mac-dot:focus-visible { outline: 2px solid var(--atlas-cyan) !important; outline-offset: 2px !important; }
html body:not(#d7) .atlas-mac-dot[hidden] { display: none !important; }

/* ---------- pannello Misura / Area ---------- */
html body:not(#d7) #atlasMeasurePanel {
  background: var(--atlas-surface) !important; color: var(--atlas-ink) !important;
  border: 1px solid var(--atlas-line) !important; border-radius: 12px !important; overflow: hidden !important;
  box-shadow: var(--atlas-shadow-pop) !important; font-family: var(--atlas-font-ui) !important;
}
html body:not(#d7) #atlasMeasurePanel .atlas-measure-window-head {
  display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 10px !important;
  min-height: 48px !important; padding: 6px 8px 6px 14px !important; margin: 0 !important; box-sizing: border-box !important;
  background: var(--atlas-surface) !important; color: var(--atlas-ink) !important;
  border: 0 !important; border-bottom: 1px solid var(--atlas-line) !important; box-shadow: none !important;
}
html body:not(#d7) #atlasMeasurePanel #atlasMeasureTitle,
html body:not(#d7) #atlasMeasurePanel #atlasMeasureTitle strong { color: var(--atlas-ink) !important; font: 600 14px/1.25 var(--atlas-font-ui) !important; background: transparent !important; }
html body:not(#d7) #atlasMeasurePanel .atlas-measure-window-actions { display: flex !important; align-items: center !important; gap: 6px !important; }
/* una sola freccia alla volta: Riduci quando aperto, Espandi quando ridotto */
html body:not(#d7) #atlasMeasurePanel #atlasMinimizeMeasure[aria-pressed="true"],
html body:not(#d7) #atlasMeasurePanel #atlasExpandMeasure[aria-pressed="true"] { display: none !important; }
html body:not(#d7) #atlasMeasurePanel .atlas-measure-window-body { padding: 12px 14px 14px !important; background: var(--atlas-surface) !important; color: var(--atlas-ink) !important; }
html body:not(#d7) #atlasMeasurePanel #atlasMeasureResult {
  margin: 0 0 4px !important; padding: 0 !important; background: transparent !important; border: 0 !important;
  color: var(--atlas-orange-ink) !important; font: 700 22px/1.2 var(--atlas-font-mono) !important; font-variant-numeric: tabular-nums;
}
html body:not(#d7) #atlasMeasurePanel #atlasMeasureHint { color: var(--atlas-muted) !important; font: 400 12.5px/1.45 var(--atlas-font-ui) !important; background: transparent !important; }
html body:not(#d7) #atlasMeasurePanel #atlasDistanceProfileRow { margin: 10px 0 0 !important; }
html body:not(#d7) #atlasMeasurePanel .atlas-measure-actions { display: flex !important; gap: 8px !important; margin-top: 10px !important; }
html body:not(#d7) #atlasMeasurePanel button:not(.atlas-mac-dot) {
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  min-height: 36px !important; height: auto !important; padding: 0 12px !important; margin: 0 !important;
  border: 1px solid var(--atlas-line-strong) !important; border-radius: 8px !important;
  background: var(--atlas-surface-2) !important; color: var(--atlas-ink) !important; box-shadow: none !important;
  font: 600 13px/1.2 var(--atlas-font-ui) !important; width: auto !important;
}
html body:not(#d7) #atlasMeasurePanel #atlasProfileBtn { width: 100% !important; color: var(--atlas-orange-ink) !important; border-color: var(--atlas-orange) !important; background: transparent !important; }
html body:not(#d7) #atlasMeasurePanel .atlas-measure-actions button { flex: 1 1 0 !important; }
html body:not(#d7) #atlasMeasurePanel #atlasClearMeasure { color: var(--atlas-danger) !important; border-color: color-mix(in srgb, var(--atlas-danger) 55%, var(--atlas-line)) !important; background: transparent !important; }
html body:not(#d7) #atlasMeasurePanel button:not(.atlas-mac-dot):hover { background: var(--atlas-hover) !important; }
html body:not(#d7) #atlasMeasurePanel button:disabled { opacity: .5 !important; }

/* ---------- pannello profilo altimetrico e legende: stesse superfici ---------- */
html body:not(#d7) #atlasProfilePanel { background: var(--atlas-surface) !important; color: var(--atlas-ink) !important; border: 1px solid var(--atlas-line) !important; border-radius: 12px !important; }
html body:not(#d7) .atlas-legend-windowbar { background: var(--atlas-surface) !important; color: var(--atlas-ink) !important; border-bottom: 1px solid var(--atlas-line) !important; }
html body:not(#d7) .atlas-legend-windowtitle { color: var(--atlas-ink) !important; }
html body:not(#d7) .atlas-legend-open-label { background: var(--atlas-surface-2) !important; color: var(--atlas-ink) !important; border: 1px solid var(--atlas-line-strong) !important; border-radius: 8px !important; }

@media (max-width: 900px) {
  html body:not(#d7) .atlas-mac-dot { width: 44px !important; height: 44px !important; min-width: 44px !important; min-height: 44px !important; max-width: 44px !important; max-height: 44px !important; flex-basis: 44px !important; border-radius: 10px !important; }
  html body:not(#d7) .atlas-mac-dot::before { width: 18px !important; height: 18px !important; }
  /* in alto, sotto la barra degli sfondi: non si sovrappone ai controlli mappa */
  html body:not(#d7) #atlasMeasurePanel.show {
    position: fixed !important; top: calc(104px + 8px) !important; left: 12px !important; right: 12px !important; bottom: auto !important;
    width: auto !important; max-width: none !important; transform: none !important; z-index: 2600 !important;
  }
  html body:not(#d7) #atlasMeasurePanel button:not(.atlas-mac-dot) { min-height: 44px !important; }
}
html body:not(#d7) #atlasMeasurePanel .atlas-measure-window-actions { position: static !important; inset: auto !important; transform: none !important; margin: 0 !important; }
html body:not(#d7) #atlasMeasurePanel .atlas-measure-window-head > * { position: static !important; }
/* ridotto: resta la barra con titolo, "Espandi" e "Chiudi" */
html body:not(#d7) #atlasMeasurePanel.minimized { height: auto !important; min-height: 0 !important; max-height: none !important; padding: 0 !important; }
html body:not(#d7) #atlasMeasurePanel.minimized #atlasMeasureTitle { display: block !important; }
html body:not(#d7) #atlasMeasurePanel.minimized .atlas-measure-window-head { border-bottom: 0 !important; }
html body:not(#d7) #atlasMeasurePanel.minimized .atlas-measure-window-body { display: none !important; }

/* ========================================================================
   4) CORREZIONI FIELD
   ======================================================================== */
/* ============================================================================
   ATLAS MAP 7.4 — Correzioni Field (Mappa e Picchettamento, tutte le larghezze)
   ----------------------------------------------------------------------------
   Tutte le regole valgono SOLO con data-atlas-theme="dark": Light invariato.
   Regola di leggibilità concordata:
     - in Field i testi azzurri/ciano diventano ARANCIO;
     - i testi navy (pensati per fondo bianco) diventano chiari;
     - nessun riquadro bianco: superfici scure dai token.
   Parte 1: correzioni esplicite dei componenti noti.
   Parte 2: attributi data-f7-* scritti da atlas-field-guard.js sugli elementi
            legacy rimasti chiari (rete di sicurezza per contenuti dinamici).
   Caricare DOPO atlas-tokens.css.
   ========================================================================== */

/* =========================================================================
   PARTE 1 — componenti noti
   ========================================================================= */

/* ---------- Punto: dati catastali, analisi del punto, verifica vincoli ---------- */
html[data-atlas-theme="dark"] body:not(#f7) :is(#catastalResults, #pointAnalysis, #pointResults, #addressResults) {
  background: var(--atlas-surface) !important; color: var(--atlas-ink) !important; border-color: var(--atlas-line) !important;
}
html[data-atlas-theme="dark"] body:not(#f7) :is(.catastal-results__head, .point-analysis__head, .point-results__head) {
  background: var(--atlas-surface-2) !important; color: var(--atlas-ink) !important; border-color: var(--atlas-line) !important;
}
html[data-atlas-theme="dark"] body:not(#f7) :is(.catastal-results__body, .point-analysis__item, .point-result, .point-result-group) {
  background: var(--atlas-surface-2) !important; color: var(--atlas-ink) !important; border-color: var(--atlas-line) !important;
}
html[data-atlas-theme="dark"] body:not(#f7) .catastal-note {
  background: rgba(255, 158, 18, .10) !important; color: var(--atlas-ink) !important; border-color: var(--atlas-orange) !important;
}
html[data-atlas-theme="dark"] body:not(#f7) .point-analysis__badge {
  background: rgba(255, 158, 18, .14) !important; color: var(--atlas-orange) !important; border-color: transparent !important;
}
html[data-atlas-theme="dark"] body:not(#f7) :is(#catastalResults, #pointAnalysis, #pointResults)
  :is(h3, h4, strong, b, p, li, dt, dd, label, span:not([class*="badge"]):not([class*="status"]):not([class*="dot"]), div:not([class*="badge"])) {
  color: inherit;
}
html[data-atlas-theme="dark"] body:not(#f7) :is(#catastalResults, #pointAnalysis, #pointResults) :is(small, .hint, .muted, [class*="__meta"], [class*="__note"]) {
  color: var(--atlas-muted) !important;
}
html[data-atlas-theme="dark"] body:not(#f7) :is(#catastalResults, #pointAnalysis, #pointResults) a { color: var(--atlas-orange) !important; }
html[data-atlas-theme="dark"] body:not(#f7) .address-result { background: var(--atlas-surface) !important; color: var(--atlas-ink) !important; border-color: var(--atlas-line) !important; }
html[data-atlas-theme="dark"] body:not(#f7) .address-result:is(:hover, :focus) { background: var(--atlas-hover) !important; }
html[data-atlas-theme="dark"] body:not(#f7) .address-result__title { color: var(--atlas-ink) !important; }
html[data-atlas-theme="dark"] body:not(#f7) .address-result__meta { color: var(--atlas-muted) !important; }

/* titoli dei gruppi nei pannelli (erano navy su scuro) */
html[data-atlas-theme="dark"] body:not(#f7) :is(.field-group > .label, .field-group > label.label, .atlas-desktop-fold__summary, .atlas-visible-head .label) {
  color: var(--atlas-ink) !important;
}
html[data-atlas-theme="dark"] body:not(#f7) .atlas-urbanistica-intro,
html[data-atlas-theme="dark"] body:not(#f7) .atlas-urbanistica-intro * { background-color: transparent; }
html[data-atlas-theme="dark"] body:not(#f7) .atlas-urbanistica-intro {
  background: var(--atlas-surface-2) !important; border-color: var(--atlas-line) !important; color: var(--atlas-ink) !important;
}
html[data-atlas-theme="dark"] body:not(#f7) .atlas-urbanistica-intro__title { color: var(--atlas-ink) !important; }
html[data-atlas-theme="dark"] body:not(#f7) .atlas-urbanistica-intro .hint { color: var(--atlas-muted) !important; }

/* stampa tecnica, informazioni WMS */
html[data-atlas-theme="dark"] body:not(#f7) #atlasPrintInfo { background: var(--atlas-surface-2) !important; color: var(--atlas-ink) !important; border-color: var(--atlas-line) !important; }
html[data-atlas-theme="dark"] body:not(#f7) #atlasPrintInfo strong { color: var(--atlas-ink) !important; }
html[data-atlas-theme="dark"] body:not(#f7) #atlasPrintPreview { background: var(--atlas-surface) !important; color: var(--atlas-ink) !important; border: 1px solid var(--atlas-line-strong) !important; }
html[data-atlas-theme="dark"] body:not(#f7) #wmsInfoPopup :is(strong, b, h3) { color: var(--atlas-ink) !important; }
html[data-atlas-theme="dark"] body:not(#f7) #wmsInfoPopup a { color: var(--atlas-orange) !important; }

/* ---------- Relazione sintetica del punto: in Field fondo scuro, testo chiaro ---------- */
html[data-atlas-theme="dark"] body:not(#f7) .point-report-card { background: var(--atlas-surface) !important; color: var(--atlas-ink) !important; border-color: var(--atlas-line) !important; }
html[data-atlas-theme="dark"] body:not(#f7) :is(.point-report-body, .point-report-text) { background: var(--atlas-bg) !important; color: var(--atlas-ink) !important; }
html[data-atlas-theme="dark"] body:not(#f7) .atlas-report-document {
  background: var(--atlas-surface) !important; color: var(--atlas-ink) !important;
  border: 1px solid var(--atlas-line) !important; box-shadow: none !important;
}
html[data-atlas-theme="dark"] body:not(#f7) .atlas-report-document :is(p, li, td, th, dd, dt, span, div, strong, b, em, small) { color: inherit; }
html[data-atlas-theme="dark"] body:not(#f7) .atlas-report-document :is(.atlas-report-title, .atlas-report-section-title, .atlas-report-group-title, .atlas-report-hit-head, h1, h2, h3, h4, strong, b) {
  color: #ffffff !important;
}
html[data-atlas-theme="dark"] body:not(#f7) .atlas-report-document :is(.atlas-report-paragraph, .atlas-report-hit-body, .atlas-report-explain, .atlas-report-content, p, li) {
  color: var(--atlas-ink) !important;
}
html[data-atlas-theme="dark"] body:not(#f7) .atlas-report-document :is(.atlas-report-subtitle, .atlas-report-source, .atlas-report-disclaimer, .atlas-report-footer, small) {
  color: var(--atlas-muted) !important;
}
html[data-atlas-theme="dark"] body:not(#f7) .atlas-report-document :is(.atlas-report-summary-item, .atlas-report-hit, .atlas-report-explain-block, .atlas-report-detected, .point-result, .point-result-group) {
  background: var(--atlas-surface-2) !important; color: var(--atlas-ink) !important; border-color: var(--atlas-line) !important;
}
html[data-atlas-theme="dark"] body:not(#f7) .atlas-report-document .atlas-report-summary-item :is(span, small, b:first-child) { color: var(--atlas-muted) !important; }
html[data-atlas-theme="dark"] body:not(#f7) .atlas-report-document .atlas-report-summary-item strong { color: #ffffff !important; }
html[data-atlas-theme="dark"] body:not(#f7) .atlas-report-document .atlas-report-section-title { border-left-color: var(--atlas-orange) !important; border-bottom-color: var(--atlas-line) !important; }
html[data-atlas-theme="dark"] body:not(#f7) .atlas-report-document :is(a, .atlas-report-category) { color: var(--atlas-orange) !important; }
/* l'intestazione con il logo resta di marca */
html[data-atlas-theme="dark"] body:not(#f7) .atlas-report-document .atlas-report-letterhead { background: #1e3a5f !important; }
html[data-atlas-theme="dark"] body:not(#f7) .atlas-report-document .atlas-report-letterhead :is(strong, b, span, div, small) { color: #ffffff !important; }
html[data-atlas-theme="dark"] body:not(#f7) .atlas-report-document .atlas-report-logo-wrap { background: #ffffff !important; }
html[data-atlas-theme="dark"] body:not(#f7) #copyPointReport { background: var(--atlas-surface-2) !important; color: var(--atlas-ink) !important; border: 1px solid var(--atlas-line-strong) !important; }

/* ---------- Accesso riservato (funzione Premium) ---------- */
html[data-atlas-theme="dark"] body:not(#f7) .atlas-access-modal [role="dialog"] {
  background: var(--atlas-surface) !important; color: var(--atlas-ink) !important; border-color: var(--atlas-line) !important;
}

/* =========================================================================
   PARTE 2 — rete di sicurezza (attributi scritti da atlas-field-guard.js)
   ========================================================================= */
html[data-atlas-theme="dark"] body:not(#f7) [data-f7-bg="surface"] {
  background-color: var(--atlas-surface-2) !important; background-image: none !important;
  border-color: var(--atlas-line) !important; color: var(--atlas-ink) !important;
}
html[data-atlas-theme="dark"] body:not(#f7) [data-f7-bg="field"] {
  background-color: var(--atlas-surface) !important; background-image: none !important;
  border-color: var(--atlas-line-strong) !important; color: var(--atlas-ink) !important;
}
html[data-atlas-theme="dark"] body:not(#f7) [data-f7-fg="accent"] { color: var(--atlas-orange) !important; }
html[data-atlas-theme="dark"] body:not(#f7) [data-f7-fg="ink"] { color: var(--atlas-ink) !important; }
html[data-atlas-theme="dark"] body:not(#f7) [data-f7-fg="muted"] { color: var(--atlas-muted) !important; }
html[data-atlas-theme="dark"] body:not(#f7) [data-f7-fg="dark"] { color: #1a1d24 !important; }
html[data-atlas-theme="dark"] body:not(#f7) .atlas-report-document .atlas-report-section-title::before,
html[data-atlas-theme="dark"] body:not(#f7) .atlas-report-document .atlas-report-section-title::after { background: var(--atlas-orange) !important; border-color: var(--atlas-orange) !important; }

/* ========================================================================
   5) LIVELLI E LEGENDE
   ======================================================================== */
/* ============================================================================
   ATLAS MAP 7.9 — Livelli e Legende (Mappa)
   1) Icone delle categorie di livelli: piccole icone lineari (20 px) nel
      colore della categoria, al posto dei riquadri pieni da 30 px della
      vecchia UI; bordo laterale sottile. Light e Field.
   2) Legende: finestra e contenuti con i colori dell'app in Light e Field;
      le immagini di legenda WMS/PNG restano su fondo chiaro (i loro colori
      hanno un significato e non vanno alterati).
   Solo aspetto: nessun livello, filtro o dato modificato.
   ========================================================================== */

html body:not(#l7) #atlasVisibleLayersPanel > details.layer-cat { border-left-width: 3px !important; box-shadow: none !important; }
html body:not(#l7) #atlasVisibleLayersPanel > details.layer-cat > summary { padding-left: 44px !important; min-height: 48px !important; }
html body:not(#l7) #atlasVisibleLayersPanel > details.layer-cat > summary::before {
  content: "" !important; position: absolute !important; left: 14px !important; top: 50% !important;
  width: 20px !important; height: 20px !important; margin: -10px 0 0 !important;
  border-radius: 0 !important; box-shadow: none !important; transform: none !important;
  background: var(--cat-color, currentColor) !important; background-image: none !important;
  -webkit-mask: var(--cat-ico) center / contain no-repeat !important; mask: var(--cat-ico) center / contain no-repeat !important;
}
html body:not(#l7) #atlasVisibleLayersPanel > details.layer-cat[open] > summary::before { transform: none !important; }

html body:not(#l7) #atlasVisibleLayersPanel > details.layer-cat { --cat-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m12 3 9 5-9 5-9-5z'/%3E%3Cpath d='m3 13 9 5 9-5'/%3E%3C/svg%3E"); --cat-color: #5a6270; }
html[data-atlas-theme="dark"] body:not(#l7) #atlasVisibleLayersPanel > details.layer-cat { --cat-color: #a7b0bd; }
html body:not(#l7) #atlasVisibleLayersPanel > details.layer-cat.purpose-reference { --cat-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m12 3 9 5-9 5-9-5z'/%3E%3Cpath d='m3 13 9 5 9-5'/%3E%3C/svg%3E"); --cat-color: #0b7cb0; }
html[data-atlas-theme="dark"] body:not(#l7) #atlasVisibleLayersPanel > details.layer-cat.purpose-reference { --cat-color: #38bdf8; }
html body:not(#l7) #atlasVisibleLayersPanel > details.layer-cat.purpose-reference { border-left-color: var(--cat-color) !important; }
html body:not(#l7) #atlasVisibleLayersPanel > details.layer-cat.purpose-constraints { --cat-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3 5 6v5c0 4.5 3 8 7 10 4-2 7-5.5 7-10V6z'/%3E%3C/svg%3E"); --cat-color: #c2413b; }
html[data-atlas-theme="dark"] body:not(#l7) #atlasVisibleLayersPanel > details.layer-cat.purpose-constraints { --cat-color: #f87171; }
html body:not(#l7) #atlasVisibleLayersPanel > details.layer-cat.purpose-constraints { border-left-color: var(--cat-color) !important; }
html body:not(#l7) #atlasVisibleLayersPanel > details.layer-cat.purpose-environment { --cat-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 19c6 0 13-5 14-15-8 1-14 6-14 13'/%3E%3Cpath d='M5 19c2-4 5-7 9-9'/%3E%3C/svg%3E"); --cat-color: #2f855a; }
html[data-atlas-theme="dark"] body:not(#l7) #atlasVisibleLayersPanel > details.layer-cat.purpose-environment { --cat-color: #4ade80; }
html body:not(#l7) #atlasVisibleLayersPanel > details.layer-cat.purpose-environment { border-left-color: var(--cat-color) !important; }
html body:not(#l7) #atlasVisibleLayersPanel > details.layer-cat.purpose-risk { --cat-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4 2.8 20h18.4z'/%3E%3Cpath d='M12 10v4M12 17h.01'/%3E%3C/svg%3E"); --cat-color: #c26a04; }
html[data-atlas-theme="dark"] body:not(#l7) #atlasVisibleLayersPanel > details.layer-cat.purpose-risk { --cat-color: #fbbf24; }
html body:not(#l7) #atlasVisibleLayersPanel > details.layer-cat.purpose-risk { border-left-color: var(--cat-color) !important; }
html body:not(#l7) #atlasVisibleLayersPanel > details.layer-cat.purpose-meteo { --cat-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 18h10a4 4 0 0 0 .5-8A6 6 0 0 0 6 9a4.5 4.5 0 0 0 1 9z'/%3E%3C/svg%3E"); --cat-color: #3b6fb6; }
html[data-atlas-theme="dark"] body:not(#l7) #atlasVisibleLayersPanel > details.layer-cat.purpose-meteo { --cat-color: #93c5fd; }
html body:not(#l7) #atlasVisibleLayersPanel > details.layer-cat.purpose-meteo { border-left-color: var(--cat-color) !important; }
html body:not(#l7) #atlasVisibleLayersPanel > details.layer-cat.purpose-info { --cat-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 11v5M12 8h.01'/%3E%3C/svg%3E"); --cat-color: #7c3aed; }
html[data-atlas-theme="dark"] body:not(#l7) #atlasVisibleLayersPanel > details.layer-cat.purpose-info { --cat-color: #c4b5fd; }
html body:not(#l7) #atlasVisibleLayersPanel > details.layer-cat.purpose-info { border-left-color: var(--cat-color) !important; }
html body:not(#l7) #atlasVisibleLayersPanel > details.layer-cat.purpose-regional { --cat-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s7-6.2 7-12a7 7 0 0 0-14 0c0 5.8 7 12 7 12z'/%3E%3Ccircle cx='12' cy='9' r='2.5'/%3E%3C/svg%3E"); --cat-color: #0f766e; }
html[data-atlas-theme="dark"] body:not(#l7) #atlasVisibleLayersPanel > details.layer-cat.purpose-regional { --cat-color: #2dd4bf; }
html body:not(#l7) #atlasVisibleLayersPanel > details.layer-cat.purpose-regional { border-left-color: var(--cat-color) !important; }

/* ---------------- Legende ---------------- */
html body:not(#l7) .treseizero-legend {
  background: var(--atlas-surface) !important; color: var(--atlas-ink) !important;
  border: 1px solid var(--atlas-line) !important; border-radius: 12px !important; overflow: hidden !important;
  box-shadow: var(--atlas-shadow-pop) !important; font-family: var(--atlas-font-ui) !important;
}
html body:not(#l7) .treseizero-legend .atlas-legend-windowbar {
  display: flex !important; align-items: center !important; gap: 8px !important;
  min-height: 48px !important; padding: 6px 12px 6px 8px !important; box-sizing: border-box !important;
  background: var(--atlas-surface) !important; color: var(--atlas-ink) !important;
  border: 0 !important; border-bottom: 1px solid var(--atlas-line) !important; box-shadow: none !important;
}
html body:not(#l7) .treseizero-legend .atlas-mac-controls { display: flex !important; gap: 6px !important; order: 2 !important; margin-left: auto !important; }
html body:not(#l7) .treseizero-legend .atlas-legend-windowtitle { order: 1 !important; color: var(--atlas-ink) !important; font: 600 14px/1.25 var(--atlas-font-ui) !important; padding-left: 6px !important; }
/* una sola freccia: Riduci quando aperta, Apri quando ridotta */
html body:not(#l7) .treseizero-legend:not(.is-collapsed) [data-legend-action="expand"].atlas-mac-dot,
html body:not(#l7) .treseizero-legend.is-collapsed [data-legend-action="collapse"] { display: none !important; }
html body:not(#l7) .treseizero-legend .atlas-legend-open-label { display: none !important; }
html body:not(#l7) .treseizero-legend .atlas-legend-body,
html body:not(#l7) .treseizero-legend .treseizero-legend-scroll { background: var(--atlas-surface) !important; color: var(--atlas-ink) !important; }
html body:not(#l7) .treseizero-legend .treseizero-legend-scroll { max-height: min(52vh, 520px) !important; overflow-y: auto !important; padding: 10px 12px 12px !important; }
html body:not(#l7) :is(.treseizero-legend, .atlas-mobile-sheet) .treseizero-legend__section {
  background: transparent !important; color: var(--atlas-ink) !important; border: 0 !important;
  border-bottom: 1px solid var(--atlas-line) !important; border-radius: 0 !important; padding: 8px 2px 10px !important; margin: 0 !important; box-shadow: none !important;
}
html body:not(#l7) :is(.treseizero-legend, .atlas-mobile-sheet) .treseizero-legend__section:last-child { border-bottom: 0 !important; }
html body:not(#l7) :is(.treseizero-legend, .atlas-mobile-sheet) .treseizero-legend__title {
  color: var(--atlas-ink) !important; font: 700 13px/1.3 var(--atlas-font-ui) !important; margin: 0 0 6px !important; background: transparent !important;
}
html body:not(#l7) :is(.treseizero-legend, .atlas-mobile-sheet) .treseizero-legend__row {
  display: flex !important; align-items: center !important; gap: 8px !important; color: var(--atlas-ink) !important;
  font: 400 12.5px/1.35 var(--atlas-font-ui) !important; background: transparent !important; padding: 2px 0 !important;
}
html body:not(#l7) :is(.treseizero-legend, .atlas-mobile-sheet) .treseizero-legend__row * { color: inherit; }
html body:not(#l7) :is(.treseizero-legend, .atlas-mobile-sheet) .treseizero-legend__swatch { flex: 0 0 auto !important; border: 1px solid var(--atlas-line-strong) !important; border-radius: 3px !important; }
html body:not(#l7) :is(.treseizero-legend, .atlas-mobile-sheet) :is(.treseizero-legend__source, .treseizero-legend__limit, .treseizero-legend__loading, .treseizero-legend__empty) {
  color: var(--atlas-muted) !important; font: 400 11.5px/1.4 var(--atlas-font-ui) !important; background: transparent !important;
}
/* immagini di legenda dei servizi (PNG): restano su un foglio chiaro, leggibili anche in Field */
html body:not(#l7) :is(.treseizero-legend, .atlas-mobile-sheet) :is(.treseizero-legend__img, .treseizero-legend__wms) {
  display: block !important; max-width: 100% !important; height: auto !important;
  background: #ffffff !important; padding: 6px !important; border-radius: 6px !important; border: 1px solid var(--atlas-line) !important; box-sizing: border-box !important;
}
html body:not(#l7) :is(.treseizero-legend, .atlas-mobile-sheet) .treseizero-legend__wms img { background: #ffffff !important; max-width: 100% !important; height: auto !important; }

html body:not(#l7) #atlasVisibleLayersPanel > details.layer-cat > summary { position: relative !important; }