/* ============================================================================
   ATLAS MAP 7.2 — Picchettamento: header condiviso + rifinitura desktop (Fase 1)
   ----------------------------------------------------------------------------
   Caricare per ULTIMO, dopo ../assets/atlas-tokens.css.
   Colori SOLO da token (--atlas-*): Light/Field/Auto funzionano da soli.

   Specificità: i fogli precedenti usano catene di classi + !important.
   Qui ogni selettore parte da  body.staking-ui-7:not(#s7)  (= 1 id + 1 classe),
   che le supera senza dover rincorrere le singole regole.
   Nessun ID, handler o calcolo viene modificato.
   ========================================================================== */

/* =========================================================================
   1) HEADER — replica dell'header desktop della Mappa (stesse misure e colori)
   ========================================================================= */
body.staking-ui-7:not(#s7) > header.atlas-hdr {
  position: fixed !important; top: 0 !important; left: 0 !important; right: 0 !important;
  z-index: 9000 !important;
  height: 52px; min-height: 52px; max-height: 52px; box-sizing: border-box;
  display: flex; align-items: center; gap: 16px;
  padding: 0 16px;
  background: #1e3a5f; border-bottom: 1px solid #17304e; box-shadow: none;
  color: #eaf1f8; font-family: var(--atlas-font-ui); -webkit-font-smoothing: antialiased;
}
html[data-atlas-theme="dark"] body.staking-ui-7:not(#s7) > header.atlas-hdr { background: #10161f; border-color: #22303f; }
body.staking-ui-7:not(#s7) .atlas-hdr svg:not(.atlas-hdr__mark) { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

/* marchio */
body.staking-ui-7:not(#s7) .atlas-hdr__brand { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; min-width: 0; }
body.staking-ui-7:not(#s7) .atlas-hdr__home { display: flex; align-items: center; border-radius: 4px; }
body.staking-ui-7:not(#s7) .atlas-hdr__home:focus-visible { outline: 2px solid #1ba6e8; outline-offset: 3px; }
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__mark { display: block; height: 28px; width: auto; }
body.staking-ui-7:not(#s7) .atlas-hdr__tag {
  display: inline-block; padding-left: 12px; border-left: 1px solid rgba(255, 255, 255, .14);
  color: rgba(226, 236, 247, .68); font-size: 10px; font-weight: 500; letter-spacing: 1.4px;
  text-transform: uppercase; white-space: nowrap;
}

/* ricerca indirizzo */
body.staking-ui-7:not(#s7) .atlas-hdr__search { position: relative; flex: 1 1 auto; min-width: 180px; max-width: 432px; margin: 0 auto 0 0; padding-left: 12px; box-sizing: border-box; display: flex; align-items: center; }
body.staking-ui-7:not(#s7) .atlas-hdr__search::before {
  content: ""; position: absolute; left: 26px; top: 50%; width: 16px; height: 16px; transform: translateY(-50%); pointer-events: none;
  background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23cfe0f2' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E");
}
body.staking-ui-7:not(#s7) .atlas-hdr #stakingAddressInput {
  width: 100%; height: 34px; margin: 0; padding: 0 96px 0 40px; box-sizing: border-box;
  border: 1px solid rgba(255, 255, 255, .16); border-radius: 4px; background: rgba(255, 255, 255, .10);
  color: #fff; font: 400 13.5px/1 var(--atlas-font-mono); font-variant-numeric: tabular-nums; box-shadow: none;
}
body.staking-ui-7:not(#s7) .atlas-hdr #stakingAddressInput::placeholder { color: rgba(255, 255, 255, .6); }
body.staking-ui-7:not(#s7) .atlas-hdr #stakingAddressInput:focus { outline: none; border-color: #1ba6e8; background: rgba(255, 255, 255, .16); }
body.staking-ui-7:not(#s7) .atlas-hdr__search-actions { position: absolute; right: 5px; top: 50%; transform: translateY(-50%); display: flex; gap: 4px; }
body.staking-ui-7:not(#s7) .atlas-hdr__search-actions button {
  width: 74px; min-width: 74px; height: 40px; min-height: 0; padding: 0 12px; margin: 0; border: 0; border-radius: 3px;
  font: 700 12px/1 var(--atlas-font-ui); cursor: pointer; box-shadow: none;
}
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__search-go { background: #f39200; color: #1a1205; }
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__search-go:disabled { opacity: .6; cursor: progress; }
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__search-clear { padding: 0; background: rgba(255, 255, 255, .14); color: #fff; font-size: 14px; }
body.staking-ui-7:not(#s7) .atlas-hdr__search-actions button:focus-visible { outline: 2px solid #1ba6e8; outline-offset: 1px; }
body.staking-ui-7:not(#s7) .atlas-hdr__results {
  position: absolute; top: 40px; left: 12px; right: 0; z-index: 9500;
  max-height: 320px; overflow-y: auto; border-radius: 6px;
  background: #fff; color: #1a1d24; box-shadow: 0 18px 40px rgba(10, 25, 45, .28);
}
html[data-atlas-theme="dark"] body.staking-ui-7:not(#s7) .atlas-hdr__results { background: #161a1f; color: #f2f2f0; }
body.staking-ui-7:not(#s7) .atlas-hdr__results[hidden] { display: none; }
body.staking-ui-7:not(#s7) .atlas-hdr__results .atlas-hdr__result {
  display: block; width: 100%; margin: 0; padding: 10px 12px; box-sizing: border-box;
  border: 0; border-bottom: 1px solid var(--atlas-line); border-radius: 0; background: transparent; color: inherit;
  text-align: left; font: 500 12px/1.35 var(--atlas-font-ui); cursor: pointer; box-shadow: none;
}
body.staking-ui-7:not(#s7) .atlas-hdr__results .atlas-hdr__result:last-child { border-bottom: 0; }
body.staking-ui-7:not(#s7) .atlas-hdr__results .atlas-hdr__result:hover,
body.staking-ui-7:not(#s7) .atlas-hdr__results .atlas-hdr__result:focus { background: var(--atlas-hover); outline: none; }
body.staking-ui-7:not(#s7) .atlas-hdr__results b { display: block; margin-bottom: 2px; font-size: 12.5px; font-weight: 800; color: var(--atlas-ink); }
body.staking-ui-7:not(#s7) .atlas-hdr__results small { display: block; font-size: 10.8px; color: var(--atlas-muted); }
body.staking-ui-7:not(#s7) .atlas-hdr__results .atlas-hdr__results-msg { padding: 10px 12px; font: 500 12px/1.4 var(--atlas-font-ui); color: var(--atlas-muted); }
body.staking-ui-7:not(#s7) .atlas-hdr__results .atlas-hdr__results-msg.is-error { color: var(--atlas-danger); }

/* lato destro */
body.staking-ui-7:not(#s7) .atlas-hdr__right { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; }

/* Light / Field / Auto (come la Mappa: attivo sempre bianco con testo navy) */
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__theme {
  display: inline-flex !important; align-items: center; gap: 2px; padding: 2px; margin-right: 4px; flex-shrink: 0;
  background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .18); border-radius: 4px;
}
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__theme button {
  display: inline-flex; align-items: center; justify-content: center; gap: 5px;
  width: auto; min-width: 30px; height: 26px; padding: 0 8px; margin: 0;
  border: none; border-radius: 3px; background: transparent; color: rgba(255, 255, 255, .7);
  font: 500 12px/1 var(--atlas-font-ui); cursor: pointer; box-shadow: none;
  transition: background-color .15s ease, color .15s ease;
}
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__theme button svg { width: 15px; height: 15px; display: block; stroke-width: 2; }
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__theme button:hover { color: #fff; }
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__theme button[aria-pressed="true"] { background: #fff; color: #1e3a5f; }
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__theme button:focus-visible { outline: 2px solid #1ba6e8; outline-offset: 1px; }

/* notifiche */
body.staking-ui-7:not(#s7) .atlas-hdr__bell { position: relative; }
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__icon-btn {
  position: relative; display: grid; place-items: center;
  width: 34px; height: 34px; min-width: 34px; padding: 0; margin: 0;
  border: 0; border-radius: 8px; background: transparent; color: #fff; cursor: pointer; box-shadow: none;
}
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__icon-btn svg { width: 20px; height: 20px; }
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__icon-btn:hover,
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__icon-btn[aria-expanded="true"] { background: rgba(255, 255, 255, .1); }
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__icon-btn:focus-visible { outline: 2px solid #1ba6e8; outline-offset: 1px; }
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__badge {
  position: absolute; top: -5px; right: -5px; min-width: 17px; height: 17px; padding: 0 4px; box-sizing: border-box;
  display: grid; place-items: center; border-radius: 999px;
  background: #ef4444; color: #fff; font: 700 9px/1 var(--atlas-font-ui);
}
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__badge[hidden] { display: none; }
body.staking-ui-7:not(#s7) .atlas-hdr .staking-notification-panel[hidden] { display: none !important; }

/* account */
body.staking-ui-7:not(#s7) .atlas-hdr__user { position: relative; }
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__user-btn {
  display: flex; align-items: center; gap: 8px; height: 38px; padding: 4px 8px 4px 4px; margin: 0; box-sizing: border-box;
  border: 1px solid transparent; border-radius: 999px; background: transparent; color: #eaf1f8; cursor: pointer; box-shadow: none;
  transition: background-color .18s ease;
}
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__user-btn.is-anon { padding: 4px; }
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__user-btn:hover { background: rgba(255, 255, 255, .12); }
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__user-btn:focus-visible { outline: 2px solid #1ba6e8; outline-offset: 2px; }
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__avatar {
  display: grid; place-items: center; width: 28px; height: 28px; flex: 0 0 28px; border-radius: 50%;
  background: #f39200; color: #1a1d24; font: 800 12px/1 var(--atlas-font-ui); letter-spacing: .5px;
}
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__avatar svg { width: 18px; height: 18px; stroke-width: 1.9; }
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__uname { color: #eaf1f8; font: 500 13px/1 var(--atlas-font-ui); white-space: nowrap; max-width: 130px; overflow: hidden; text-overflow: ellipsis; }
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__chev { display: inline-flex; width: 14px; color: rgba(226, 236, 247, .7); transition: transform .2s ease; }
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__chev svg { width: 14px; height: 14px; stroke-width: 2; }
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__user-btn[aria-expanded="true"] .atlas-hdr__chev { transform: rotate(90deg); }

body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__menu {
  position: absolute; top: calc(100% + 8px); right: 0; z-index: 9500;
  min-width: 232px; padding: 8px; box-sizing: border-box; white-space: nowrap;
  background: #12161b; border: 1px solid rgba(255, 255, 255, .10); border-radius: 14px;
  box-shadow: 0 24px 60px rgba(8, 18, 32, .5);
}
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__menu[hidden] { display: none; }
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__menu-head { display: flex; align-items: center; gap: 10px; padding: 8px 8px 10px; margin-bottom: 6px; border-bottom: 1px solid rgba(255, 255, 255, .08); }
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__avatar--menu { width: 36px; height: 36px; flex-basis: 36px; background: linear-gradient(135deg, #1ba6e8, #1e3a5f); color: #fff; font-size: 13px; letter-spacing: 0; }
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__menu-head > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__menu-head strong { color: #f2f2f0; font: 700 13px/1.15 var(--atlas-font-ui); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__tier { color: #f39200; font: 700 10px/1.1 var(--atlas-font-ui); letter-spacing: .6px; text-transform: uppercase; }
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__item {
  display: flex; align-items: center; gap: 10px; width: 100%; margin: 0; padding: 9px 10px; box-sizing: border-box;
  border: 0; border-radius: 9px; background: transparent; color: #d6dee7;
  font: 600 13px/1.4 var(--atlas-font-ui); text-align: left; text-decoration: none; cursor: pointer; box-shadow: none;
  transition: background-color .14s ease;
}
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__item svg { width: 18px; height: 18px; flex: 0 0 18px; }
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__item:hover,
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__item:focus-visible { background: rgba(255, 255, 255, .07); color: #fff; outline: none; }
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__item--danger { color: #ff8080; }
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__item--danger:hover { background: rgba(214, 69, 69, .16); color: #ff9a9a; }

/* Tablet/telefono: impostazione provvisoria fino alle Fasi 2–4
   (la Mappa sotto 901 px nasconde ricerca e tema dall'header). */
@media (max-width: 767px), (max-width: 900px) and (pointer: fine) {
  body.staking-ui-7:not(#s7) > header.atlas-hdr { height: 56px; min-height: 56px; max-height: 56px; padding: 0 10px; gap: 8px; }
  body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__mark { height: 24px; }
  body.staking-ui-7:not(#s7) .atlas-hdr__tag,
  body.staking-ui-7:not(#s7) .atlas-hdr__search,
  body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__theme .atlas-theme-label,
  body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__uname,
  body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__chev { display: none !important; }
  body.staking-ui-7:not(#s7) .atlas-hdr__right { margin-left: auto; gap: 4px; }
  /* Light / Field / Auto solo icone, come la Mappa su telefono */
  body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__theme { margin: 0 4px 0 0; border-radius: 6px; }
  body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__theme button { width: 34px; min-width: 34px; height: 34px; padding: 0; border-radius: 4px; }
  body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__theme button svg { width: 17px; height: 17px; }
  body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__icon-btn { width: 44px; height: 44px; min-width: 44px; }
  body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__user-btn { width: 44px; height: 44px; padding: 8px; justify-content: center; }
  body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__item { min-height: 44px; }
}

/* =========================================================================
   1b) BARRA DI STATO — identica al footer desktop della Mappa
   Il footer TreSeiZero resta nel DOM (inserito dal PHP) ma, come nella Mappa,
   su desktop è sostituito dalla barra di stato.
   ========================================================================= */
@media (min-width: 901px), (min-width: 768px) and (pointer: coarse) {
  body.staking-ui-7.staking-status-on:not(#s7) footer.atlas-shared-footer,
  body.staking-ui-7.staking-status-on:not(#s7) footer.atlas-page-footer { display: none !important; }
}
body.staking-ui-7:not(#s7) .atlas-shell-status {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 8500;
  height: 32px; box-sizing: border-box;
  display: flex; align-items: center; gap: 16px; padding: 0 16px;
  background: var(--atlas-surface); color: var(--atlas-muted); border-top: 1px solid var(--atlas-line);
  font: 400 11px/1 var(--atlas-font-mono); white-space: nowrap; overflow: hidden;
}
body.staking-ui-7:not(#s7) .atlas-shell-status .sep { width: 1px; height: 14px; flex: 0 0 1px; background: var(--atlas-line); }
body.staking-ui-7:not(#s7) .atlas-shell-status .spacer { flex: 1 1 auto; }
body.staking-ui-7:not(#s7) .atlas-shell-status b { color: var(--atlas-ink); font-weight: 600; }
body.staking-ui-7:not(#s7) .atlas-shell-status .muted { color: var(--atlas-ink); }
@media (max-width: 1200px) { body.staking-ui-7:not(#s7) .atlas-shell-status .hide-md { display: none; } }
@media (max-width: 767px), (max-width: 900px) and (pointer: fine) { body.staking-ui-7:not(#s7) .atlas-shell-status { display: none !important; } }

/* 2) Dialog notifiche: vedi ../assets/atlas-dialogs-7.css (7.5) */
body.staking-ui-7:not(#s7) .atlas-hdr__close { display: none !important; } /* nodo conservato per staking.js */

/* =========================================================================
   3) SFONDO MAPPA prima del caricamento delle tile (segue il tema)
   ========================================================================= */
body.staking-ui-7:not(#s7) #map.leaflet-container,
body.staking-ui-7:not(#s7) #map { background: var(--atlas-map-bg) !important; }

/* =========================================================================
   4) DESKTOP (>= 901 px)
   ========================================================================= */
@media (min-width: 901px), (min-width: 768px) and (pointer: coarse) {
  /* il toggle nel pannello è per il mobile: su desktop c'è quello dell'header */
  body.staking-ui-7:not(#s7) #workspace .staking-theme-toggle { display: none !important; }

  /* ---------- pannello: header ---------- */
  body.staking-ui-7:not(#s7) #workspace .workspace-head { align-items: center !important; }
  body.staking-ui-7:not(#s7) #workspace .staking-modal-title strong { font: 600 17px/1.3 var(--atlas-font-ui) !important; color: var(--atlas-ink) !important; }
  body.staking-ui-7:not(#s7) #workspace .staking-modal-title svg { color: var(--atlas-orange) !important; }
  body.staking-ui-7:not(#s7) #workspace #stakingMinimizeBtn {
    display: grid !important; place-items: center !important;
    width: 32px !important; height: 32px !important; min-width: 32px !important; min-height: 32px !important; padding: 0 !important;
    border: 1px solid var(--atlas-line) !important; border-radius: 6px !important;
    background: var(--atlas-surface) !important; color: var(--atlas-muted) !important; box-shadow: none !important;
  }
  body.staking-ui-7:not(#s7) #workspace #stakingMinimizeBtn:hover { background: var(--atlas-hover) !important; color: var(--atlas-ink) !important; }
  body.staking-ui-7:not(#s7) #workspace #stakingMinimizeBtn svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

  /* ---------- schede sottolineate (come il prototipo) ---------- */
  body.staking-ui-7:not(#s7) #workspace .staking-workflow-tabs {
    display: flex !important; gap: 4px !important; padding: 0 20px !important; margin: 0 0 18px !important;
    background: transparent !important; border-bottom: 1px solid var(--atlas-line) !important;
    overflow-x: auto; scrollbar-width: none;
  }
  body.staking-ui-7:not(#s7) #workspace .staking-workflow-tabs::-webkit-scrollbar { display: none; }
  body.staking-ui-7:not(#s7) #workspace .staking-workflow-tabs button {
    flex: 0 0 auto !important; min-height: 40px !important; height: 40px !important; padding: 0 12px !important; margin: 0 0 -1px !important;
    border: 0 !important; border-radius: 0 !important; background: transparent !important;
    color: var(--atlas-muted) !important; font: 500 13px/1 var(--atlas-font-ui) !important;
    box-shadow: inset 0 -2px transparent !important; white-space: nowrap !important; cursor: pointer;
  }
  body.staking-ui-7:not(#s7) #workspace .staking-workflow-tabs button:hover { color: var(--atlas-ink) !important; background: transparent !important; box-shadow: inset 0 -2px var(--atlas-line-strong) !important; }
  body.staking-ui-7:not(#s7) #workspace .staking-workflow-tabs button[aria-selected="true"] {
    color: var(--atlas-orange-ink) !important; font-weight: 600 !important; box-shadow: inset 0 -2px var(--atlas-orange) !important;
  }
  body.staking-ui-7:not(#s7) #workspace .staking-workflow-tabs button:focus-visible { outline: 2px solid var(--atlas-cyan) !important; outline-offset: -2px; }

  /* ---------- pulsante Acquisisci posizione: icona allineata ---------- */
  body.staking-ui-7:not(#s7) #workspace #stakeFromDeviceBtn {
    display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important;
    min-height: 36px !important; height: 36px !important; padding: 0 14px !important; flex: 0 0 auto;
    line-height: 1 !important; white-space: nowrap;
  }
  body.staking-ui-7:not(#s7) #workspace #stakeFromDeviceBtn .field-action-icon {
    display: inline-grid !important; place-items: center !important;
    width: 18px !important; height: 18px !important; flex: 0 0 18px !important; margin: 0 !important;
    border-radius: 0 !important; background: transparent !important;
  }
  body.staking-ui-7:not(#s7) #workspace #stakeFromDeviceBtn .field-action-icon svg { width: 18px !important; height: 18px !important; display: block; }

  /* ---------- riquadri metodo GPS: altezze e testi allineati ---------- */
  body.staking-ui-7:not(#s7) #workspace .staking-acquisition-grid { align-items: stretch !important; }
  body.staking-ui-7:not(#s7) #workspace .staking-acquisition-grid button { display: flex !important; flex-direction: column !important; align-items: flex-start !important; }
  body.staking-ui-7:not(#s7) #workspace .staking-acquisition-grid button span { margin-top: auto !important; }

  /* ---------- Field: testi e superfici che restavano chiari/scuri ---------- */
  body.staking-ui-7:not(#s7) #workspace #tab-trig article {
    background: var(--atlas-surface-3) !important; border: 1px solid var(--atlas-line) !important; color: var(--atlas-ink) !important;
  }
  body.staking-ui-7:not(#s7) #workspace #tab-trig h3 { color: var(--atlas-ink) !important; font: 600 14px/1.3 var(--atlas-font-ui) !important; }
  body.staking-ui-7:not(#s7) #workspace #tab-trig :is(label, small, .hint) { color: var(--atlas-muted) !important; }
  body.staking-ui-7:not(#s7) #workspace #tab-trig .result {
    background: var(--atlas-surface) !important; color: var(--atlas-ink) !important;
    border: 1px solid var(--atlas-line) !important; font-family: var(--atlas-font-mono) !important;
  }
  body.staking-ui-7:not(#s7) #workspace :is(#tab-trig, #tab-points) :is(select, input:not([type="color"]):not([type="checkbox"])) {
    background: var(--atlas-surface) !important; color: var(--atlas-ink) !important; border: 1px solid var(--atlas-line-strong) !important;
  }
  body.staking-ui-7:not(#s7) #workspace .premiumtag { color: var(--atlas-orange-ink) !important; }

  /* ---------- pannello Livelli: sopra il modale, e il modale si sposta ---------- */
  body.staking-ui-7:not(#s7) #layercard { z-index: 1650 !important; }
  body.staking-ui-7:not(#s7) #stakingLayersToggle { z-index: 1700 !important; }
  body.staking-ui-7:not(#s7):not(.staking-layers-collapsed):not(.staking-workspace-collapsed) #workspace:not([data-staking-view="pq"]) {
    left: calc(60px + (100vw - 60px - 364px) / 2) !important;
    width: min(860px, calc(100vw - 60px - 364px - 40px)) !important;
  }
  body.staking-ui-7:not(#s7) #layercard .atlas-project-launcher {
    background: var(--atlas-surface-3) !important; color: var(--atlas-ink) !important; border: 1px solid var(--atlas-line) !important;
  }
  body.staking-ui-7:not(#s7) #layercard .atlas-project-launcher :is(h3, strong) { color: var(--atlas-ink) !important; }
  body.staking-ui-7:not(#s7) #layercard .atlas-project-launcher p { color: var(--atlas-muted) !important; }
  body.staking-ui-7:not(#s7) #layercard .atlas-project-launcher button {
    background: var(--atlas-surface) !important; color: var(--atlas-ink) !important; border: 1px solid var(--atlas-line-strong) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.staking-ui-7:not(#s7) .atlas-hdr * { transition: none !important; }
}

/* =========================================================================
   5) Nessuna velatura sulla mappa a pannello aperto
   (la mappa resta leggibile dove si toccano i punti da picchettare)
   ========================================================================= */
body.staking-ui-7:not(#s7) main::before,
body.staking-ui-7:not(#s7):not(.staking-workspace-collapsed) main::before { content: none !important; display: none !important; background: none !important; }

/* Icona del pulsante "Riduci pannello" visibile a tutte le larghezze */
body.staking-ui-7:not(#s7) #stakingMinimizeBtn svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }


/* =========================================================================
   6) TELEFONO E TABLET PROVVISORIO (≤ 900 px) — Fase 3
   Stesso linguaggio della Mappa mobile: barra inferiore, schede dal basso,
   controlli mappa a card. Il pannello non supera il 62% dello schermo così
   resta visibile la mappa dove si toccano i picchetti; la freccia lo riduce.
   ========================================================================= */
@media (max-width: 767px), (max-width: 900px) and (pointer: fine), (min-width: 768px) and (max-width: 1366px) and (pointer: coarse) {
  body.staking-ui-7:not(#s7) { --stk-dock: calc(64px + env(safe-area-inset-bottom, 0px)); }
  html[data-atlas-theme="dark"] body.staking-ui-7:not(#s7) #map { background: var(--atlas-map-bg) !important; }
  body.staking-ui-7:not(#s7) main,
  body.staking-ui-7:not(#s7) #map { bottom: var(--stk-dock) !important; }

  /* ---------- barra inferiore (come la Mappa) ---------- */
  body.staking-ui-7:not(#s7) #mobileDock {
    position: fixed !important; left: 0 !important; right: 0 !important; bottom: 0 !important; top: auto !important;
    z-index: 5000 !important; height: var(--stk-dock) !important; min-height: 0 !important;
    display: grid !important; grid-template-columns: repeat(4, 1fr) !important; gap: 0 !important;
    padding: 0 0 env(safe-area-inset-bottom, 0px) !important; margin: 0 !important; box-sizing: border-box !important;
    background: var(--atlas-surface) !important; border: 0 !important; border-top: 1px solid var(--atlas-line) !important;
    border-radius: 0 !important; box-shadow: 0 -4px 16px rgba(15, 33, 55, .06) !important;
  }
  body.staking-ui-7:not(#s7) #mobileDock > button {
    position: relative !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; gap: 4px !important;
    width: auto !important; height: 64px !important; min-height: 64px !important; padding: 0 2px !important; margin: 0 !important;
    border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important;
    color: var(--atlas-muted) !important; font: 600 11px/1.1 var(--atlas-font-ui) !important; opacity: 1 !important; visibility: visible !important;
  }
  body.staking-ui-7:not(#s7) #mobileDock > button * { color: inherit !important; }
  body.staking-ui-7:not(#s7) #mobileDock > button .dockicon {
    display: grid !important; place-items: center !important; width: 24px !important; height: 24px !important;
    margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; font-size: 18px !important;
  }
  body.staking-ui-7:not(#s7) #mobileDock > button svg { width: 22px !important; height: 22px !important; stroke: currentColor !important; }
  body.staking-ui-7:not(#s7) #mobileDock > button:is(.active, [aria-pressed="true"]) { color: var(--atlas-orange-ink) !important; background: transparent !important; }
  body.staking-ui-7:not(#s7) #mobileDock > button:is(.active, [aria-pressed="true"])::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.staking-ui-7:not(#s7) #mobileDock > button:focus-visible { outline: 2px solid var(--atlas-cyan) !important; outline-offset: -3px !important; }

  /* ---------- controlli mappa: card in alto a destra (non toccano il pannello) ---------- */
  body.staking-ui-7:not(#s7) .maptools {
    position: fixed !important; top: 68px !important; right: 12px !important; bottom: auto !important; left: auto !important;
    z-index: 3000 !important; width: auto !important; height: auto !important;
    display: flex !important; flex-direction: column !important; align-items: center !important; gap: 4px !important;
    padding: 4px !important; margin: 0 !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.staking-ui-7:not(#s7) .maptools .atlas-mobile-map-zoom {
    order: -1 !important; position: static !important; display: flex !important; flex-direction: column !important; gap: 4px !important;
    padding: 0 0 4px !important; margin: 0 !important; background: transparent !important; border: 0 !important;
    border-bottom: 1px solid var(--atlas-line) !important; border-radius: 0 !important; box-shadow: none !important;
  }
  body.staking-ui-7:not(#s7) .maptools 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: none !important;
    font: 400 24px/1 var(--atlas-font-ui) !important;
  }
  body.staking-ui-7:not(#s7) .maptools button:active { background: var(--atlas-hover) !important; }
  body.staking-ui-7:not(#s7) .maptools button:focus-visible { outline: 2px solid var(--atlas-cyan) !important; }
  body.staking-ui-7:not(#s7) .maptools button .atlas-map-action-label { display: none !important; }
  body.staking-ui-7:not(#s7) .maptools button .atlas-tool-glyph { display: grid !important; place-items: center !important; width: 22px !important; height: 22px !important; margin: 0 !important; background: transparent !important; color: inherit !important; }
  body.staking-ui-7:not(#s7) .maptools button svg { width: 22px !important; height: 22px !important; }
  body.staking-ui-7:not(#s7) .maptools #atlasLocateBtn { color: var(--atlas-orange) !important; }
  body.staking-ui-7:not(#s7) .maptools #stakingAttributionToggle { color: var(--atlas-muted) !important; }
  body.staking-ui-7:not(#s7) .maptools button[aria-expanded="true"] { background: rgba(243, 146, 0, .14) !important; color: var(--atlas-orange-ink) !important; }
  body.staking-ui-7.staking-sheet-tall:not(#s7) .maptools { display: none !important; }

  /* ---------- pannello Picchettamento: scheda dal basso ---------- */
  body.staking-ui-7:not(#s7) #workspace {
    position: fixed !important; left: 0 !important; right: 0 !important; top: auto !important;
    bottom: var(--stk-dock) !important; transform: none !important; z-index: 3600 !important;
    width: 100% !important; max-width: none !important; height: auto !important;
    max-height: min(58dvh, calc(100dvh - 56px - var(--stk-dock) - 72px)) !important;
    display: flex !important; flex-direction: column !important; overflow-x: hidden !important; overflow-y: auto !important;
    overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
    margin: 0 !important; padding: 0 !important; box-sizing: border-box !important;
    background: var(--atlas-surface) !important; color: var(--atlas-ink) !important;
    border: 0 !important; border-top: 1px solid var(--atlas-line) !important; border-radius: 16px 16px 0 0 !important;
    box-shadow: 0 -10px 30px rgba(15, 33, 55, .16) !important;
  }
  body.staking-ui-7.staking-workspace-collapsed:not(#s7) #workspace { display: none !important; }
  body.staking-ui-7:not(#s7) #workspace .grab {
    display: block !important; position: sticky !important; top: 0 !important; z-index: 3 !important; flex: 0 0 auto !important;
    width: 100% !important; height: 14px !important; margin: 0 !important; padding: 0 !important;
    background: var(--atlas-surface) !important; border: 0 !important;
  }
  body.staking-ui-7:not(#s7) #workspace .grab::after {
    content: "" !important; position: absolute !important; top: 6px !important; left: 50% !important; transform: translateX(-50%) !important;
    width: 40px !important; height: 4px !important; border-radius: 4px !important; background: var(--atlas-line-strong) !important;
  }
  body.staking-ui-7:not(#s7) #workspace .workspace-head {
    position: sticky !important; top: 14px !important; z-index: 3 !important; flex: 0 0 auto !important;
    display: flex !important; flex-wrap: nowrap !important; align-items: center !important; justify-content: space-between !important; gap: 8px !important;
    min-height: 52px !important; height: auto !important; padding: 0 12px 0 16px !important; margin: 0 !important;
    background: var(--atlas-surface) !important; border: 0 !important; box-shadow: none !important;
  }
  body.staking-ui-7:not(#s7) #workspace .staking-modal-title { display: flex !important; align-items: center !important; gap: 8px !important; min-width: 0 !important; }
  body.staking-ui-7:not(#s7) #workspace .staking-modal-title svg { width: 18px !important; height: 18px !important; color: var(--atlas-orange) !important; flex: 0 0 18px !important; }
  body.staking-ui-7:not(#s7) #workspace .staking-modal-title strong { color: var(--atlas-ink) !important; font: 600 17px/1.2 var(--atlas-font-ui) !important; white-space: nowrap !important; }
  body.staking-ui-7:not(#s7) #workspace .workspace-head-actions { display: flex !important; flex-wrap: nowrap !important; align-items: center !important; gap: 6px !important; margin: 0 !important; padding: 0 !important; }
  body.staking-ui-7:not(#s7) #workspace .workspace-head-actions .staking-theme-toggle { display: none !important; } /* è nell'header */
  body.staking-ui-7:not(#s7) #workspace #stakingClearFields {
    min-height: 36px !important; height: 36px !important; padding: 0 10px !important; margin: 0 !important;
    border: 1px solid var(--atlas-line) !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;
  }
  body.staking-ui-7:not(#s7) #workspace #stakingMinimizeBtn {
    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: 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;
  }

  /* schede: riga scorrevole sottolineata, sempre visibile in cima */
  body.staking-ui-7:not(#s7) #workspace .staking-workflow-tabs {
    position: sticky !important; top: 66px !important; z-index: 2 !important; flex: 0 0 auto !important;
    display: flex !important; gap: 0 !important; overflow-x: auto !important; overflow-y: hidden !important; scrollbar-width: none;
    padding: 0 8px !important; margin: 0 !important; background: var(--atlas-surface) !important;
    border: 0 !important; border-bottom: 1px solid var(--atlas-line) !important; box-shadow: none !important;
  }
  body.staking-ui-7:not(#s7) #workspace .staking-workflow-tabs::-webkit-scrollbar { display: none; }
  body.staking-ui-7:not(#s7) #workspace .staking-workflow-tabs button {
    flex: 0 0 auto !important; min-height: 44px !important; height: 44px !important; padding: 0 12px !important; margin: 0 0 -1px !important;
    border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: inset 0 -2px transparent !important;
    color: var(--atlas-muted) !important; font: 500 13px/1 var(--atlas-font-ui) !important; white-space: nowrap !important;
  }
  body.staking-ui-7:not(#s7) #workspace .staking-workflow-tabs button[aria-selected="true"] {
    color: var(--atlas-orange-ink) !important; font-weight: 600 !important; box-shadow: inset 0 -2px var(--atlas-orange) !important;
  }
  body.staking-ui-7:not(#s7) #workspace .staking-workflow-tabs button:focus-visible { outline: 2px solid var(--atlas-cyan) !important; outline-offset: -2px !important; }

  /* contenuto: scorre con il pannello (niente scroll annidati) */
  body.staking-ui-7:not(#s7) #workspace .staking-workflow-content {
    flex: 0 0 auto !important; height: auto !important; max-height: none !important; overflow: visible !important;
    padding: 14px 16px 8px !important; margin: 0 !important; background: var(--atlas-surface) !important; color: var(--atlas-ink) !important;
  }
  body.staking-ui-7:not(#s7) #workspace :is(#tab-points, #tab-trig, #stakingTracePane, #stakingPQPane) { padding: 0 !important; margin: 0 !important; background: transparent !important; }
  body.staking-ui-7:not(#s7) #workspace .field-actions-card {
    padding: 0 !important; margin: 0 0 12px !important; background: transparent !important; border: 0 !important; box-shadow: none !important;
  }
  body.staking-ui-7:not(#s7) #workspace .staking-section-title { margin: 0 0 8px !important; color: var(--atlas-muted) !important; font: 700 11px/1.2 var(--atlas-font-ui) !important; letter-spacing: 1px !important; text-transform: uppercase !important; }

  /* metodi GPS: righe compatte selezionabili */
  body.staking-ui-7:not(#s7) #workspace .staking-acquisition-grid { display: flex !important; flex-direction: column !important; gap: 6px !important; margin: 0 !important; }
  body.staking-ui-7:not(#s7) #workspace .staking-acquisition-grid button {
    display: grid !important; grid-template-columns: 1fr auto !important; grid-template-rows: auto auto !important; column-gap: 10px !important; row-gap: 2px !important;
    align-items: center !important; text-align: left !important;
    width: 100% !important; min-height: 56px !important; height: auto !important; padding: 9px 12px !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;
  }
  body.staking-ui-7:not(#s7) #workspace .staking-acquisition-grid button b { grid-column: 1 !important; grid-row: 1 !important; color: var(--atlas-ink) !important; font: 600 14px/1.25 var(--atlas-font-ui) !important; }
  body.staking-ui-7:not(#s7) #workspace .staking-acquisition-grid button small { grid-column: 1 !important; grid-row: 2 !important; color: var(--atlas-muted) !important; font: 400 12px/1.3 var(--atlas-font-ui) !important; }
  body.staking-ui-7:not(#s7) #workspace .staking-acquisition-grid button span {
    grid-column: 2 !important; grid-row: 1 / 3 !important; margin: 0 !important; color: var(--atlas-accent-text) !important;
    font: 500 11px/1.2 var(--atlas-font-mono) !important; text-align: right !important; white-space: nowrap !important;
  }
  body.staking-ui-7:not(#s7) #workspace .staking-acquisition-grid button[aria-pressed="true"] {
    border-color: var(--atlas-orange) !important; background: rgba(243, 146, 0, .10) !important; box-shadow: inset 3px 0 var(--atlas-orange) !important;
  }
  body.staking-ui-7:not(#s7) #workspace .staking-acquire-action { display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 8px !important; margin: 10px 0 0 !important; }
  body.staking-ui-7:not(#s7) #workspace .staking-acquire-note { order: 2 !important; margin: 0 !important; color: var(--atlas-muted) !important; font: 400 12px/1.4 var(--atlas-font-ui) !important; }
  body.staking-ui-7:not(#s7) #workspace #stakeFromDeviceBtn {
    order: 1 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important;
    width: 100% !important; min-height: 48px !important; height: 48px !important; padding: 0 16px !important; margin: 0 !important;
    border: 0 !important; border-radius: 10px !important; background: #f39200 !important; color: #1a1205 !important;
    font: 700 15px/1 var(--atlas-font-ui) !important; box-shadow: none !important; text-align: center !important;
  }
  body.staking-ui-7:not(#s7) #workspace #stakeFromDeviceBtn .field-action-icon {
    display: inline-grid !important; place-items: center !important; width: 20px !important; height: 20px !important; flex: 0 0 20px !important;
    margin: 0 !important; background: transparent !important; border-radius: 0 !important;
  }
  body.staking-ui-7:not(#s7) #workspace #stakeFromDeviceBtn .field-action-icon svg { width: 20px !important; height: 20px !important; }
  body.staking-ui-7:not(#s7) #workspace .atlas-altitude-notice {
    margin: 0 0 12px !important; padding: 10px 12px !important; font-size: 12.5px !important; line-height: 1.45 !important;
    color: var(--atlas-ink) !important; background: var(--atlas-surface-2) !important;
    border: 1px solid var(--atlas-line) !important; border-left: 3px solid var(--atlas-cyan) !important; border-radius: 8px !important;
  }

  /* coordinate */
  body.staking-ui-7:not(#s7) #workspace .addrow { display: flex !important; flex-direction: column !important; gap: 8px !important; margin: 0 0 12px !important; }
  body.staking-ui-7:not(#s7) #workspace .staking-coordinate-field { display: flex !important; flex-direction: column !important; gap: 6px !important; color: var(--atlas-muted) !important; font: 600 11px/1.3 var(--atlas-font-ui) !important; letter-spacing: .6px !important; text-transform: uppercase !important; }
  body.staking-ui-7:not(#s7) #workspace #coordInput {
    width: 100% !important; min-height: 48px !important; padding: 0 12px !important; box-sizing: border-box !important;
    background: var(--atlas-surface) !important; color: var(--atlas-ink) !important;
    border: 1px solid var(--atlas-line-strong) !important; border-radius: 10px !important;
    font: 400 16px/1 var(--atlas-font-mono) !important; text-transform: none !important; letter-spacing: 0 !important;
  }
  body.staking-ui-7:not(#s7) #workspace #addCoord {
    width: 100% !important; min-height: 48px !important; border: 0 !important; border-radius: 10px !important;
    background: #f39200 !important; color: #1a1205 !important; font: 700 15px/1 var(--atlas-font-ui) !important; box-shadow: none !important;
  }

  /* metriche 2 × 2 */
  body.staking-ui-7:not(#s7) #workspace .staking-metrics-grid { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 6px !important; margin: 0 0 12px !important; }
  body.staking-ui-7:not(#s7) #workspace .staking-metrics-grid > div {
    display: flex !important; flex-direction: column !important; gap: 4px !important; min-height: 0 !important; padding: 10px 12px !important; margin: 0 !important;
    background: var(--atlas-surface-2) !important; border: 1px solid var(--atlas-line) !important; border-radius: 10px !important; box-shadow: none !important;
  }
  body.staking-ui-7:not(#s7) #workspace .staking-metrics-grid b { color: var(--atlas-muted) !important; font: 500 11px/1.2 var(--atlas-font-ui) !important; }
  body.staking-ui-7:not(#s7) #workspace .staking-metrics-grid span { color: var(--atlas-ink) !important; font: 500 14px/1.2 var(--atlas-font-mono) !important; }

  /* dettagli picchetti e geometria */
  body.staking-ui-7:not(#s7) #workspace #stakingSurveyDetails { margin: 0 !important; border-top: 1px solid var(--atlas-line) !important; }
  body.staking-ui-7:not(#s7) #workspace #stakingSurveyDetails > summary {
    min-height: 48px !important; display: flex !important; align-items: center !important; padding: 0 !important;
    color: var(--atlas-ink) !important; background: transparent !important; font: 700 12px/1.2 var(--atlas-font-ui) !important; letter-spacing: .8px !important; text-transform: uppercase !important;
  }
  body.staking-ui-7:not(#s7) #workspace #stakingSurveyDetails :is(.hint, .parcelbox span) { color: var(--atlas-muted) !important; }
  body.staking-ui-7:not(#s7) #workspace :is(.parcelbox, .livecard) {
    background: var(--atlas-surface-2) !important; color: var(--atlas-ink) !important; border: 1px solid var(--atlas-line) !important; border-radius: 10px !important; box-shadow: none !important;
  }
  body.staking-ui-7:not(#s7) #workspace .polybar { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; align-items: center !important; }
  body.staking-ui-7:not(#s7) #workspace .polybar :is(button, select) { min-height: 44px !important; }
  body.staking-ui-7:not(#s7) #workspace .pointlist { overflow-x: auto !important; -webkit-overflow-scrolling: touch; }
  body.staking-ui-7:not(#s7) #workspace .pointlist :is(table, th, td) { color: var(--atlas-ink) !important; border-color: var(--atlas-line) !important; }
  body.staking-ui-7:not(#s7) #workspace .pointlist th { background: var(--atlas-surface-2) !important; color: var(--atlas-muted) !important; }
  body.staking-ui-7:not(#s7) #workspace .pointlist tr:nth-child(even) td { background: var(--atlas-surface-2) !important; }
  body.staking-ui-7:not(#s7) #workspace .pointlist tr:nth-child(odd) td { background: var(--atlas-surface) !important; }

  /* campi e pulsanti generici del pannello */
  body.staking-ui-7:not(#s7) #workspace :is(select, input[type="number"], input[type="text"]:not(#coordInput), input:not([type]):not(#coordInput)) {
    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-size: 15px !important;
  }
  body.staking-ui-7:not(#s7) #workspace :is(#tab-trig, #tab-points) button:not(.primary):not(#stakeFromDeviceBtn):not(#addCoord):not([data-precision-method]):not(.danger) {
    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.staking-ui-7:not(#s7) #workspace #tab-trig article {
    padding: 14px !important; margin: 0 0 10px !important; background: var(--atlas-surface-2) !important;
    border: 1px solid var(--atlas-line) !important; border-radius: 12px !important; color: var(--atlas-ink) !important; box-shadow: none !important;
  }
  body.staking-ui-7:not(#s7) #workspace #tab-trig h3 { color: var(--atlas-ink) !important; font: 600 15px/1.3 var(--atlas-font-ui) !important; margin: 0 0 10px !important; }
  body.staking-ui-7:not(#s7) #workspace #tab-trig :is(label, small, .hint) { color: var(--atlas-muted) !important; }
  body.staking-ui-7:not(#s7) #workspace #tab-trig .result { background: var(--atlas-surface) !important; color: var(--atlas-ink) !important; border: 1px solid var(--atlas-line) !important; font-family: var(--atlas-font-mono) !important; }
  body.staking-ui-7:not(#s7) #workspace :is(.staking-mode-intro, #stakingPQMobileNote) {
    color: var(--atlas-ink) !important; background: var(--atlas-surface-2) !important;
    border: 1px solid var(--atlas-line) !important; border-left: 3px solid var(--atlas-orange) !important; border-radius: 8px !important;
  }
  body.staking-ui-7:not(#s7) #workspace :is(.staking-mode-intro, #stakingPQMobileNote) p { color: var(--atlas-muted) !important; }

  /* esportazioni: in fondo al contenuto, griglia 2 colonne da 44 px */
  body.staking-ui-7:not(#s7) #workspace #stakingExportFooter {
    position: static !important; flex: 0 0 auto !important; display: block !important; z-index: auto !important;
    padding: 12px 16px calc(16px + env(safe-area-inset-bottom, 0px)) !important; margin: 0 !important;
    background: var(--atlas-surface) !important; border: 0 !important; border-top: 1px solid var(--atlas-line) !important; box-shadow: none !important;
  }
  body.staking-ui-7:not(#s7) #workspace #stakingExportFooter[hidden] { display: none !important; }
  body.staking-ui-7:not(#s7) #workspace #stakingExportFooter .exportbar {
    display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 8px !important;
    padding: 0 !important; margin: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important;
  }
  body.staking-ui-7:not(#s7) #workspace #stakingExportFooter .exportbar > button {
    width: 100% !important; min-height: 44px !important; height: auto !important; padding: 0 10px !important; margin: 0 !important;
    border: 1px solid var(--atlas-line-strong) !important; border-radius: 10px !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; order: 2;
  }
  body.staking-ui-7:not(#s7) #workspace #stakingExportFooter #pdfBtn { order: 1 !important; grid-column: 1 / -1 !important; background: var(--atlas-green) !important; border-color: var(--atlas-green) !important; color: #102004 !important; }
  body.staking-ui-7:not(#s7) #workspace #stakingExportFooter #importCsvBtn { order: 3 !important; }

  /* registrazione GPS attiva: pillola sopra la barra quando il pannello è ridotto */
  body.staking-ui-7:not(#s7) #stakingRecordingStatus:not([hidden]) {
    min-height: 44px !important; border-radius: 999px !important; background: #d93c3c !important; color: #fff !important;
    font: 700 13px/1 var(--atlas-font-ui) !important; border: 0 !important; box-shadow: var(--atlas-shadow-pop) !important;
  }
  body.staking-ui-7.staking-workspace-collapsed:not(#s7) #stakingRecordingStatus:not([hidden]) {
    position: fixed !important; left: 50% !important; transform: translateX(-50%) !important; bottom: calc(var(--stk-dock) + 12px) !important; z-index: 4800 !important;
    padding: 0 18px !important;
  }

  /* ---------- Livelli: stessa scheda dal basso ---------- */
  body.staking-ui-7:not(#s7) #layercard.mobile-open {
    position: fixed !important; left: 0 !important; right: 0 !important; top: auto !important; bottom: var(--stk-dock) !important;
    z-index: 3700 !important; width: 100% !important; max-width: none !important; height: auto !important;
    max-height: min(58dvh, calc(100dvh - 56px - var(--stk-dock) - 72px)) !important; overflow-y: auto !important; transform: none !important;
    display: block !important; padding: 12px 16px 16px !important; margin: 0 !important; box-sizing: border-box !important;
    background: var(--atlas-surface) !important; color: var(--atlas-ink) !important;
    border: 0 !important; border-top: 1px solid var(--atlas-line) !important; border-radius: 16px 16px 0 0 !important;
    box-shadow: 0 -10px 30px rgba(15, 33, 55, .16) !important;
  }
  body.staking-ui-7:not(#s7) #layercard.mobile-open :is(.cardtitle) { color: var(--atlas-muted) !important; }
  body.staking-ui-7:not(#s7) #layercard.mobile-open .layercard-head .cardtitle { color: var(--atlas-ink) !important; font: 600 17px/1.2 var(--atlas-font-ui) !important; text-transform: none !important; letter-spacing: 0 !important; }
  body.staking-ui-7:not(#s7) #layercard.mobile-open :is(details, .atlas-catasto-card, .atlas-staking-taf, .atlas-project-launcher) {
    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.staking-ui-7:not(#s7) #layercard.mobile-open :is(summary, label, h3, strong, b) { color: var(--atlas-ink) !important; }
  body.staking-ui-7:not(#s7) #layercard.mobile-open :is(p, em, small) { color: var(--atlas-muted) !important; }
  body.staking-ui-7:not(#s7) #layercard.mobile-open label { min-height: 44px !important; }
  body.staking-ui-7:not(#s7) #layercard.mobile-open .basemap-switch { background: var(--atlas-surface-2) !important; border: 1px solid var(--atlas-line) !important; border-radius: 10px !important; padding: 4px !important; }
  body.staking-ui-7:not(#s7) #layercard.mobile-open .basemap-switch button { min-height: 40px !important; border: 0 !important; background: transparent !important; color: var(--atlas-muted) !important; border-radius: 7px !important; box-shadow: none !important; }
  body.staking-ui-7:not(#s7) #layercard.mobile-open .basemap-switch button.active { background: var(--atlas-surface) !important; color: var(--atlas-ink) !important; box-shadow: inset 0 -2px var(--atlas-orange) !important; }
  body.staking-ui-7:not(#s7) #layercard.mobile-open .atlas-project-launcher button { 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; }
  body.staking-ui-7:not(#s7) #layercard.mobile-open #closeLayersBtn { display: none !important; }

  /* ---------- finestre (acquisizione GPS, coordinate, introduzione) ---------- */
  body.staking-ui-7:not(#s7) :is(#precisionModal, #editModal, #intro) .modalcard {
    background: var(--atlas-surface) !important; color: var(--atlas-ink) !important; border: 1px solid var(--atlas-line) !important;
  }
  body.staking-ui-7:not(#s7) :is(#precisionModal, #editModal, #intro) .modalactions button { min-height: 44px !important; }
  body.staking-ui-7:not(#s7) #precisionChoice button { min-height: 56px !important; }
}

@media (max-width: 767px), (max-width: 900px) and (pointer: fine), (min-width: 768px) and (max-width: 1366px) and (pointer: coarse) {
  /* zoom +/−: il CSS legacy li disegnava come quadrati navy */
  body.staking-ui-7:not(#s7) .maptools .atlas-mobile-map-zoom :is(#stakingZoomIn, #stakingZoomOut) {
    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: 8px !important;
    background: transparent !important; color: var(--atlas-ink) !important; box-shadow: none !important;
    font: 400 24px/1 var(--atlas-font-ui) !important;
  }
  body.staking-ui-7:not(#s7) .maptools .atlas-mobile-map-zoom :is(#stakingZoomIn, #stakingZoomOut):active { background: var(--atlas-hover) !important; }
  /* campo coordinate: altezza normale */
  body.staking-ui-7:not(#s7) #workspace #coordInput { height: 48px !important; max-height: 48px !important; }
  body.staking-ui-7:not(#s7) #workspace .mobile-quick-hint { margin: 0 0 12px !important; color: var(--atlas-muted) !important; font-size: 12.5px !important; }
}
@media (max-width: 767px), (max-width: 900px) and (pointer: fine), (min-width: 768px) and (max-width: 1366px) and (pointer: coarse) {
  body.staking-ui-7:not(#s7) .maptools #atlasLocateBtn svg,
  body.staking-ui-7:not(#s7) .maptools #atlasLocateBtn svg * { stroke: var(--atlas-orange) !important; opacity: 1 !important; }
  body.staking-ui-7:not(#s7) .maptools #atlasLocateBtn svg circle[fill="currentColor"] { fill: var(--atlas-orange) !important; }
  body.staking-ui-7:not(#s7) .maptools #stakingAttributionToggle svg * { stroke: var(--atlas-muted) !important; }
}
@media (max-width: 767px), (max-width: 900px) and (pointer: fine), (min-width: 768px) and (max-width: 1366px) and (pointer: coarse) {
  /* una scheda = un metodo, anche tra 601 e 900 px */
  body.staking-ui-7:not(#s7) #workspace[data-staking-view="position"] :is(.addrow, .mobile-quick-hint) { display: none !important; }
  body.staking-ui-7:not(#s7) #workspace[data-staking-view="coordinates"] .field-actions-card { display: none !important; }
}
@media (max-width: 767px), (max-width: 900px) and (pointer: fine), (min-width: 768px) and (max-width: 1366px) and (pointer: coarse) {
  body.staking-ui-7:not(#s7) #workspace .addrow {
    display: flex !important; flex-direction: column !important; align-items: stretch !important; justify-content: flex-start !important;
    grid-template-columns: none !important; height: auto !important; min-height: 0 !important; padding: 0 !important;
  }
  body.staking-ui-7:not(#s7) #workspace .addrow > * {
    width: 100% !important; max-width: none !important; margin: 0 !important; flex: 0 0 auto !important;
    position: static !important; float: none !important; grid-column: auto !important; align-self: stretch !important;
  }
  body.staking-ui-7:not(#s7) #workspace .addrow .staking-coordinate-field { align-items: stretch !important; text-align: left !important; }
}

/* =========================================================================
   7) Navigazione ai picchetti (tutte le larghezze) — stile dei pulsanti del
   pannello: niente pulsante navy pieno e pin rosso.
   ========================================================================= */
body.staking-ui-7:not(#s7) #workspace .livecard {
  padding: 12px !important; margin: 0 0 12px !important;
  background: var(--atlas-surface-2) !important; color: var(--atlas-ink) !important;
  border: 1px solid var(--atlas-line) !important; border-radius: 10px !important; box-shadow: none !important;
}
body.staking-ui-7:not(#s7) #workspace .livecard > .cardtitle {
  margin: 0 0 8px !important; color: var(--atlas-muted) !important;
  font: 700 11px/1.2 var(--atlas-font-ui) !important; letter-spacing: 1px !important; text-transform: uppercase !important;
}
body.staking-ui-7:not(#s7) #workspace #liveToggle {
  display: flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important;
  width: 100% !important; min-height: 44px !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 14px/1.2 var(--atlas-font-ui) !important; cursor: pointer;
}
body.staking-ui-7:not(#s7) #workspace #liveToggle .stk-live-ico { display: inline-grid !important; place-items: center !important; width: 18px !important; height: 18px !important; color: var(--atlas-orange) !important; }
body.staking-ui-7:not(#s7) #workspace #liveToggle svg { width: 18px !important; height: 18px !important; fill: none !important; stroke: currentColor !important; stroke-width: 2 !important; stroke-linecap: round !important; stroke-linejoin: round !important; }
body.staking-ui-7:not(#s7) #workspace #liveToggle:hover { background: var(--atlas-hover) !important; }
body.staking-ui-7:not(#s7) #workspace #liveToggle.active {
  background: rgba(243, 146, 0, .12) !important; border-color: var(--atlas-orange) !important; color: var(--atlas-orange-ink) !important;
}
body.staking-ui-7:not(#s7) #workspace #liveToggle:focus-visible { outline: 2px solid var(--atlas-cyan) !important; outline-offset: 2px !important; }
body.staking-ui-7:not(#s7) #workspace .livelist .livehint { margin: 8px 0 0 !important; color: var(--atlas-muted) !important; font-size: 12.5px !important; }
body.staking-ui-7:not(#s7) #workspace .livelist .liverow {
  display: flex !important; align-items: center !important; gap: 8px !important; padding: 8px 0 !important; border-bottom: 1px solid var(--atlas-line) !important;
}
body.staking-ui-7:not(#s7) #workspace .livelist .liverow :is(.liverow-id, .liverow-dist, .liverow-az) { color: var(--atlas-ink) !important; font-family: var(--atlas-font-mono) !important; }
body.staking-ui-7:not(#s7) #workspace .livelist .liverow-actions { margin-left: auto !important; display: flex !important; gap: 6px !important; }
body.staking-ui-7:not(#s7) #workspace .livelist .liverow-actions button {
  min-height: 36px !important; padding: 0 12px !important; border: 1px solid var(--atlas-orange) !important; border-radius: 8px !important;
  background: transparent !important; color: var(--atlas-orange-ink) !important; font: 600 12px/1 var(--atlas-font-ui) !important;
}
@media (max-width: 767px), (max-width: 900px) and (pointer: fine), (min-width: 768px) and (max-width: 1366px) and (pointer: coarse) {
  body.staking-ui-7:not(#s7) #workspace .livelist .liverow-actions button { min-height: 44px !important; }
}

/* =========================================================================
   8) Piano quotato su desktop: pannello compatto accanto alla rail.
   Le cinque schede non stavano in 460 px ("Piano quotato" tagliato):
   pannello a 560 px (resta ampia la mappa per disegnare il contorno) e
   schede più compatte; sotto i 1180 px scorrono e la scheda attiva resta in vista.
   ========================================================================= */
@media (min-width: 901px), (min-width: 768px) and (pointer: coarse) {
  body.staking-ui-7:not(#s7) #workspace[data-staking-view="pq"] {
    left: 72px !important; top: 64px !important; transform: none !important;
    width: min(560px, calc(100vw - 440px)) !important; min-width: 420px !important;
  }
  body.staking-ui-7:not(#s7) #workspace[data-staking-view="pq"] .staking-workflow-tabs { padding: 0 12px !important; gap: 0 !important; }
  body.staking-ui-7:not(#s7) #workspace[data-staking-view="pq"] .staking-workflow-tabs button { padding: 0 9px !important; font-size: 12.5px !important; }
  /* indicazione di scorrimento quando le schede non ci stanno */
  body.staking-ui-7:not(#s7) #workspace .staking-workflow-tabs.stk-overflow {
    -webkit-mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 28px), transparent 100%);
            mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 28px), transparent 100%);
  }
  body.staking-ui-7:not(#s7) #workspace .staking-workflow-tabs.stk-overflow.stk-at-end {
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 28px, #000 100%);
            mask-image: linear-gradient(90deg, transparent 0, #000 28px, #000 100%);
  }
}

/* =========================================================================
   9) NAVIGAZIONE AI PICCHETTI e REALTÀ AUMENTATA
   Card nello stile dell'app (Light: bianca, Field: scura), distanza grande,
   precisione GPS come indicatore colorato leggibile:
     Ottima ≤ 3 m (verde) · Buona ≤ 8 m (arancio) · Bassa > 8 m (rosso).
   Soglie, calcoli e testi restano quelli di staking.js; staking-shell-7.js
   aggiunge solo il livello (data-q) e la barra (--stk-prec) al contenitore.
   ========================================================================= */
body.staking-ui-7:not(#s7) {
  --stk-good: #2f9e44; --stk-medium: #d9480f; --stk-low: #d62828;
}
html[data-atlas-theme="dark"] body.staking-ui-7:not(#s7) {
  --stk-good: #69db7c; --stk-medium: #ffa94d; --stk-low: #ff6b6b;
}

/* ---------- indicatore di precisione (condiviso) ---------- */
body.staking-ui-7:not(#s7) :is(#navPrecision, #arPrecision).gnssprecision {
  display: grid !important; grid-template-columns: 1fr !important; gap: 6px !important;
  margin: 0 !important; padding: 10px 12px 12px !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-line-strong) !important;
  border-radius: 10px !important; text-align: left !important; box-shadow: none !important;
}
body.staking-ui-7:not(#s7) :is(#navPrecision, #arPrecision).gnssprecision > span {
  display: block !important; color: var(--atlas-ink) !important; opacity: 1 !important;
  font: 700 15px/1.3 var(--atlas-font-ui) !important; letter-spacing: 0 !important;
}
body.staking-ui-7:not(#s7) :is(#navPrecision, #arPrecision).gnssprecision > small {
  display: block !important; color: var(--atlas-muted) !important; opacity: 1 !important;
  font: 400 11.5px/1.35 var(--atlas-font-ui) !important;
}
body.staking-ui-7:not(#s7) :is(#navPrecision, #arPrecision).gnssprecision::after {
  content: "" !important; display: block !important; order: 2; height: 6px !important; border-radius: 6px !important;
  background: linear-gradient(90deg, var(--stk-q, var(--atlas-line-strong)) 0 var(--stk-prec, 0%), var(--atlas-line) var(--stk-prec, 0%) 100%) !important;
}
body.staking-ui-7:not(#s7) :is(#navPrecision, #arPrecision)[data-q="good"] { --stk-q: var(--stk-good); border-left-color: var(--stk-good) !important; }
body.staking-ui-7:not(#s7) :is(#navPrecision, #arPrecision)[data-q="medium"] { --stk-q: var(--stk-medium); border-left-color: var(--stk-medium) !important; }
body.staking-ui-7:not(#s7) :is(#navPrecision, #arPrecision)[data-q="low"] { --stk-q: var(--stk-low); border-left-color: var(--stk-low) !important; }
body.staking-ui-7:not(#s7) :is(#navPrecision, #arPrecision)[data-q="good"] > span { color: var(--stk-good) !important; }
body.staking-ui-7:not(#s7) :is(#navPrecision, #arPrecision)[data-q="medium"] > span { color: var(--stk-medium) !important; }
body.staking-ui-7:not(#s7) :is(#navPrecision, #arPrecision)[data-q="low"] > span { color: var(--stk-low) !important; }
body.staking-ui-7:not(#s7) :is(#navPrecision, #arPrecision) :is(.precision-good, .precision-medium, .precision-low) { color: inherit !important; }

/* ---------- pannello Naviga (sulla mappa) ---------- */
body.staking-ui-7:not(#s7) #navPanel {
  position: fixed !important; left: 50% !important; right: auto !important; z-index: 4700 !important;
  bottom: 44px !important; width: min(560px, calc(100vw - 24px)) !important; box-sizing: border-box !important;
  display: grid !important; grid-template-columns: 76px minmax(0, 1fr) !important; grid-template-rows: auto auto !important;
  gap: 12px 14px !important; align-items: center !important; padding: 14px !important;
  background: var(--atlas-surface) !important; color: var(--atlas-ink) !important;
  border: 1px solid var(--atlas-line) !important; border-radius: 14px !important;
  box-shadow: 0 18px 44px rgba(15, 33, 55, .28) !important;
  transform: translate(-50%, 160%) !important; transition: transform .22s ease !important;
}
body.staking-ui-7:not(#s7) #navPanel.show { transform: translate(-50%, 0) !important; }
body.staking-ui-7:not(#s7) #navPanel .compass {
  position: relative !important; grid-row: 1 !important; width: 76px !important; height: 76px !important; margin: 0 !important;
  border-radius: 50% !important; background: var(--atlas-surface-2) !important;
  border: 2px solid var(--atlas-line-strong) !important; box-shadow: inset 0 0 0 6px var(--atlas-surface) !important;
}
body.staking-ui-7:not(#s7) #navPanel .compass::before {
  content: "N" !important; position: absolute !important; top: 5px !important; left: 50% !important; transform: translateX(-50%) !important;
  color: var(--atlas-muted) !important; font: 700 10px/1 var(--atlas-font-ui) !important;
}
body.staking-ui-7:not(#s7) #navPanel #navArrow {
  position: absolute !important; left: 50% !important; top: 50% !important; transform-origin: 50% 85% !important;
  color: var(--atlas-orange) !important; font: 800 34px/1 var(--atlas-font-ui) !important; text-shadow: none !important;
}
body.staking-ui-7:not(#s7) #navPanel .navinfo { grid-row: 1 !important; display: flex !important; flex-direction: column !important; gap: 2px !important; min-width: 0 !important; }
body.staking-ui-7:not(#s7) #navPanel #navTitle { color: var(--atlas-muted) !important; font: 700 11px/1.2 var(--atlas-font-ui) !important; letter-spacing: 1px !important; text-transform: uppercase !important; }
body.staking-ui-7:not(#s7) #navPanel #navDistance { color: var(--atlas-ink) !important; font: 700 32px/1.1 var(--atlas-font-mono) !important; letter-spacing: -.5px !important; }
body.staking-ui-7:not(#s7) #navPanel #navMeta { color: var(--atlas-ink) !important; font: 500 13px/1.35 var(--atlas-font-ui) !important; opacity: .9 !important; }
body.staking-ui-7:not(#s7) #navPanel #navPrecision { grid-column: 1 / -1 !important; grid-row: 2 !important; margin-top: 2px !important; }
body.staking-ui-7:not(#s7) #navPanel .navinfo #navPrecision { margin-top: 8px !important; }
body.staking-ui-7:not(#s7) #navPanel > button {
  min-height: 44px !important; padding: 0 16px !important; margin: 0 !important; border-radius: 10px !important;
  font: 700 14px/1 var(--atlas-font-ui) !important; box-shadow: none !important;
}
body.staking-ui-7:not(#s7) #navPanel #navCenter { background: var(--atlas-surface-2) !important; color: var(--atlas-ink) !important; border: 1px solid var(--atlas-line-strong) !important; }
body.staking-ui-7:not(#s7) #navPanel #navStop { background: transparent !important; color: var(--atlas-danger) !important; border: 1px solid var(--atlas-danger) !important; }
body.staking-ui-7:not(#s7) #navPanel .stk-nav-actions { grid-column: 1 / -1 !important; display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 8px !important; }
@media (max-width: 767px), (max-width: 900px) and (pointer: fine), (min-width: 768px) and (max-width: 1366px) and (pointer: coarse) {
  body.staking-ui-7:not(#s7) #navPanel { bottom: calc(var(--stk-dock) + 10px) !important; width: calc(100vw - 16px) !important; grid-template-columns: 64px minmax(0, 1fr) !important; padding: 12px !important; }
  body.staking-ui-7:not(#s7) #navPanel .compass { width: 64px !important; height: 64px !important; }
  body.staking-ui-7:not(#s7) #navPanel #navDistance { font-size: 28px !important; }
  body.staking-ui-7:not(#s7) #navPanel #navCenter { display: inline-flex !important; align-items: center !important; justify-content: center !important; }
}

/* ---------- Realtà aumentata ---------- */
body.staking-ui-7:not(#s7) #arOverlay { background: #000 !important; z-index: 9500 !important; }
body.staking-ui-7:not(#s7) #arOverlay .arshade { background: linear-gradient(180deg, rgba(0,0,0,.35) 0, transparent 22%, transparent 60%, rgba(0,0,0,.45) 100%) !important; }
body.staking-ui-7:not(#s7) #arOverlay .arhead {
  position: absolute !important; top: calc(env(safe-area-inset-top, 0px) + 12px) !important; left: 12px !important; right: 12px !important;
  display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 10px !important;
  padding: 8px 8px 8px 14px !important; box-sizing: border-box !important;
  background: color-mix(in srgb, var(--atlas-surface) 92%, transparent) !important; color: var(--atlas-ink) !important;
  border: 1px solid var(--atlas-line) !important; border-radius: 14px !important; box-shadow: 0 10px 30px rgba(0,0,0,.28) !important;
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
}
body.staking-ui-7:not(#s7) #arOverlay #arTitle { color: var(--atlas-ink) !important; font: 700 15px/1.25 var(--atlas-font-ui) !important; }
body.staking-ui-7:not(#s7) #arOverlay #arClose {
  display: grid !important; place-items: center !important; width: 44px !important; height: 44px !important; flex: 0 0 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; font: 400 26px/1 var(--atlas-font-ui) !important;
}
/* mirino al centro dello schermo */
body.staking-ui-7:not(#s7) #arOverlay .stk-ar-reticle {
  position: absolute; left: 50%; top: 42%; width: 64px; height: 64px; transform: translate(-50%, -50%); pointer-events: none;
  border: 2px solid rgba(255, 255, 255, .7); border-radius: 50%; box-shadow: 0 0 0 1px rgba(0,0,0,.25);
}
body.staking-ui-7:not(#s7) #arOverlay .stk-ar-reticle::before,
body.staking-ui-7:not(#s7) #arOverlay .stk-ar-reticle::after { content: ""; position: absolute; background: rgba(255, 255, 255, .8); }
body.staking-ui-7:not(#s7) #arOverlay .stk-ar-reticle::before { left: 50%; top: -10px; bottom: -10px; width: 2px; transform: translateX(-50%); }
body.staking-ui-7:not(#s7) #arOverlay .stk-ar-reticle::after { top: 50%; left: -10px; right: -10px; height: 2px; transform: translateY(-50%); }
/* segnaposto del picchetto (sostituisce l'emoji) */
body.staking-ui-7:not(#s7) #arOverlay #arFlag {
  position: absolute !important; top: 42% !important; transform: translate(-50%, -100%) !important;
  display: flex !important; flex-direction: column !important; align-items: center !important; gap: 6px !important;
  font-size: 0 !important; line-height: 0 !important; transition: left .2s ease !important; filter: drop-shadow(0 6px 14px rgba(0,0,0,.45));
}
body.staking-ui-7:not(#s7) #arOverlay #arFlag .stk-ar-pin { display: block; width: 58px; height: 72px; order: 2; }
body.staking-ui-7:not(#s7) #arOverlay #arFlagText {
  order: 1; display: block !important; padding: 6px 12px !important; border-radius: 999px !important;
  background: #f39200 !important; color: #1a1205 !important; font: 800 14px/1.2 var(--atlas-font-mono) !important; white-space: nowrap !important;
}
/* pannello dati in basso */
body.staking-ui-7:not(#s7) #arOverlay .arhud {
  position: absolute !important; left: 12px !important; right: 12px !important; bottom: calc(env(safe-area-inset-bottom, 0px) + 14px) !important;
  display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 8px !important;
  padding: 14px !important; box-sizing: border-box !important; text-align: left !important;
  background: color-mix(in srgb, var(--atlas-surface) 94%, transparent) !important; color: var(--atlas-ink) !important;
  border: 1px solid var(--atlas-line) !important; border-radius: 16px !important; box-shadow: 0 14px 40px rgba(0,0,0,.35) !important;
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  max-width: 560px; margin: 0 auto !important;
}
body.staking-ui-7:not(#s7) #arOverlay #arDistance { color: var(--atlas-ink) !important; font: 800 40px/1 var(--atlas-font-mono) !important; letter-spacing: -1px !important; }
body.staking-ui-7:not(#s7) #arOverlay #arMeta { color: var(--atlas-ink) !important; font: 600 14px/1.35 var(--atlas-font-ui) !important; opacity: 1 !important; }
body.staking-ui-7:not(#s7) #arOverlay .arhud > small { color: var(--atlas-muted) !important; font: 400 11.5px/1.35 var(--atlas-font-ui) !important; opacity: 1 !important; }
body.staking-ui-7:not(#s7) #navPanel .compass { display: block !important; grid-column: 1 !important; align-self: start !important; }
body.staking-ui-7:not(#s7) #navPanel .navinfo { grid-column: 2 !important; }
body.staking-ui-7:not(#s7) #navPanel #navCenter,
body.staking-ui-7:not(#s7) #navPanel #navStop { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; }

/* =========================================================================
   10) "Vai ai picchetti" — la fase sul terreno ben visibile
   ========================================================================= */
body.staking-ui-7:not(#s7) #workspace .livecard.stk-go-card {
  padding: 14px !important; margin: 0 0 14px !important;
  background: rgba(243, 146, 0, .08) !important; color: var(--atlas-ink) !important;
  border: 1px solid color-mix(in srgb, var(--atlas-orange) 45%, var(--atlas-line)) !important;
  border-left: 4px solid var(--atlas-orange) !important; border-radius: 12px !important;
}
body.staking-ui-7:not(#s7) #workspace .stk-go-head { display: flex !important; align-items: center !important; gap: 12px !important; margin: 0 0 12px !important; }
body.staking-ui-7:not(#s7) #workspace .stk-go-icon {
  display: grid; place-items: center; flex: 0 0 40px; width: 40px; height: 40px; border-radius: 10px;
  background: #f39200; color: #1a1205;
}
body.staking-ui-7:not(#s7) #workspace .stk-go-icon svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
body.staking-ui-7:not(#s7) #workspace .stk-go-head > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1 1 auto; }
body.staking-ui-7:not(#s7) #workspace .stk-go-head strong { color: var(--atlas-ink); font: 700 15px/1.25 var(--atlas-font-ui); }
body.staking-ui-7:not(#s7) #workspace .stk-go-head small { color: var(--atlas-muted); font: 400 12.5px/1.35 var(--atlas-font-ui); }
body.staking-ui-7:not(#s7) #workspace .stk-go-count {
  flex: 0 0 auto; min-width: 28px; height: 28px; padding: 0 8px; box-sizing: border-box; display: grid; place-items: center;
  border-radius: 999px; background: var(--atlas-surface); border: 1px solid var(--atlas-line-strong);
  color: var(--atlas-ink); font: 700 13px/1 var(--atlas-font-mono);
}
/* pulsante principale: arancio pieno come "Acquisisci posizione" */
body.staking-ui-7:not(#s7) #workspace .stk-go-card #liveToggle {
  min-height: 44px !important; border: 0 !important; background: #f39200 !important; color: #1a1205 !important; font-weight: 700 !important;
}
body.staking-ui-7:not(#s7) #workspace .stk-go-card #liveToggle .stk-live-ico { color: #1a1205 !important; }
body.staking-ui-7:not(#s7) #workspace .stk-go-card #liveToggle:hover { background: #e08700 !important; }
body.staking-ui-7:not(#s7) #workspace .stk-go-card #liveToggle.active {
  background: var(--atlas-surface) !important; color: var(--atlas-orange-ink) !important; border: 1px solid var(--atlas-orange) !important;
}
body.staking-ui-7:not(#s7) #workspace .stk-go-card #liveToggle.active .stk-live-ico { color: var(--atlas-orange) !important; }
body.staking-ui-7:not(#s7) #workspace .stk-go-card #liveToggle:disabled { background: var(--atlas-surface) !important; color: var(--atlas-muted) !important; border: 1px dashed var(--atlas-line-strong) !important; cursor: not-allowed !important; }
body.staking-ui-7:not(#s7) #workspace .stk-go-card #liveToggle:disabled .stk-live-ico { color: var(--atlas-muted) !important; }
body.staking-ui-7:not(#s7) #workspace .stk-go-card.is-empty .livelist { display: none !important; }
body.staking-ui-7:not(#s7) #workspace .stk-go-card .livelist .liverow { border-bottom-color: color-mix(in srgb, var(--atlas-orange) 20%, var(--atlas-line)) !important; }
body.staking-ui-7:not(#s7) #workspace .stk-go-card .liverow-go { background: #f39200 !important; color: #1a1205 !important; border-color: #f39200 !important; }

/* tabella picchetti: ⌖ diventa "Vai", AR come chip, modifica neutra */
body.staking-ui-7:not(#s7) #workspace .pointlist td.rowactions { white-space: nowrap !important; }
body.staking-ui-7:not(#s7) #workspace .pointlist .rowactions button {
  min-height: 32px !important; min-width: 0 !important; padding: 0 10px !important; margin: 0 0 0 4px !important;
  border-radius: 8px !important; font: 700 12px/1 var(--atlas-font-ui) !important; box-shadow: none !important;
}
body.staking-ui-7:not(#s7) #workspace .pointlist .rowactions .navbtn { font-size: 0 !important; background: #f39200 !important; color: #1a1205 !important; border: 0 !important; }
body.staking-ui-7:not(#s7) #workspace .pointlist .rowactions .navbtn::before { content: "Vai"; font: 700 12px/1 var(--atlas-font-ui); }
body.staking-ui-7:not(#s7) #workspace .pointlist .rowactions .arbtn { background: transparent !important; color: var(--atlas-orange-ink) !important; border: 1px solid var(--atlas-orange) !important; }
body.staking-ui-7:not(#s7) #workspace .pointlist .rowactions [data-e] { background: var(--atlas-surface) !important; color: var(--atlas-ink) !important; border: 1px solid var(--atlas-line-strong) !important; }
@media (max-width: 767px), (max-width: 900px) and (pointer: fine), (min-width: 768px) and (max-width: 1366px) and (pointer: coarse) {
  body.staking-ui-7:not(#s7) #workspace .pointlist .rowactions button { min-height: 40px !important; padding: 0 12px !important; }
}

/* popup del picchetto sulla mappa: Naviga in evidenza */
body.staking-ui-7:not(#s7) .leaflet-popup .popupactions { display: flex !important; flex-wrap: wrap !important; gap: 6px !important; margin-top: 8px !important; }
body.staking-ui-7:not(#s7) .leaflet-popup .popupactions button {
  min-height: 36px !important; padding: 0 12px !important; border-radius: 8px !important; font: 600 12px/1 var(--atlas-font-ui) !important;
  background: #fff !important; color: #1a1d24 !important; border: 1px solid #d2d2ca !important; box-shadow: none !important;
}
body.staking-ui-7:not(#s7) .leaflet-popup .popupactions button.main { background: #f39200 !important; color: #1a1205 !important; border-color: #f39200 !important; font-weight: 700 !important; }
body.staking-ui-7:not(#s7) .leaflet-popup .popupactions button.ar { color: #995700 !important; border-color: #f39200 !important; }

/* pulsante sulla mappa (telefono/tablet, pannello ridotto) */
body.staking-ui-7:not(#s7) .stk-go-fab[hidden] { display: none !important; }
@media (max-width: 767px), (max-width: 900px) and (pointer: fine), (min-width: 768px) and (max-width: 1366px) and (pointer: coarse) {
  body.staking-ui-7:not(#s7) .stk-go-fab {
    position: fixed; left: 50%; transform: translateX(-50%); bottom: calc(var(--stk-dock) + 14px); z-index: 4600;
    display: inline-flex; align-items: center; gap: 10px; min-height: 48px; padding: 0 8px 0 18px;
    border: 0; border-radius: 999px; background: #f39200; color: #1a1205;
    font: 700 15px/1 var(--atlas-font-ui); box-shadow: 0 10px 26px rgba(15, 33, 55, .35); cursor: pointer; white-space: nowrap;
  }
  body.staking-ui-7:not(#s7) .stk-go-fab svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
  body.staking-ui-7:not(#s7) .stk-go-fab b { min-width: 30px; height: 32px; padding: 0 8px; box-sizing: border-box; display: grid; place-items: center; border-radius: 999px; background: #1a1205; color: #f39200; font: 700 13px/1 var(--atlas-font-mono); }
  body.staking-ui-7:not(#s7) .stk-go-fab:focus-visible { outline: 3px solid var(--atlas-cyan); outline-offset: 3px; }
  /* la pillola della registrazione GPS sale sopra, se entrambe visibili */
  body.staking-ui-7.staking-workspace-collapsed:not(#s7) #stakingRecordingStatus:not([hidden]) ~ .stk-go-fab { bottom: calc(var(--stk-dock) + 70px); }
}


/* =========================================================================
   11) Funzioni GPS solo sul campo — avviso su computer (come il Piano quotato
   su telefono). body.stk-no-gps è impostato da staking-shell-7.js.
   ========================================================================= */
body.staking-ui-7:not(#s7) .stk-gps-note { display: none; }
body.staking-ui-7.stk-no-gps:not(#s7) .stk-gps-note {
  display: flex; align-items: flex-start; gap: 12px; margin: 0 0 12px; padding: 14px;
  background: var(--atlas-surface-2); color: var(--atlas-ink);
  border: 1px solid var(--atlas-line); border-left: 4px solid var(--atlas-orange); border-radius: 10px;
}
body.staking-ui-7.stk-no-gps:not(#s7) .stk-gps-note__icon {
  display: grid; place-items: center; flex: 0 0 40px; width: 40px; height: 40px; border-radius: 10px;
  background: rgba(243, 146, 0, .14); color: var(--atlas-orange);
}
body.staking-ui-7.stk-no-gps:not(#s7) .stk-gps-note__icon svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
body.staking-ui-7.stk-no-gps:not(#s7) .stk-gps-note__body { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
body.staking-ui-7.stk-no-gps:not(#s7) .stk-gps-note__body strong { color: var(--atlas-ink); font: 700 14px/1.3 var(--atlas-font-ui); }
body.staking-ui-7.stk-no-gps:not(#s7) .stk-gps-note__body p { margin: 0; color: var(--atlas-muted); font: 400 13px/1.45 var(--atlas-font-ui); }
body.staking-ui-7.stk-no-gps:not(#s7) .stk-gps-note__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 8px; }
body.staking-ui-7.stk-no-gps:not(#s7) .stk-gps-note__primary {
  min-height: 36px; padding: 0 14px; border: 0; border-radius: 8px; background: #f39200; color: #1a1205;
  font: 700 13px/1 var(--atlas-font-ui); cursor: pointer;
}
body.staking-ui-7.stk-no-gps:not(#s7) .stk-gps-note__anyway {
  min-height: 36px; padding: 0 4px; border: 0; background: transparent; color: var(--atlas-muted);
  font: 500 12.5px/1 var(--atlas-font-ui); text-decoration: underline; cursor: pointer;
}
body.staking-ui-7.stk-no-gps:not(#s7) .stk-gps-note--compact { margin: 0; padding: 10px 12px; }
body.staking-ui-7.stk-no-gps:not(#s7) .stk-gps-note--compact .stk-gps-note__icon { display: none; }
body.staking-ui-7.stk-no-gps:not(#s7) :is(.stk-gps-note__primary, .stk-gps-note__anyway):focus-visible { outline: 2px solid var(--atlas-cyan); outline-offset: 2px; }

/* controlli GPS nascosti (restano nel DOM con i loro handler) */
body.staking-ui-7.stk-no-gps:not(#s7) #workspace .field-actions-card > :not(.stk-gps-note),
body.staking-ui-7.stk-no-gps:not(#s7) #stakingTracePane > :not(.stk-gps-note),
body.staking-ui-7.stk-no-gps:not(#s7) #workspace .stk-go-card > :not(.stk-go-head):not(.stk-gps-note),
body.staking-ui-7.stk-no-gps:not(#s7) #workspace .pointlist .rowactions :is(.navbtn, .arbtn),
body.staking-ui-7.stk-no-gps:not(#s7) .leaflet-popup .popupactions :is(button.main, button.ar) { display: none !important; }
body.staking-ui-7.stk-no-gps:not(#s7) #workspace .stk-go-card { background: var(--atlas-surface-2) !important; border-left-color: var(--atlas-line-strong) !important; border-color: var(--atlas-line) !important; }
body.staking-ui-7.stk-no-gps:not(#s7) #workspace .stk-go-card .stk-go-icon { background: var(--atlas-line); color: var(--atlas-muted); }
body.staking-ui-7.stk-no-gps:not(#s7) #workspace .stk-go-card .stk-go-head small { display: none; }
/* scheda Tracciamento con indicatore rosso (REC) ancora leggibile */
body.staking-ui-7.stk-no-gps:not(#s7) #workspace .staking-workflow-tabs :is([data-staking-view="position"], [data-staking-view="trace"])::after {
  content: ""; display: inline-block; width: 12px; height: 12px; margin-left: 6px; vertical-align: -1px; opacity: .55;
  background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235a6270' stroke-width='2' stroke-linecap='round'%3E%3Crect x='6' y='2.5' width='12' height='19' rx='2.5'/%3E%3Cpath d='M10.5 18.5h3'/%3E%3C/svg%3E");
}
body.staking-ui-7.stk-no-gps:not(#s7) #workspace .stk-go-card :is(#liveToggle, #liveList) { display: none !important; }
body.staking-ui-7.stk-no-gps:not(#s7) #workspace .stk-gps-note .stk-gps-note__primary {
  display: inline-flex !important; align-items: center !important; min-height: 36px !important; padding: 0 14px !important;
  border: 0 !important; border-radius: 8px !important; background: #f39200 !important; color: #1a1205 !important;
  font: 700 13px/1 var(--atlas-font-ui) !important; box-shadow: none !important;
}
body.staking-ui-7.stk-no-gps:not(#s7) #workspace .stk-gps-note .stk-gps-note__anyway {
  min-height: 36px !important; padding: 0 4px !important; border: 0 !important; background: transparent !important;
  color: var(--atlas-muted) !important; font: 500 12.5px/1 var(--atlas-font-ui) !important; text-decoration: underline !important; box-shadow: none !important;
}

/* =========================================================================
   12) "Vai al più vicino" e ritorno alla Mappa
   ========================================================================= */
body.staking-ui-7:not(#s7) #workspace .stk-go-nearest { margin: 0 0 10px; }
body.staking-ui-7:not(#s7) #workspace .stk-go-nearest[hidden] { display: none !important; }
body.staking-ui-7:not(#s7) #workspace .stk-go-nearest__btn {
  display: flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important;
  width: 100% !important; min-height: 48px !important; padding: 0 16px !important; margin: 0 !important;
  border: 0 !important; border-radius: 10px !important; background: #f39200 !important; color: #1a1205 !important;
  font: 700 15px/1 var(--atlas-font-ui) !important; box-shadow: none !important; cursor: pointer;
}
body.staking-ui-7:not(#s7) #workspace .stk-go-nearest__btn svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
body.staking-ui-7:not(#s7) #workspace .stk-go-nearest__btn:hover { background: #e08700 !important; }
body.staking-ui-7:not(#s7) #workspace .stk-go-nearest__btn:disabled { opacity: .7 !important; cursor: progress !important; }
body.staking-ui-7:not(#s7) #workspace .stk-go-nearest__btn:focus-visible { outline: 2px solid var(--atlas-cyan) !important; outline-offset: 2px !important; }
body.staking-ui-7:not(#s7) #workspace .stk-go-nearest__msg { margin: 6px 0 0 !important; color: var(--atlas-ink) !important; font: 500 12.5px/1.4 var(--atlas-font-ui) !important; }
body.staking-ui-7:not(#s7) #workspace .stk-go-nearest__msg:empty { display: none !important; }
body.staking-ui-7:not(#s7) #workspace .stk-go-nearest__msg.is-error { color: var(--atlas-danger) !important; }
/* con "Vai al più vicino" l'elenco delle distanze diventa l'azione secondaria */
body.staking-ui-7:not(#s7) #workspace .stk-go-card #liveToggle:not(.active):not(:disabled) {
  background: var(--atlas-surface) !important; color: var(--atlas-ink) !important; border: 1px solid var(--atlas-line-strong) !important; font-weight: 600 !important;
}
body.staking-ui-7:not(#s7) #workspace .stk-go-card #liveToggle:not(.active):not(:disabled) .stk-live-ico { color: var(--atlas-orange) !important; }
body.staking-ui-7:not(#s7) .stk-go-fab.is-busy { opacity: .75; }

/* logo = ritorno alla Mappa: freccia visibile su telefono e tablet */
body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__home-back { display: none; }
body.staking-ui-7:not(#s7) .atlas-hdr__home-back svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
@media (max-width: 767px), (max-width: 900px) and (pointer: fine), (min-width: 768px) and (max-width: 1366px) and (pointer: coarse) {
  body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__home {
    display: flex !important; align-items: center !important; gap: 4px !important;
    min-height: 44px !important; padding: 0 10px 0 4px !important; margin-left: -4px !important;
    border-radius: 10px !important; background: rgba(255, 255, 255, .08) !important; border: 1px solid rgba(255, 255, 255, .14) !important;
    text-decoration: none !important;
  }
  body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__home:active { background: rgba(255, 255, 255, .16) !important; }
  body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__home-back { display: grid; place-items: center; width: 20px; height: 20px; color: #fff; }
  body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__mark { height: 22px !important; }
}
@media (max-width: 374px) {
  body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__mark { height: 19px !important; }
  body.staking-ui-7:not(#s7) .atlas-hdr .atlas-hdr__theme button { width: 30px; min-width: 30px; }
}

/* =========================================================================
   13) Gestione picchetti: Unione, Colore, Rimuovi ultimo, Cancella tutti
   Stessa famiglia di controlli del pannello, in Light e Field.
   ========================================================================= */
body.staking-ui-7:not(#s7) #workspace .polybar {
  display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 8px !important;
  padding: 0 !important; margin: 10px 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important;
}
body.staking-ui-7:not(#s7) #workspace .polybar > label {
  display: inline-flex !important; align-items: center !important; gap: 8px !important; margin: 0 !important;
  min-height: 40px !important; padding: 0 4px 0 10px !important; box-sizing: border-box !important;
  background: var(--atlas-surface) !important; color: var(--atlas-muted) !important;
  border: 1px solid var(--atlas-line-strong) !important; border-radius: 8px !important;
  font: 600 12px/1 var(--atlas-font-ui) !important; box-shadow: none !important;
}
body.staking-ui-7:not(#s7) #workspace .polybar #geometryMode {
  min-height: 36px !important; height: 36px !important; margin: 0 !important; padding: 0 26px 0 6px !important;
  border: 0 !important; border-radius: 6px !important; background-color: transparent !important; color: var(--atlas-ink) !important;
  font: 600 13px/1 var(--atlas-font-ui) !important; box-shadow: none !important;
}
/* colore: un campione tondo dentro lo stesso contenitore */
body.staking-ui-7:not(#s7) #workspace .polybar .colorpick { padding-right: 6px !important; cursor: pointer !important; }
body.staking-ui-7:not(#s7) #workspace .polybar #polygonColor {
  -webkit-appearance: none !important; appearance: none !important;
  width: 26px !important; height: 26px !important; min-width: 26px !important; min-height: 26px !important; padding: 0 !important; margin: 0 !important;
  border: 2px solid var(--atlas-surface) !important; border-radius: 50% !important; background: transparent !important;
  box-shadow: 0 0 0 1px var(--atlas-line-strong) !important; cursor: pointer !important; overflow: hidden !important;
}
body.staking-ui-7:not(#s7) #workspace .polybar #polygonColor::-webkit-color-swatch-wrapper { padding: 0 !important; }
body.staking-ui-7:not(#s7) #workspace .polybar #polygonColor::-webkit-color-swatch { border: 0 !important; border-radius: 50% !important; }
body.staking-ui-7:not(#s7) #workspace .polybar #polygonColor::-moz-color-swatch { border: 0 !important; border-radius: 50% !important; }
body.staking-ui-7:not(#s7) #workspace .polybar :is(#undoBtn, #togglePolygon, #clearBtn) {
  min-height: 40px !important; height: auto !important; padding: 0 14px !important; margin: 0 !important;
  border-radius: 8px !important; font: 600 13px/1.2 var(--atlas-font-ui) !important; box-shadow: none !important;
}
body.staking-ui-7:not(#s7) #workspace .polybar :is(#undoBtn, #togglePolygon) {
  background: var(--atlas-surface-2) !important; color: var(--atlas-ink) !important; border: 1px solid var(--atlas-line-strong) !important;
}
/* Cancella tutti: azione distruttiva ma senza riquadro bianco (come "Cancella" di Misura) */
body.staking-ui-7:not(#s7) #workspace .polybar #clearBtn {
  background: transparent !important; color: var(--atlas-danger) !important;
  border: 1px solid color-mix(in srgb, var(--atlas-danger) 55%, var(--atlas-line)) !important;
}
body.staking-ui-7:not(#s7) #workspace .polybar :is(#undoBtn, #togglePolygon):hover { background: var(--atlas-hover) !important; }
body.staking-ui-7:not(#s7) #workspace .polybar #clearBtn:hover { background: var(--atlas-danger-soft) !important; }
body.staking-ui-7:not(#s7) #workspace .polybar :is(button, label, select, input):focus-visible { outline: 2px solid var(--atlas-cyan) !important; outline-offset: 2px !important; }
body.staking-ui-7:not(#s7) #workspace .polybar :is(button):disabled { opacity: .5 !important; }
/* altri pulsanti "danger" del pannello con la stessa regola */
body.staking-ui-7:not(#s7) #workspace button.danger:not(#clearBtn) {
  background: transparent !important; color: var(--atlas-danger) !important; border: 1px solid color-mix(in srgb, var(--atlas-danger) 55%, var(--atlas-line)) !important;
}
@media (max-width: 767px), (max-width: 900px) and (pointer: fine), (min-width: 768px) and (max-width: 1366px) and (pointer: coarse) {
  body.staking-ui-7:not(#s7) #workspace .polybar > label,
  body.staking-ui-7:not(#s7) #workspace .polybar :is(#undoBtn, #togglePolygon, #clearBtn) { min-height: 44px !important; }
  body.staking-ui-7:not(#s7) #workspace .polybar #geometryMode { min-height: 40px !important; height: 40px !important; }
  body.staking-ui-7:not(#s7) #workspace .polybar :is(#undoBtn, #clearBtn) { flex: 1 1 40% !important; }
}
@media (max-width: 767px), (max-width: 900px) and (pointer: fine), (min-width: 768px) and (max-width: 1366px) and (pointer: coarse) {
  body.staking-ui-7:not(#s7) #workspace .polybar > label.geometry-mode { flex: 1 1 58% !important; width: auto !important; }
  body.staking-ui-7:not(#s7) #workspace .polybar > label.colorpick { flex: 1 1 30% !important; width: auto !important; justify-content: space-between !important; }
  body.staking-ui-7:not(#s7) #workspace .polybar #geometryMode { flex: 1 1 auto !important; width: auto !important; min-width: 0 !important; }
}

/* =========================================================================
   14) TABLET (touch, 768–1366 px, verticale e orizzontale) — Fase 4
   Un'interfaccia sola, né telefono né desktop:
   - header e barra di stato come il desktop, comandi da 44 px;
   - rail degli strumenti a sinistra (niente barra inferiore del telefono);
   - pannello Picchettamento AGGANCIATO a sinistra, a tutta altezza, con i
     contenuti compatti del telefono: la mappa resta sempre visibile a destra
     per toccare i picchetti;
   - Livelli come pannello a destra;
   - funzioni GPS (posizione, tracciamento, Vai ai picchetti, AR) attive.
   ========================================================================= */
@media (min-width: 768px) and (max-width: 1366px) and (pointer: coarse) {
  html body.staking-ui-7:not(#s7):not(#t7) { --stk-dock: 32px; --stk-rail: 64px; --stk-panel: clamp(360px, 44vw, 460px); }

  /* header */
  html body.staking-ui-7:not(#s7):not(#t7) > header.atlas-hdr { height: 56px; min-height: 56px; max-height: 56px; padding: 0 12px; gap: 12px; }
  html body.staking-ui-7:not(#s7):not(#t7) .atlas-hdr .atlas-hdr__icon-btn { width: 44px; height: 44px; min-width: 44px; }
  html body.staking-ui-7:not(#s7):not(#t7) .atlas-hdr .atlas-hdr__user-btn { height: 44px; }
  html body.staking-ui-7:not(#s7):not(#t7) .atlas-hdr .atlas-hdr__theme button { height: 34px; min-width: 36px; }
  html body.staking-ui-7:not(#s7):not(#t7) .atlas-hdr #stakingAddressInput { height: 40px; font-size: 15px; }
  html body.staking-ui-7:not(#s7):not(#t7) .atlas-hdr__search-actions button { height: 34px; }
  html body.staking-ui-7:not(#s7):not(#t7) .atlas-hdr .atlas-hdr__item { min-height: 44px; }

  /* area mappa: tra header, rail e barra di stato */
  html body.staking-ui-7:not(#s7):not(#t7) main {
    position: fixed !important; top: 56px !important; left: 0 !important; right: 0 !important; bottom: 32px !important; height: auto !important;
  }
  html body.staking-ui-7:not(#s7):not(#t7) #map {
    position: absolute !important; top: 0 !important; bottom: 0 !important; right: 0 !important; left: var(--stk-rail) !important;
    width: auto !important; height: auto !important;
  }

  /* rail a sinistra */
  html body.staking-ui-7:not(#s7):not(#t7) #desktopModuleRail {
    display: flex !important; flex-direction: column !important; align-items: center !important; gap: 4px !important;
    position: absolute !important; top: 0 !important; bottom: 0 !important; left: 0 !important; width: var(--stk-rail) !important;
    padding: 8px 0 !important; box-sizing: border-box !important; z-index: 1600 !important;
    background: var(--atlas-surface) !important; border-right: 1px solid var(--atlas-line) !important; overflow-y: auto !important;
  }
  html body.staking-ui-7:not(#s7):not(#t7) #desktopModuleRail button,
  html body.staking-ui-7:not(#s7):not(#t7) #desktopModuleRail a {
    width: 48px !important; height: 48px !important; min-width: 48px !important; min-height: 48px !important; border-radius: 10px !important;
    display: grid !important; place-items: center !important;
  }
  html body.staking-ui-7:not(#s7):not(#t7) #desktopModuleRail svg { width: 22px !important; height: 22px !important; }

  /* niente elementi del telefono */
  html body.staking-ui-7:not(#s7):not(#t7) #mobileDock,
  html body.staking-ui-7:not(#s7):not(#t7) .maptools,
  html body.staking-ui-7:not(#s7):not(#t7) #workspace .grab,
  html body.staking-ui-7:not(#s7):not(#t7) #openWorkspaceBtn,
  html body.staking-ui-7:not(#s7):not(#t7) #openLayersBtn { display: none !important; }

  /* pannello Picchettamento agganciato a sinistra */
  html body.staking-ui-7:not(#s7):not(#t7) #workspace,
  html body.staking-ui-7:not(#s7):not(#t7):not(.staking-layers-collapsed):not(.staking-workspace-collapsed) #workspace:not([data-staking-view="pq"]),
  html body.staking-ui-7:not(#s7):not(#t7) #workspace[data-staking-view="pq"] {
    position: fixed !important; transform: none !important; inset: auto !important;
    left: calc(var(--stk-rail) + 12px) !important; top: calc(56px + 12px) !important; bottom: calc(32px + 12px) !important; right: auto !important;
    width: var(--stk-panel) !important; min-width: 0 !important; max-width: none !important; height: auto !important; max-height: none !important;
    display: flex !important; flex-direction: column !important; overflow-x: hidden !important; overflow-y: auto !important;
    border: 1px solid var(--atlas-line) !important; border-radius: 12px !important;
    box-shadow: 0 14px 36px rgba(15, 33, 55, .18) !important; z-index: 3600 !important;
  }
  html body.staking-ui-7.staking-workspace-collapsed:not(#s7):not(#t7) #workspace { display: none !important; }
  html body.staking-ui-7:not(#s7):not(#t7) #workspace .workspace-head { top: 0 !important; min-height: 56px !important; }
  html body.staking-ui-7:not(#s7):not(#t7) #workspace .staking-workflow-tabs { top: 56px !important; }
  html body.staking-ui-7:not(#s7):not(#t7) #workspace #stakingExportFooter { padding-bottom: 16px !important; }

  /* Livelli a destra */
  html body.staking-ui-7:not(#s7):not(#t7) #stakingLayersToggle {
    display: inline-flex !important; position: fixed !important; top: calc(56px + 12px) !important; right: 12px !important; left: auto !important;
    min-height: 44px !important; z-index: 3750 !important;
  }
  html body.staking-ui-7:not(#s7):not(#t7) #layercard:not([hidden]) {
    display: block !important; position: fixed !important; transform: none !important;
    top: calc(56px + 64px) !important; right: 12px !important; bottom: calc(32px + 12px) !important; left: auto !important;
    width: min(340px, 42vw) !important; max-height: none !important; height: auto !important; overflow-y: auto !important;
    padding: 12px 14px 16px !important; box-sizing: border-box !important; z-index: 3700 !important;
    background: var(--atlas-surface) !important; color: var(--atlas-ink) !important;
    border: 1px solid var(--atlas-line) !important; border-radius: 12px !important; box-shadow: 0 14px 36px rgba(15, 33, 55, .18) !important;
  }
  html body.staking-ui-7:not(#s7):not(#t7) #layercard :is(details, .atlas-catasto-card, .atlas-staking-taf, .atlas-project-launcher) {
    background: var(--atlas-surface-2) !important; color: var(--atlas-ink) !important; border: 1px solid var(--atlas-line) !important; border-radius: 12px !important;
  }
  html body.staking-ui-7:not(#s7):not(#t7) #layercard label { min-height: 44px !important; }

  /* barra di stato del desktop, pannello Naviga sopra di essa */
  html body.staking-ui-7:not(#s7):not(#t7) .atlas-shell-status { display: flex !important; }
  html body.staking-ui-7:not(#s7):not(#t7) #navPanel { left: calc(var(--stk-rail) + (100vw - var(--stk-rail)) / 2) !important; width: min(560px, calc(100vw - var(--stk-rail) - 24px)) !important; }
}
@media (min-width: 768px) and (max-width: 1366px) and (pointer: coarse) {
  /* rail: solo icone (le etichette restano come nome accessibile/title) */
  html body.staking-ui-7:not(#s7):not(#t7) #desktopModuleRail > :is(button, a) {
    position: relative !important; flex: 0 0 auto !important; padding: 0 !important; margin: 0 !important;
    border: 0 !important; background: transparent !important; color: var(--atlas-muted) !important; box-shadow: none !important;
  }
  html body.staking-ui-7:not(#s7):not(#t7) #desktopModuleRail > :is(button, a) > b {
    position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important;
    clip: rect(0 0 0 0) !important; white-space: nowrap !important; margin: -1px !important; padding: 0 !important;
  }
  html body.staking-ui-7:not(#s7):not(#t7) #desktopModuleRail > :is(button, a) > span {
    display: grid !important; place-items: center !important; width: 24px !important; height: 24px !important; margin: 0 !important;
    background: transparent !important; border: 0 !important; color: inherit !important;
  }
  html body.staking-ui-7:not(#s7):not(#t7) #desktopModuleRail > :is(button, a):is(.active, [aria-pressed="true"], [aria-expanded="true"]) {
    background: rgba(243, 146, 0, .14) !important; color: var(--atlas-orange-ink) !important;
  }
  html body.staking-ui-7:not(#s7):not(#t7) #desktopModuleRail > :is(button, a):active { background: var(--atlas-hover) !important; }
  html body.staking-ui-7:not(#s7):not(#t7) #desktopModuleRail .desktop-rail-separator {
    display: block !important; width: 32px !important; height: 1px !important; margin: 6px 0 !important; background: var(--atlas-line) !important;
  }
  html body.staking-ui-7:not(#s7):not(#t7) #desktopModuleRail #railLocate { color: var(--atlas-orange) !important; }
  html body.staking-ui-7:not(#s7):not(#t7) #desktopModuleRail > :last-child { margin-top: auto !important; }
  /* Livelli: pulsante compatto con icona */
  html body.staking-ui-7:not(#s7):not(#t7) #stakingLayersToggle {
    align-items: center !important; gap: 8px !important; padding: 0 14px !important; border-radius: 10px !important;
    background: var(--atlas-surface) !important; color: var(--atlas-ink) !important; border: 1px solid var(--atlas-line) !important;
    box-shadow: var(--atlas-shadow-pop) !important; font: 600 14px/1 var(--atlas-font-ui) !important;
  }
}

/* 7.12 — solo "Da posizione" e "Da coordinate" nella barra schede */
body.staking-ui-7:not(#s7) #workspace .staking-workflow-tabs[hidden],
body.staking-ui-7:not(#s7) #workspace .staking-workflow-tabs > button[hidden] { display: none !important; }
body.staking-ui-7:not(#s7) #workspace .staking-workflow-tabs > button:not([hidden]) { flex: 1 1 0 !important; justify-content: center !important; text-align: center !important; }
@media (min-width: 901px) and (pointer: fine) {
  body.staking-ui-7:not(#s7) #workspace .staking-workflow-tabs > button:not([hidden]) { flex: 0 0 auto !important; }
}


/* =========================================================================
   15) Telefono: controlli mappa nell'header (come la Mappa) — 7.13
   Riga navy di 48 px sotto l'header: Mappa · Satellite a sinistra,
   Posizione e Crediti (Leaflet, OSM, TINITALY, WMS…) a destra.
   Zoom con due dita o doppio tocco.
   ========================================================================= */
body.staking-ui-7:not(#s7) #stkM7MapBar { display: none; }
@media (max-width: 767px), (max-width: 900px) and (pointer: fine) {
  body.staking-ui-7:not(#s7) #stkM7MapBar {
    display: flex; align-items: center; position: fixed; left: 0; right: 0; top: 56px; height: 48px; z-index: 2900;
    padding: 0 8px; box-sizing: border-box; background: #24476f; border-bottom: 1px solid rgba(255, 255, 255, .08);
  }
  html[data-atlas-theme="dark"] body.staking-ui-7:not(#s7) #stkM7MapBar { background: #172130; }
  body.staking-ui-7:not(#s7) #stkM7MapBar .stk-mapbar__group { display: flex; gap: 2px; }
  body.staking-ui-7:not(#s7) #stkM7MapBar .stk-mapbar__btn {
    display: grid; place-items: center; width: 40px; height: 40px; padding: 0; margin: 0;
    border: 0; border-radius: 6px; background: transparent; color: rgba(255, 255, 255, .8); cursor: pointer;
  }
  body.staking-ui-7:not(#s7) #stkM7MapBar .stk-mapbar__btn svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
  body.staking-ui-7:not(#s7) #stkM7MapBar .stk-mapbar__btn[aria-pressed="true"] { background: #ffffff; color: #1e3a5f; }
  body.staking-ui-7:not(#s7) #stkM7MapBar .stk-mapbar__btn:focus-visible { outline: 2px solid #1ba6e8; outline-offset: -2px; }

  /* #map è posizionata dentro <main> (che parte a 56 px): 48 px = altezza della riga */
  body.staking-ui-7:not(#s7) #map { top: 48px !important; }
  body.staking-ui-7:not(#s7) #workspace,
  body.staking-ui-7:not(#s7) #layercard.mobile-open { max-height: min(56dvh, calc(100dvh - 104px - var(--stk-dock) - 64px)) !important; }

  /* posizione e crediti: a destra nella riga (zoom solo a gesti) */
  body.staking-ui-7:not(#s7) #stkM7MapBar .maptools {
    position: absolute !important; top: 4px !important; right: 8px !important; bottom: auto !important; left: auto !important; z-index: 1 !important;
    width: auto !important; height: auto !important;
    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.staking-ui-7:not(#s7) .maptools .atlas-mobile-map-zoom { display: none !important; }
  body.staking-ui-7:not(#s7) .maptools 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.staking-ui-7:not(#s7) .maptools #stakingAttributionToggle,
  body.staking-ui-7:not(#s7) .maptools #stakingAttributionToggle svg * { color: rgba(255, 255, 255, .8) !important; stroke: rgba(255, 255, 255, .8) !important; }
  body.staking-ui-7:not(#s7) .maptools :is(#stakingAttributionToggle[aria-expanded="true"], #stakingAttributionToggle.is-open) { background: #ffffff !important; }
  body.staking-ui-7:not(#s7) .maptools :is(#stakingAttributionToggle[aria-expanded="true"], #stakingAttributionToggle.is-open) svg * { stroke: #1e3a5f !important; }
  body.staking-ui-7.staking-sheet-tall:not(#s7) .maptools { display: flex !important; }
  body.staking-ui-7:not(#s7) #stakingAttributionDrawer:not([hidden]):is(.is-open, .open, .show, [aria-hidden="false"]) {
    position: fixed !important; top: 112px !important; right: 8px !important; left: auto !important; bottom: auto !important;
    max-width: calc(100vw - 16px) !important; z-index: 2960 !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.staking-ui-7:not(#s7) #stakingAttributionDrawer a { color: var(--atlas-orange-ink) !important; }
}

/* 7.14 — riga controlli (telefono): Posizione, Crediti e "Apri Mappa" a destra */
@media (max-width: 767px), (max-width: 900px) and (pointer: fine) {
  html body.staking-ui-7:not(#s7):not(#t7) #stkM7MapBar { gap: 2px; }
  html body.staking-ui-7:not(#s7):not(#t7) #stkM7MapBar .stk-mapbar__group { margin-right: auto; }
  html body.staking-ui-7:not(#s7):not(#t7) #stkM7MapBar .maptools,
  html body.staking-ui-7.staking-workspace-collapsed:not(#s7):not(#t7) #stkM7MapBar .maptools {
    position: static !important; inset: auto !important; transform: none !important; display: flex !important;
    visibility: visible !important; opacity: 1 !important; margin: 0 !important;
  }
  html body.staking-ui-7:not(#s7):not(#t7) #stkM7MapBar .stk-mapbar__open {
    display: grid; place-items: center; width: 40px; height: 40px; margin-left: 4px; border-radius: 6px;
    color: #ffffff; text-decoration: none; position: relative;
  }
  html body.staking-ui-7:not(#s7):not(#t7) #stkM7MapBar .stk-mapbar__open::before {
    content: ""; position: absolute; left: -3px; top: 10px; bottom: 10px; width: 1px; background: rgba(255, 255, 255, .22);
  }
  html body.staking-ui-7:not(#s7):not(#t7) #stkM7MapBar .stk-mapbar__open svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
  html body.staking-ui-7:not(#s7):not(#t7) #stkM7MapBar .stk-mapbar__open:active { background: rgba(255, 255, 255, .14); }
  html body.staking-ui-7:not(#s7):not(#t7) #stkM7MapBar .stk-mapbar__open:focus-visible { outline: 2px solid #1ba6e8; outline-offset: -2px; }
}