/* =========================================================
   CENTRO DI COSTO — aggiunte allo stile di Spese Casa
   ========================================================= */
.mob-only { display: grid; place-items: center; }
.gear-ic { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
@media (min-width: 900px) { .mob-only { display: none; } }

/* società */
.soc-bar { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; }
.soc-bar::-webkit-scrollbar { display: none; }
.soc-bar button { height: 36px; padding: 0 14px; border-radius: 11px; border: 1px solid var(--line); background: var(--surface); font-weight: 600; font-size: 13.5px; color: var(--ink-2); cursor: pointer; white-space: nowrap; transition: all .2s var(--out); }
.soc-bar button.on { background: var(--ink); color: var(--bg); border-color: var(--ink); }

.k-txt { font-size: 20px !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (min-width: 900px) { .k-txt { font-size: 24px !important; } }
.warn-ic { background: var(--danger-soft) !important; color: var(--danger) !important; }

/* barre con percentuale */
.bar-top em { font-style: normal; color: var(--muted); font-weight: 500; margin-left: 6px; font-size: 12px; }
.bar-row.click { cursor: pointer; border-radius: 8px; }
.bar-row.click:hover .bar-fill { filter: brightness(1.08); }
.bar-track { position: relative; }
.bar-bud { position: absolute; top: -2px; bottom: -2px; width: 2px; background: var(--ink); opacity: .5; border-radius: 1px; }
.bar-fill.over { background: var(--danger); }

/* filtri */
.filters.f4 { grid-template-columns: 1fr 1fr; }
.filters.f4 #f-q { grid-column: 1 / -1; }
.filters.f3 { grid-template-columns: 1fr 1fr; }
.filters.f3 #a-q { grid-column: 1 / -1; }
@media (min-width: 640px) {
  .filters.f4 { grid-template-columns: 2fr 1fr 1fr 1fr; } .filters.f4 #f-q { grid-column: auto; }
  .filters.f3 { grid-template-columns: 2fr 1fr 1fr; } .filters.f3 #a-q { grid-column: auto; }
}

/* elenco movimenti */
.ic.cc { background: var(--accent-soft); color: var(--accent); font-size: 12px; letter-spacing: .02em; }
.ic.cc.cc-att { background: var(--warn-soft); color: var(--warn); }
.item .s b { font-weight: 600; color: var(--ink-2); }
.amt.zero { color: var(--warn); }
.more-row { display: flex; justify-content: center; padding: 12px 0 4px; }
.tbl .num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.tbl .cod { color: var(--muted); font-size: 12.5px; white-space: nowrap; }
.tbl td .chip { font-weight: 500; }
.m-day .day-h b { font-variant-numeric: tabular-nums; color: var(--ink-2); }

/* centri */
.cc-grid { display: grid; gap: 12px; }
@media (min-width: 640px) { .cc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .cc-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.cc-card { cursor: pointer; display: grid; gap: 10px; transition: transform .15s var(--out), box-shadow .2s; }
@media (hover: hover) { .cc-card:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(34, 34, 34, .07); } }
.cc-top { display: flex; align-items: center; gap: 12px; }
.cc-top .ic { width: 42px; height: 42px; border-radius: 12px; font-size: 13px; }
.cc-top h3 { font-size: 16px; }
.cc-top .muted { font-size: 12.5px; }
.cc-top .pct { margin-left: auto; font-weight: 700; font-size: 13px; color: var(--accent); background: var(--accent-soft); padding: 3px 9px; border-radius: 999px; }
.cc-card .big { margin: 0; }
.cc-cats { display: grid; gap: 6px; padding-top: 10px; border-top: 1px solid var(--line); }
.cc-cats div { display: flex; justify-content: space-between; gap: 8px; font-size: 13px; color: var(--ink-2); }
.cc-cats div span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cc-cats div b { font-weight: 600; font-variant-numeric: tabular-nums; }
.cc-bud { font-size: 12.5px; color: var(--muted); display: flex; justify-content: space-between; }
.cc-bud.over { color: var(--danger); font-weight: 600; }

/* matrice */
.mx-wrap { overflow-x: auto; margin: 0 -16px; padding: 0 16px; }
@media (min-width: 900px) { .mx-wrap { margin: 0; padding: 0; } }
.mx { border-collapse: collapse; width: 100%; font-size: 13px; min-width: 560px; }
.mx th, .mx td { padding: 9px 10px; border-bottom: 1px solid var(--line); text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.mx th { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); font-weight: 600; }
.mx th:first-child, .mx td:first-child { text-align: left; padding-left: 0; position: sticky; left: 0; background: var(--surface); }
.mx td:first-child { font-weight: 500; color: var(--ink); max-width: 200px; overflow: hidden; text-overflow: ellipsis; }
.mx td.h0 { color: var(--line); }
.mx td.h1 { background: color-mix(in srgb, var(--accent) 7%, transparent); }
.mx td.h2 { background: color-mix(in srgb, var(--accent) 16%, transparent); }
.mx td.h3 { background: color-mix(in srgb, var(--accent) 28%, transparent); font-weight: 600; }
.mx tr.tot td { font-weight: 700; border-bottom: 0; border-top: 2px solid var(--line); }

/* articoli */
.art-var { display: inline-flex; align-items: center; gap: 4px; }

/* assistente */
.chat { display: flex; flex-direction: column; padding: 0; overflow: hidden; height: calc(100dvh - 190px - env(safe-area-inset-bottom)); min-height: 380px; }
@media (min-width: 900px) { .chat { height: calc(100dvh - 130px); max-width: 860px; } }
.chat-log { flex: 1; overflow-y: auto; padding: 18px 16px; display: flex; flex-direction: column; gap: 12px; }
.msg { max-width: 88%; padding: 10px 14px; border-radius: 16px; font-size: 14.5px; line-height: 1.5; animation: rise .35s var(--out) both; }
.msg p { margin: 0 0 6px; } .msg p:last-child { margin: 0; }
.msg ul { margin: 4px 0; padding-left: 18px; } .msg li { margin: 2px 0; }
.msg.u { align-self: flex-end; background: var(--accent); color: var(--accent-ink); border-bottom-right-radius: 6px; }
.msg.a { align-self: flex-start; background: var(--bg); color: var(--ink); border-bottom-left-radius: 6px; }
.msg.err { color: var(--danger); background: var(--danger-soft); }
.msg.typing { display: flex; gap: 5px; padding: 14px; }
.msg.typing i { width: 7px; height: 7px; border-radius: 50%; background: var(--muted); animation: blink 1.2s infinite; }
.msg.typing i:nth-child(2) { animation-delay: .15s; } .msg.typing i:nth-child(3) { animation-delay: .3s; }
@keyframes blink { 0%, 80%, 100% { opacity: .25; } 40% { opacity: 1; } }
.chat-hello { margin: auto 0; display: grid; gap: 14px; justify-items: center; text-align: center; padding: 10px 0; }
.chat-hello p { margin: 0; max-width: 380px; }
.qchips { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.qchips button { border: 1px solid var(--line); background: var(--surface); color: var(--ink-2); border-radius: 999px; padding: 8px 13px; font-size: 13px; font-weight: 500; cursor: pointer; transition: all .15s; }
.qchips button:hover { border-color: var(--accent); color: var(--accent); }
.chat-in { display: flex; gap: 8px; padding: 10px; border-top: 1px solid var(--line); align-items: flex-end; }
.chat-in textarea { min-height: 46px; max-height: 140px; resize: none; border-radius: 14px; padding: 12px 14px; }
.chat-send { flex: none; width: 46px; height: 46px; border-radius: 14px; border: 0; background: var(--accent); color: var(--accent-ink); display: grid; place-items: center; cursor: pointer; }
.chat-send svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.chat-send:disabled { opacity: .5; }

/* scansione */
.scan-list { display: grid; gap: 0; max-height: 46dvh; overflow: auto; margin: 4px 0 12px; border: 1px solid var(--line); border-radius: 12px; padding: 0 12px; }
.scan-row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 10px 0; border-top: 1px solid var(--line); }
.scan-row:first-child { border-top: 0; }
.scan-row input[type=checkbox] { width: 18px; height: 18px; min-height: 0; accent-color: var(--accent); }
.scan-row .t { font-weight: 500; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.scan-row .s { font-size: 12.5px; color: var(--muted); }
.scan-row .amt { font-weight: 600; font-variant-numeric: tabular-nums; }
.tot-line { display: flex; justify-content: space-between; font-size: 14px; padding: 8px 2px 4px; }
.tot-line b { font-variant-numeric: tabular-nums; }

/* insight */
.ins-date { font-size: 12px; color: var(--muted); margin-top: 10px; }

/* niente allargamenti con testi lunghi */
.view { grid-template-columns: minmax(0, 1fr); }
.view > * { min-width: 0; }
.day { overflow: hidden; }

/* modifica veloce in tabella */
.tbl td.ed { cursor: text; }
.tbl td.ed:hover { box-shadow: inset 0 0 0 1px var(--line); border-radius: 8px; }
.tbl td.ed:hover::after { content: ""; }
.cell-in { height: 34px !important; min-height: 34px !important; padding: 4px 8px; font-size: 14px !important; border-radius: 8px; border-color: var(--accent); text-align: right; min-width: 90px; }
select.cell-in { text-align: left; min-width: 150px; padding-right: 28px; }

/* =========================================================
   SPLASH — il grafico che diventa il logo dell'app
   ========================================================= */
.spx { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; cursor: pointer; overflow: hidden; color: var(--line); }
.spx-bg { position: absolute; inset: 0; background: radial-gradient(120% 85% at 50% 40%, var(--surface) 0%, var(--bg) 72%); }
.spx-grid { position: absolute; inset: -10%; opacity: 0; background-image: radial-gradient(circle, color-mix(in srgb, var(--accent) 22%, transparent) 1.1px, transparent 1.4px); background-size: 26px 26px; -webkit-mask-image: radial-gradient(closest-side at 50% 45%, #000 0%, transparent 85%); mask-image: radial-gradient(closest-side at 50% 45%, #000 0%, transparent 85%); }
.spx-glow { position: absolute; left: 50%; top: 42%; width: 70vmin; height: 70vmin; margin: -35vmin 0 0 -35vmin; border-radius: 50%; background: radial-gradient(circle, color-mix(in srgb, var(--accent) 16%, transparent) 0%, transparent 65%); opacity: 0; }
.spx-stage { position: relative; display: grid; justify-items: center; width: min(400px, 82vw); transform-origin: 0 0; will-change: transform; }
.spx-svg { width: 100%; height: auto; display: block; overflow: visible; }
#spx-bars rect { fill: url(#spx-bar); transform-box: fill-box; transform-origin: 50% 100%; transform: scaleY(0); }
#spx-bars rect.r { fill: #e22726; }
#spx-axis path { stroke-dasharray: 1; stroke-dashoffset: 1; }
#spx-dots circle { fill: var(--accent); }
#spx-rip circle { opacity: 0; transform-box: fill-box; transform-origin: 50% 50%; stroke-width: 1.5; }
#spx-ic, #spx-sq, #spx-ring, #spx-hand, #spx-slice { opacity: 0; }
#spx-sq, #spx-slice { transform-box: fill-box; transform-origin: 50% 50%; }
#spx-slice { transform-origin: 0% 100%; }
#spx-ring, #spx-hand { stroke-dasharray: 1; stroke-dashoffset: 1; }
.spx-t { display: grid; justify-items: center; gap: 6px; margin-top: -34px; }
.spx-t b { display: flex; font-size: clamp(22px, 6vw, 30px); font-weight: 700; letter-spacing: -.025em; color: var(--ink); white-space: pre; }
.spx-t b span { display: inline-block; opacity: 0; }
.spx-t > span { font-size: 11.5px; font-weight: 600; letter-spacing: .5em; text-transform: uppercase; color: var(--muted); opacity: 0; }
.spx-prog { display: block; width: 120px; height: 3px; border-radius: 3px; background: color-mix(in srgb, var(--accent) 14%, transparent); overflow: hidden; margin-top: 12px; opacity: 0; }
.spx-prog u { display: block; height: 100%; width: 100%; border-radius: 3px; background: linear-gradient(90deg, var(--accent), #e22726); transform: scaleX(0); transform-origin: 0 50%; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .spx { color: #3a3f4b; } }
:root[data-theme="dark"] .spx { color: #3a3f4b; }

/* =========================================================
   CENTRI — dashboard
   ========================================================= */
#v-centri, #v-home {
  --c1: #3362ab; --c2: #eb6834; --c3: #1baf7a; --c4: #eda100; --c5: #e87ba4; --c-other: #b6bac3;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) #v-centri, :root:not([data-theme="light"]) #v-home { --c1: #6d93db; --c2: #d95926; --c3: #199e70; --c4: #c98500; --c5: #d55181; --c-other: #5b616c; }
}
:root[data-theme="dark"] #v-centri, :root[data-theme="dark"] #v-home { --c1: #6d93db; --c2: #d95926; --c3: #199e70; --c4: #c98500; --c5: #d55181; --c-other: #5b616c; }


.cc-dash { display: grid; gap: 12px; }
@media (min-width: 900px) { .cc-dash { grid-template-columns: minmax(0, 1.25fr) minmax(320px, 1fr); gap: 16px; align-items: stretch; } }

/* hero + mappa */
.cc-mapcard { display: grid; gap: 4px; position: relative; overflow: hidden; }
.cc-hero { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 14px 24px; align-items: flex-end; }
.ch-main .label { font-size: 13px; color: var(--muted); font-weight: 500; }
.ch-big { font-size: 34px; font-weight: 700; letter-spacing: -.03em; font-variant-numeric: tabular-nums; line-height: 1.1; margin: 4px 0 2px; }
@media (min-width: 900px) { .ch-big { font-size: 42px; } }
.ch-kpis { display: flex; gap: 10px; }
.ch-kpis > div { display: grid; gap: 1px; padding: 10px 14px; border-radius: 12px; background: var(--bg); min-width: 128px; }
.ch-kpis span { font-size: 11.5px; color: var(--muted); font-weight: 500; }
.ch-kpis b { font-size: 18px; font-weight: 700; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.ch-kpis small { font-size: 11px; color: var(--muted); }
@media (max-width: 639px) { .ch-kpis { width: 100%; } .ch-kpis > div { flex: 1; min-width: 0; } }

.cc-map { position: relative; margin: 0 -6px; }
.cm-svg { width: 100%; height: auto; display: block; max-height: 560px; overflow: visible; }
.cm-land { fill: color-mix(in srgb, var(--accent) 7%, var(--surface)); stroke: color-mix(in srgb, var(--accent) 38%, transparent); stroke-width: 1; stroke-linejoin: round; }
.cm-arc { fill: none; stroke: var(--accent); stroke-width: 1.4; stroke-linecap: round; opacity: .45; stroke-dasharray: 1; stroke-dashoffset: 0; }
.cm-dot { fill: var(--accent); }
.cm-pin { cursor: pointer; }
.cm-c { fill: color-mix(in srgb, var(--accent) 55%, var(--surface)); stroke: var(--surface); stroke-width: 2; transition: fill .3s; }
.cm-pin.on .cm-c { fill: var(--accent); }
.cm-hit { fill: transparent; }
.cm-pulse { fill: none; stroke: var(--accent); stroke-width: 1.5; opacity: 0; transform-box: fill-box; transform-origin: center; }
.cm-pin.on .cm-pulse { animation: cmpulse 2.2s 1.6s var(--out) infinite; }
@keyframes cmpulse { 0% { opacity: .55; transform: scale(1); } 100% { opacity: 0; transform: scale(2.6); } }
.cm-lbl { cursor: pointer; }
.cm-lead { fill: none; stroke: var(--muted); stroke-width: .8; opacity: .6; }
.cm-lbl text { paint-order: stroke; stroke: var(--surface); stroke-width: 4px; stroke-linejoin: round; }
.cm-n { font-size: 10.5px; font-weight: 700; letter-spacing: .04em; fill: var(--ink); }
.cm-v { font-size: 10.5px; font-weight: 500; fill: var(--ink-2); font-variant-numeric: tabular-nums; }
.cm-lbl[data-centro] .cm-n { transition: fill .2s; }
.cm-note { padding: 0 6px 4px; }
.cm-tip { transform: translate(-50%, -100%); }

/* ingresso mappa */
.cc-anim .cm-land { stroke-dasharray: 1; animation: cmdraw 1.1s var(--out) both, cmfill .6s .7s ease both; }
@keyframes cmdraw { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
@keyframes cmfill { from { fill-opacity: 0; } to { fill-opacity: 1; } }
.cc-anim .cm-arc { animation: cmdraw .8s var(--d) var(--out) both; }
.cc-anim .cm-pin > .cm-c { transform-box: fill-box; transform-origin: center; animation: cmpop .6s var(--d) var(--spring) both; }
@keyframes cmpop { from { transform: scale(0); } }
.cc-anim .cm-lbl { animation: rise .5s var(--d) var(--out) both; }
.cc-anim .cm-dot { animation: fadein .3s 1.5s both; }

/* classifica */
.cc-rankcard { display: flex; flex-direction: column; }
.cc-rank { display: grid; gap: 4px; }
.cr-row { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 12px; align-items: center; padding: 10px; margin: 0 -10px; border: 0; background: transparent; border-radius: 12px; text-align: left; cursor: pointer; color: inherit; transition: background .2s; }
.cr-row:hover { background: var(--bg); }
.cr-row.on { background: var(--accent-soft); }
.cr-n { width: 28px; height: 28px; border-radius: 9px; display: grid; place-items: center; font-size: 12.5px; font-weight: 700; background: var(--bg); color: var(--ink-2); font-variant-numeric: tabular-nums; transition: all .2s; }
.cr-row.on .cr-n { background: var(--accent); color: var(--accent-ink); }
.cr-main { display: grid; gap: 7px; min-width: 0; }
.cr-top { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; font-size: 13.5px; }
.cr-top b { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cr-top > span { display: flex; gap: 8px; align-items: baseline; white-space: nowrap; }
.cr-top em { font-style: normal; font-size: 12px; color: var(--muted); font-variant-numeric: tabular-nums; }
.cr-top strong { font-weight: 700; font-variant-numeric: tabular-nums; }
.cr-track { position: relative; height: 8px; border-radius: 4px; background: var(--bg); }
.cr-row.on .cr-track { background: var(--surface); }
.cr-track i { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 4px; background: var(--bar-dim); transition: background .3s; transform-origin: left; }
.cr-row.on .cr-track i { background: var(--accent); }
.cr-track i.over { background: var(--danger) !important; }
.cr-track u { position: absolute; top: -3px; bottom: -3px; width: 2px; border-radius: 1px; background: var(--ink); opacity: .55; }
.cc-anim .cr-row { animation: rise .5s var(--d) var(--out) both; }
.cc-anim .cr-track i { animation: crgrow 1s calc(var(--d) + 150ms) var(--out) both; }
@keyframes crgrow { from { transform: scaleX(0); } }

/* focus */
.cc-focus { display: grid; gap: 16px; }
.cf-head { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.cf-head .ic { width: 44px; height: 44px; border-radius: 13px; font-size: 13px; }
.cf-t { display: grid; min-width: 0; }
.cf-t .label { font-size: 12px; color: var(--muted); font-weight: 500; }
.cf-t h3 { font-size: 19px; font-weight: 700; letter-spacing: -.02em; }
.cf-head .pct { font-weight: 700; font-size: 13px; color: var(--accent); background: var(--accent-soft); padding: 3px 10px; border-radius: 999px; }
.cf-head .btn { margin-left: auto; }
.cf-grid { display: grid; gap: 18px; }
@media (min-width: 900px) { .cf-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr) minmax(0, 1fr); gap: 28px; } .cf-col + .cf-col { border-left: 1px solid var(--line); padding-left: 28px; } }
.cf-col { display: grid; gap: 14px; align-content: start; min-width: 0; }
.cf-kpis { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.cf-kpis > div { background: var(--bg); border-radius: 12px; padding: 10px 12px; display: grid; gap: 2px; min-width: 0; }
.cf-kpis span { font-size: 11.5px; color: var(--muted); font-weight: 500; }
.cf-kpis b { font-size: 17px; font-weight: 700; letter-spacing: -.02em; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cf-gauge { position: relative; display: grid; justify-items: center; }
.cf-gauge svg { width: 100%; max-width: 230px; display: block; }
.g-tr, .g-v { fill: none; stroke-width: 14; stroke-linecap: round; }
.g-tr { stroke: var(--bg); }
.g-v { stroke: var(--accent); stroke-dasharray: 100; stroke-dashoffset: var(--p); }
.cf-gauge.over .g-v { stroke: var(--danger); }
.g-txt { position: absolute; bottom: 22px; display: grid; justify-items: center; }
.g-txt b { font-size: 24px; font-weight: 700; letter-spacing: -.02em; }
.g-txt span { font-size: 11.5px; color: var(--muted); }
.g-st { font-size: 12.5px; font-weight: 600; color: var(--ink-2); margin-top: 2px; }
.cf-gauge.over .g-st { color: var(--danger); }
.cf-nobud { display: block; text-align: center; font-size: 13px; color: var(--accent); font-weight: 500; padding: 14px; border: 1.5px dashed var(--line); border-radius: 12px; }
.cf-warn { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: var(--danger); background: var(--danger-soft); padding: 9px 12px; border-radius: 10px; cursor: pointer; }
.cf-warn svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: none; }

.cf-donut { grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 18px; }
@media (max-width: 639px) { .cf-donut { grid-template-columns: 1fr; justify-items: center; } .dn-leg { width: 100%; } }
.dn-wrap { position: relative; width: 150px; height: 150px; }
.dn { width: 100%; height: 100%; transform: rotate(-90deg); }
.dn-s { fill: none; stroke-width: 18; stroke-linecap: butt; }
.dn-c { position: absolute; inset: 0; display: grid; place-content: center; justify-items: center; }
.dn-c b { font-size: 26px; font-weight: 700; letter-spacing: -.02em; line-height: 1; }
.dn-c span { font-size: 11.5px; color: var(--muted); }
.dn-leg { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; min-width: 0; }
.dn-leg li { display: grid; grid-template-columns: 10px minmax(0, 1fr) auto 34px; gap: 8px; align-items: center; font-size: 13px; }
.dn-leg i { width: 10px; height: 10px; border-radius: 3px; }
.dn-leg span { color: var(--ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dn-leg b { font-weight: 600; font-variant-numeric: tabular-nums; }
.dn-leg em { font-style: normal; font-size: 12px; color: var(--muted); text-align: right; font-variant-numeric: tabular-nums; }

.cf-sub { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.cf-top { display: grid; gap: 12px; }
.ct-row { display: grid; gap: 6px; cursor: pointer; }
.ct-t { display: flex; justify-content: space-between; gap: 10px; font-size: 13px; }
.ct-t span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--ink-2); }
.ct-t b { font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ct-bar { height: 5px; border-radius: 3px; background: var(--bg); overflow: hidden; }
.ct-bar i { display: block; height: 100%; border-radius: 3px; background: var(--accent); transform-origin: left; }
.ct-row:hover .ct-t span { color: var(--ink); }

.cf-in .cf-head { animation: rise .45s var(--out) both; }
.cf-in .cf-kpis > div { animation: rise .5s var(--out) both; }
.cf-in .cf-kpis > div:nth-child(2) { animation-delay: 60ms; } .cf-in .cf-kpis > div:nth-child(3) { animation-delay: 120ms; } .cf-in .cf-kpis > div:nth-child(4) { animation-delay: 180ms; }
.cf-in .g-v { animation: gsweep 1.1s .25s var(--out) both; }
@keyframes gsweep { from { stroke-dashoffset: 100; } }
.cf-in .dn-leg li { animation: rise .45s var(--out) both; }
.cf-in .dn-leg li:nth-child(2) { animation-delay: 70ms; } .cf-in .dn-leg li:nth-child(3) { animation-delay: 140ms; } .cf-in .dn-leg li:nth-child(4) { animation-delay: 210ms; } .cf-in .dn-leg li:nth-child(5) { animation-delay: 280ms; } .cf-in .dn-leg li:nth-child(6) { animation-delay: 350ms; }
.cf-in .ct-row { animation: rise .45s var(--d) var(--out) both; }
.cf-in .ct-bar i { animation: crgrow .9s calc(var(--d) + 100ms) var(--out) both; }

/* matrice: cascata */
.mx-anim td { animation: fadein .4s calc(var(--d, 0ms) + 300ms) ease both; }
.cr-sub { font-size: 11.5px; color: var(--muted); margin-top: -2px; }
.cc-ins { margin-top: auto; padding-top: 16px; display: grid; gap: 8px; }
.cc-ins .cf-sub { margin-bottom: 2px; }
.ci-row { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; gap: 10px; align-items: center; font-size: 13px; color: var(--ink-2); padding: 8px 0; border-top: 1px solid var(--line); }
.ci-row[data-gozero] { cursor: pointer; }
.ci-row > b { font-weight: 700; color: var(--ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
.ci-t { min-width: 0; overflow-wrap: anywhere; }
.ci-t b { color: var(--ink); font-weight: 600; }
.ci-ic { width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; background: var(--accent-soft); color: var(--accent); }
.ci-row.warn .ci-ic { background: var(--danger-soft); color: var(--danger); }
.ci-ic svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.cc-anim .ci-row { animation: rise .5s var(--d) var(--out) both; }
/* fix colonne focus */
.ct-row, .ct-t, .ct-t span { min-width: 0; }
@media (min-width: 900px) { .cf-grid { grid-template-columns: minmax(0, .95fr) minmax(0, 1.4fr) minmax(0, 1fr); } }
.dn-wrap { width: 136px; height: 136px; flex: none; }
.dn-leg li { grid-template-columns: 10px minmax(0, 1fr) auto 30px; gap: 7px; font-size: 12.5px; }
@media (max-width: 639px) { .cm-n, .cm-v { font-size: 12.5px; } .cm-lbl text { stroke-width: 4.5px; } }

/* =========================================================
   SELEZIONE MULTIPLA
   ========================================================= */
.sum-r { display: flex; align-items: center; gap: 8px; }
.sum-r .btn { height: 32px; }
.tbl th.ck, .tbl td.ck { width: 34px; padding-right: 0; }
.cb { width: 18px !important; height: 18px !important; min-height: 0 !important; margin: 0; accent-color: var(--accent); cursor: pointer; vertical-align: middle; }
.tbl tbody tr.sel td { background: var(--accent-soft); }
.tbl tbody tr.sel:hover td { background: color-mix(in srgb, var(--accent) 14%, var(--surface)); }
.day.selmode .item { position: relative; padding-left: 34px; }
.day.selmode .item::before { content: ""; position: absolute; left: 0; top: 50%; width: 20px; height: 20px; margin-top: -10px; border-radius: 6px; border: 2px solid var(--line); background: var(--surface); transition: all .15s; }
.day.selmode .item.sel::before { background: var(--accent); border-color: var(--accent); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E"); background-size: 14px; background-position: center; background-repeat: no-repeat; }
.day.selmode .item.sel { background: var(--accent-soft); margin: 0 -16px; padding-right: 16px; padding-left: 50px; }
.day.selmode .item.sel::before { left: 16px; }

.selbar { position: fixed; z-index: 30; left: 12px; right: 12px; bottom: calc(76px + env(safe-area-inset-bottom)); display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap;
  background: var(--ink); color: var(--bg); border-radius: 16px; padding: 10px 12px 10px 16px; box-shadow: 0 12px 34px rgba(0, 0, 0, .25); animation: sbin .35s var(--spring) both; }
@keyframes sbin { from { opacity: 0; transform: translateY(16px) scale(.97); } }
.sb-n { font-size: 14px; } .sb-n b { font-variant-numeric: tabular-nums; }
#sb-t { opacity: .75; font-variant-numeric: tabular-nums; }
.sb-a { display: flex; gap: 6px; }
.selbar .btn { background: transparent; color: var(--bg); border-color: color-mix(in srgb, var(--bg) 30%, transparent); height: 34px; }
.selbar .sb-del { background: var(--danger); border-color: transparent; color: #fff; font-weight: 600; }
@media (min-width: 900px) { .selbar { left: calc(248px + 40px); right: 40px; bottom: 24px; max-width: 760px; margin: 0 auto; } }
#v-movimenti { padding-bottom: 70px; }

/* home: mappa senza hero */
.cc-mapcard > .card-h { margin-bottom: 0; }

.sum-row { flex-wrap: wrap; row-gap: 8px; }
.sum-r { margin-left: auto; }
#m-sum { white-space: nowrap; }
@media (max-width: 639px) { .xl-d { display: none; } }
body.has-sel .fab { display: none; }

/* =========================================================
   IMPORTA AGGIORNAMENTI — banner e confronto
   ========================================================= */
.zb { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 12px; align-items: center; border: 1px solid color-mix(in srgb, var(--danger) 25%, var(--line)) !important; }
.zb-ic { width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; background: var(--danger-soft); color: var(--danger); }
.zb-ic svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.zb-t { display: grid; gap: 3px; min-width: 0; }
.zb-t b { font-size: 14.5px; }
.zb-t span { font-size: 12.5px; color: var(--muted); line-height: 1.45; }
.zb-a { grid-column: 1 / -1; display: flex; gap: 8px; flex-wrap: wrap; }
@media (min-width: 900px) { .zb { grid-template-columns: auto minmax(0, 1fr) auto; } .zb-a { grid-column: auto; } }

.rv-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-bottom: 12px; }
@media (max-width: 479px) { .rv-kpis { grid-template-columns: 1fr 1fr; } }
.rv-kpis > div { background: var(--bg); border-radius: 12px; padding: 10px 12px; display: grid; gap: 1px; }
.rv-kpis b { font-size: 22px; font-weight: 700; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.rv-kpis span { font-size: 11.5px; color: var(--muted); font-weight: 500; }
.rv-kpis .warn { background: var(--danger-soft); } .rv-kpis .warn b { color: var(--danger); }
.rv-kpis .new { background: var(--accent-soft); } .rv-kpis .new b { color: var(--accent); }
.rv-same { margin: -4px 0 12px; }
.rv-sec { margin-bottom: 14px; }
.rv-h { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.rv-h b { font-size: 14px; }
.rv-h .chip.paid { background: var(--accent-soft); color: var(--accent); }
.rv-tg { margin-left: auto; border: 0; background: none; cursor: pointer; padding: 0; }
.rv-list { border: 1px solid var(--line); border-radius: 12px; max-height: 260px; overflow: auto; padding: 0 12px; }
.rv-sec.late .rv-list { border-color: color-mix(in srgb, var(--danger) 30%, var(--line)); }
.rv-row { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 10px; align-items: center; padding: 9px 0; border-top: 1px solid var(--line); cursor: pointer; }
.rv-row:first-child { border-top: 0; }
.rv-m { display: grid; min-width: 0; }
.rv-m .t { font-size: 13.5px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rv-m .s { font-size: 12.5px; color: var(--muted); }
.rv-m .s b { color: var(--ink); font-weight: 600; }
.rv-m em { font-style: normal; font-weight: 700; font-size: 12px; }
.rv-m em.up { color: var(--danger); } .rv-m em.down { color: #1a8a5a; }
.rv-pv { color: var(--danger); font-weight: 500; }
.zb-an { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
@media (max-width: 639px) { .zb-an { grid-template-columns: 1fr 1fr; } }
.zb-an > div { background: var(--bg); border-radius: 11px; padding: 9px 12px; display: grid; gap: 1px; }
.zb-an b { font-size: 19px; font-weight: 700; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.zb-an span { font-size: 11.5px; color: var(--muted); line-height: 1.3; }
.zb-an .bad b { color: var(--danger); } .zb-an .ok { background: var(--accent-soft); } .zb-an .ok b { color: var(--accent); }
@media (min-width: 900px) { .zb { grid-template-columns: auto minmax(0, 1fr); } .zb-a { grid-column: 1 / -1; } }
.rv-src { font-size: 11.5px !important; color: var(--accent) !important; }

/* =========================================================
   DETTAGLIO PRODOTTO — piazzali e cronologia
   ========================================================= */
.ad-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
@media (max-width: 479px) { .ad-kpis { grid-template-columns: 1fr 1fr; } }
.ad-kpis > div { background: var(--bg); border-radius: 12px; padding: 10px 12px; display: grid; gap: 2px; min-width: 0; }
.ad-kpis span { font-size: 11.5px; color: var(--muted); font-weight: 500; }
.ad-kpis b { font-size: 16px; font-weight: 700; letter-spacing: -.02em; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ad-var { margin-top: 10px; font-size: 13px; color: var(--danger); background: var(--danger-soft); padding: 8px 12px; border-radius: 10px; }
.ad-sec { margin-top: 18px; display: grid; gap: 10px; }
.ad-codes { display: flex; flex-wrap: wrap; gap: 6px; }
.ad-codes .chip { font-family: ui-monospace, Menlo, Consolas, monospace; font-weight: 500; }
.ad-pz { display: grid; gap: 12px; }
.ad-pr { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 12px; align-items: center; }
.ad-pm { display: grid; gap: 5px; min-width: 0; }
.ad-pt { display: flex; justify-content: space-between; gap: 10px; font-size: 13.5px; }
.ad-pt span { color: var(--ink-2); font-variant-numeric: tabular-nums; white-space: nowrap; }
.ad-pm small { font-size: 11.5px; color: var(--muted); }
.ad-pm .ct-bar i { animation: crgrow .8s var(--out) both; }
.tl { display: grid; gap: 4px; }
.tl-g { position: relative; }
.tl-d { font-size: 12px; font-weight: 600; color: var(--ink-2); padding: 8px 0 4px 22px; }
.tl-i { position: relative; display: block; padding: 8px 10px 8px 22px; margin-left: 0; border-radius: 10px; cursor: pointer; transition: background .15s; }
.tl-i:hover { background: var(--bg); }
.tl-g::before { content: ""; position: absolute; left: 6px; top: 26px; bottom: 6px; width: 2px; border-radius: 1px; background: var(--line); }
.tl-i i { position: absolute; left: 2px; top: 13px; width: 10px; height: 10px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 3px var(--surface); }
.tl-m { display: grid; gap: 2px; min-width: 0; }
.tl-t { display: flex; justify-content: space-between; gap: 10px; font-size: 13.5px; }
.tl-t span { font-weight: 600; font-variant-numeric: tabular-nums; }
.tl-s { font-size: 12.5px; color: var(--muted); }
.tl-s .up { color: var(--danger); }

/* =========================================================
   IVA — interruttore Netto / + IVA
   ========================================================= */
.iva-tg { position: relative; display: inline-grid; grid-template-columns: 1fr 1fr; align-items: center; height: 34px; padding: 3px; border-radius: 11px; border: 1px solid var(--line); background: var(--surface); cursor: pointer; font: inherit; font-size: 12.5px; font-weight: 600; isolation: isolate; }
.iva-tg span { position: relative; z-index: 1; padding: 0 11px; line-height: 26px; color: var(--muted); transition: color .25s; white-space: nowrap; text-align: center; }
.iva-tg i { position: absolute; z-index: 0; top: 3px; bottom: 3px; left: 3px; width: calc(50% - 3px); border-radius: 8px; background: var(--ink); transition: transform .35s var(--spring), background .25s; }
.iva-tg span:first-child { color: var(--bg); }
.iva-tg.on i { transform: translateX(100%); background: var(--accent); }
.iva-tg.on span:first-child { color: var(--muted); }
.iva-tg.on span:nth-child(2) { color: #fff; }
.iva-tg:active { transform: scale(.96); }
@media (max-width: 639px) { .top-r .sync { font-size: 0; gap: 0; } .iva-tg { height: 32px; font-size: 12px; } .iva-tg span { padding: 0 9px; } }

/* modulo: riepilogo IVA */
.iva-box { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 10px; align-items: end; margin-bottom: 12px; }
.iva-box label.f { margin: 0; }
.iva-sum { display: grid; gap: 3px; background: var(--bg); border-radius: 12px; padding: 9px 12px; }
.iva-sum > div { display: flex; justify-content: space-between; font-size: 12.5px; color: var(--muted); }
.iva-sum b { color: var(--ink-2); font-weight: 600; font-variant-numeric: tabular-nums; }
.iva-sum .t { border-top: 1px solid var(--line); padding-top: 4px; margin-top: 1px; color: var(--ink); font-size: 14px; }
.iva-sum .t b { color: var(--ink); font-weight: 700; }

/* =========================================================
   TEMA — selettore Automatico / Chiaro / Scuro
   ========================================================= */
.th-seg { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; padding: 4px; border-radius: 14px; background: var(--bg); border: 1px solid var(--line); isolation: isolate; }
.th-seg button { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 12px 6px 10px; border: 0; border-radius: 10px; background: transparent; color: var(--muted); font: inherit; font-size: 12.5px; font-weight: 600; cursor: pointer; transition: color .25s; }
.th-seg button svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: transform .4s var(--spring); }
.th-seg button.on { color: var(--accent); }
.th-seg button.on svg { transform: scale(1.12) rotate(-8deg); }
.th-seg i { position: absolute; z-index: 0; top: 4px; bottom: 4px; left: 4px; width: calc((100% - 16px) / 3); border-radius: 10px; background: var(--surface); box-shadow: 0 1px 3px rgba(0,0,0,.08), 0 4px 12px rgba(0,0,0,.06); transform: translateX(calc(var(--i, 0) * (100% + 4px))); transition: transform .4s var(--spring); }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .35s; }
.a-cnt { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.lb-m { display: none; }
@media (max-width: 639px) { .lb-d { display: none; } .lb-m { display: inline; } }

/* =========================================================
   GLS ATTREZZATI
   ========================================================= */
#v-gls { --c1: #3362ab; --c2: #eb6834; --c3: #1baf7a; --c4: #eda100; --c5: #e87ba4; --c-other: #b6bac3; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) #v-gls { --c1: #6d93db; --c2: #d95926; --c3: #199e70; } }
:root[data-theme="dark"] #v-gls { --c1: #6d93db; --c2: #d95926; --c3: #199e70; }
#gl-body { display: grid; gap: 12px; }
@media (min-width: 900px) { #gl-body { gap: 16px; } }
.gl-bar { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; }
.gl-month { display: inline-flex; align-items: center; gap: 2px; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 3px; }
.gl-month select { border: 0; background-color: transparent; height: 34px !important; min-height: 34px !important; font-weight: 700; font-size: 14.5px !important; width: auto; padding: 0 30px 0 8px; }
.gl-month .icon-btn { width: 32px; height: 32px; font-size: 20px; border-radius: 9px; }
.gl-month .icon-btn:disabled { opacity: .3; cursor: default; }
.gl-act { display: flex; gap: 8px; }
.gl-warn { display: grid; gap: 4px; border: 1px solid color-mix(in srgb, var(--danger) 35%, var(--line)) !important; background: var(--danger-soft); }
.gl-warn b { color: var(--danger); } .gl-warn span { font-size: 13px; color: var(--ink-2); }
.gl-pdf svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; margin-right: 6px; vertical-align: -3px; }
.gl-pdf { color: var(--danger) !important; }
.gl-pdf[hidden] { display: none !important; }

/* ---------- hero ---------- */
.gl-hero { --h1: #17366d; --h2: #3362ab; position: relative; overflow: hidden; border-radius: 22px; color: #fff; padding: 22px 20px 18px;
  background: radial-gradient(120% 140% at 100% 0%, #4677c7 0%, transparent 55%), linear-gradient(135deg, var(--h1) 0%, var(--h2) 100%);
  box-shadow: 0 18px 40px -22px rgba(23, 54, 109, .65); isolation: isolate; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .gl-hero { --h1: #0f2247; --h2: #244c8f; box-shadow: none; } }
:root[data-theme="dark"] .gl-hero { --h1: #0f2247; --h2: #244c8f; box-shadow: none; }
@media (min-width: 900px) { .gl-hero { padding: 30px 32px 24px; } }
.gh-top { position: relative; }
.gh-art { position: absolute; top: -30px; right: -32px; bottom: -14px; width: calc(100% + 40px); z-index: -1; -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 45%); mask-image: linear-gradient(90deg, transparent 0%, #000 45%); opacity: .95; }
@media (min-width: 900px) { .gh-art { width: 72%; } }
@media (max-width: 899px) { .gh-art { top: -22px; right: -20px; opacity: .6; } .ga-hero .gh-art { opacity: .32; } }
.gh-svg { width: 100%; height: 100%; display: block; }
.gh-main { position: relative; display: grid; gap: 4px; min-height: 120px; align-content: center; }
.gh-lbl { font-size: 12.5px; letter-spacing: .06em; text-transform: uppercase; font-weight: 600; opacity: .78; }
.gh-big { font-size: 46px; font-weight: 800; letter-spacing: -.035em; line-height: 1.02; font-variant-numeric: tabular-nums; }
@media (min-width: 900px) { .gh-big { font-size: 60px; } }
.gh-sub { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.gh-sub > span { font-size: 12.5px; font-weight: 600; padding: 4px 10px; border-radius: 999px; background: rgba(255, 255, 255, .13); border: 1px solid rgba(255, 255, 255, .16); backdrop-filter: blur(6px); }
.gh-sub .gl-d.up { background: rgba(226, 39, 38, .9); border-color: transparent; color: #fff; } .gh-sub .gl-d.down { background: rgba(27, 175, 122, .9); border-color: transparent; color: #fff; }
.gh-kpis { position: relative; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 22px; border-top: 1px solid rgba(255, 255, 255, .16); }
@media (min-width: 640px) { .gh-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .gh-kpis { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
.gh-k { display: grid; gap: 2px; padding: 14px 14px 2px 0; min-width: 0; }
@media (min-width: 1100px) { .gh-k + .gh-k { padding-left: 18px; border-left: 1px solid rgba(255, 255, 255, .14); } }
.gh-k span { font-size: 12px; opacity: .72; font-weight: 500; }
.gh-k b { font-size: 21px; font-weight: 700; letter-spacing: -.02em; white-space: nowrap; font-variant-numeric: tabular-nums; }
@media (min-width: 900px) { .gh-k b { font-size: 23px; } }
.gh-k small { font-size: 11.5px; opacity: .65; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cc-anim .gh-main > * { animation: rise .6s var(--out) both; } .cc-anim .gh-main > :nth-child(2) { animation-delay: 80ms; } .cc-anim .gh-main > :nth-child(3) { animation-delay: 160ms; }
.cc-anim .gh-k { animation: rise .55s var(--out) both; }
.cc-anim .gh-k:nth-child(1) { animation-delay: 250ms; } .cc-anim .gh-k:nth-child(2) { animation-delay: 310ms; } .cc-anim .gh-k:nth-child(3) { animation-delay: 370ms; } .cc-anim .gh-k:nth-child(4) { animation-delay: 430ms; } .cc-anim .gh-k:nth-child(5) { animation-delay: 490ms; } .cc-anim .gh-k:nth-child(6) { animation-delay: 550ms; }
.gl-hero-empty { min-height: 220px; display: grid; align-items: center; }
.gl-hero-empty h3 { font-size: 26px; margin: 4px 0 0; letter-spacing: -.02em; } .gl-hero-empty p { margin: 4px 0 0; opacity: .75; font-size: 14px; }
/* grafica delle rotte */
.gh-rings circle { fill: none; stroke: #fff; stroke-opacity: .10; stroke-dasharray: 2 6; }
.gh-rings { animation: ghspin 60s linear infinite; transform-box: fill-box; transform-origin: center; }
@keyframes ghspin { to { transform: rotate(360deg); } }
.gh-r { fill: none; stroke: #fff; stroke-opacity: .28; stroke-width: 1.2; stroke-dasharray: 1; stroke-dashoffset: 1; animation: ghdraw 1.6s var(--d) cubic-bezier(.6, .1, .2, 1) forwards; }
@keyframes ghdraw { to { stroke-dashoffset: 0; } }
.gh-f { fill: none; stroke: #fff; stroke-width: 2.2; stroke-linecap: round; stroke-dasharray: .07 .93; stroke-dashoffset: .07; opacity: 0; filter: drop-shadow(0 0 4px rgba(255, 255, 255, .9)); animation: ghflow var(--t) var(--d) cubic-bezier(.45, 0, .55, 1) infinite; }
.gh-f.red { stroke: #ff6b6a; filter: drop-shadow(0 0 5px rgba(255, 90, 90, .95)); }
@keyframes ghflow { 0% { stroke-dashoffset: .07; opacity: 0; } 8% { opacity: 1; } 85% { opacity: 1; } 100% { stroke-dashoffset: -.93; opacity: 0; } }
.gh-e { opacity: 0; animation: ghin .5s var(--d) var(--spring) forwards; }
@keyframes ghin { to { opacity: 1; } }
.gh-ec { fill: #fff; } .gh-ep { fill: none; stroke: #fff; stroke-width: 1; opacity: 0; transform-box: fill-box; transform-origin: center; animation: ghping 2.8s calc(var(--d) + 600ms) var(--out) infinite; }
@keyframes ghping { 0% { opacity: .8; transform: scale(.6); } 100% { opacity: 0; transform: scale(3); } }
.gh-oc { fill: #fff; } .gh-oi { fill: var(--h2, #3362ab); }
.gh-op { fill: none; stroke: #fff; stroke-width: 1.4; transform-box: fill-box; transform-origin: center; animation: ghping 2.4s var(--out) infinite; }
@media (prefers-reduced-motion: reduce) { .gh-r { animation: none; stroke-dashoffset: 0; } .gh-f, .gh-ep, .gh-op, .gh-rings { animation: none; opacity: 0; } .gh-e { animation: none; opacity: 1; } }

/* ---------- mappa ---------- */
.gl-mapcard .card-h { flex-wrap: wrap; gap: 6px 16px; }
.gl-leg2 { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--muted); }
.gl-leg2 i { width: 10px; height: 10px; border-radius: 50%; display: inline-block; } .gl-leg2 i.o { background: var(--danger); } .gl-leg2 i.p { background: var(--accent); margin-left: 10px; }
.gl-mapgrid { display: grid; gap: 14px; }
@media (min-width: 980px) { .gl-mapgrid { grid-template-columns: minmax(0, 1.25fr) minmax(320px, 1fr); gap: 24px; align-items: stretch; } }
.gl-map { position: relative; border-radius: 16px; background: var(--bg); padding: 6px; }
.gl-svg { width: 100%; height: auto; display: block; max-height: 680px; overflow: hidden; touch-action: pan-y; user-select: none; -webkit-user-select: none; border-radius: 12px; }
.gl-svg.zoomed { touch-action: none; cursor: grab; }
.gl-land { fill: var(--surface); stroke: color-mix(in srgb, var(--accent) 35%, var(--line)); stroke-width: .7; }
.gl-arc { opacity: .38; stroke: var(--accent); transition: opacity .2s, stroke .2s; }
.gl-arc.hl { opacity: 1; stroke: var(--danger); }
.gl-flow { fill: none; stroke: var(--accent); stroke-linecap: round; stroke-dasharray: .1 .9; stroke-dashoffset: .1; opacity: 0; animation: ghflow var(--t) var(--d) cubic-bezier(.45, 0, .55, 1) infinite; pointer-events: none; }
.gl-pin { cursor: pointer; }
.gl-pin .cm-c { fill: var(--accent); stroke: var(--surface); stroke-width: 1; transition: fill .2s; }
.gl-pin .gl-halo { fill: var(--accent); opacity: .14; }
.gl-pin.hl .cm-c, .gl-pin:hover .cm-c { fill: var(--danger); }
.gl-pin.hl .gl-halo { fill: var(--danger); opacity: .25; }
.gl-pn { fill: #fff; font-size: 6.4px; font-weight: 800; text-anchor: middle; pointer-events: none; font-variant-numeric: tabular-nums; }
.cc-anim .gl-pin > .cm-c, .cc-anim .gl-pin > .gl-halo { transform-box: fill-box; transform-origin: center; animation: cmpop .5s var(--d) var(--spring) both; }
.cc-anim .gl-pin > .gl-pn { animation: rise0 .4s calc(var(--d) + 250ms) both; } @keyframes rise0 { from { opacity: 0; } }
.gl-orig .gl-oc { fill: var(--danger); stroke: var(--surface); stroke-width: 1.6; } .gl-orig .gl-oi { fill: #fff; }
.gl-op { fill: none; stroke: var(--danger); stroke-width: 1.1; opacity: 0; transform-box: fill-box; transform-origin: center; animation: cmpulse 2.4s 1.2s var(--out) infinite; }
.gl-op2 { animation-delay: 2.4s; }
.gl-on { fill: var(--danger); font-size: 8.5px; font-weight: 800; letter-spacing: .06em; paint-order: stroke; stroke: var(--bg); stroke-width: 2.5px; }
.gl-os { fill: var(--muted); font-size: 6px; font-weight: 600; paint-order: stroke; stroke: var(--bg); stroke-width: 2px; }
.cc-anim .gl-orig > .gl-oc { animation: cmpop .6s .3s var(--spring) both; transform-box: fill-box; transform-origin: center; }
.gl-map .cm-tip { line-height: 1.45; }
/* elenco destinazioni */
.gl-dest { display: flex; flex-direction: column; min-height: 0; }
.gd-h { display: flex; justify-content: space-between; font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); font-weight: 600; padding: 0 4px 8px; border-bottom: 1px solid var(--line); }
.gd-l { display: grid; align-content: start; overflow-y: auto; max-height: 560px; padding-right: 2px; }
@media (min-width: 980px) { .gl-dest { position: relative; } .gd-l { position: absolute; inset: 30px 0 0 0; max-height: none; } }
.gd-r { display: grid; grid-template-columns: 26px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 9px 6px; border-bottom: 1px solid var(--line); cursor: pointer; border-radius: 10px; transition: background .15s; }
.gd-r:hover, .gd-r.hl { background: var(--accent-soft); }
.cc-anim .gd-r { animation: rise .45s var(--d) var(--out) both; }
.gd-n { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font-size: 11px; font-weight: 800; color: var(--muted); background: var(--bg); font-variant-numeric: tabular-nums; }
.gd-n.nb { background: var(--accent); color: #fff; }
.gd-r.hl .gd-n { background: var(--danger); color: #fff; }
.gd-m { display: grid; min-width: 0; gap: 1px; }
.gd-m b { font-size: 13.5px; font-weight: 650; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gd-m b em { font-style: normal; font-size: 11px; color: var(--muted); font-weight: 600; }
.gd-m small { font-size: 11.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gd-b { height: 3px; border-radius: 2px; background: var(--bg); margin-top: 4px; overflow: hidden; } .gd-b i { display: block; height: 100%; background: var(--accent); border-radius: 2px; }
.gd-v { font-size: 13.5px; font-variant-numeric: tabular-nums; }

.gl-2, .gl-3 { display: grid; gap: 12px; }
@media (min-width: 900px) { .gl-2 { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; } }
@media (min-width: 1100px) { .gl-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; } }
@media (min-width: 700px) and (max-width: 1099px) { .gl-3 { grid-template-columns: 1fr 1fr; } .gl-3 > :first-child { grid-column: 1 / -1; } }
.gl-anim-row { }
.cc-anim .gl-anim-row { animation: rise .45s var(--d) var(--out) both; }
.cc-anim .gl-anim-row .bar-fill, .cc-anim .gb-t i { animation: crgrow .9s calc(var(--d) + 120ms) var(--out) both; transform-origin: left; }
#gl-reg .bar-top em { font-style: normal; color: var(--muted); font-size: 11.5px; margin-left: 8px; }
.gl-months .mb.gl-mb { cursor: pointer; }

/* contratti */
.gl-split { display: flex; gap: 2px; height: 10px; border-radius: 5px; overflow: hidden; margin-bottom: 14px; }
.gl-split i { display: block; height: 100%; }
.gs-0 { background: var(--c1); } .gs-1 { background: var(--c2); }
.cc-anim .gl-split { animation: crgrow 1s .3s var(--out) both; transform-origin: left; }
.gl-cs { display: grid; gap: 10px; }
@media (min-width: 700px) and (max-width: 1099px) { .gl-cs { grid-template-columns: 1fr 1fr; } }
.gl-c { background: var(--bg); border-radius: 14px; padding: 12px 14px; }
.gl-ch { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; font-size: 13px; font-weight: 600; }
.gl-ch > b { font-size: 17px; font-variant-numeric: tabular-nums; white-space: nowrap; } .gl-ch em { font-style: normal; font-size: 11.5px; color: var(--muted); margin-left: 6px; font-weight: 600; }
.gl-dot { display: inline-block; width: 9px; height: 9px; border-radius: 3px; margin-right: 7px; vertical-align: 0; }
.gl-ct { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-top: 10px; }
.gl-ct > div { display: grid; gap: 1px; min-width: 0; } .gl-ct small { font-size: 10.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .gl-ct b { font-size: 13px; font-variant-numeric: tabular-nums; white-space: nowrap; }
/* composizione: anello */
.gl-ring { position: relative; width: 168px; height: 168px; margin: 0 auto 4px; }
.gl-ring svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.gl-rb { fill: none; stroke: var(--bg); stroke-width: 13; }
.gl-rs { fill: none; stroke-width: 13; background: none !important; }
.gl-rs.gc-0 { stroke: var(--c1); } .gl-rs.gc-1 { stroke: var(--c2); } .gl-rs.gc-2 { stroke: var(--c3); }
.cc-anim .gl-rs { animation: glring 1.1s var(--d) var(--out) both; }
@keyframes glring { from { stroke-dasharray: 0 1; } }
.gl-rc { position: absolute; inset: 0; display: grid; place-content: center; text-align: center; gap: 2px; }
.gl-rc b { font-size: 18px; letter-spacing: -.02em; font-variant-numeric: tabular-nums; } .gl-rc small { font-size: 11px; color: var(--muted); }
.gc-0 { background: var(--c1); } .gc-1 { background: var(--c2); } .gc-2 { background: var(--c3); }
.gl-leg { margin-top: 10px; } .gl-leg li { grid-template-columns: 10px minmax(0, 1fr) auto 44px; }
/* tipologia */
.gl-tipi { display: grid; gap: 10px; }
.gl-ti { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 12px; border-radius: 14px; background: var(--bg); }
.cc-anim .gl-ti { animation: rise .45s var(--out) both; } .cc-anim .gl-ti:nth-child(2) { animation-delay: 80ms; } .cc-anim .gl-ti:nth-child(3) { animation-delay: 160ms; }
.gl-tic { width: 40px; height: 40px; border-radius: 11px; display: grid; place-items: center; background: var(--surface); color: var(--accent); }
.gl-tic svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.gl-ti > div { display: grid; min-width: 0; gap: 1px; } .gl-ti b { font-size: 13.5px; } .gl-ti small { font-size: 11.5px; color: var(--muted); }
.gl-tb { height: 4px; border-radius: 2px; background: var(--surface); margin-top: 5px; overflow: hidden; } .gl-tb i { display: block; height: 100%; background: var(--accent); border-radius: 2px; }
.cc-anim .gl-tb i { animation: crgrow .9s .4s var(--out) both; transform-origin: left; }
.gl-tv { text-align: right; display: grid; } .gl-tv b { font-variant-numeric: tabular-nums; font-size: 15px; }
/* fasce */
.gl-bands { display: grid; gap: 10px; }
.gb-row { display: grid; grid-template-columns: 118px minmax(0, 1fr) 70px; gap: 12px; align-items: center; font-size: 13px; }
.gb-l { color: var(--ink); font-weight: 600; white-space: nowrap; display: grid; } .gb-l small { color: var(--muted); font-weight: 500; font-size: 11px; }
.gb-t { height: 8px; border-radius: 4px; background: var(--bg); overflow: hidden; }
.gb-t i { display: block; height: 100%; border-radius: 4px; background: var(--accent); }
.gb-v { text-align: right; font-variant-numeric: tabular-nums; }
@media (max-width: 479px) { .gb-row { grid-template-columns: 104px minmax(0, 1fr) 62px; gap: 8px; } }

/* giorni */
.gl-days { gap: 4px; height: 170px; }
.gl-days .mb i { max-width: 22px; }
.gl-days .mbl { font-size: 10px; }
@media (max-width: 699px) { .gl-days .mbv { display: none; } .gl-days .mb:nth-child(even) .mbl { visibility: hidden; } }
.gl-days .mb.we i { opacity: .45; }
.gl-days .mbv { font-size: 9px; }
/* tabella centri di costo */
.gl-tab td:first-child { max-width: none; white-space: nowrap; }
.gl-tab tbody tr[data-gcdc] { cursor: pointer; }
.gl-tab tbody tr[data-gcdc]:hover td { background: var(--bg); }
.gl-cc { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 12px; color: var(--accent); margin-right: 4px; }
.gl-tab .chip.paid { background: var(--accent-soft); color: var(--accent); }
.gl-rr td { color: var(--accent); font-weight: 600; border-bottom: 0; }
/* anomalie */
.gl-an { display: grid; gap: 8px; }
.ga-row { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; gap: 12px; align-items: start; padding: 12px; border-radius: 12px; background: var(--bg); cursor: pointer; transition: transform .15s var(--out); }
.ga-row:hover { transform: translateX(2px); }
.ga-row.warn .ci-ic { background: var(--danger-soft); color: var(--danger); }
.cc-anim .ga-row { animation: rise .45s calc(var(--d) + 300ms) var(--out) both; }
.ga-m { display: grid; gap: 3px; min-width: 0; }
.ga-m b { font-size: 13.5px; } .ga-m span { font-size: 12.5px; color: var(--ink-2); line-height: 1.45; } .ga-m small { font-size: 11px; color: var(--muted); font-family: ui-monospace, Menlo, Consolas, monospace; overflow-wrap: anywhere; }
.ga-v { font-size: 13px; white-space: nowrap; color: var(--ink); }
.ga-row.warn .ga-v { color: var(--danger); }
@media (max-width: 479px) { .ga-row { grid-template-columns: 30px minmax(0, 1fr); } .ga-v { grid-column: 2; } }
/* elenco */
.gl-f { margin-bottom: 10px; }
.gl-st .chip.gk-C1, .ic.gk-C1 { background: color-mix(in srgb, var(--c1) 14%, transparent); color: var(--c1); }
.gl-st .chip.gk-C2, .ic.gk-C2 { background: color-mix(in srgb, var(--c2) 16%, transparent); color: var(--c2); }
.gl-st tbody tr { cursor: pointer; }

/* =========================================================
   GASOLIO
   ========================================================= */
#ga-body { display: grid; gap: 12px; }
@media (min-width: 900px) { #ga-body { gap: 16px; } }
#v-gasolio { --c1: #3362ab; --fuel: #f39c34; }
#ga-add { padding: 7px 12px; border-radius: 10px; }
.ga-hero .gh-art { -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 30%); mask-image: linear-gradient(90deg, transparent 0%, #000 30%); }
@media (min-width: 900px) { .ga-hero .gh-art { width: 52%; top: -26px; bottom: -18px; } }
.gh-chip { font: inherit; font-size: 12.5px; font-weight: 700; padding: 4px 12px; border-radius: 999px; border: 1px dashed rgba(255, 255, 255, .55); background: transparent; color: #fff; cursor: pointer; }
.gh-chip:hover { background: rgba(255, 255, 255, .12); }
/* indicatore */
.ga-svg .gg-arc { fill: none; stroke: #fff; stroke-opacity: .16; stroke-width: 6; stroke-linecap: round; }
.ga-svg .gg-lvl { fill: none; stroke: #ffc15e; stroke-width: 6; stroke-linecap: round; stroke-dasharray: var(--lv) 1; filter: drop-shadow(0 0 6px rgba(255, 193, 94, .7)); animation: gglvl 1.8s .4s cubic-bezier(.3, .7, .2, 1) both; }
@keyframes gglvl { from { stroke-dasharray: 0 1; } }
.ga-svg .gg-t { stroke: #fff; stroke-opacity: .35; stroke-width: 1.2; } .ga-svg .gg-t.m { stroke-opacity: .75; stroke-width: 2; }
.ga-svg .gg-e { fill: #fff; opacity: .8; font-size: 13px; font-weight: 800; }
.ga-svg .gg-ndl { transform-box: view-box; transform-origin: 420px 178px; transform: rotate(var(--deg)); animation: ggndl 2.2s .3s cubic-bezier(.25, 1.4, .4, 1) both, ggidle 4s 2.6s ease-in-out infinite; }
.ga-svg .gg-ndl path { fill: #fff; filter: drop-shadow(0 0 4px rgba(255, 255, 255, .6)); }
@keyframes ggndl { from { transform: rotate(-108deg); } }
@keyframes ggidle { 0%, 100% { transform: rotate(var(--deg)); } 50% { transform: rotate(calc(var(--deg) - 2.5deg)); } }
.ga-svg .gg-hub { fill: #fff; } .ga-svg .gg-hub2 { fill: var(--h2, #3362ab); }
.ga-svg .ga-pipe { fill: none; stroke: #fff; stroke-opacity: .22; stroke-width: 1.4; stroke-dasharray: 1; stroke-dashoffset: 1; animation: ghdraw 1.6s .2s cubic-bezier(.6, .1, .2, 1) forwards; }
.ga-svg .ga-pulse { fill: none; stroke: #ffc15e; stroke-width: 2.6; stroke-linecap: round; stroke-dasharray: .08 .92; stroke-dashoffset: .08; opacity: 0; filter: drop-shadow(0 0 5px rgba(255, 193, 94, .95)); animation: ghflow 2.8s 1.4s cubic-bezier(.45, 0, .55, 1) infinite; }
/* goccia */
.ga-svg .ga-drop { fill: none; stroke: #fff; stroke-width: 2; stroke-opacity: .9; }
.ga-svg .ga-liq { transform: translateY(185px); animation: galiq 2s .5s cubic-bezier(.3, .7, .2, 1) forwards; }
@keyframes galiq { to { transform: translateY(var(--dy)); } }
.ga-svg .ga-w1 { animation: gawave 3.2s linear infinite; } .ga-svg .ga-w2 { animation: gawave 2.2s linear infinite reverse; }
@keyframes gawave { from { transform: translateX(0); } to { transform: translateX(-60px); } }
.ga-svg .ga-bub { fill: #fff; opacity: 0; animation: gabub 2.8s var(--d) ease-in infinite; }
@keyframes gabub { 0% { opacity: 0; transform: translateY(0); } 20% { opacity: .7; } 100% { opacity: 0; transform: translateY(-70px); } }
@media (prefers-reduced-motion: reduce) { .ga-svg * { animation: none !important; } .ga-svg .ga-liq { transform: translateY(var(--dy)); } .ga-svg .ga-pipe { stroke-dashoffset: 0; } }

/* mezzi */
.ga-veh { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
.gv-c { background: var(--bg); border-radius: 16px; padding: 14px; display: grid; gap: 8px; cursor: pointer; border: 1.5px solid transparent; transition: transform .18s var(--out), border-color .18s, box-shadow .18s; }
.gv-c:hover { transform: translateY(-2px); box-shadow: 0 10px 24px -16px rgba(20, 40, 80, .45); }
.gv-c.on { border-color: var(--accent); background: var(--accent-soft); }
.cc-anim .gv-c { animation: rise .5s var(--d) var(--out) both; }
.gv-top { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.gv-plate { display: inline-flex; align-items: stretch; border: 1.5px solid #1b1f27; border-radius: 6px; overflow: hidden; background: #fff; color: #111; height: 28px; font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; box-shadow: 0 1px 0 rgba(0, 0, 0, .05); }
.gv-plate i { width: 15px; background: #1f4fbf; color: #fff; font-style: normal; font-size: 9px; font-weight: 800; display: grid; place-items: end center; padding-bottom: 3px; font-family: system-ui, sans-serif; }
.gv-plate b { padding: 0 9px; display: grid; place-items: center; font-size: 14px; letter-spacing: .06em; font-weight: 800; }
.gv-plate::after { content: ""; width: 15px; background: #1f4fbf; }
.gv-plate.sm { height: 22px; } .gv-plate.sm b { font-size: 12px; padding: 0 6px; } .gv-plate.sm i, .gv-plate.sm::after { width: 11px; font-size: 7px; }
.gv-l { text-align: right; display: grid; } .gv-l b { font-size: 18px; letter-spacing: -.02em; font-variant-numeric: tabular-nums; } .gv-l small { font-size: 11px; color: var(--muted); }
.gv-name { font-size: 12.5px; font-weight: 600; color: var(--ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .gv-name em { font-style: normal; color: var(--muted); font-weight: 500; }
.gv-tank { height: 8px; border-radius: 4px; background: var(--surface); overflow: hidden; }
.gv-tank i { display: block; height: 100%; border-radius: 4px; background: linear-gradient(90deg, #f6b44f, #f08a24); }
.cc-anim .gv-tank i { animation: crgrow 1s calc(var(--d) + 200ms) var(--out) both; transform-origin: left; }
.gv-st { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.gv-st > div { display: grid; min-width: 0; } .gv-st small { font-size: 10.5px; color: var(--muted); } .gv-st b { font-size: 13px; font-variant-numeric: tabular-nums; white-space: nowrap; }
/* linea del tempo */
.ga-tl { overflow-x: auto; }
.ga-tsvg { width: 100%; min-width: 620px; display: block; }
.ga-tk { stroke: var(--line); stroke-width: 1; vector-effect: non-scaling-stroke; }
.ga-tkl { fill: var(--muted); font-size: 11px; text-anchor: middle; }
.ga-ll { fill: var(--ink-2); font-size: 11.5px; font-weight: 700; font-family: ui-monospace, Menlo, Consolas, monospace; }
.ga-lt { stroke: var(--line); stroke-dasharray: 2 4; vector-effect: non-scaling-stroke; }
.ga-lp { fill: none; stroke: var(--accent); stroke-opacity: .45; stroke-width: 1.5; }
.cc-anim .ga-lp { stroke-dasharray: 1; animation: cmdraw 1.2s var(--d) var(--out) both; }
.ga-dot { fill: #f39c34; fill-opacity: .85; stroke: var(--surface); stroke-width: 1.5; cursor: pointer; transition: fill-opacity .15s; }
.ga-dot:hover { fill-opacity: 1; stroke: var(--ink); }
.cc-anim .ga-dot { transform-box: fill-box; transform-origin: center; animation: cmpop .5s var(--d) var(--spring) both; }
.ga-lane { cursor: pointer; } .ga-lane:hover .ga-ll { fill: var(--accent); }
/* barre */
.ga-bars { height: 190px; }
@media (min-width: 900px) { .ga-bars { height: 360px; } .ga-wd { height: 350px !important; } }
.ga-bars .mb i { max-width: 46px; background: linear-gradient(180deg, #f6b44f, #f08a24) !important; opacity: .55; }
.ga-bars .mb i.cur { opacity: 1; }
.ga-bars .mb.gl-mb { cursor: pointer; }
#ga-uso .bar-top em { font-style: normal; color: var(--muted); font-size: 11.5px; margin-left: 8px; }
/* operatori */
.ga-ops { display: grid; gap: 4px; }
.ga-op { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 8px 4px; border-bottom: 1px solid var(--line); }
.ga-op:last-child { border-bottom: 0; }
.cc-anim .ga-op { animation: rise .45s var(--d) var(--out) both; }
.ga-av { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: var(--accent); color: #fff; font-weight: 800; font-size: 13px; letter-spacing: .02em; }
.ga-op.na .ga-av { background: var(--bg); color: var(--muted); }
.ga-om { display: grid; min-width: 0; } .ga-om b { font-size: 13.5px; } .ga-om small { font-size: 11.5px; color: var(--muted); }
.ga-op > b { font-variant-numeric: tabular-nums; font-size: 14px; }
/* giorni */
.ga-wd { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8px; align-items: end; height: 220px; }
.ga-w { display: grid; grid-template-rows: 1fr auto auto auto; justify-items: center; height: 100%; gap: 3px; }
.ga-wb { width: 100%; max-width: 46px; height: 100%; background: var(--bg); border-radius: 10px; display: flex; align-items: flex-end; overflow: hidden; }
.ga-wb i { display: block; width: 100%; border-radius: 10px; background: linear-gradient(180deg, #5d86cf, var(--accent)); }
.cc-anim .ga-wb i { animation: wdgrow 1s var(--d) var(--out) both; transform-origin: bottom; }
@keyframes wdgrow { from { transform: scaleY(0); } }
.ga-w b { font-size: 13px; font-variant-numeric: tabular-nums; } .ga-w small { font-size: 11.5px; color: var(--ink-2); font-weight: 600; } .ga-w em { font-style: normal; font-size: 10.5px; color: var(--muted); min-height: 13px; }
.ga-f { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; }
@media (min-width: 640px) { .ga-f { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); } }
.ga-ic { background: color-mix(in srgb, #f39c34 18%, transparent) !important; color: #e07f12 !important; }
.ga-ic svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.gl-st .gv-plate { vertical-align: middle; }

/* =========================================================
   SOTTO-SCHEDE ATTREZZATURA
   ========================================================= */
.sub-tabs { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; margin-bottom: 4px; }
.sub-tabs a { padding: 8px 16px; border-radius: 999px; font-size: 13.5px; font-weight: 600; color: var(--ink-2); text-decoration: none; background: var(--surface); border: 1px solid var(--line); transition: background .15s, color .15s; }
.sub-tabs a:hover { color: var(--ink); }
.sub-tabs a.on { background: var(--ink); color: var(--surface); border-color: var(--ink); }
.sub-tabs .st-h { font-size: 12.5px; color: var(--muted); margin-left: 8px; }
@media (max-width: 639px) { .sub-tabs { flex-wrap: nowrap; overflow-x: auto; } .sub-tabs a { flex: 1 0 auto; text-align: center; padding: 8px 12px; } .sub-tabs .st-h { display: none; } }
#v-attr, #v-movimenti, #v-articoli { --st: 1; }

/* =========================================================
   DASHBOARD GENERALE
   ========================================================= */
#v-home { --a-att: #3362ab; --a-gls: #1baf7a; --a-gas: #eda100; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) #v-home { --a-att: #6d93db; --a-gls: #199e70; --a-gas: #c98500; } }
:root[data-theme="dark"] #v-home { --a-att: #6d93db; --a-gls: #199e70; --a-gas: #c98500; }
#ov-body { display: grid; gap: 12px; }
@media (min-width: 900px) { #ov-body { gap: 16px; } }
#v-home .a-att { --a: var(--a-att); } #v-home .a-gls { --a: var(--a-gls); } #v-home .a-gas { --a: var(--a-gas); }
/* hero */
.ov-hero .gh-art { -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 40%); mask-image: linear-gradient(90deg, transparent 0%, #000 40%); }
@media (min-width: 900px) { .ov-hero .gh-art { width: 46%; } }
@media (max-width: 899px) { .ov-hero .gh-art { opacity: .35; } }
.ov-chip { display: inline-flex; align-items: center; gap: 6px; }
.ov-chip i { width: 8px; height: 8px; border-radius: 50%; background: var(--a); box-shadow: 0 0 0 2px rgba(255, 255, 255, .7); }
.ov-hero .ov-chip i.a-att { background: #fff; } .ov-hero .ov-chip i.a-gls { background: #7ee0b5; } .ov-hero .ov-chip i.a-gas { background: #ffc15e; }
.ov-stack { position: relative; display: flex; gap: 3px; height: 8px; margin-top: 22px; border-radius: 4px; overflow: hidden; }
.ov-stack i { display: block; height: 100%; border-radius: 2px; }
.ov-stack i.a-att { background: #fff; } .ov-stack i.a-gls { background: #7ee0b5; } .ov-stack i.a-gas { background: #ffc15e; }
.cc-anim .ov-stack { animation: crgrow 1.2s .3s var(--out) both; transform-origin: left; }
.ov-hero .gh-kpis { margin-top: 14px; border-top: 0; }
.ov-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; margin-right: 6px; vertical-align: 1px; }
.ov-dot.a-att { background: #fff; } .ov-dot.a-gls { background: #7ee0b5; } .ov-dot.a-gas { background: #ffc15e; }
.ov-svg .ov-rb { fill: none; stroke: #fff; stroke-opacity: .1; stroke-width: 16; }
.ov-svg .ov-rs { fill: none; stroke-width: 16; animation: glring 1.4s var(--d) cubic-bezier(.3, .7, .2, 1) both; }
.ov-svg .ov-rp { fill: none; stroke: #fff; stroke-opacity: .18; stroke-dasharray: 2 5; animation: ghspin 40s linear infinite reverse; transform-box: fill-box; transform-origin: center; }
.ov-svg .ov-orb circle { fill: none; stroke: #fff; stroke-opacity: .1; }
.ov-svg .ov-sat { transform-box: view-box; transform-origin: 520px 130px; animation: ovorb var(--t) linear infinite; transform: rotate(var(--o, 0deg)); }
.ov-svg .ov-sat circle { fill: #fff; filter: drop-shadow(0 0 4px rgba(255, 255, 255, .9)); }
@keyframes ovorb { from { transform: rotate(var(--o, 0deg)); } to { transform: rotate(calc(var(--o, 0deg) + 360deg)); } }
.ov-svg .ov-tick { stroke: #fff; stroke-opacity: .5; stroke-width: 2; stroke-linecap: round; }
@media (prefers-reduced-motion: reduce) { .ov-svg * { animation: none !important; } }
/* aree */
.ov-areas { display: grid; gap: 12px; }
@media (min-width: 760px) { .ov-areas { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; } }
.ov-area { display: grid; gap: 6px; text-decoration: none; color: inherit; position: relative; overflow: hidden; transition: transform .2s var(--out), box-shadow .2s; }
.ov-area::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 3px; background: var(--a); }
.ov-area:hover { transform: translateY(-3px); box-shadow: 0 16px 34px -22px rgba(20, 40, 80, .5); }
.cc-anim .ov-area { animation: rise .55s var(--d) var(--out) both; }
.ov-ah { display: flex; align-items: center; gap: 10px; }
.ov-ic { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; color: var(--a); background: color-mix(in srgb, var(--a) 14%, transparent); }
.ov-ic svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.ov-at { font-weight: 700; font-size: 14px; flex: 1; }
.ov-go { display: inline-flex; align-items: center; gap: 2px; font-size: 12.5px; font-weight: 600; color: var(--muted); transition: color .15s, gap .15s; }
.ov-go svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; }
.ov-area:hover .ov-go { color: var(--a); gap: 6px; }
.ov-av { display: flex; align-items: baseline; gap: 10px; margin-top: 6px; }
.ov-av b { font-size: 30px; font-weight: 800; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.ov-d { font-size: 12px; font-weight: 700; padding: 2px 8px; border-radius: 999px; }
.ov-d.up { background: var(--danger-soft); color: var(--danger); } .ov-d.down { background: color-mix(in srgb, #1baf7a 15%, transparent); color: #168a60; }
.ov-note { font-size: 12.5px; color: var(--muted); }
.ov-spark { width: 100%; height: 48px; display: block; margin: 4px 0 2px; overflow: visible; }
.ov-sl { fill: none; stroke: var(--a); stroke-width: 2.2; stroke-linejoin: round; stroke-linecap: round; }
.cc-anim .ov-sl { stroke-dasharray: 1; animation: cmdraw 1.4s var(--d) var(--out) both; }
.ov-sa { fill: var(--a); opacity: .1; }
.ov-sd { fill: var(--surface); stroke: var(--a); stroke-width: 2.4; }
.ov-as { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; padding-top: 10px; border-top: 1px solid var(--line); }
.ov-as > div { display: grid; min-width: 0; } .ov-as b { font-size: 14px; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .ov-as small { font-size: 11px; color: var(--muted); }
/* barre impilate */
.ov-trend .card-h { flex-wrap: wrap; gap: 6px 16px; }
.ov-leg { display: flex; gap: 14px; flex-wrap: wrap; font-size: 12px; color: var(--muted); }
.ov-leg i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; background: var(--a); margin-right: 6px; vertical-align: -1px; }
.ov-bars { display: flex; align-items: flex-end; gap: 10px; height: 240px; padding-top: 18px; }
@media (min-width: 900px) { .ov-bars { height: 280px; gap: 16px; } }
.ov-b { flex: 1; min-width: 0; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 6px; cursor: pointer; }
.ov-bc { width: 100%; max-width: 64px; display: flex; flex-direction: column; gap: 2px; border-radius: 8px; overflow: hidden; transition: opacity .2s, transform .2s; }
.ov-bc i { display: block; width: 100%; background: var(--a); min-height: 2px; }
.cc-anim .ov-bc { animation: wdgrow .9s var(--d) var(--out) both; transform-origin: bottom; }
.ov-bars:hover .ov-b:not(:hover) .ov-bc { opacity: .55; }
.ov-b.on .ov-bc { box-shadow: 0 0 0 2px var(--surface), 0 0 0 4px var(--ink); }
.ov-bv { font-size: 11px; color: var(--ink-2); font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ov-bl { font-size: 11.5px; color: var(--muted); font-weight: 600; text-transform: capitalize; white-space: nowrap; }
@media (max-width: 639px) { .ov-bars { gap: 5px; } .ov-bv { display: none; } }
/* 2 e 3 colonne */
.ov-2, .ov-3 { display: grid; gap: 12px; }
@media (min-width: 900px) { .ov-2 { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; } .ov-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; } }
@media (min-width: 640px) and (max-width: 899px) { .ov-3 { grid-template-columns: 1fr 1fr; } }
.ov-al { display: grid; gap: 8px; }
.ov-ar { display: grid; grid-template-columns: 10px minmax(0, 1fr) 18px; gap: 12px; align-items: center; text-align: left; padding: 12px 14px; border-radius: 12px; background: var(--bg); border: 0; font: inherit; color: inherit; cursor: pointer; transition: transform .15s var(--out), background .15s; }
.ov-ar:hover { transform: translateX(3px); background: color-mix(in srgb, var(--a) 10%, var(--bg)); }
.cc-anim .ov-ar { animation: rise .45s var(--d) var(--out) both; }
.ov-ad { width: 10px; height: 10px; border-radius: 50%; background: var(--a); box-shadow: 0 0 0 4px color-mix(in srgb, var(--a) 20%, transparent); }
.ov-am { display: grid; min-width: 0; } .ov-am b { font-size: 13.5px; } .ov-am small { font-size: 12px; color: var(--muted); }
.ov-ar svg { width: 16px; height: 16px; fill: none; stroke: var(--muted); stroke-width: 2; }
.ov-feed { display: grid; }
.ov-fr { display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 9px 2px; border-bottom: 1px solid var(--line); text-decoration: none; color: inherit; }
.ov-fr:last-child { border-bottom: 0; }
.cc-anim .ov-fr { animation: rise .45s var(--d) var(--out) both; }
.ov-fi { width: 32px; height: 32px; border-radius: 9px; display: grid; place-items: center; color: var(--a); background: color-mix(in srgb, var(--a) 13%, transparent); }
.ov-fi svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.ov-fm { display: grid; min-width: 0; } .ov-fm b { font-size: 13px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .ov-fm small { font-size: 11.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ov-fv { font-size: 13px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ov-top { display: grid; }
.ov-tr { display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 9px 0; border-bottom: 1px solid var(--line); }
.ov-tr:last-child { border-bottom: 0; }
.cc-anim .ov-tr { animation: rise .45s var(--d) var(--out) both; }
.ov-tn { width: 24px; height: 24px; border-radius: 50%; background: var(--bg); display: grid; place-items: center; font-size: 11px; font-weight: 800; color: var(--muted); }
.ov-tr:first-child .ov-tn { background: var(--ink); color: var(--surface); }
.ov-tm { display: grid; min-width: 0; } .ov-tm b { font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .ov-tm small { font-size: 11px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ov-tr > b { font-size: 13.5px; font-variant-numeric: tabular-nums; }
/* noleggi */
.ga-vh { display: inline-flex; align-items: center; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }
.gv-rent { display: flex; justify-content: space-between; gap: 8px; flex-wrap: wrap; font-size: 12px; color: var(--muted); padding: 7px 10px; border-radius: 10px; background: var(--surface); }
.gv-rent b { color: var(--ink); font-variant-numeric: tabular-nums; }
@media (min-width: 1100px) { .ga-veh { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.ga-ct td:first-child { white-space: nowrap; }
.ga-ct .m2 { color: var(--muted); font-size: 12px; margin-left: 6px; }
.ga-ct tbody tr[data-gtarga] { cursor: pointer; }
.ga-ct tbody tr[data-gtarga]:hover td { background: var(--bg); }
.ga-oth td { color: var(--ink-2); }
.ga-cn { margin-top: 10px; font-size: 12.5px; color: var(--muted); background: var(--bg); border-radius: 10px; padding: 8px 12px; }
.ga-cn .link { background: none; border: 0; padding: 0; font: inherit; color: var(--accent); font-weight: 600; cursor: pointer; }
.gv-nick { font-size: 15px; font-weight: 800; letter-spacing: -.01em; margin-top: -2px; }
.gv-addn { justify-self: start; font: inherit; font-size: 12px; font-weight: 600; color: var(--accent); background: none; border: 1px dashed color-mix(in srgb, var(--accent) 45%, transparent); border-radius: 999px; padding: 2px 10px; cursor: pointer; }
.gv-addn:hover { background: var(--accent-soft); }
.ga-fr { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, .8fr); gap: 10px; }
@media (max-width: 479px) { .ga-fr { grid-template-columns: 1fr 1fr; } .ga-fr > :first-child { grid-column: 1 / -1; } .ga-fr { padding-bottom: 8px; border-bottom: 1px solid var(--line); margin-bottom: 8px; } }
.ga-nm { font-size: 13px; margin-left: 6px; }
.gv-nick { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; justify-self: start; }
.gv-nick svg { width: 13px; height: 13px; fill: none; stroke: var(--muted); stroke-width: 2; stroke-linejoin: round; opacity: 0; transition: opacity .15s; }
.gv-nick:hover svg { opacity: 1; }
@media (hover: none) { .gv-nick svg { opacity: .6; } }
/* accesso */
.login-note { display: flex; align-items: center; justify-content: center; gap: 6px; font-size: 12px !important; }
.login-note svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.8; flex: none; }


/* =========================================================
   FATTURE
   ========================================================= */
#fa-body { display: grid; gap: 12px; }
@media (min-width: 900px) { #fa-body { gap: 16px; } }
#fa-add { padding: 7px 12px; border-radius: 10px; }
.fa-hero .gh-art { -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 35%); mask-image: linear-gradient(90deg, transparent 0%, #000 35%); }
@media (min-width: 900px) { .fa-hero .gh-art { width: 46%; } }
@media (max-width: 899px) { .fa-hero .gh-art { opacity: .35; } }
.fa-svg .fa-p rect { fill: #fff; stroke: none; }
.fa-svg .fa-p.p3 rect { fill-opacity: .14; } .fa-svg .fa-p.p2 rect { fill-opacity: .28; } .fa-svg .fa-p.p1 rect { fill-opacity: .95; }
.fa-svg .fa-p { animation: fain .8s var(--out) both; } .fa-svg .p2 { animation-delay: .15s; } .fa-svg .p1 { animation-delay: .3s; }
@keyframes fain { from { opacity: 0; transform: translateY(14px); } }
.fa-svg .fa-l { stroke: #c9d5ea; stroke-width: 5; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: 1; animation: ghdraw .7s var(--d) var(--out) forwards; }
.fa-svg .fa-tot { stroke: #3362ab; stroke-width: 7; }
.fa-svg .fa-ok circle { fill: #1baf7a; stroke: #fff; stroke-width: 3; transform-box: fill-box; transform-origin: center; animation: cmpop .6s 1.7s var(--spring) both; }
.fa-svg .fa-ok path { fill: none; stroke: #fff; stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1; stroke-dashoffset: 1; animation: ghdraw .5s 2s var(--out) forwards; }
@media (prefers-reduced-motion: reduce) { .fa-svg * { animation: none !important; stroke-dashoffset: 0 !important; } }
.fa-due { display: grid; gap: 6px; }
.fa-dr { display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 8px 10px; border-radius: 12px; background: var(--bg); cursor: pointer; }
.cc-anim .fa-dr { animation: rise .45s var(--d) var(--out) both; }
.fa-dd { display: grid; text-align: center; border-radius: 10px; background: var(--surface); padding: 4px 0; } .fa-dd b { font-size: 16px; line-height: 1.1; } .fa-dd small { font-size: 10px; color: var(--muted); }
.fa-dr.late .fa-dd { background: var(--danger-soft); color: var(--danger); } .fa-dr.late .fa-dd small { color: var(--danger); }
.fa-dr.soon .fa-dd { background: color-mix(in srgb, #eda100 18%, transparent); color: #a56f00; }
.fa-dm { display: grid; min-width: 0; } .fa-dm b { font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .fa-dm small { font-size: 11.5px; color: var(--muted); }
.fa-dr > b { font-variant-numeric: tabular-nums; font-size: 13.5px; }
.chip.late { background: var(--danger-soft); color: var(--danger); }
.gl-st .chip.paid, .fa-chk .chip.paid { background: color-mix(in srgb, #1baf7a 15%, transparent); color: #168a60; }
.fa-clip svg { width: 16px; height: 16px; fill: none; stroke: var(--muted); stroke-width: 1.8; }
.fa-ic { background: var(--accent-soft) !important; color: var(--accent) !important; } .fa-ic svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.fa-bars { height: 200px; }
.fa-chk { margin-top: 12px; padding: 10px 12px; border-radius: 12px; background: var(--bg); display: grid; gap: 2px; font-size: 13px; }
.fa-chk span { color: var(--muted); font-size: 12.5px; }
.fa-chk.ok { background: color-mix(in srgb, #1baf7a 12%, var(--bg)); } .fa-chk.ok b { color: #168a60; }
.fa-chk.ko { background: var(--danger-soft); } .fa-chk.ko b { color: var(--danger); }
.fa-rows { margin-top: 12px; display: grid; font-size: 12.5px; }
.fa-rh, .fa-rr { display: grid; grid-template-columns: minmax(0, 1fr) 50px 80px 80px; gap: 8px; padding: 7px 0; border-bottom: 1px solid var(--line); align-items: center; }
.fa-rh { font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); font-weight: 600; }
.fa-rh span:not(:first-child), .fa-rr span:not(:first-child) { text-align: right; font-variant-numeric: tabular-nums; }
.fa-rr span:first-child { display: grid; min-width: 0; } .fa-rr span:first-child b { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .fa-rr small { color: var(--muted); font-size: 11px; }
.fa-rr.warn small { color: var(--danger); font-weight: 600; }
.fa-3 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }

/* dashboard: fatture, controlli, IA */
#v-home .a-fat { --a: #8b5cf6; } #v-home .a-xi { --a: #0e9aa7; }
@media (min-width: 640px) { .ov-areas { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1180px) { .ov-areas { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.ov-fbar { display: flex; gap: 2px; height: 10px; border-radius: 5px; overflow: hidden; background: var(--bg); margin: 14px 0 8px; }
.ov-fbar i { display: block; height: 100%; } .ov-fbar .pd { background: #1baf7a; } .ov-fbar .op { background: #eda100; } .ov-fbar .lt { background: var(--danger); }
.ov-ckf { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 12px; }
.ov-cf { display: inline-flex; align-items: center; gap: 7px; font: inherit; font-size: 12.5px; font-weight: 600; color: var(--ink-2); padding: 6px 12px; border-radius: 999px; border: 1px solid var(--line); background: var(--surface); cursor: pointer; }
.ov-cf i { width: 8px; height: 8px; border-radius: 50%; background: var(--a); }
.ov-cf b { font-size: 11px; background: var(--bg); padding: 1px 7px; border-radius: 999px; }
.ov-cf.on { background: var(--ink); color: var(--surface); border-color: var(--ink); } .ov-cf.on b { background: rgba(255, 255, 255, .18); }
.ov-cf:disabled { opacity: .4; cursor: default; }
.ov-cl { display: grid; gap: 6px; }
.ov-ci { display: grid; grid-template-columns: 4px minmax(0, 1fr) auto 18px; gap: 14px; align-items: center; text-align: left; padding: 12px 14px 12px 0; border-radius: 12px; background: var(--bg); border: 0; font: inherit; color: inherit; cursor: pointer; overflow: hidden; transition: transform .15s var(--out); }
.ov-ci[hidden] { display: none; }
.ov-ci:hover { transform: translateX(3px); }
.cc-anim .ov-ci { animation: rise .45s var(--d) var(--out) both; }
.ov-cl-l { align-self: stretch; background: var(--muted); opacity: .5; }
.ov-ci.warn .ov-cl-l { background: var(--danger); opacity: 1; }
.ov-cm { display: grid; gap: 2px; min-width: 0; } .ov-ct { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; } .ov-ct b { font-size: 13.5px; }
.ov-cm small { font-size: 12px; color: var(--muted); line-height: 1.45; }
.ov-cv { font-size: 13px; white-space: nowrap; font-variant-numeric: tabular-nums; } .ov-ci.warn .ov-cv { color: var(--danger); }
.ov-ci > svg { width: 16px; height: 16px; fill: none; stroke: var(--muted); stroke-width: 2; }
@media (max-width: 639px) { .ov-ci { grid-template-columns: 4px minmax(0, 1fr) 16px; } .ov-cv { grid-column: 2; } .ov-ci > svg { grid-row: 1; grid-column: 3; } }
.ov-tag { font-style: normal; font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; padding: 2px 7px; border-radius: 6px; color: var(--a, var(--accent)); background: color-mix(in srgb, var(--a, var(--accent)) 14%, transparent); }
.ov-tag.t-att, .ov-tag.t-attrezzatura { --a: var(--a-att); } .ov-tag.t-gls { --a: var(--a-gls); } .ov-tag.t-gas, .ov-tag.t-gasolio { --a: var(--a-gas); } .ov-tag.t-fat, .ov-tag.t-fatture { --a: #8b5cf6; } .ov-tag.t-generale { --a: var(--muted); }
.ov-ins .ov-tag { margin-right: 6px; }
.ov-key { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
.ov-chat { display: grid; gap: 8px; margin-top: 12px; }
.ov-chat:empty { display: none; }
.ov-msg { padding: 10px 12px; border-radius: 14px; font-size: 13.5px; line-height: 1.5; max-width: 92%; }
.ov-msg.user { justify-self: end; background: var(--accent); color: #fff; border-bottom-right-radius: 4px; }
.ov-msg.ai { background: var(--bg); border-bottom-left-radius: 4px; } .ov-msg p { margin: 0 0 6px; } .ov-msg p:last-child { margin: 0; } .ov-msg ul { margin: 4px 0; padding-left: 18px; }
.ov-ask { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; margin-top: 12px; }

/* ---- GLS mappa: strumenti zoom / 2D-3D ---- */
.gm-tools { position: absolute; top: 12px; right: 12px; z-index: 3; display: flex; flex-direction: column; align-items: flex-end; gap: 8px; }
.gm-seg, .gm-zoom { display: flex; background: color-mix(in srgb, var(--surface) 82%, transparent); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border: 1px solid var(--line); border-radius: 12px; padding: 3px; box-shadow: 0 6px 20px -10px rgba(15, 30, 60, .35); }
.gm-zoom { flex-direction: column; }
.gm-seg button, .gm-zoom button { appearance: none; border: 0; background: none; color: var(--text); font: 700 12.5px/1 inherit; font-family: inherit; min-width: 36px; height: 32px; border-radius: 9px; cursor: pointer; display: grid; place-items: center; transition: background .2s, color .2s, transform .15s; }
.gm-zoom button { font-size: 18px; font-weight: 600; }
.gm-zoom button svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.gm-seg button:hover, .gm-zoom button:hover { background: color-mix(in srgb, var(--accent) 10%, transparent); }
.gm-seg button:active, .gm-zoom button:active { transform: scale(.92); }
.gm-seg button.on { background: var(--accent); color: #fff; box-shadow: 0 4px 12px -4px color-mix(in srgb, var(--accent) 70%, transparent); }
.gm-hint { position: absolute; left: 14px; bottom: 12px; font-size: 11px; color: var(--muted); background: color-mix(in srgb, var(--surface) 78%, transparent); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); padding: 5px 10px; border-radius: 999px; border: 1px solid var(--line); pointer-events: none; }
@media (max-width: 640px) { .gm-hint { display: none; } .gm-tools { top: 8px; right: 8px; } .gm-seg button, .gm-zoom button { min-width: 34px; height: 30px; } }

/* ---- 3D (pulito) ---- */
.gm-stage { transition: opacity .22s ease, transform .22s ease; }
.gm-stage.out { opacity: 0; transform: scale(.985); }
.gm-rot button svg { width: 16px; height: 16px; }
.gl-svg.is3d { background: linear-gradient(180deg, color-mix(in srgb, var(--accent) 5%, var(--bg)), var(--bg)); }
.g3-shadow { fill: rgba(15, 30, 60, .07); filter: blur(4px); }
.g3-side { fill: color-mix(in srgb, var(--accent) 22%, var(--surface)); }
.g3-land { fill: url(#g3land); stroke: color-mix(in srgb, var(--accent) 30%, var(--line)); stroke-linejoin: round; }
.g3-l1 { stop-color: var(--surface); } .g3-l2 { stop-color: color-mix(in srgb, var(--accent) 6%, var(--surface)); }
.g3-arc { fill: none; stroke: var(--accent); opacity: .28; stroke-linecap: round; transition: opacity .2s, stroke .2s; }
.g3-arc.hl { opacity: .9; stroke: var(--danger); }
.cc-anim .g3-arc { stroke-dasharray: 1; animation: cmdash .9s var(--d) var(--out) both; } @keyframes cmdash { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
.g3-f.fl { fill: color-mix(in srgb, var(--accent) 88%, #fff); } .g3-f.fr { fill: color-mix(in srgb, var(--accent) 72%, #000); }
.g3-t { fill: color-mix(in srgb, var(--accent) 45%, #fff); }
.g3-col:not(.nb) .g3-f.fl { fill: color-mix(in srgb, var(--accent) 45%, var(--surface)); } .g3-col:not(.nb) .g3-f.fr { fill: color-mix(in srgb, var(--accent) 60%, var(--line)); } .g3-col:not(.nb) .g3-t { fill: color-mix(in srgb, var(--accent) 25%, var(--surface)); }
.g3-col .g3-f, .g3-col .g3-t { transition: fill .18s; }
.g3-col.hl .g3-f.fl, .g3-col:hover .g3-f.fl { fill: var(--danger); } .g3-col.hl .g3-f.fr, .g3-col:hover .g3-f.fr { fill: color-mix(in srgb, var(--danger) 75%, #000); } .g3-col.hl .g3-t, .g3-col:hover .g3-t { fill: color-mix(in srgb, var(--danger) 45%, #fff); }
.g3-col .cm-hit { fill: transparent; }
.g3-lab rect { fill: var(--surface); stroke: color-mix(in srgb, var(--accent) 40%, var(--line)); stroke-width: .6; }
.g3-lab text { fill: var(--text); font-size: 6.2px; font-weight: 700; text-anchor: middle; }
.g3-labs { pointer-events: none; } .g3-lab.hl rect { fill: var(--danger); stroke: var(--danger); } .g3-lab.hl text { fill: #fff; }
.g3-ring { fill: none; stroke: var(--danger); stroke-width: .7; opacity: .5; }
.g3-orig .gl-oc { fill: var(--danger); stroke: var(--surface); stroke-width: 1.2; }
.cc-anim .g3-grow { animation: g3grow .8s var(--d) cubic-bezier(.2, .8, .2, 1) both; }
@keyframes g3grow { from { transform: scaleY(0); } }
.cc-anim .g3-lab { animation: rise0 .4s 1.1s both; }
.gl-svg.dragging { cursor: grabbing; }
@media (prefers-reduced-motion: reduce) { .cc-anim .g3-grow, .cc-anim .g3-arc, .cc-anim .g3-lab { animation: none; } }

/* ---- GLS 3D WebGL ---- */
.gm-3d { position: relative; width: 100%; aspect-ratio: 346 / 388; max-height: 680px; border-radius: 12px; overflow: hidden; background: radial-gradient(110% 80% at 50% 30%, color-mix(in srgb, var(--accent) 8%, var(--surface)), var(--bg) 75%); touch-action: pan-y; }
.gm-3d.zoomed { touch-action: none; }
.gm-3d.dragging { cursor: grabbing; }
.gm-canvas { position: absolute; inset: 0; width: 100% !important; height: 100% !important; display: block; outline: none; }
.gm-load { position: absolute; inset: 0; display: grid; place-items: center; color: var(--muted); font-size: 13px; }
.gm-labs { position: absolute; inset: 0; pointer-events: none; }
.g3l { position: absolute; left: 0; top: 0; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: var(--surface); color: var(--ink); font-size: 11px; font-weight: 700; display: grid; place-items: center; box-shadow: 0 2px 8px -2px rgba(15, 30, 60, .35); border: 1px solid color-mix(in srgb, var(--accent) 30%, var(--line)); transition: opacity .2s, background .2s, color .2s; will-change: transform; }
.g3l.off { opacity: 0; }
.g3l.hl { background: var(--danger); color: #fff; border-color: var(--danger); }
.g3l.roma { background: none; border: 0; box-shadow: none; color: var(--danger); font-size: 11px; font-weight: 800; letter-spacing: .06em; text-shadow: 0 0 3px var(--surface), 0 0 6px var(--surface); }

/* ---- GLS: fatture mensili ---- */
.gf-card .card-h { align-items: center; }
.gf-yr { display: inline-flex; align-items: center; gap: 4px; font-size: 13px; }
.gf-yr button { appearance: none; border: 1px solid var(--line); background: var(--surface); color: var(--ink); width: 28px; height: 28px; border-radius: 8px; cursor: pointer; font-size: 16px; line-height: 1; }
.gf-yr button:disabled { opacity: .35; cursor: default; }
.gf-yr b { min-width: 44px; text-align: center; }
.gf-sum { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 13px; color: var(--ink-2); margin: -2px 0 14px; }
.gf-sum b { color: var(--ink); }
.gf-todo b { color: var(--warn); } .gf-ok { color: #15803d; font-weight: 600; }
.gf-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
@media (max-width: 900px) { .gf-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 560px) { .gf-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.gf-m { position: relative; display: flex; text-align: left; gap: 9px; align-items: flex-start; padding: 11px 11px 10px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); cursor: pointer; transition: border-color .2s, background .2s, transform .15s; user-select: none; -webkit-user-select: none; }
.gf-m:hover { border-color: color-mix(in srgb, var(--accent) 45%, var(--line)); }
.gf-m:active { transform: scale(.97); }
.gf-m input { position: absolute; opacity: 0; pointer-events: none; }
.gf-box { flex: none; width: 20px; height: 20px; border-radius: 6px; border: 1.6px solid color-mix(in srgb, var(--ink) 25%, transparent); display: grid; place-items: center; transition: background .2s, border-color .2s; margin-top: 1px; }
.gf-box svg { width: 14px; height: 14px; fill: none; stroke: #fff; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 24; stroke-dashoffset: 24; transition: stroke-dashoffset .25s ease .05s; }
.gf-m input:focus-visible + .gf-box { outline: 2px solid var(--accent); outline-offset: 2px; }
.gf-t { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.gf-t b { font-size: 13.5px; }
.gf-t small { font-size: 11.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gf-m.due { border-color: color-mix(in srgb, var(--warn) 35%, var(--line)); background: color-mix(in srgb, var(--warn-soft) 45%, var(--surface)); }
.gf-m.on { border-color: color-mix(in srgb, #16a34a 40%, var(--line)); background: color-mix(in srgb, #16a34a 7%, var(--surface)); }
.gf-m.on .gf-box { background: #16a34a; border-color: #16a34a; }
.gf-m.on .gf-box svg { stroke-dashoffset: 0; }
.gf-m.on .gf-t small { color: #15803d; }
.gf-m.empty:not(.on) .gf-t b { color: var(--muted); font-weight: 600; }
.cc-anim .gf-m { animation: rise .45s var(--d) var(--out) both; }

/* =========================================================
   TORENTAL · LISTINO KIT ADESIVI
   ========================================================= */
#v-torental { --tk-mat: #b6bfcd; --tk-ric: #3362ab; --tk-prep: #eb6834; --tk-app: #1baf7a; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) #v-torental { --tk-mat: #5b6372; --tk-ric: #6d93db; --tk-prep: #d95926; --tk-app: #199e70; } }
:root[data-theme="dark"] #v-torental { --tk-mat: #5b6372; --tk-ric: #6d93db; --tk-prep: #d95926; --tk-app: #199e70; }
#tr-body { display: grid; gap: 12px; }
@media (min-width: 900px) { #tr-body { gap: 16px; } }
.tr-title { display: grid; gap: 1px; } .tr-title b { font-size: 15px; } .tr-title span { font-size: 12px; color: var(--muted); }
#tr-mod { padding: 7px 12px; border-radius: 10px; }
/* hero */
.tr-hero .gh-art { -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 40%); mask-image: linear-gradient(90deg, transparent 0%, #000 40%); }
@media (min-width: 900px) { .tr-hero .gh-art { width: 44%; } }
@media (max-width: 899px) { .tr-hero .gh-art { opacity: .35; } }
.tr-svg .tr-s rect { fill: #fff; }
.tr-svg .s1 rect { fill: #f28b3c; fill-opacity: .95; } .tr-svg .s2 rect { fill: #d9dde4; fill-opacity: .9; } .tr-svg .s3 rect { fill: #fff; fill-opacity: .16; }
.tr-svg .tr-s { animation: trslide .9s var(--d) var(--out) both; }
@keyframes trslide { from { opacity: 0; transform: translateX(60px); } }
@media (prefers-reduced-motion: reduce) { .tr-svg * { animation: none !important; } }
.tr-nota { display: flex; gap: 10px; align-items: flex-start; padding: 10px 14px; border-radius: 12px; background: var(--surface); border: 1px solid var(--line); font-size: 13px; color: var(--ink-2); }
.tr-nota svg { flex: none; width: 18px; height: 18px; fill: none; stroke: var(--accent); stroke-width: 1.8; stroke-linecap: round; margin-top: 1px; }
/* schede dei kit */
.tk-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(232px, 1fr)); }
@media (max-width: 520px) { .tk-grid { grid-template-columns: 1fr 1fr; gap: 10px; } }
.tk { display: flex; flex-direction: column; gap: 8px; text-align: left; font: inherit; color: inherit; cursor: pointer; border: 1px solid transparent; transition: transform .15s var(--out), border-color .2s; padding: 16px; }
.tk:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--accent) 30%, transparent); }
.cc-anim .tk { animation: rise .5s var(--d) var(--out) both; }
.tk-h { display: flex; justify-content: space-between; align-items: center; gap: 6px; }
.tk-cod { font-size: 11px; font-weight: 700; letter-spacing: .04em; color: var(--muted); background: var(--bg); padding: 2px 8px; border-radius: 6px; font-variant-numeric: tabular-nums; }
.tk-flag { font-size: 10.5px; font-weight: 700; color: #a56f00; background: color-mix(in srgb, #eda100 16%, transparent); padding: 2px 7px; border-radius: 6px; vertical-align: 1px; }
.tk-n { font-size: 16px; font-weight: 700; letter-spacing: -.01em; line-height: 1.2; }
.tk-p { display: grid; font-size: 26px; font-weight: 800; letter-spacing: -.03em; font-variant-numeric: tabular-nums; line-height: 1.1; }
.tk-p small { font-size: 11.5px; font-weight: 500; letter-spacing: 0; color: var(--muted); margin-top: 2px; }
.tk-bar { display: flex; gap: 2px; height: 8px; border-radius: 4px; overflow: hidden; background: var(--bg); }
.tk-bar i { display: block; height: 100%; }
.cc-anim .tk-bar { animation: crgrow .9s calc(var(--d) + 200ms) var(--out) both; transform-origin: left; }
.tk-l { display: flex; flex-wrap: wrap; gap: 3px 10px; font-size: 11.5px; color: var(--muted); }
.tk-l span { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; } .tk-l i { width: 7px; height: 7px; border-radius: 2px; }
.tk-s { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin-top: auto; padding-top: 10px; border-top: 1px solid var(--line); }
.tk-s > span { display: grid; min-width: 0; } .tk-s small { font-size: 10.5px; color: var(--muted); } .tk-s b { font-size: 13.5px; font-variant-numeric: tabular-nums; white-space: nowrap; }
@media (max-width: 520px) { .tk { padding: 12px; } .tk-p { font-size: 21px; } .tk-n { font-size: 14px; } .tk-l { display: none; } .tk-s { grid-template-columns: 1fr 1fr; } .tk-s > span:last-child { display: none; } }
/* controlli */
.tr-fixb { justify-self: start; margin-top: 6px; border: 1px solid var(--line); background: var(--surface); color: var(--accent); font: inherit; font-size: 12px; font-weight: 600; padding: 4px 10px; border-radius: 8px; cursor: pointer; }
.tr-fixb:hover { background: var(--accent-soft); }
#tr-anom .ga-m { display: grid; }
/* confronto */
.tr-leg { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 12px; color: var(--muted); margin: -4px 0 14px; }
.tr-leg span { display: inline-flex; align-items: center; gap: 6px; } .tr-leg i { width: 10px; height: 10px; border-radius: 3px; }
.tr-cmp { display: grid; gap: 4px; }
.tr-cr { display: grid; grid-template-columns: minmax(120px, 190px) minmax(0, 1fr) 84px; gap: 14px; align-items: center; padding: 7px 8px; margin: 0 -8px; border-radius: 10px; cursor: pointer; transition: background .15s; }
.tr-cr:hover { background: var(--bg); }
.cc-anim .tr-cr { animation: rise .45s var(--d) var(--out) both; }
.tr-cn { display: grid; min-width: 0; } .tr-cn b { font-size: 13.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .tr-cn small { font-size: 11px; color: var(--muted); }
.tr-ct { display: block; height: 22px; } .tr-cb { display: flex; gap: 2px; height: 100%; border-radius: 6px; overflow: hidden; min-width: 4px; }
.tr-cb i { display: block; height: 100%; }
.cc-anim .tr-cb { animation: crgrow 1s calc(var(--d) + 150ms) var(--out) both; transform-origin: left; }
.tr-cv { text-align: right; font-variant-numeric: tabular-nums; font-size: 14px; }
@media (max-width: 559px) { .tr-cr { grid-template-columns: minmax(0, 1fr) auto; gap: 4px 10px; } .tr-ct { grid-column: 1 / -1; grid-row: 2; height: 14px; } }
/* preventivo + articoli */
.tr-2 { display: grid; gap: 12px; }
@media (min-width: 980px) { .tr-2 { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 16px; align-items: start; } }
.tr-opts { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center; margin: 0 0 12px; }
.tr-ck { display: inline-flex; align-items: center; gap: 8px; font-size: 13.5px; cursor: pointer; padding: 7px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.tr-ck input { width: 16px; height: 16px; min-height: 0 !important; accent-color: var(--accent); margin: 0; }
.tr-gg { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: var(--ink-2); }
.tr-gg input { width: 72px; height: 36px !important; min-height: 36px !important; text-align: center; }
.tr-sd { margin: 0 0 12px; border: 1px solid var(--line); border-radius: 12px; padding: 8px 12px; }
.tr-sd summary { cursor: pointer; font-size: 13px; font-weight: 600; color: var(--accent); }
.tr-sg { display: grid; gap: 6px; margin-top: 10px; }
.tr-sg label { display: grid; grid-template-columns: minmax(0, 1fr) 80px; gap: 10px; align-items: center; font-size: 13px; }
.tr-sg label span { display: grid; } .tr-sg small { font-size: 11px; color: var(--muted); }
.tr-sg input { height: 34px !important; min-height: 34px !important; text-align: center; }
.tr-ql { display: grid; gap: 2px; margin-bottom: 10px; }
.tr-ql > div { display: flex; justify-content: space-between; gap: 12px; font-size: 13.5px; padding: 6px 0; border-bottom: 1px dashed var(--line); }
.tr-ql em { font-style: normal; color: var(--muted); font-size: 12.5px; } .tr-ql b { font-variant-numeric: tabular-nums; }
.tr-sing { display: grid; gap: 4px; }
.tr-si { display: grid; grid-template-columns: 84px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 8px 10px; border-radius: 10px; background: var(--bg); font-size: 13.5px; }
.cc-anim .tr-si { animation: rise .45s var(--d, 200ms) var(--out) both; }
.tr-sc { font-size: 11px; font-weight: 700; color: var(--muted); letter-spacing: .03em; font-variant-numeric: tabular-nums; }
.tr-sn em { font-style: normal; font-size: 11px; color: var(--muted); margin-left: 4px; }
.tr-si > b { font-variant-numeric: tabular-nums; }
.tr-mp { display: grid; text-align: right; } .tr-mp small { font-size: 11px; color: var(--muted); }
/* tabella composizione */
.tr-tabl { min-width: 980px; }
.tr-tabl th small { display: block; font-size: 10px; text-transform: none; letter-spacing: 0; opacity: .8; }
.tr-tabl th.l, .tr-tabl td.l { text-align: left; }
.tr-tabl tbody tr { cursor: pointer; } .tr-tabl tbody tr:hover td { background: color-mix(in srgb, var(--accent) 5%, var(--surface)); }
.tr-tabl td.tr-gain { color: #168a60; font-weight: 600; } .tr-tabl td.tr-gain small { display: block; font-size: 10.5px; font-weight: 500; color: var(--muted); }
/* dettaglio kit */
.tr-dr .fa-rh, .tr-dr .fa-rr { grid-template-columns: minmax(0, 1fr) 48px 64px 72px 72px; }
.tr-dr .tr-dt { border-bottom: 0; border-top: 2px solid var(--line); }
/* modulo modifica */
.sheet-panel.xwide { max-width: 1080px; }
.tr-f3 { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 2fr) !important; }
@media (max-width: 559px) { .tr-f3 { grid-template-columns: 1fr 1fr !important; } .tr-f3 > :last-child { grid-column: 1 / -1; } }
.tr-mats { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 0 10px; }
.tr-mxw { overflow-x: auto; border: 1px solid var(--line); border-radius: 14px; margin-bottom: 10px; -webkit-overflow-scrolling: touch; }
.tr-mx { border-collapse: separate; border-spacing: 0; width: 100%; font-size: 13px; }
.tr-mx th, .tr-mx td { padding: 5px; border-bottom: 1px solid var(--line); }
.tr-mx thead th { background: var(--bg); font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); font-weight: 600; text-align: left; white-space: nowrap; padding: 8px 6px; }
.tr-mx tbody tr:last-child td { border-bottom: 0; }
.tr-mx .tr-c0 { position: sticky; left: 0; z-index: 1; background: var(--surface); min-width: 210px; padding-left: 10px; }
.tr-mx thead .tr-c0 { background: var(--bg); z-index: 2; }
.tr-mx tbody td:first-child { position: sticky; left: 0; z-index: 1; background: var(--surface); min-width: 210px; }
.tr-mx input { width: 100%; min-width: 0; height: 34px !important; min-height: 34px !important; padding: 0 8px !important; font-size: 13px !important; border-radius: 8px !important; }
.tr-mx .tr-in-n { width: 76px; text-align: right; } .tr-mx .tr-in-s { width: 80px; }
.tr-lx { width: 32px; height: 32px; font-size: 16px; }
.tr-pr3 { display: grid; grid-template-columns: 110px minmax(0, 1fr) 90px 32px; gap: 6px; padding: 3px 0; }
.tr-pr3 input { min-width: 0; }
/* menu: 7 voci sul telefono */
@media (max-width: 899px) { .nav a span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; } .nav a { padding-left: 2px; padding-right: 2px; } }
/* Torental: modifica completa */
.tr-fh { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin: 16px 0 8px; }
.tr-mh, .tr-mr { display: grid; grid-template-columns: 110px minmax(0, 1fr) 110px 150px 32px; gap: 6px; align-items: center; }
.tr-mh { font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); font-weight: 600; padding: 0 2px 4px; }
.tr-mr { padding: 3px 0; } .tr-mr input, .tr-mr select { min-width: 0; }
@media (max-width: 639px) { .tr-mh { display: none; } .tr-mr { grid-template-columns: 1fr 1fr 32px; padding: 8px 0; border-bottom: 1px solid var(--line); } .tr-mr [data-m="cod"] { grid-column: 1; } .tr-mr [data-m="n"] { grid-column: 2; } .tr-mr .tr-lx { grid-column: 3; grid-row: 1; } }
.tr-mx .tr-in-fx { width: 96px; border-style: dashed !important; }
.tr-reset { margin-top: 18px; padding-top: 12px; border-top: 1px solid var(--line); }
.tr-reset .link { background: none; border: 0; padding: 0; font: inherit; font-size: 12.5px; color: var(--danger); cursor: pointer; text-decoration: underline; }
.tr-f4 { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
@media (max-width: 559px) { .tr-f4 { grid-template-columns: 1fr 1fr !important; } }
.tr-mats em { font-style: normal; font-size: 11px; font-weight: 500; }
.tk-add { align-items: center; justify-content: center; text-align: center; background: transparent; border: 1.5px dashed color-mix(in srgb, var(--accent) 35%, var(--line)); border-radius: var(--radius, 16px); min-height: 180px; color: var(--accent); box-shadow: none; }
.tk-add:hover { background: var(--accent-soft); }
.tk-plus { width: 40px; height: 40px; border-radius: 12px; background: var(--accent-soft); display: grid; place-items: center; font-size: 24px; font-weight: 600; }
.tk-add small { color: var(--muted); font-size: 12px; }
.tr-si[data-trsing], .tr-si[data-trmat] { cursor: pointer; transition: background .15s; }
.tr-si[data-trsing]:hover, .tr-si[data-trmat]:hover { background: color-mix(in srgb, var(--accent) 8%, var(--bg)); }
#tr-body .card-h { flex-wrap: wrap; gap: 6px 12px; } #tr-body .card-h > .btn { margin-left: auto; }
/* Torental: PDF */
.tr-pdfbtn { color: var(--danger) !important; display: inline-flex; align-items: center; gap: 6px; }
.tr-pdfbtn svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.tr-pdfo { display: grid; gap: 10px; }
@media (min-width: 560px) { .tr-pdfo { grid-template-columns: 1fr 1fr; } }
.tr-pdfb { display: grid; gap: 6px; text-align: left; padding: 16px; border-radius: 14px; border: 1px solid var(--line); background: var(--surface); font: inherit; color: inherit; cursor: pointer; transition: border-color .2s, transform .15s var(--out), background .2s; }
.tr-pdfb:hover { border-color: color-mix(in srgb, var(--accent) 45%, var(--line)); background: color-mix(in srgb, var(--accent) 4%, var(--surface)); transform: translateY(-2px); }
.tr-pdfb b { font-size: 15px; } .tr-pdfb small { font-size: 12.5px; color: var(--muted); line-height: 1.45; }
.tr-pdfi { width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; background: var(--accent-soft); color: var(--accent); margin-bottom: 4px; }
.tr-pdfi.int { background: color-mix(in srgb, #eb6834 14%, transparent); color: #c4521f; }
.tr-pdfi svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

/* =========================================================
   LYRECO
   ========================================================= */
#ly-body { display: grid; gap: 12px; }
@media (min-width: 900px) { #ly-body { gap: 16px; } }
.ly-hero .gh-art { -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 38%); mask-image: linear-gradient(90deg, transparent 0%, #000 38%); }
@media (min-width: 900px) { .ly-hero .gh-art { width: 44%; } }
@media (max-width: 899px) { .ly-hero .gh-art { opacity: .3; } }
.ly-svg .ly-p rect { fill: #fff; }
.ly-svg .p1 rect { fill-opacity: .16; } .ly-svg .p2 > rect:first-child { fill-opacity: .95; } .ly-svg .p3 rect { fill: #eb6834; fill-opacity: .95; }
.ly-svg .p2 line { stroke: #c9d5ea; stroke-width: 5; stroke-linecap: round; } .ly-svg .ly-tag { fill: #3362ab !important; fill-opacity: 1 !important; }
.ly-svg .p3 path { stroke: #fff; stroke-width: 6; stroke-linecap: round; fill: none; }
.ly-svg .ly-p { animation: fain .8s var(--d) var(--out) both; }
@media (prefers-reduced-motion: reduce) { .ly-svg * { animation: none !important; } }
.ly-hb .btn { background: #fff; color: #17366d; border-color: #fff; }
.gh-k.ly-kwarn b { color: #ffd2b8; }
#ly-body .card-h { flex-wrap: wrap; gap: 6px 12px; } #ly-body .card-h > .btn, #ly-body .card-h > .tr-seg, #ly-body .card-h > .ly-aq { margin-left: auto; }
.ly-aq { width: min(260px, 100%); height: 34px !important; min-height: 34px !important; font-size: 13px !important; }
/* mappa: niente collegamenti, solo i piazzali */
.ly-dash .cc-map .cm-svg { max-height: 520px; }
.cr-row.ly-na .cr-n { background: var(--danger-soft); color: var(--danger); }
.cr-row.ly-na .cr-track i { background: repeating-linear-gradient(135deg, color-mix(in srgb, var(--danger) 55%, transparent) 0 6px, color-mix(in srgb, var(--danger) 25%, transparent) 6px 12px); }
.ly-link { background: none; border: 0; padding: 0; font: inherit; color: var(--accent); font-weight: 600; cursor: pointer; text-decoration: underline; }
/* barre mensili impilate */
.ly-mb { display: flex; align-items: flex-end; gap: 8px; height: 220px; padding-top: 18px; }
.ly-b { flex: 1; min-width: 0; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; gap: 4px; cursor: pointer; }
.ly-bv { font-size: 10.5px; color: var(--muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
.ly-bc { width: 100%; max-width: 46px; display: flex; flex-direction: column; gap: 1px; border-radius: 6px 6px 2px 2px; overflow: hidden; transform-origin: bottom; }
.ly-bc i { display: block; width: 100%; min-height: 1px; }
.cc-anim .ly-bc { animation: lygrow .7s var(--d) var(--out) both; } @keyframes lygrow { from { transform: scaleY(0); } }
.ly-b:hover .ly-bc { filter: brightness(1.08); }
.ly-bl { font-size: 11px; color: var(--muted); text-transform: capitalize; }
.ly-leg { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 12px; font-size: 11.5px; color: var(--muted); }
.ly-leg span { display: inline-flex; align-items: center; gap: 6px; } .ly-leg i { width: 9px; height: 9px; border-radius: 3px; }
/* matrice */
.ly-mxt { min-width: 900px; } .ly-mxt th { white-space: normal; max-width: 110px; line-height: 1.25; vertical-align: bottom; }
.ly-mxt tbody tr[data-lycdc] { cursor: pointer; } .ly-mxt tbody tr[data-lycdc]:hover td { background-color: color-mix(in srgb, var(--accent) 5%, var(--surface)); }
.ly-mxt tr.ly-na td:first-child { color: var(--danger); }
/* fatture */
.ly-dseg button { padding: 5px 10px; }
.ly-dt tr.ly-na td:first-child, .ly-rt tr.ly-na td:first-child { box-shadow: inset 3px 0 0 var(--danger); }
.chip.ly-tp { font-size: 11px; padding: 1px 8px; background: var(--accent-soft); color: var(--accent); }
.chip.ly-tp.nc { background: color-mix(in srgb, #8b5cf6 14%, transparent); color: #7444d6; }
.chip.ly-q { font-size: 11px; padding: 1px 8px; }
.ly-cc { font-size: 13px; }
.ly-dt td, .ly-rt td { white-space: nowrap; } .ly-rt td:nth-child(3) { white-space: normal; min-width: 220px; }
.ly-neg { color: #7444d6 !important; }
.ly-ic { background: var(--accent-soft) !important; color: var(--accent) !important; } .ly-ic.na { background: var(--danger-soft) !important; color: var(--danger) !important; }
.ly-ic svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
/* articoli */
.ly-arts { display: grid; gap: 2px; }
@media (min-width: 1100px) { .ly-arts { grid-template-columns: 1fr 1fr; column-gap: 28px; } }
.ly-ar { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 8px 6px; border-bottom: 1px solid var(--line); cursor: pointer; border-radius: 8px; }
.ly-ar:hover { background: var(--bg); }
.cc-anim .ly-ar { animation: rise .45s var(--d) var(--out) both; }
.ly-am { display: grid; min-width: 0; gap: 1px; } .ly-am b { font-size: 13px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .ly-am small { font-size: 11px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ly-ap { display: grid; justify-items: end; gap: 2px; } .ly-ap b { font-size: 13.5px; font-variant-numeric: tabular-nums; } .ly-ap small { font-size: 11px; color: var(--muted); } .ly-ap .chip { font-size: 10.5px; padding: 1px 7px; }
/* dettaglio fattura */
.ly-all { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: end; margin: 14px 0 4px; padding: 12px; border-radius: 12px; background: var(--accent-soft); }
.ly-all label.f { margin: 0; } .ly-all .btn { height: 42px; }
@media (max-width: 559px) { .ly-all { grid-template-columns: 1fr; } }
.ly-rows { display: grid; margin-top: 10px; font-size: 12.5px; }
.ly-rh, .ly-rr { display: grid; grid-template-columns: minmax(0, 1fr) 76px 170px; gap: 10px; align-items: center; padding: 7px 0; border-bottom: 1px solid var(--line); }
.ly-rh { font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); font-weight: 600; }
.ly-rr > span:first-child { display: grid; min-width: 0; } .ly-rr b { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .ly-rr small { color: var(--muted); font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ly-rr > span:nth-child(2), .ly-rh > span:nth-child(2) { text-align: right; font-variant-numeric: tabular-nums; }
.ly-rr select { height: 34px !important; min-height: 34px !important; font-size: 12.5px !important; padding: 0 28px 0 8px !important; }
@media (max-width: 559px) { .ly-rh { display: none; } .ly-rr { grid-template-columns: minmax(0, 1fr) auto; } .ly-rr select { grid-column: 1 / -1; } }
/* anagrafica */
.ly-ch, .ly-cr { display: grid; grid-template-columns: 86px minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1fr) 76px 32px; gap: 6px; align-items: center; }
.ly-ch { font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); font-weight: 600; padding: 0 2px 4px; }
.ly-cr { padding: 6px 0; border-bottom: 1px solid var(--line); } .ly-cr input, .ly-cr select { min-width: 0; height: 36px !important; min-height: 36px !important; font-size: 13px !important; }
.ly-cr .ly-ck { grid-column: 1 / 6; font-size: 12px !important; color: var(--muted); }
.ly-cu { grid-row: 1; grid-column: 6; font-size: 10.5px; color: var(--muted); text-align: center; line-height: 1.1; }
.ly-cr .tr-lx { grid-row: 1; grid-column: 6; }
@media (max-width: 639px) { .ly-ch { display: none; } .ly-cr { grid-template-columns: 1fr 1fr 32px; } .ly-cr [data-c="cod"] { grid-column: 1; } .ly-cr [data-c="n"] { grid-column: 2; } .ly-cr .ly-ck { grid-column: 1 / -1; } .ly-cu, .ly-cr .tr-lx { grid-column: 3; } }
/* stili condivisi (mappa con classifica, interruttori, tabelle larghe) */
.tr-dash { display: grid; gap: 10px; }
@media (min-width: 980px) { .tr-dash { grid-template-columns: minmax(0, 1fr) minmax(300px, .9fr); gap: 28px; align-items: center; } }
.tr-rank { display: grid; align-content: start; gap: 2px; }
.tr-none { margin-top: 10px; padding: 8px 12px; border-radius: 10px; background: var(--bg); line-height: 1.5; }
.tr-pin .cm-c { fill: color-mix(in srgb, var(--ink) 18%, var(--surface)); stroke-width: 1.5; }
.tr-pin.act .cm-c { fill: color-mix(in srgb, var(--accent) 60%, var(--surface)); stroke-width: 2; }
.tr-pin.on .cm-c, .tr-pin.act:hover .cm-c { fill: var(--accent); }
.tr-hb { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; }
.tr-seg { display: inline-flex; background: var(--bg); border-radius: 10px; padding: 3px; }
.tr-seg button { appearance: none; border: 0; background: none; font: inherit; font-size: 12.5px; font-weight: 600; color: var(--muted); padding: 5px 12px; border-radius: 8px; cursor: pointer; transition: background .2s, color .2s; }
.tr-seg button.on { background: var(--surface); color: var(--ink); box-shadow: 0 1px 3px rgba(15, 30, 60, .12); }
.tr-tw { overflow-x: auto; }
.tr-tbl td { white-space: nowrap; }
.tr-nt { display: block; font-size: 11px; color: var(--muted); font-weight: 400; max-width: 340px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ly-rt td:nth-child(3) b { display: block; max-width: 340px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 1499px) { .ly-rt th:nth-child(4), .ly-rt td:nth-child(4) { display: none; } }

/* =========================================================
   AMAZON (riusa gli stili di Lyreco)
   ========================================================= */
#am-body { display: grid; gap: 12px; }
@media (min-width: 900px) { #am-body { gap: 16px; } }
#am-body .card-h { flex-wrap: wrap; gap: 6px 12px; } #am-body .card-h > .btn, #am-body .card-h > .tr-seg, #am-body .card-h > .ly-aq { margin-left: auto; }
.am-hero .gh-art { -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 38%); mask-image: linear-gradient(90deg, transparent 0%, #000 38%); }
@media (min-width: 900px) { .am-hero .gh-art { width: 44%; } }
@media (max-width: 899px) { .am-hero .gh-art { opacity: .3; } }
.am-svg .am-b rect { fill: #fff; } .am-svg .am-b path { fill: none; stroke-width: 3; stroke-linecap: round; }
.am-svg .b1 rect { fill: #e8a23a; fill-opacity: .95; } .am-svg .b1 path { stroke: rgba(255, 255, 255, .55); }
.am-svg .b2 rect { fill-opacity: .95; } .am-svg .b2 path { stroke: #c9d5ea; }
.am-svg .b3 rect { fill-opacity: .18; } .am-svg .b3 path { stroke: rgba(255, 255, 255, .45); }
.am-svg .am-b { animation: fain .8s var(--d) var(--out) both; }
@media (prefers-reduced-motion: reduce) { .am-svg * { animation: none !important; } }
.am-ic { background: color-mix(in srgb, #e8a23a 16%, transparent) !important; color: #b97710 !important; } .am-ic.na { background: var(--danger-soft) !important; color: var(--danger) !important; }
.am-ic svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.am-ot td.am-ad { white-space: normal; min-width: 220px; max-width: 360px; } .am-ot td.am-ad span { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 12.5px; color: var(--ink-2); }
.am-ot td .chip.ly-q { margin-left: 4px; }
@media (max-width: 1499px) { .am-ot th:nth-child(5), .am-ot td:nth-child(5), .am-ot th:nth-child(7), .am-ot td:nth-child(7) { display: none; } }
.am-rt td:nth-child(2) b { display: block; max-width: 420px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 1499px) { .am-rt th:nth-child(3), .am-rt td:nth-child(3) { display: none; } }
.am-arts { grid-template-columns: 1fr !important; }
.bar-fill.am-amz { background: #e8a23a; }
.am-rh { grid-template-columns: minmax(0, 1fr) 76px 190px; }
.ly-ck2 { grid-column: 1 / 6; }
@media (max-width: 639px) { .ly-ck2 { grid-column: 1 / -1; } }
.ly-mxt th { min-width: 112px; }
.ly-mxt th:first-child { min-width: 150px; }
/* menu: 9 voci sul telefono */
@media (max-width: 460px) { .nav { padding-left: 2px; padding-right: 2px; } .nav a { padding-left: 0; padding-right: 0; } .nav a span { font-size: 9px !important; letter-spacing: -.01em; } .nav a svg { width: 20px !important; height: 20px !important; } .nav a::before { width: 34px !important; margin-left: -17px !important; } }

/* ===== Mappa piazzali (Lyreco, Amazon) — v36 ===== */
.ly-dash { gap: 14px; }
@media (min-width: 980px) { .tr-dash.ly-dash { grid-template-columns: minmax(0, 1.25fr) minmax(320px, 1fr); gap: 32px; align-items: start; } }
.ly-dash .cc-map { margin: 0; min-width: 0; }
.pz-svg { width: 100%; height: auto; display: block; overflow: hidden; }
.pz-land { fill: color-mix(in srgb, var(--accent) 7%, var(--surface)); stroke: color-mix(in srgb, var(--accent) 42%, transparent); stroke-linejoin: round; }
.pz-dot { fill: color-mix(in srgb, var(--accent) 34%, var(--surface)); }
.pz-dots { stroke: none; pointer-events: none; }
.pz-pin, .pz-lbl { cursor: pointer; transition: opacity .25s; }
.pz-halo { fill: var(--accent); opacity: .12; transition: opacity .25s; }
.pz-c { fill: var(--accent); stroke: var(--surface); transition: fill .25s; }
.pz-num { fill: var(--accent-ink); font-weight: 700; text-anchor: middle; font-variant-numeric: tabular-nums; pointer-events: none; }
.pz-pin.hl .pz-halo, .pz-pin.on .pz-halo { opacity: .28; }
.pz-pin.on .pz-c { fill: color-mix(in srgb, var(--accent) 78%, var(--ink)); }
.pz-lbl rect { fill: var(--surface); stroke: var(--line); transition: stroke .25s, fill .25s; }
.pz-lbl.hl rect, .pz-lbl.on rect { stroke: var(--accent); }
.pz-lbl.on rect { fill: var(--accent-soft); }
.pz-n { font-weight: 700; fill: var(--ink); }
.pz-v { font-weight: 500; fill: var(--ink-2); font-variant-numeric: tabular-nums; }
.pz-lead { stroke: color-mix(in srgb, var(--ink) 35%, transparent); stroke-dasharray: 2 2; fill: none; }
.pz-true line { stroke: color-mix(in srgb, var(--accent) 55%, transparent); }
.pz-true circle { fill: var(--surface); stroke: var(--accent); }
.pz-svg:has(.tr-pin.on) .tr-pin:not(.on) { opacity: .38; }
.pz-foot { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 10px; font-size: 12px; color: var(--muted); font-variant-numeric: tabular-nums; }
.pz-key { display: inline-flex; align-items: center; gap: 5px; }
.pz-key i { display: inline-block; border-radius: 50%; background: var(--accent); opacity: .8; border: 1.5px solid var(--surface); box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent) 25%, transparent); }
.pz-key i:last-of-type { margin-right: 4px; }
.pz-anim .pz-landg { animation: fade .7s ease both; }
.pz-anim .pz-pin > .pz-c, .pz-anim .pz-pin > .pz-halo { transform-box: fill-box; transform-origin: center; animation: cmpop .55s var(--d) var(--spring) both; }
.pz-anim .pz-num, .pz-anim .pz-lbl, .pz-anim .pz-lead, .pz-anim .pz-true { animation: fade .45s var(--d, 700ms) ease both; }
.pz-anim .pz-num { animation-delay: 700ms; }
/* classifica più compatta e allineata */
.ly-dash .tr-rank { gap: 0; }
.ly-dash .cr-row { padding: 8px 10px; gap: 12px; }
.ly-dash .cr-main { gap: 5px; }
.ly-dash .cr-track { height: 6px; }
.ly-dash .cr-row.hl:not(.on) { background: var(--bg); }
.ly-dash .cr-row + .cr-row { border-top: 1px solid color-mix(in srgb, var(--line) 60%, transparent); border-radius: 0; }
.ly-dash .cr-row:hover, .ly-dash .cr-row.on, .ly-dash .cr-row.hl { border-radius: 10px; border-top-color: transparent; }
.ly-dash .cr-row.hl + .cr-row, .ly-dash .cr-row.on + .cr-row, .ly-dash .cr-row:hover + .cr-row { border-top-color: transparent; }
.ly-dash .cr-sub { margin-top: 0; }

/* ===== Report PDF per piazzale e periodo — v37 ===== */
.rp-w { display: grid; gap: 6px; }
.rp-w label.f { margin-bottom: 4px; }
.rp-l { font-size: 12.5px; font-weight: 600; color: var(--ink-2); margin-top: 8px; }
.rp-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.rp-chip { border: 1px solid var(--line); background: var(--surface); color: var(--ink-2); font: inherit; font-size: 12.5px; font-weight: 500; padding: 6px 11px; border-radius: 999px; cursor: pointer; transition: all .2s; }
.rp-chip:hover { border-color: color-mix(in srgb, var(--accent) 45%, var(--line)); color: var(--ink); }
.rp-chip.on { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
.rp-dates { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 6px; }
.seg.rp-iva { display: grid !important; margin: 2px 0 0 !important; }
.rp-opts { display: grid; gap: 6px; }
@media (min-width: 560px) { .rp-opts { grid-template-columns: 1fr 1fr; } }
.rp-o { display: grid; grid-template-columns: 20px 1fr; gap: 10px; align-items: start; padding: 11px 12px; border: 1px solid var(--line); border-radius: 12px; cursor: pointer; transition: border-color .2s, background .2s; }
.rp-o:has(input:checked) { border-color: color-mix(in srgb, var(--accent) 45%, var(--line)); background: color-mix(in srgb, var(--accent) 4%, var(--surface)); }
.rp-o input { width: 18px; height: 18px; min-height: 0; margin: 1px 0 0; accent-color: var(--accent); }
.rp-o span { display: grid; gap: 2px; } .rp-o b { font-size: 13.5px; font-weight: 600; } .rp-o small { font-size: 12px; color: var(--muted); line-height: 1.4; }
.rp-sum { margin-top: 12px; padding: 12px 14px; border-radius: 12px; background: var(--accent-soft); display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
.rp-sum b { font-size: 18px; font-variant-numeric: tabular-nums; color: var(--accent); }
.rp-sum span { font-size: 12.5px; color: var(--ink-2); }
.rp-sum .rp-none { color: var(--danger); font-weight: 600; }

/* ===== Dashboard generale — v38 ===== */
#v-home { --a-ly: #0e9fb4; --a-am: #eb6834; --a-fat: #8b5cf6; --a-tr: #64748b; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) #v-home { --a-ly: #22b8cc; --a-am: #f07c4c; --a-fat: #a283f5; --a-tr: #94a3b8; } }
:root[data-theme="dark"] #v-home { --a-ly: #22b8cc; --a-am: #f07c4c; --a-fat: #a283f5; --a-tr: #94a3b8; }
#v-home .a-ly { --a: var(--a-ly); } #v-home .a-am { --a: var(--a-am); } #v-home .a-fat { --a: var(--a-fat); } #v-home .a-tr { --a: var(--a-tr); }
.ov-tag.t-ly { --a: var(--a-ly, #0e9fb4); } .ov-tag.t-am { --a: var(--a-am, #eb6834); }
#v-home { display: grid; gap: 0; }
#ov-body { display: grid; gap: 16px; }
#ov-body > * { margin: 0 !important; }
/* hero */
.db-hero { padding: 26px 26px 18px; }
.db-top { position: relative; display: grid; gap: 22px; }
@media (min-width: 980px) { .db-top { grid-template-columns: minmax(0, 1fr) minmax(360px, .95fr); gap: 40px; align-items: center; } }
.db-hl { display: grid; gap: 4px; }
.db-hr { display: grid; gap: 12px; padding: 16px; border-radius: 16px; background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .12); }
.db-mix { display: flex; gap: 3px; height: 12px; border-radius: 6px; overflow: hidden; background: rgba(255, 255, 255, .1); }
.db-mix i { display: block; height: 100%; min-width: 3px; }
.cc-anim .db-mix { animation: crgrow 1.1s .25s var(--out) both; transform-origin: left; }
.db-mixl { display: grid; gap: 2px; }
.db-mr { display: grid; grid-template-columns: 10px minmax(0, 1fr) auto 40px; gap: 10px; align-items: center; padding: 6px 8px; margin: 0 -8px; border-radius: 9px; color: #fff; text-decoration: none; font-size: 13px; transition: background .2s; }
.db-mr:hover { background: rgba(255, 255, 255, .08); }
.db-mr i { width: 10px; height: 10px; border-radius: 3px; }
.db-mr span { opacity: .85; } .db-mr b { font-weight: 700; font-variant-numeric: tabular-nums; } .db-mr em { font-style: normal; text-align: right; opacity: .65; font-variant-numeric: tabular-nums; font-size: 12px; }
.h-att { background: #ffffff; } .h-gls { background: #6fe0ae; } .h-gas { background: #ffc15e; } .h-ly { background: #74dbe9; } .h-am { background: #ff9b70; }
.db-kpis { margin-top: 20px !important; }
@media (min-width: 1100px) { .db-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; } }
@media (min-width: 640px) and (max-width: 1099px) { .db-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }
/* schede delle aree */
.db-areas { display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 760px) { .db-areas { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1180px) { .db-areas { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; } }
.db-area { display: grid; align-content: start; gap: 4px; padding: 16px 16px 14px; text-decoration: none; color: inherit; position: relative; overflow: hidden; transition: transform .2s var(--out), box-shadow .2s, border-color .2s; }
.db-area::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 3px; background: var(--a); }
.db-area:hover { transform: translateY(-3px); box-shadow: 0 16px 34px -22px rgba(20, 40, 80, .45); }
.cc-anim .db-area { animation: rise .55s var(--d) var(--out) both; }
.db-ah { display: flex; align-items: center; gap: 10px; }
.db-ah .ov-ic { width: 32px; height: 32px; border-radius: 9px; flex: none; }
.db-at { font-weight: 650; font-size: 13.5px; flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.db-go { width: 16px; height: 16px; fill: none; stroke: var(--muted); stroke-width: 2; transition: transform .2s, stroke .2s; flex: none; }
.db-area:hover .db-go, .db-mini:hover .db-go { stroke: var(--a); transform: translateX(3px); }
.db-av { margin-top: 10px; }
.db-av b { font-size: 25px; font-weight: 800; letter-spacing: -.03em; font-variant-numeric: tabular-nums; white-space: nowrap; }
@media (max-width: 420px) { .db-av b { font-size: 21px; } }
.db-am { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 12px; color: var(--muted); min-height: 20px; }
.db-am .ov-d { font-size: 11px; padding: 1px 7px; }
.db-spark { height: 40px; margin: 6px 0 4px; }
.db-spk0 { height: 10px; }
.db-as { display: grid; grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); gap: 8px; padding-top: 10px; border-top: 1px solid var(--line); }
.db-as > div { display: grid; min-width: 0; } .db-as b { font-size: 13.5px; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .db-as small { font-size: 11px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.db-an { font-size: 11.5px; color: var(--muted); margin-top: 8px; padding: 5px 9px; border-radius: 8px; background: var(--bg); line-height: 1.35; }
/* righe a due colonne */
.db-row { display: grid; gap: 16px; }
@media (min-width: 1020px) { .db-row { grid-template-columns: minmax(0, 1.75fr) minmax(320px, 1fr); align-items: stretch; } }
.ov-trend { display: flex; flex-direction: column; }
.ov-trend .ov-bars { flex: 1; min-height: 240px; }
.db-leg { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line); }
.db-leg span i { background: var(--a); }
.db-leg .muted { margin-left: auto; }
.ov-bc i.a-ly { background: var(--a-ly); } .ov-bc i.a-am { background: var(--a-am); }
/* peso delle aree */
.db-split { display: flex; flex-direction: column; }
.db-sr { display: grid; gap: 5px; padding: 10px 0; border-bottom: 1px solid var(--line); text-decoration: none; color: inherit; }
.cc-anim .db-sr { animation: rise .45s var(--d) var(--out) both; }
.db-st { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; font-size: 13.5px; }
.db-st b { font-weight: 600; } .db-st > span { display: flex; gap: 8px; align-items: baseline; }
.db-st em { font-style: normal; font-size: 12px; color: var(--muted); font-variant-numeric: tabular-nums; } .db-st strong { font-variant-numeric: tabular-nums; }
.db-sb { height: 7px; border-radius: 4px; background: var(--bg); overflow: hidden; } .db-sb i { display: block; height: 100%; border-radius: 4px; background: var(--a); }
.cc-anim .db-sb i { animation: crgrow 1s var(--d) var(--out) both; transform-origin: left; }
.db-sr small { font-size: 11.5px; color: var(--muted); }
.db-sr:hover b { color: var(--a); }
.db-stot { display: flex; justify-content: space-between; align-items: baseline; margin-top: auto; padding-top: 14px; font-size: 13px; color: var(--muted); }
.db-stot b { font-size: 17px; color: var(--ink); font-variant-numeric: tabular-nums; }
/* forniture per piazzale */
.db-pzl { display: grid; gap: 0; }
@media (min-width: 760px) { .db-pzl { grid-template-columns: 1fr 1fr; column-gap: 28px; } }
.db-pr { display: grid; grid-template-columns: 26px minmax(0, 1fr); gap: 12px; align-items: center; padding: 9px 0; border-bottom: 1px solid var(--line); }
.cc-anim .db-pr { animation: rise .45s var(--d) var(--out) both; }
.db-pn { width: 26px; height: 26px; border-radius: 8px; background: var(--bg); display: grid; place-items: center; font-size: 11.5px; font-weight: 700; color: var(--ink-2); }
.db-pr.na .db-pn { background: var(--danger-soft); color: var(--danger); }
.db-pm { display: grid; gap: 5px; min-width: 0; }
.db-pt { display: flex; justify-content: space-between; gap: 10px; font-size: 13.5px; } .db-pt b { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .db-pt strong { font-variant-numeric: tabular-nums; }
.db-pb { display: flex; gap: 2px; height: 7px; border-radius: 4px; overflow: hidden; min-width: 4px; }
.db-pb i { display: block; height: 100%; background: var(--a); }
.cc-anim .db-pb { animation: crgrow 1s var(--d) var(--out) both; transform-origin: left; }
.db-pm small { font-size: 11px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* colonna laterale */
.db-side { display: grid; gap: 16px; align-content: start; }
.db-mini { display: grid; gap: 4px; text-decoration: none; color: inherit; position: relative; overflow: hidden; transition: transform .2s var(--out), box-shadow .2s; }
.db-mini::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--a); }
.db-mini:hover { transform: translateY(-2px); box-shadow: 0 16px 34px -22px rgba(20, 40, 80, .45); }
.db-mv { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.db-mv b { font-size: 24px; font-weight: 800; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.db-mv > span:not(.ov-d) { font-size: 12.5px; color: var(--muted); }
.db-mini .ov-fbar { margin: 8px 0 6px; height: 8px; }
.db-mini .db-as { margin-top: 6px; }
/* ultimi movimenti e classifiche */
#v-home .ov-fi { color: var(--a); background: color-mix(in srgb, var(--a) 13%, transparent); }
.db-tops { grid-template-columns: 1fr; }
@media (min-width: 700px) { .db-tops { grid-template-columns: 1fr 1fr !important; } }
@media (min-width: 1180px) { .db-tops { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; } }
.db-tops .gd-b i { background: var(--a); }
.db-tops .ov-tr:first-child .ov-tn { background: var(--a); color: #fff; }
#ov-ck:not(.all) .ov-ci[data-more] { display: none; }
.db-more { display: block; width: 100%; margin-top: 10px; padding: 10px; border-radius: 10px; border: 1px dashed var(--line); background: transparent; font: inherit; font-size: 13px; font-weight: 600; color: var(--accent); cursor: pointer; }
.db-more:hover { background: var(--accent-soft); border-style: solid; border-color: transparent; }
.db-row2 { align-items: start !important; }
.db-feed .ov-fr { padding: 10px 2px; }
.db-side { grid-auto-rows: 1fr; }
.db-mini { align-content: start; }
.db-mini .db-an { margin-top: auto; }
.db-mini { display: flex; flex-direction: column; }
.db-mini > .db-an { margin-top: auto; }
.db-mini > .db-as + .db-an { margin-top: auto; }
.db-ml { display: grid; margin-top: 10px; }
.db-mli { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 7px 0; border-top: 1px solid var(--line); }
.db-mli > span { display: grid; min-width: 0; } .db-mli b { font-size: 12.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .db-mli small { font-size: 11px; color: var(--muted); }
.db-mli strong { font-size: 13px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.db-mli.late small, .db-mli.late strong { color: var(--danger); }
.db-side { grid-auto-rows: auto; }
.db-pz { display: flex; flex-direction: column; }
.db-pz > .db-leg { margin-top: auto; }
.db-pz > .db-pzl { margin-bottom: 14px; }
@media (max-width: 759px) {
  .db-areas .db-area:last-child:nth-child(odd) { grid-column: 1 / -1; }
  .db-area { padding: 14px 13px 12px; }
  .db-as b { font-size: 12.5px; }
  .db-hero { padding: 22px 18px 16px; }
  .db-hr { padding: 12px 14px; }
}

/* ===== Amazon: aggiornamento dal report di Amazon Business — v39 ===== */
.am-upd { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 12px 16px; border-radius: 14px; background: var(--surface); border: 1px solid var(--line); margin-bottom: 14px; }
.am-ud { width: 10px; height: 10px; border-radius: 50%; background: #1baf7a; box-shadow: 0 0 0 4px color-mix(in srgb, #1baf7a 18%, transparent); flex: none; }
.am-upd.old .am-ud { background: #eda100; box-shadow: 0 0 0 4px color-mix(in srgb, #eda100 20%, transparent); }
.am-ut { display: grid; flex: 1; min-width: 200px; } .am-ut b { font-size: 14px; } .am-ut small { font-size: 12px; color: var(--muted); }
.am-how { display: grid; gap: 4px; }
.am-hs { display: grid; grid-template-columns: 30px 1fr; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.am-hs > span { width: 30px; height: 30px; border-radius: 50%; background: var(--accent); color: var(--accent-ink); display: grid; place-items: center; font-weight: 700; font-size: 13px; }
.am-hs b { font-size: 14px; } .am-hs p { margin: 2px 0 0; font-size: 13px; color: var(--ink-2); line-height: 1.45; }

/* ===== Amazon: articoli modificabili — v40 ===== */
.am-ed { margin-top: 14px; border: 1px solid var(--line); border-radius: 14px; padding: 12px 14px; }
.am-eh { display: grid; gap: 2px; margin-bottom: 6px; } .am-eh b { font-size: 14px; } .am-eh small { font-size: 12px; color: var(--muted); }
.am-er { display: grid; grid-template-columns: minmax(0, 1fr) 70px 104px 92px 160px 30px; gap: 8px; align-items: end; padding: 10px 0; border-bottom: 1px solid var(--line); }
.am-er input, .am-er select { width: 100%; height: 38px; min-height: 0; padding: 0 10px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); color: var(--ink); font: inherit; font-size: 13px; }
.am-er input:focus, .am-er select:focus { outline: 2px solid color-mix(in srgb, var(--accent) 40%, transparent); border-color: var(--accent); }
.am-ed-n { display: grid; gap: 3px; margin: 0; } .am-ed-n span, .am-ed-t small { font-size: 10.5px; color: var(--muted); font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
.am-ed-n input { text-align: right; font-variant-numeric: tabular-nums; }
.am-ed-t { display: grid; gap: 3px; text-align: right; } .am-ed-t b { height: 38px; display: flex; align-items: center; justify-content: flex-end; font-variant-numeric: tabular-nums; font-size: 13.5px; }
.am-ed-x { width: 30px; height: 38px; border: 0; background: transparent; border-radius: 8px; cursor: pointer; color: var(--muted); display: grid; place-items: center; }
.am-ed-x:hover { background: var(--danger-soft); color: var(--danger); }
.am-ed-x svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.am-add { margin-top: 10px; border: 1px dashed var(--line); background: transparent; border-radius: 10px; padding: 8px 12px; font: inherit; font-size: 13px; font-weight: 600; color: var(--accent); cursor: pointer; width: 100%; }
.am-add:hover { background: var(--accent-soft); border-style: solid; border-color: transparent; }
.am-es { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-top: 10px; padding: 10px 12px; border-radius: 10px; }
.am-es span { display: grid; } .am-es b { font-size: 13.5px; font-variant-numeric: tabular-nums; } .am-es small { font-size: 12px; }
.am-es.ok { background: color-mix(in srgb, #1baf7a 12%, transparent); } .am-es.ok small { color: #168a60; }
.am-es.ko { background: var(--warn-soft); } .am-es.ko small { color: var(--warn); }
@media (max-width: 719px) {
  .am-er { grid-template-columns: 1fr 1fr 1fr 30px; }
  .am-er .am-ed-d { grid-column: 1 / -1; }
  .am-er select { grid-column: 1 / 4; }
  .am-er .am-ed-x { grid-column: 4; grid-row: 3; }
}
.am-er { grid-template-columns: 84px 116px minmax(90px, 1fr) minmax(150px, 190px) 30px; row-gap: 6px; }
.am-er .am-ed-d { grid-column: 1 / -1; font-weight: 600; }
.am-er .am-ed-t { text-align: left; } .am-er .am-ed-t b { justify-content: flex-start; padding-left: 4px; }
@media (max-width: 719px) {
  .am-er { grid-template-columns: 1fr 1fr 1fr 30px; }
  .am-er select { grid-column: 1 / 4; }
  .am-er .am-ed-t { text-align: right; } .am-er .am-ed-t b { justify-content: flex-end; }
}
.am-canbtn { color: var(--danger) !important; }

/* ===== Piazzali — v42 ===== */
@media (max-width: 899px) { .nav a.nv-d { display: none; } }
#v-piazzali { --a-att: #3362ab; --a-gls: #1baf7a; --a-gas: #eda100; --a-ly: #0e9fb4; --a-am: #eb6834; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) #v-piazzali { --a-att: #6d93db; --a-gls: #199e70; --a-gas: #c98500; --a-ly: #22b8cc; --a-am: #f07c4c; } }
:root[data-theme="dark"] #v-piazzali { --a-att: #6d93db; --a-gls: #199e70; --a-gas: #c98500; --a-ly: #22b8cc; --a-am: #f07c4c; }
#v-piazzali .a-att { --a: var(--a-att); } #v-piazzali .a-gls { --a: var(--a-gls); } #v-piazzali .a-gas { --a: var(--a-gas); } #v-piazzali .a-ly { --a: var(--a-ly); } #v-piazzali .a-am { --a: var(--a-am); }
#pz-body { display: grid; gap: 16px; }
#pz-body > * { margin: 0 !important; }
.pz-hero .db-mr { border: 0; background: transparent; font: inherit; cursor: pointer; text-align: left; width: calc(100% + 16px); }
.pz-rk { width: 18px !important; height: 18px !important; border-radius: 6px !important; background: rgba(255, 255, 255, .16); font-style: normal; font-size: 11px; font-weight: 700; display: grid; place-items: center; }
.pz-hero .db-mr:has(.pz-rk) { grid-template-columns: 18px minmax(0, 1fr) auto 40px; }
.pz-name { margin: 2px 0 0; font-size: 22px; font-weight: 700; letter-spacing: -.01em; }
.pz-sb { display: flex; gap: 2px; height: 8px; border-radius: 4px; overflow: hidden; min-width: 4px; }
.pz-sb i { display: block; height: 100%; background: var(--a); }
.cc-anim .pz-sb { animation: crgrow 1s var(--d) var(--out) both; transform-origin: left; }
.pz-leg { margin-top: 10px; }
.pz-mx td:first-child { text-align: left; white-space: nowrap; }
.pz-mx tr.click { cursor: pointer; } .pz-mx tr.click:hover td { background: var(--accent-soft); }
.pz-nc { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; background: var(--warn-soft) !important; border-color: transparent !important; }
.pz-nci { width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; background: color-mix(in srgb, var(--warn) 18%, transparent); color: var(--warn); flex: none; }
.pz-nci svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.pz-ncm { display: grid; gap: 2px; flex: 1; min-width: 220px; } .pz-ncm b { font-size: 14px; } .pz-ncm span { font-size: 12.5px; color: var(--ink-2); }
.pz-back { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.pz-back select { height: 36px; border-radius: 10px; border: 1px solid var(--line); background: var(--surface); color: var(--ink); font: inherit; font-size: 14px; font-weight: 600; padding: 0 12px; max-width: 100%; }
.pz-area { border: 1px solid var(--line); font: inherit; text-align: left; cursor: pointer; color: inherit; background: var(--surface); }
#pz-body .ov-fr { width: 100%; border: 0; border-bottom: 1px solid var(--line); background: transparent; font: inherit; text-align: left; cursor: pointer; color: inherit; }
#pz-body .ov-fr:hover { background: var(--bg); }
.pz-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.pz-tag { display: inline-flex; align-items: center; gap: 7px; font-size: 12.5px; padding: 5px 10px; border-radius: 999px; background: var(--bg); }
.pz-tag i { width: 8px; height: 8px; border-radius: 50%; background: var(--a); }
.pz-lg { margin-top: 10px; } .pz-lg h4 { margin: 0 0 4px; font-size: 13px; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.pz-lr { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(180px, 240px); gap: 10px; align-items: center; padding: 9px 0; border-bottom: 1px solid var(--line); }
.pz-ln { display: grid; min-width: 0; } .pz-ln b { font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .pz-ln small { font-size: 11.5px; color: var(--muted); }
.pz-lr select { height: 38px; border-radius: 9px; border: 1px solid var(--line); background: var(--surface); color: var(--ink); font: inherit; font-size: 13px; padding: 0 8px; width: 100%; }
@media (max-width: 560px) { .pz-lr { grid-template-columns: minmax(0, 1fr) auto; } .pz-lr select { grid-column: 1 / -1; } }
@media (min-width: 980px) { #pz-map { position: sticky; top: 16px; } }
#pz-rank:not(.all) .pz-more { display: none; }
.pz-back select { width: auto !important; min-width: 220px; height: 36px !important; min-height: 0 !important; }

/* ===== Backup dei dati — v42 ===== */
.bk-st { display: flex; gap: 12px; align-items: center; padding: 12px 14px; border-radius: 12px; background: var(--bg); margin-top: 8px; }
.bk-st > div { display: grid; } .bk-st b { font-size: 14px; } .bk-st small { font-size: 12px; color: var(--muted); }
.bk-d { width: 10px; height: 10px; border-radius: 50%; flex: none; background: var(--muted); }
.bk-st.ok .bk-d { background: #1baf7a; box-shadow: 0 0 0 4px color-mix(in srgb, #1baf7a 18%, transparent); }
.bk-st.warn .bk-d { background: #eda100; box-shadow: 0 0 0 4px color-mix(in srgb, #eda100 20%, transparent); }
.bk-st.ko .bk-d { background: var(--danger); box-shadow: 0 0 0 4px var(--danger-soft); }
.bk-auto { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 12px; padding: 10px 0; border-top: 1px solid var(--line); }
.bk-auto > span { display: grid; } .bk-auto b { font-size: 13.5px; } .bk-auto small { font-size: 12px; color: var(--muted); }
.tg { position: relative; width: 44px; height: 26px; border-radius: 13px; border: 0; background: var(--line); cursor: pointer; flex: none; transition: background .2s; }
.tg i { position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, .2); transition: transform .2s var(--out); }
.tg.on { background: #1baf7a; } .tg.on i { transform: translateX(18px); }

/* ===== Impostazioni riorganizzate — v43 ===== */
.st-wrap { display: grid; gap: 20px; }
@media (min-width: 1100px) { .st-wrap { grid-template-columns: 230px minmax(0, 860px); gap: 36px; align-items: start; } }
.st-nav { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; margin: 0 -4px; padding: 0 4px 2px; }
.st-nav::-webkit-scrollbar { display: none; }
.st-nav a { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; padding: 8px 12px; border-radius: 10px; font-size: 13.5px; font-weight: 500; color: var(--ink-2); text-decoration: none; background: var(--surface); border: 1px solid var(--line); transition: background .15s, color .15s; }
.st-nav a:hover { background: var(--accent-soft); color: var(--accent); border-color: transparent; }
.st-nav svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: none; }
@media (min-width: 1100px) { .st-nav { position: sticky; top: 20px; flex-direction: column; overflow: visible; margin: 0; padding: 0; gap: 2px; } .st-nav a { border: 0; background: transparent; padding: 9px 12px; } }
.st-main { display: grid; gap: 34px; min-width: 0; }
.st-sec { display: grid; gap: 12px; scroll-margin-top: 20px; }
.st-sh h2 { margin: 0; font-size: 18px; font-weight: 700; letter-spacing: -.01em; }
.st-sh p { margin: 3px 0 0; font-size: 13px; color: var(--muted); line-height: 1.45; }
.st-card { padding: 4px 20px; }
.st-card > :first-child.st-ch { padding-top: 14px; }
.st-ch { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; padding: 14px 0 10px; border-bottom: 1px solid var(--line); }
.st-ch h3 { margin: 0; font-size: 14.5px; }
.st-row { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.st-card > .st-row:last-child, .st-card > div:last-child > .st-row:last-child { border-bottom: 0; }
.st-row[hidden] { display: none; }
.st-l { display: grid; gap: 2px; min-width: 0; flex: 1; } .st-l b { font-size: 14px; font-weight: 600; } .st-l small { font-size: 12.5px; color: var(--muted); line-height: 1.45; }
.st-row > .btn, .st-row > .st-pill { flex: none; }
.st-col { flex-wrap: wrap; } .st-col .st-l { flex-basis: 100%; }
.st-key { width: 100%; margin: 4px 0 0 !important; } .st-key input { flex: 1; }
.st-danger .st-l b { color: var(--danger); }
.st-btn-d { color: var(--danger) !important; border-color: color-mix(in srgb, var(--danger) 35%, var(--line)) !important; }
.st-btn-d:hover { background: var(--danger-soft) !important; }
.st-theme { width: 330px; max-width: 100%; flex: none; }
.st-theme button { padding: 8px 6px !important; } .st-theme button svg { width: 18px !important; height: 18px !important; }
@media (max-width: 640px) { .st-row:has(.st-theme) { flex-direction: column; align-items: stretch; } .st-theme { width: 100%; } }
.st-pill { font-size: 12px; font-weight: 700; padding: 4px 10px; border-radius: 999px; }
.st-pill.on { background: color-mix(in srgb, #1baf7a 15%, transparent); color: #168a60; } .st-pill.off { background: var(--bg); color: var(--muted); }
.st-warn { color: var(--danger); }
.st-chips { padding: 14px 0 10px; }
.st-add { margin: 0 0 14px !important; } .st-add input { flex: 1; height: 38px; min-height: 0; }
.st-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 16px 0; border-bottom: 1px solid var(--line); }
@media (min-width: 760px) { .st-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.st-stat { display: grid; gap: 2px; padding: 12px 14px; border-radius: 12px; background: var(--bg); min-width: 0; }
.st-stat span { font-size: 11.5px; color: var(--muted); } .st-stat b { font-size: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .st-stat small { font-size: 11px; color: var(--muted); }
/* budget */
.st-bt { display: grid; }
.st-bh, .st-br { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr) 150px; gap: 14px; align-items: center; }
.st-bh { padding: 14px 0 8px; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); border-bottom: 1px solid var(--line); }
.st-bh span:last-child { text-align: right; }
.st-br { padding: 10px 0; border-bottom: 1px solid var(--line); }
.st-br:last-child { border-bottom: 0; }
.st-br > b { font-size: 13.5px; font-weight: 600; }
.st-bs { display: grid; gap: 4px; font-size: 13.5px; font-weight: 600; font-variant-numeric: tabular-nums; } .st-bs small { font-size: 11px; font-weight: 500; color: var(--muted); }
.st-bb { display: block; height: 5px; border-radius: 3px; background: var(--bg); overflow: hidden; } .st-bb u { display: block; height: 100%; background: var(--accent); border-radius: 3px; } .st-bb u.near { background: #eda100; } .st-bb u.over { background: var(--danger); }
.st-br input { height: 38px; min-height: 0; text-align: right; font-variant-numeric: tabular-nums; border: 1px solid var(--line); border-radius: 9px; padding: 0 12px; background: var(--surface); color: var(--ink); font: inherit; font-size: 14px; width: 100%; }
@media (max-width: 560px) { .st-bh { display: none; } .st-br { grid-template-columns: 1fr 120px; } .st-br > b { grid-column: 1 / -1; } }
.bk-card #s-bk { padding: 12px 0 16px; }
.bk-card .bk-st { margin-top: 0; }
.st-key input { height: 38px; min-height: 0; } .st-key .btn { height: 38px; }
@media (max-width: 1099px) { .st-wrap { padding-top: 8px; } }

/* ===== Menu: «Altro» sul telefono — v44 ===== */
.nav .nv-m { display: none; }
@media (max-width: 899px) {
  .nav .nv-m { position: relative; display: flex; flex-direction: column; align-items: center; gap: 2px; font: inherit; font-size: 11px; color: var(--muted); padding: 4px 12px; border-radius: 10px; font-weight: 500; border: 0; background: transparent; cursor: pointer; }
  .nav .nv-m svg { width: 22px; height: 22px; fill: currentColor; stroke: none; }
  .nav .nv-m.active { color: var(--accent); }
}
@media (max-width: 460px) { .nav .nv-m { padding-left: 0; padding-right: 0; } .nav .nv-m span { font-size: 9px; } .nav .nv-m svg { width: 20px; height: 20px; } }
.nm-l { display: grid; gap: 8px; }
.nm-i { display: grid; grid-template-columns: 1fr 20px; align-items: center; padding: 14px 16px; border-radius: 12px; background: var(--bg); color: inherit; text-decoration: none; }
.nm-i b { font-size: 15px; } .nm-i small { grid-column: 1; font-size: 12.5px; color: var(--muted); }
.nm-i svg { grid-row: 1 / 3; grid-column: 2; width: 18px; height: 18px; fill: none; stroke: var(--muted); stroke-width: 2; }

/* ===== Preventivi Payper / JRC — v44 ===== */
#pv-body { display: grid; gap: 16px; }
#pv-body > * { margin: 0 !important; }
.pv-bar0 { flex-wrap: wrap; gap: 10px; }
.pv-tabs button, .pv-sups button { padding-left: 14px !important; padding-right: 14px !important; }
.pv-target { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 12px 16px; border-radius: 14px; background: var(--accent-soft); color: var(--accent); }
.pv-target span { font-size: 13.5px; color: var(--ink-2); } .pv-target b { color: var(--accent); }
.pv-search { display: grid; gap: 12px; }
.pv-sb { display: flex; align-items: center; gap: 10px; padding: 0 14px; height: 52px; border-radius: 14px; border: 1.5px solid var(--line); background: var(--surface); transition: border-color .2s; }
.pv-sb:focus-within { border-color: var(--accent); }
.pv-sb svg { width: 20px; height: 20px; fill: none; stroke: var(--muted); stroke-width: 2; stroke-linecap: round; flex: none; }
.pv-sb input { flex: 1; border: 0 !important; outline: 0; background: transparent; font: inherit; font-size: 16px; height: 100%; min-height: 0; padding: 0; color: var(--ink); box-shadow: none !important; }
.pv-fl { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.pv-fl select { height: 36px; min-height: 0; border-radius: 10px; border: 1px solid var(--line); background: var(--surface); color: var(--ink); font: inherit; font-size: 13.5px; padding: 0 10px; width: auto; max-width: 100%; }
.pv-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
.pv-card { display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: 14px; align-items: start; text-align: left; font: inherit; color: inherit; cursor: pointer; border: 1px solid var(--line); background: var(--surface); padding: 14px; transition: transform .2s var(--out), box-shadow .2s, border-color .2s; }
.pv-card:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--accent) 35%, var(--line)); box-shadow: 0 14px 30px -22px rgba(20, 40, 80, .45); }
.cc-anim .pv-card { animation: rise .45s var(--d) var(--out) both; }
.pv-img { position: relative; display: grid; place-items: center; width: 84px; height: 100px; border-radius: 12px; background: linear-gradient(160deg, var(--bg), color-mix(in srgb, var(--accent) 7%, var(--bg))); overflow: hidden; flex: none; }
.pv-img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; background: #fff; z-index: 1; }
.pv-img b { font-size: 20px; font-weight: 800; color: color-mix(in srgb, var(--accent) 45%, var(--muted)); letter-spacing: -.02em; }
.pv-img.big { width: 100%; height: 260px; border-radius: 16px; } .pv-img.big b { font-size: 46px; }
.pv-img.sm { width: 34px; height: 40px; border-radius: 8px; } .pv-img.sm b { font-size: 11px; }
.pv-cm { display: grid; gap: 4px; min-width: 0; }
.pv-cm > b { font-size: 15px; font-weight: 700; letter-spacing: -.01em; }
.pv-cm > small { font-size: 11.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pv-sws { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; margin-top: 4px; } .pv-sws em { font-style: normal; font-size: 11px; color: var(--muted); margin-left: 2px; }
.pv-sw { display: inline-block; width: 14px; height: 14px; border-radius: 50%; border: 1px solid rgba(0, 0, 0, .14); flex: none; }
.pv-pr { display: grid; gap: 2px; margin-top: 6px; } .pv-pr strong { font-size: 17px; font-variant-numeric: tabular-nums; } .pv-pr small { font-size: 11px; color: var(--muted); } .pv-pr .chip { justify-self: start; font-size: 11px; }
.pv-back { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; } .pv-sp { flex: 1; }
.pv-hd { display: grid; gap: 20px; }
@media (min-width: 1000px) { .pv-hd { grid-template-columns: 240px minmax(0, 1fr) 280px; align-items: start; } }
.pv-code { font-size: 11.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.pv-hi h2 { margin: 2px 0 6px; font-size: 26px; letter-spacing: -.02em; }
.pv-hi p { margin: 0 0 14px; font-size: 13.5px; color: var(--ink-2); line-height: 1.55; }
.pv-spec { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.pv-spec div { display: grid; gap: 1px; padding: 8px 10px; border-radius: 10px; background: var(--bg); } .pv-spec span { font-size: 11px; color: var(--muted); } .pv-spec b { font-size: 12.5px; }
.pv-prices { display: grid; gap: 10px; padding: 14px; border-radius: 14px; background: var(--bg); }
.pv-pf { display: grid; gap: 3px; margin: 0; } .pv-pf > span { font-size: 11.5px; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; }
.pv-pf input { height: 42px; min-height: 0; border-radius: 10px; border: 1px solid var(--line); background: var(--surface); color: var(--ink); font: inherit; font-size: 18px; font-weight: 700; padding: 0 12px; font-variant-numeric: tabular-nums; }
.pv-pf b { font-size: 20px; font-variant-numeric: tabular-nums; } .pv-pf small { font-size: 11.5px; color: var(--muted); }
.pv-pf:nth-child(2) b { color: var(--accent); }
.pv-tgl { display: flex; gap: 8px; align-items: center; font-size: 13px; cursor: pointer; } .pv-tgl input { width: 17px; height: 17px; min-height: 0; accent-color: var(--accent); }
.pv-tw { overflow-x: auto; margin: 0 -4px; padding: 0 4px; }
.pv-t { width: 100%; border-collapse: collapse; min-width: 560px; }
.pv-t th { font-family: inherit; font-size: 14px; font-weight: 800; padding: 10px 6px 12px; text-align: center; border-bottom: 1px solid var(--line); white-space: nowrap; }
.pv-t th.pv-ch { text-align: left; font-size: 11px; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: .05em; }
.pv-t td { padding: 10px 5px; text-align: center; border-bottom: 1px solid var(--line); vertical-align: middle; }
.pv-t tr:hover td { background: color-mix(in srgb, var(--accent) 3%, transparent); }
.pv-t td.pv-ch { text-align: left; min-width: 190px; }
.pv-cr { display: flex; align-items: center; gap: 10px; } .pv-cr > span:last-child { display: grid; min-width: 0; } .pv-cr b { font-size: 13px; font-weight: 700; } .pv-cr small { font-size: 11px; color: var(--muted); }
.pv-qi { width: 62px; height: 32px; min-height: 0; border: 1.5px solid #2e9e57; border-radius: 6px; background: var(--surface); color: var(--ink); text-align: center; font: inherit; font-size: 14px; font-weight: 700; padding: 0 4px; }
.pv-qi:focus { outline: 0; border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 20%, transparent); }
.pv-t td small { display: block; margin-top: 4px; font-size: 10.5px; color: var(--muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
.pv-na { background: repeating-linear-gradient(135deg, transparent 0 6px, color-mix(in srgb, var(--line) 60%, transparent) 6px 7px); }
.pv-rt { font-weight: 700; font-variant-numeric: tabular-nums; min-width: 54px; }
.pv-acqc input { width: 76px; height: 32px; min-height: 0; border: 1px solid var(--line); border-radius: 6px; text-align: right; font: inherit; font-size: 13px; padding: 0 6px; background: var(--surface); color: var(--ink); }
.pv-acqh { font-size: 11px !important; font-weight: 600 !important; color: var(--muted); }
.pv-bar { position: sticky; bottom: 12px; z-index: 5; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 12px 14px; border-radius: 16px; background: var(--surface); border: 1px solid var(--line); box-shadow: 0 18px 40px -20px rgba(20, 40, 80, .45); }
@media (max-width: 899px) { .pv-bar { bottom: calc(76px + env(safe-area-inset-bottom)); } }
.pv-bar #pv-sum { flex: 1; min-width: 180px; font-size: 14px; }
.pv-bar select { height: 40px; min-height: 0; border-radius: 10px; border: 1px solid var(--line); background: var(--surface); color: var(--ink); font: inherit; font-size: 13.5px; padding: 0 10px; width: auto; max-width: 260px; }
/* elenco preventivi */
.pv-kpis { display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 760px) { .pv-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.pv-k { display: grid; gap: 2px; } .pv-k span { font-size: 12px; color: var(--muted); } .pv-k b { font-size: 24px; font-weight: 800; } .pv-k small { font-size: 12px; color: var(--muted); font-variant-numeric: tabular-nums; }
.pv-ql { display: grid; }
.pv-qr { display: grid; grid-template-columns: 128px minmax(0, 1fr) 190px 112px 120px; gap: 20px; align-items: center; padding: 14px 12px; border: 0; border-bottom: 1px solid var(--line); background: transparent; font: inherit; color: inherit; text-align: left; cursor: pointer; border-radius: 0; }
.pv-qr:hover { background: var(--bg); }
.pv-qn, .pv-qc { display: grid; min-width: 0; } .pv-qn b, .pv-qc b { font-size: 14px; } .pv-qn small, .pv-qc small { font-size: 11.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pv-qt { text-align: right; font-variant-numeric: tabular-nums; }
@media (max-width: 640px) { .pv-qh { display: none; } .pv-qr { grid-template-columns: minmax(0, 1fr) auto; } .pv-qn { grid-column: 1 / -1; } }
.pv-empty { display: grid; justify-items: center; text-align: center; gap: 8px; padding: 40px 20px; }
.pv-empty h3 { margin: 4px 0 0; } .pv-empty p { margin: 0 0 10px; color: var(--muted); max-width: 440px; font-size: 13.5px; }
.pv-ei { width: 56px; height: 56px; border-radius: 16px; display: grid; place-items: center; background: var(--accent-soft); color: var(--accent); }
.pv-ei svg { width: 28px; height: 28px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
/* scheda del preventivo */
.pv-ed { display: grid; gap: 16px; }
.pv-eht { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.pv-eht h2 { margin: 0; font-size: 26px; letter-spacing: -.02em; }
.pv-ehb { display: flex; gap: 8px; flex-wrap: wrap; }
.pv-ef { display: grid; gap: 10px 14px; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }
.pv-ef label.f { margin: 0; } .pv-w2 { grid-column: span 2; }
@media (max-width: 520px) { .pv-w2 { grid-column: auto; } }
.pv-lt td { vertical-align: middle; }
.pv-szs { display: flex; flex-wrap: wrap; gap: 4px; max-width: 320px; } .pv-szs span { display: inline-flex; gap: 4px; align-items: baseline; font-size: 11.5px; padding: 2px 7px; border-radius: 6px; background: var(--bg); color: var(--ink-2); } .pv-szs b { font-size: 12px; color: var(--ink); }
.pv-li { width: 90px; height: 34px; min-height: 0; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--ink); text-align: right; font: inherit; font-size: 13.5px; padding: 0 8px; font-variant-numeric: tabular-nums; }
.pv-li.sc { width: 64px; } .pv-li.man { border-color: #eda100; background: color-mix(in srgb, #eda100 8%, var(--surface)); }
.pv-la { white-space: nowrap; text-align: right; }
.pv-lb { width: 30px; height: 30px; border: 0; background: transparent; border-radius: 8px; cursor: pointer; color: var(--muted); display: inline-grid; place-items: center; }
.pv-lb:hover { background: var(--bg); color: var(--ink); } .pv-lb.d:hover { background: var(--danger-soft); color: var(--danger); }
.pv-lb svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.pv-foot { display: grid; gap: 16px; }
@media (min-width: 900px) { .pv-foot { grid-template-columns: minmax(0, 1fr) 380px; align-items: start; } }
.pv-foot textarea { width: 100%; border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; font: inherit; font-size: 13.5px; background: var(--surface); color: var(--ink); resize: vertical; }
.pv-tots { display: grid; gap: 2px; }
.pv-tr { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 7px 0; font-size: 13.5px; } .pv-tr b { font-variant-numeric: tabular-nums; }
.pv-tr.t { margin-top: 6px; padding: 12px 14px; border-radius: 12px; background: var(--accent); color: var(--accent-ink); font-size: 16px; } .pv-tr.t b { font-size: 20px; }
.pv-gs { display: inline-flex; align-items: center; gap: 4px; margin-left: auto; color: var(--muted); } .pv-gs input { width: 60px; height: 30px; min-height: 0; border: 1px solid var(--line); border-radius: 7px; text-align: right; font: inherit; font-size: 13px; padding: 0 6px; background: var(--surface); color: var(--ink); }
.pv-int { margin-top: 12px; padding: 10px 12px; border-radius: 12px; border: 1px dashed var(--line); } .pv-int > span { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); } .pv-int > small { display: block; font-size: 11.5px; color: var(--warn); }
.pv-int .pv-tr { padding: 5px 0; font-size: 13px; } .pv-int b.pos { color: #168a60; } .pv-int b.neg { color: var(--danger); }
.pv-lq { display: grid; grid-template-columns: repeat(auto-fill, minmax(90px, 1fr)); gap: 10px; } .pv-lq label.f { margin: 0; } .pv-lq input { text-align: center; }
.pv-img.sm { border: 1px solid rgba(0,0,0,.12); width: 30px; height: 36px; }
@media (max-width: 640px) {
  .pv-img.big { height: 150px; } .pv-img.big b { font-size: 34px; }
  .pv-bar { padding: 8px 10px; gap: 8px; border-radius: 14px; }
  .pv-bar #pv-sum { flex-basis: 100%; min-width: 0; font-size: 13px; }
  .pv-bar select { flex: 1; height: 38px; max-width: none; min-width: 0; }
  .pv-bar .btn { height: 38px; padding: 0 12px; font-size: 13.5px; }
  .pv-hi h2 { font-size: 22px; }
}
/* miniature dei colori: bordo pulito, tinta solo se manca la foto — v45 */
.pv-img.sm { width: 34px; height: 40px; border-radius: 8px; background: #fff; border: 1px solid var(--line); box-shadow: 0 1px 2px rgba(15, 23, 42, .06); }
.pv-img.sm:not(.has), .pv-img.sm:not(:has(img)) { background: var(--sw); border-color: rgba(0, 0, 0, .1); }
.pv-img.sm img { inset: 2px; width: calc(100% - 4px); height: calc(100% - 4px); border-radius: 6px; background: #fff; }
.pv-img img { background: #fff; }
.pv-opts { display: grid; gap: 8px; }

/* ===== Loghi dei fornitori con animazione + vista cliente — v46 ===== */
.pv-brand { position: relative; display: inline-grid; grid-template-columns: repeat(2, 64px); gap: 4px; padding: 4px; border-radius: 16px; background: var(--bg); border: 1px solid var(--line); isolation: isolate; }
.pv-bi { position: absolute; z-index: -1; top: 4px; bottom: 4px; left: 4px; width: 64px; border-radius: 12px; background: var(--surface); box-shadow: 0 1px 2px rgba(15, 23, 42, .08), 0 8px 18px -10px rgba(15, 23, 42, .35); transform: translateX(calc(var(--i, 0) * 68px)); transition: transform .55s cubic-bezier(.34, 1.36, .5, 1); }
.pv-brand button { position: relative; display: grid; place-items: center; height: 46px; border: 0; background: transparent; border-radius: 12px; cursor: pointer; padding: 0; overflow: hidden; }
.pv-brand img { height: 32px; width: auto; display: block; border-radius: 4px; filter: grayscale(1); opacity: .42; transform: scale(.94); transition: filter .45s ease, opacity .45s ease, transform .5s cubic-bezier(.34, 1.36, .5, 1); }
.pv-brand button:hover img { filter: grayscale(.35); opacity: .78; transform: scale(.98) translateY(-1px); }
.pv-brand button.on img { filter: none; opacity: 1; transform: scale(1); animation: pvpop .6s cubic-bezier(.34, 1.56, .5, 1); }
.pv-brand button.on::after { content: ""; position: absolute; inset: 7px 14px; border-radius: 4px; pointer-events: none; background: linear-gradient(110deg, transparent 38%, rgba(255, 255, 255, .7) 50%, transparent 62%); background-size: 260% 100%; background-position: 140% 0; animation: pvshine 1.15s .18s cubic-bezier(.4, 0, .2, 1) both; }
.pv-brand button:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
@keyframes pvpop { 0% { transform: scale(.8); } 55% { transform: scale(1.07); } 100% { transform: scale(1); } }
@keyframes pvshine { from { background-position: 140% 0; } to { background-position: -40% 0; } }
@media (prefers-reduced-motion: reduce) { .pv-bi, .pv-brand img { transition: none; } .pv-brand button.on img, .pv-brand button.on::after { animation: none; } }
.pv-elogo { width: 64px; height: 64px; border-radius: 14px; box-shadow: 0 10px 24px -14px rgba(0, 0, 0, .5); animation: pvpop .7s cubic-bezier(.34, 1.56, .5, 1); }
.pv-eye { display: inline-flex; align-items: center; gap: 7px; height: 34px; padding: 0 12px; border-radius: 10px; border: 1px solid var(--line); background: var(--surface); color: var(--ink-2); font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; transition: background .2s, color .2s, border-color .2s; }
.pv-eye svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.pv-eye .e-off { display: none; }
.pv-eye.on { background: var(--ink); color: var(--surface); border-color: var(--ink); }
.pv-eye.on .e-on { display: none; } .pv-eye.on .e-off { display: block; }
@media (max-width: 640px) { .pv-eye span { display: none; } .pv-eye { padding: 0 10px; } }
.pv-big { font-size: 26px !important; color: var(--accent); }
.pv-acqinfo { font-size: 12px; color: var(--muted); padding-top: 2px; }
.pv-int[hidden] { display: none; }

/* ===== Catalogo: homepage con categorie — v47 ===== */
.pv-hero { position: relative; display: grid; gap: 18px; padding: 26px; border-radius: 22px; background: linear-gradient(135deg, var(--surface) 0%, color-mix(in srgb, var(--accent) 5%, var(--surface)) 100%); border: 1px solid var(--line); overflow: hidden; }
.pv-hero::after { content: ""; position: absolute; right: -80px; top: -120px; width: 320px; height: 320px; border-radius: 50%; background: radial-gradient(circle, color-mix(in srgb, var(--accent) 10%, transparent), transparent 70%); pointer-events: none; }
@media (min-width: 980px) { .pv-hero { grid-template-columns: minmax(0, 1fr) minmax(380px, 1.1fr); align-items: center; gap: 32px; padding: 30px 32px; } }
.pv-hero-l { display: flex; align-items: center; gap: 18px; position: relative; z-index: 1; }
.pv-hero-logo { width: 64px; height: auto; max-height: 74px; border-radius: 10px; box-shadow: 0 14px 28px -16px rgba(0, 0, 0, .45); animation: pvpop .7s cubic-bezier(.34, 1.56, .5, 1) both; }
.pv-hero h2 { margin: 2px 0 2px; font-size: 30px; font-weight: 800; letter-spacing: -.03em; }
.pv-hero p { margin: 0; font-size: 13px; color: var(--muted); }
.pv-hero-s { position: relative; z-index: 1; height: 56px; background: var(--surface); box-shadow: 0 10px 30px -18px rgba(15, 23, 42, .35); }
.pv-sh { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-top: 6px; }
.pv-sh h3 { margin: 0; font-size: 17px; font-weight: 700; letter-spacing: -.01em; }
.pv-cats { display: grid; gap: 14px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 700px) { .pv-cats { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .pv-cats { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 1500px) { .pv-cats { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.pv-cat { position: relative; display: grid; grid-template-rows: auto auto; text-align: left; padding: 0; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); overflow: hidden; cursor: pointer; font: inherit; color: inherit; transition: transform .3s cubic-bezier(.2, .8, .2, 1), box-shadow .3s, border-color .3s; }
.pv-cat:hover { transform: translateY(-4px); border-color: color-mix(in srgb, var(--accent) 30%, var(--line)); box-shadow: 0 22px 40px -26px rgba(15, 23, 42, .45); }
.cc-anim .pv-cat { animation: rise .55s var(--d) var(--out) both; }
.pv-cat-img { position: relative; display: block; aspect-ratio: 4 / 3; background: linear-gradient(180deg, #f6f7f9, #eceef2); overflow: hidden; }
.pv-cat-img img { position: absolute; inset: 10% 16%; width: 68%; height: 80%; object-fit: contain; mix-blend-mode: multiply; transition: transform .5s cubic-bezier(.2, .8, .2, 1); }
.pv-cat:hover .pv-cat-img img { transform: scale(1.06); }
.pv-cat-t { display: grid; gap: 2px; padding: 12px 40px 14px 16px; }
.pv-cat-t b { font-size: 15px; font-weight: 700; letter-spacing: -.01em; }
.pv-cat-t small { font-size: 12px; color: var(--muted); font-variant-numeric: tabular-nums; }
.pv-cat-go { position: absolute; right: 14px; bottom: 18px; width: 18px; height: 18px; fill: none; stroke: var(--muted); stroke-width: 2; transition: transform .25s, stroke .25s; }
.pv-cat:hover .pv-cat-go { transform: translateX(3px); stroke: var(--accent); }
:root[data-theme="dark"] .pv-cat-img { background: linear-gradient(180deg, #2a2c30, #232528); }
:root[data-theme="dark"] .pv-cat-img img { mix-blend-mode: normal; border-radius: 10px; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .pv-cat-img { background: linear-gradient(180deg, #2a2c30, #232528); } :root:not([data-theme="light"]) .pv-cat-img img { mix-blend-mode: normal; border-radius: 10px; } }
/* pagina della categoria */
.pv-crumb { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--muted); }
.pv-crumb b { color: var(--ink); font-weight: 600; }
.pv-cb { display: inline-flex; align-items: center; gap: 4px; border: 0; background: transparent; font: inherit; color: var(--accent); font-weight: 600; cursor: pointer; padding: 4px 6px 4px 0; }
.pv-cb svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2.2; }
.pv-lh { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.pv-lh h2 { margin: 0; font-size: 26px; font-weight: 800; letter-spacing: -.02em; }
.pv-lh p { margin: 2px 0 0; }
.pv-sb.sm { height: 44px; width: 380px; max-width: 100%; border-radius: 12px; }
.pv-sb.sm input { font-size: 14.5px; }
.pv-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.pv-chips button { border: 1px solid var(--line); background: var(--surface); color: var(--ink-2); font: inherit; font-size: 13px; font-weight: 500; padding: 6px 12px; border-radius: 999px; cursor: pointer; transition: all .2s; }
.pv-chips button:hover { border-color: color-mix(in srgb, var(--accent) 40%, var(--line)); color: var(--ink); }
.pv-chips button.on { background: var(--ink); border-color: var(--ink); color: var(--surface); }
#pv-sort { height: 36px; min-height: 0; border-radius: 10px; border: 1px solid var(--line); background: var(--surface); color: var(--ink); font: inherit; font-size: 13px; padding: 0 10px; width: auto; }
.pv-pr strong em { font-style: normal; font-size: 12px; font-weight: 500; color: var(--muted); }
.pv-card .pv-img img { mix-blend-mode: multiply; background: transparent; }
.pv-card .pv-img { background: linear-gradient(180deg, #f6f7f9, #eceef2); }
.pv-img.has > b { display: none; }
.pv-sh .link { border: 0; background: none; padding: 0; font: inherit; font-size: 13px; font-weight: 600; color: var(--accent); cursor: pointer; }
.pv-sh .link:hover { text-decoration: underline; }
.pv-chips button em { font-style: normal; font-size: 11px; color: var(--muted); margin-left: 3px; } .pv-chips button.on em { color: inherit; opacity: .7; }

/* ---------- v49 logo del cliente sui capi ---------- */
.pv-lg { margin-top: 16px; }
.pv-lgs { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 700px) { .pv-lgs { grid-template-columns: 1fr; } }
.pv-lgs-i { display: flex; flex-direction: column; gap: 10px; padding: 14px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); min-width: 0; }
.pv-lgt { display: flex; align-items: center; gap: 12px; }
.pv-lgt b { display: block; font-size: 14px; } .pv-lgt small { color: var(--muted); font-size: 12px; }
.pv-lgico { width: 40px; height: 40px; flex: none; }
.pv-lgico path { fill: var(--bg); stroke: var(--muted); stroke-width: 1.6; stroke-linejoin: round; }
.pv-lgico .pt { fill: var(--accent); }
.pv-lgx { height: 128px; border-radius: 10px; display: grid; place-items: center; padding: 12px; background-color: #fff; background-image: linear-gradient(45deg, #f1f3f6 25%, transparent 25%), linear-gradient(-45deg, #f1f3f6 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #f1f3f6 75%), linear-gradient(-45deg, transparent 75%, #f1f3f6 75%); background-size: 16px 16px; background-position: 0 0, 0 8px, 8px -8px, -8px 0; border: 1px solid var(--line); }
.pv-lgx { overflow: hidden; }
.pv-lgx img { max-width: 100%; max-height: 102px; object-fit: contain; opacity: 0; transition: opacity .3s; }
.pv-lgx.ok img { opacity: 1; }
.pv-lgx.ko::after { content: 'Logo non disponibile su questo dispositivo'; font-size: 12px; color: var(--muted); }
.pv-lgn { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-width: 0; }
.pv-lgn small { color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.pv-lgn span { display: flex; gap: 14px; flex: none; } .pv-lgn .link.d { color: var(--danger); }
.pv-lgup { display: grid; justify-items: center; gap: 4px; height: 128px; align-content: center; border: 1.5px dashed var(--line); border-radius: 10px; background: var(--bg); color: var(--ink); cursor: pointer; font: inherit; transition: border-color .2s, background .2s; }
.pv-lgup:hover { border-color: var(--accent); background: var(--accent-soft); }
.pv-lgup svg { width: 24px; height: 24px; fill: none; stroke: var(--accent); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.pv-lgup b { font-size: 13.5px; } .pv-lgup small { color: var(--muted); font-size: 12px; }
.pv-lgs-i > .link { align-self: flex-start; font-size: 13px; }
.pv-lgb { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--line); }
.pv-lgba { display: flex; gap: 8px; flex-wrap: wrap; }
.pv-lgtg { display: inline-flex; gap: 4px; }
.pv-lgtg button { height: 28px; padding: 0 10px; border-radius: 999px; border: 1px solid var(--line); background: var(--surface); color: var(--muted); font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; transition: all .18s; white-space: nowrap; }
.pv-lgtg button:hover:not(:disabled):not(.on) { border-color: var(--accent); color: var(--accent); }
.pv-lgtg button.on { background: var(--accent); border-color: var(--accent); color: #fff; }
.pv-lgtg button:disabled { opacity: .35; cursor: not-allowed; }
.pv-mk { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.pv-mkc { border: 1px solid var(--line); border-radius: 12px; padding: 12px; background: var(--surface); }
.pv-mkh b { display: block; font-size: 13.5px; } .pv-mkh small { color: var(--muted); font-size: 12px; }
.pv-mki { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: 8px; margin-top: 10px; }
.pv-mki figure { margin: 0; } .pv-mki img { width: 100%; aspect-ratio: 1; object-fit: contain; background: #fff; border-radius: 8px; border: 1px solid var(--line); }
.pv-mki figcaption { font-size: 11px; color: var(--muted); text-align: center; margin-top: 4px; }
.pv-lgn .link, .pv-lgs-i > .link { border: 0; background: none; padding: 0; font: inherit; font-size: 13px; font-weight: 600; color: var(--accent); cursor: pointer; }
.pv-lgn .link:hover, .pv-lgs-i > .link:hover { text-decoration: underline; } .pv-lgn .link.d { color: var(--danger); }

/* ---------- v50 anteprima a scelta, prezzi personalizzazione ---------- */
.pv-mks-h { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; font-size: 13px; color: var(--muted); }
.pv-mks-h .link { border: 0; background: none; padding: 0; font: inherit; font-weight: 600; color: var(--accent); cursor: pointer; }
.pv-mks { display: grid; gap: 6px; max-height: 52vh; overflow: auto; }
.pv-mks-r { display: flex; align-items: center; gap: 12px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 12px; cursor: pointer; background: var(--surface); transition: border-color .15s, background .15s; }
.pv-mks-r:has(input:checked) { border-color: var(--accent); background: var(--accent-soft); }
.pv-mks-r input { width: 18px; height: 18px; accent-color: var(--accent); flex: none; }
.pv-mks-r b { display: block; font-size: 13.5px; } .pv-mks-r small { color: var(--muted); font-size: 12px; }
.pv-mki figure { display: grid; gap: 6px; justify-items: center; }
.pv-mki figure .btn { display: inline-flex; align-items: center; gap: 6px; }
.pv-mki figure .btn svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.pv-mk { grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); }
.pv-mkf { display: flex; justify-content: flex-end; margin-top: 14px; }
.pv-pr { margin-top: 16px; }
.pv-prt td { vertical-align: middle; }
.pv-prd { display: grid; gap: 6px; min-width: 260px; }
.pv-prd select, .pv-prs { height: 34px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--ink); font: inherit; font-size: 13px; padding: 0 8px; max-width: 100%; }
.pv-prd input { height: 34px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--ink); font: inherit; font-size: 13px; padding: 0 10px; }
.pv-pl { display: grid; gap: 6px; }
.pv-plr { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 10px; font-size: 13.5px; }
.pv-plr em { font-style: normal; font-size: 11px; color: var(--muted); background: var(--bg); padding: 2px 6px; border-radius: 6px; margin-left: 4px; }
.pv-pli { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); flex: none; }
.pv-pli input { width: 84px; height: 34px; border: 1px solid var(--line); border-radius: 8px; text-align: right; padding: 0 8px; font: inherit; background: var(--surface); color: var(--ink); }
.pv-lgt small em { font-style: normal; color: var(--accent); font-weight: 600; }
.pv-mki img { max-height: 320px; }

/* ---------- v51 sistema il logo a mano ---------- */
.pv-mkbt { display: inline-flex; gap: 6px; flex-wrap: wrap; justify-content: center; }
.pv-adj { background: #fff; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; display: grid; place-items: center; }
.pv-adj canvas { width: 100%; max-width: 560px; height: auto; max-height: 62vh; object-fit: contain; display: block; cursor: grab; touch-action: none; outline: none; }
.pv-adj canvas:active { cursor: grabbing; }
.pv-adj canvas:focus-visible { box-shadow: inset 0 0 0 2px var(--accent); }
.pv-adjs { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 14px; }
@media (max-width: 640px) { .pv-adjs { grid-template-columns: 1fr; } }
.pv-adjs label { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; font-size: 13px; color: var(--muted); }
.pv-adjs input[type=range] { width: 100%; accent-color: var(--accent); }
.pv-adjs b { color: var(--ink); font-size: 13px; min-width: 42px; text-align: right; font-variant-numeric: tabular-nums; }
.pv-adjb { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 12px; }
.pv-adjb .link { border: 0; background: none; padding: 0; font: inherit; font-size: 13px; font-weight: 600; color: var(--accent); cursor: pointer; }
/* v52 scheda lavoro */
#pv-work { display: inline-flex; align-items: center; gap: 6px; }
#pv-work svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
/* v53 «Aggiungi prodotti» nella sezione Prodotti */
.pv-ph { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.pv-ph > div { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; min-width: 0; }
.pv-ph h3 { margin: 0; }
#pv-addp { display: inline-flex; align-items: center; gap: 6px; flex: none; }
#pv-addp svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; }

/* ---------- v55 DeWalt (attrezzi) ---------- */
.pv-brand { grid-template-columns: repeat(3, 64px); }
.pv-tl { display: block; font-size: 12px; color: var(--muted); margin-top: 4px; }
.pv-tq { display: inline-flex; align-items: center; gap: 8px; padding: 6px 0 4px; }
.pv-tqb { width: 44px; height: 44px; border-radius: 12px; border: 1px solid var(--line); background: var(--surface); color: var(--ink); font-size: 22px; line-height: 1; cursor: pointer; transition: border-color .15s, color .15s; }
.pv-tqb:hover { border-color: var(--accent); color: var(--accent); }
.pv-tqi { width: 96px !important; height: 44px !important; text-align: center; font-size: 18px !important; font-weight: 700; }
.pv-card .pv-cm > b { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.pv-brand { grid-template-columns: repeat(4, 64px); }
@media (max-width: 520px) { .pv-brand { grid-template-columns: repeat(4, 54px); } .pv-bi { width: 54px; transform: translateX(calc(var(--i, 0) * 58px)); } .pv-brand img { height: 28px; } }
.pv-brand { grid-template-columns: repeat(5, 60px); } .pv-bi { width: 60px; transform: translateX(calc(var(--i, 0) * 64px)); }
@media (max-width: 520px) { .pv-brand { grid-template-columns: repeat(5, 50px); gap: 3px; } .pv-bi { width: 50px; transform: translateX(calc(var(--i, 0) * 53px)); } .pv-brand img { height: 26px; } }
.pv-card .pv-cm > b { -webkit-line-clamp: 3; }

/* ---------- v59 vista 3D ---------- */
.pv-hm { position: relative; }
.pv-3dbtn { position: absolute; left: 50%; bottom: 10px; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--line); background: color-mix(in srgb, var(--surface) 92%, transparent); backdrop-filter: blur(6px); color: var(--ink); font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; box-shadow: 0 6px 18px -10px rgba(15, 23, 42, .5); transition: border-color .2s, color .2s, transform .2s; white-space: nowrap; }
.pv-3dbtn:hover { border-color: var(--accent); color: var(--accent); transform: translateX(-50%) translateY(-1px); }
.pv-3dbtn svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linejoin: round; }
.pv-3dbtn em { font-style: normal; font-size: 10px; font-weight: 700; padding: 1px 6px; border-radius: 999px; background: var(--accent-soft); color: var(--accent); }
.pv3d { position: relative; background: #fff; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; cursor: grab; touch-action: pan-y; user-select: none; outline: none; }
.pv3d.drag { cursor: grabbing; }
.pv3d:focus-visible { box-shadow: inset 0 0 0 2px var(--accent); }
.pv3d-st { position: relative; aspect-ratio: 1; max-height: 62vh; margin: 0 auto; }
.pv3d-st img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; pointer-events: none; }
.pv3d-hint { position: absolute; left: 50%; bottom: 12px; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: #5b6472; background: rgba(255, 255, 255, .9); padding: 4px 10px; border-radius: 999px; border: 1px solid #e3e7ee; }
.pv3d-hint svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.pv3d-deg { position: absolute; top: 10px; right: 12px; font-size: 12px; font-weight: 600; color: #5b6472; font-variant-numeric: tabular-nums; }
.pv3d-ctl { display: flex; align-items: center; gap: 12px; margin-top: 12px; flex-wrap: wrap; }
.pv3d-ctl input[type=range] { flex: 1; min-width: 140px; accent-color: var(--accent); }
.pv3d-ctl .btn { display: inline-flex; align-items: center; gap: 6px; }
.pv3d-ctl .btn svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.pv3d-ctl .link { border: 0; background: none; padding: 0; font: inherit; font-size: 13px; font-weight: 600; color: var(--accent); cursor: pointer; }
.pv3d-ask { text-align: center; padding: 6px 4px; }
.pv3d-ask p { margin: 6px 0; }
.pv3d-ico { width: 56px; height: 56px; margin: 0 auto 8px; border-radius: 16px; display: grid; place-items: center; background: var(--accent-soft); color: var(--accent); }
.pv3d-ico svg { width: 28px; height: 28px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linejoin: round; }
@media (prefers-reduced-motion: reduce) { .pv-3dbtn { transition: none; } }
.pv-3dbtn { z-index: 3; }
.pv3d-up { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 12px; padding: 12px 14px; border-radius: 12px; background: var(--accent-soft); font-size: 13px; color: var(--ink); }
.pv3d-st img { will-change: opacity; backface-visibility: hidden; }
/* v61: Milwaukee, taglie nelle schede attrezzi */
.pv-brand { grid-template-columns: repeat(6, 60px); }
@media (max-width: 520px) { .pv-brand { grid-template-columns: repeat(6, 46px); gap: 3px; } .pv-bi { width: 46px; transform: translateX(calc(var(--i, 0) * 49px)); } .pv-brand img { height: 24px; } }
.pv-vr { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 8px 18px; padding-top: 4px; }
.pv-vrow { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 6px 0; border-top: 1px solid var(--line); }
.pv-vn { display: grid; gap: 1px; min-width: 0; }
.pv-vn b { font-size: 14.5px; font-weight: 700; color: var(--ink); }
.pv-vn small { font-size: 12px; color: var(--ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pv-vrow .pv-tq { padding: 0; gap: 6px; }
.pv-vrow .pv-tqb { width: 36px; height: 36px; font-size: 19px; border-radius: 10px; }
.pv-vrow .pv-tqi { width: 64px !important; height: 36px !important; font-size: 16px !important; }
/* v62: prodotti nuovi da link */
.pv-sha { display: inline-flex; align-items: center; gap: 14px; flex-wrap: wrap; justify-content: flex-end; }
.pv-sha .btn svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; margin-right: 6px; vertical-align: -3px; }
.pv-new { display: inline-block; font-style: normal; font-size: 10.5px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; color: #fff; background: var(--accent); border-radius: 6px; padding: 1px 6px; margin-right: 6px; vertical-align: 2px; }
.pvx-intro { margin: 0 0 14px; font-size: 14px; line-height: 1.5; color: var(--ink-2); }
.pvx-warn { margin: 0 0 12px; padding: 9px 12px; border-radius: 10px; font-size: 13px; line-height: 1.45; background: #fff6e6; color: #8a5300; border: 1px solid #f3d7a6; }
.pvx-note { margin: 4px 0 0; font-size: 12.5px; color: var(--ink-2); }
.pvx-src { display: flex; gap: 8px; align-items: baseline; margin: 0 0 12px; font-size: 13px; min-width: 0; }
.pvx-src span { color: var(--ink-2); flex: none; }
.pvx-src a { color: var(--accent); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.pvx-ph { margin: 0 0 14px; }
.pvx-l { display: block; font-size: 12.5px; font-weight: 600; color: var(--ink-2); margin-bottom: 6px; }
#pvx-phs { display: flex; gap: 8px; flex-wrap: wrap; }
.pvx-p { width: 92px; height: 92px; border-radius: 12px; border: 2px solid var(--line); background: #fff; padding: 4px; cursor: pointer; display: grid; place-items: center; overflow: hidden; transition: border-color .2s, box-shadow .2s; }
.pvx-p img { max-width: 100%; max-height: 100%; object-fit: contain; display: block; }
.pvx-p.on { border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent); }
.pvx-p.add, .pvx-p.none { background: var(--bg); color: var(--ink-2); font-size: 12px; font-weight: 600; gap: 2px; align-content: center; }
.pvx-p.add svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.pvx-bar { display: flex; align-items: center; justify-content: space-between; gap: 10px 16px; flex-wrap: wrap; margin: -4px 0 14px; padding: 10px 14px; border-radius: 12px; background: var(--bg); border: 1px dashed var(--line); font-size: 13px; color: var(--ink-2); }
.pvx-bar b { color: var(--ink); }
.pvx-bar a { color: var(--accent); }
.pvx-ba { display: inline-flex; gap: 8px; }
@media (max-width: 520px) { .pvx-p { width: 74px; height: 74px; } .pv-sha { gap: 10px; } }
/* v64: scelta dell'IA */
.ai-first { position: relative; display: inline-grid; grid-template-columns: 1fr 1fr; padding: 3px; border-radius: 11px; border: 1px solid var(--line); background: var(--surface); isolation: isolate; }
.ai-first i { position: absolute; z-index: -1; top: 3px; bottom: 3px; left: 3px; width: calc(50% - 3px); border-radius: 8px; background: var(--ink); transition: transform .35s var(--spring); }
.ai-first.oa i { transform: translateX(100%); }
.ai-first button { border: 0; background: none; font: inherit; font-size: 13px; font-weight: 600; padding: 6px 14px; color: var(--muted); cursor: pointer; transition: color .25s; white-space: nowrap; }
.ai-first button.on { color: var(--bg); }
.ai-first button:disabled { cursor: default; opacity: .5; }
/* v65: 7 fornitori */
.pv-brand { grid-template-columns: repeat(14, 44px); } .pv-bi { width: 44px; transform: translateX(calc(var(--i, 0) * 48px)); }
@media (max-width: 520px) { .pv-brand { grid-template-columns: repeat(8, 38px); gap: 3px; } .pv-bi { width: 38px; transform: translateX(calc(var(--i, 0) * 41px)); } .pv-brand img { height: 21px; } }
/* v67: menu «Altro» e foto ingrandita */
.pv-act { position: relative; }
.pv-toolsb svg circle { fill: currentColor; stroke: none; }
.pv-toolsb[aria-expanded="true"] { border-color: var(--accent); color: var(--accent); }
.pv-menu { position: absolute; z-index: 60; top: calc(100% + 8px); right: 0; width: min(340px, calc(100vw - 32px)); padding: 6px; border-radius: 14px; background: var(--surface); border: 1px solid var(--line); box-shadow: 0 18px 40px -16px rgba(15, 23, 42, .35); animation: pvmenu .18s ease-out both; }
@keyframes pvmenu { from { opacity: 0; transform: translateY(-4px); } }
.pv-mh { padding: 8px 10px 6px; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.pv-menu button { display: flex; align-items: flex-start; gap: 11px; width: 100%; padding: 10px; border: 0; border-radius: 10px; background: none; text-align: left; font: inherit; color: var(--ink); cursor: pointer; }
.pv-menu button:hover, .pv-menu button:focus-visible { background: var(--bg); outline: none; }
.pv-menu svg { flex: none; width: 19px; height: 19px; margin-top: 1px; fill: none; stroke: var(--accent); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.pv-menu b { display: block; font-size: 14px; font-weight: 600; }
.pv-menu small { display: block; margin-top: 2px; font-size: 12px; color: var(--ink-2); line-height: 1.35; }
.pv-img img, .pv-mki img, .pv-lgx img { cursor: zoom-in; }
.pv-card .pv-img img, .pv-cat img, label .pv-img img { cursor: inherit; }
.pv-zoom { position: fixed; inset: 0; z-index: 400; display: flex; flex-direction: column; background: rgba(10, 13, 20, .9); opacity: 0; transition: opacity .2s ease; }
.pv-zoom.on { opacity: 1; }
.pv-zbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; color: #fff; }
.pv-zcap { font-weight: 600; font-size: 15px; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pv-zact { display: inline-flex; gap: 8px; flex: none; }
.pv-zbtn { display: inline-flex; align-items: center; gap: 7px; height: 38px; padding: 0 14px; border-radius: 11px; border: 1px solid rgba(255, 255, 255, .25); background: rgba(255, 255, 255, .1); color: #fff; font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; }
.pv-zbtn:hover { background: rgba(255, 255, 255, .2); }
.pv-zbtn.x { width: 38px; padding: 0; justify-content: center; }
.pv-zbtn svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.pv-zstage { flex: 1; min-height: 0; display: flex; align-items: center; justify-content: center; padding: 8px 16px; overflow: auto; }
.pv-zimg { max-width: 100%; max-height: 100%; object-fit: contain; background: #fff; border-radius: 14px; cursor: zoom-in; transition: transform .25s ease; }
.pv-zoom.big .pv-zstage { align-items: flex-start; justify-content: flex-start; }
.pv-zoom.big .pv-zimg { max-width: none; max-height: none; width: min(2000px, 220vw); cursor: zoom-out; }
.pv-zhint { margin: 0; padding: 8px 16px 14px; text-align: center; font-size: 12px; color: rgba(255, 255, 255, .6); }
@media (max-width: 520px) { .pv-toolsb span { display: none; } .pv-zcap { font-size: 13px; } .pv-zbtn { height: 34px; padding: 0 11px; font-size: 13px; } }
@media (prefers-reduced-motion: reduce) { .pv-zoom, .pv-zimg, .pv-menu { transition: none; animation: none; } }
/* v69: chiudi preventivo, prezzi d'acquisto sulle righe, clienti */
.pv-tgb { display: inline-flex; gap: 8px; flex-wrap: wrap; }
#pv-close svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; margin-right: 6px; vertical-align: -3px; }
.pv-lacq { display: block; margin-top: 4px; font-size: 11.5px; color: var(--ink-2); white-space: nowrap; text-align: right; }
.pv-lacq.neg { color: #c2410c; font-weight: 600; }
body.pv-cli .pv-lacq { display: none; }
.pv-cliric { display: flex; align-items: center; gap: 10px 18px; flex-wrap: wrap; margin-top: 14px; padding: 12px 14px; border-radius: 12px; background: var(--bg); border: 1px dashed var(--line); }
.pv-cliric small { flex: 1 1 260px; font-size: 12.5px; color: var(--ink-2); line-height: 1.45; }
.pv-rf { display: inline-flex; align-items: center; gap: 10px; font-size: 13px; font-weight: 600; color: var(--ink); }
.pv-ri { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; }
.pv-ri input { width: 74px; height: 36px; text-align: right; }
.pv-clisb { margin: 4px 0 10px; max-width: 420px; }
.pv-cll { display: grid; gap: 0; }
.pv-clr { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 12px 16px; padding: 10px 0; border-top: 1px solid var(--line); }
.pv-clm { display: flex; align-items: center; gap: 12px; min-width: 0; border: 0; background: none; padding: 4px 0; text-align: left; font: inherit; color: inherit; cursor: pointer; }
.pv-clm:hover b { color: var(--accent); }
.pv-cla { flex: none; width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; background: var(--bg); border: 1px solid var(--line); font-size: 13px; font-weight: 700; color: var(--ink-2); }
.pv-cln { display: grid; min-width: 0; }
.pv-cln b { font-size: 14.5px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pv-cln small { font-size: 12.5px; color: var(--ink-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pv-clk { display: grid; justify-items: end; gap: 3px; }
.pv-clk small { font-size: 12px; color: var(--ink-2); white-space: nowrap; }
@media (max-width: 640px) { .pv-clr { grid-template-columns: minmax(0, 1fr) auto; } .pv-cla2 { grid-column: 1 / -1; } .pv-cla2 .btn { width: 100%; } .pv-clk { justify-items: end; } }

/* =========================================================
   v72 · TELEFONO: barra sotto (dock) + sezione Preventivi
   ========================================================= */
#pv-body { grid-template-columns: minmax(0, 1fr); }
.dk-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.dk-t { position: relative; display: grid; justify-items: center; gap: 8px; padding: 16px 6px 14px; border-radius: 16px; background: var(--bg); border: 1px solid transparent; color: var(--ink); text-decoration: none; font: inherit; cursor: pointer; transition: transform .15s, background .15s, border-color .15s; }
.dk-t:active { transform: scale(.96); }
.dk-t b { font-size: 12.5px; font-weight: 600; text-align: center; line-height: 1.2; }
.dk-ti { position: relative; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 14px; background: var(--surface); color: var(--accent); box-shadow: 0 1px 2px rgba(15, 23, 42, .06); }
.dk-ti svg { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.dk-t.cur { border-color: var(--accent); background: var(--accent-soft); }
.dk-t.on { border-color: var(--accent); background: var(--accent-soft); }
.dk-t.on .dk-ti { background: var(--accent); color: var(--accent-ink); }
.dk-ti em { position: absolute; top: -6px; right: -6px; min-width: 20px; height: 20px; border-radius: 10px; background: var(--ink); color: var(--surface); font-size: 11px; font-style: normal; font-weight: 700; display: grid; place-items: center; border: 2px solid var(--accent-soft); }
.dk-edit { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; margin-top: 14px; padding: 13px; border: 1px dashed var(--line); border-radius: 14px; background: transparent; color: var(--ink-2); font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; }
.dk-edit svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.dk-hint { margin: 0 0 14px; font-size: 13.5px; color: var(--ink-2); line-height: 1.45; }
@media (min-width: 900px) { .nav .nv-m { display: none !important; } }

@media (max-width: 899px) {
  :root { --dock-h: 66px; --dock-b: calc(10px + env(safe-area-inset-bottom)); --dock-top: calc(var(--dock-h) + 10px + env(safe-area-inset-bottom)); }
  main { padding-bottom: calc(var(--dock-top) + 28px) !important; }
  /* dock flottante */
  .nav { left: 50% !important; right: auto !important; bottom: var(--dock-b) !important; width: min(560px, calc(100% - 20px)); transform: translateX(-50%); height: var(--dock-h); padding: 6px !important; gap: 2px; display: flex; justify-content: space-between; align-items: stretch;
    border: 1px solid color-mix(in srgb, var(--line) 80%, transparent) !important; border-radius: 24px;
    background: color-mix(in srgb, var(--surface) 80%, transparent) !important;
    backdrop-filter: blur(22px) saturate(180%); -webkit-backdrop-filter: blur(22px) saturate(180%);
    box-shadow: 0 12px 32px rgba(15, 23, 42, .16), 0 2px 8px rgba(15, 23, 42, .06); }
  .nav a { display: none !important; }
  .nav a.dk-on, .nav .nv-m { display: flex !important; order: var(--dk, 9); flex: 1 1 0; min-width: 0; flex-direction: column; align-items: center; justify-content: center; gap: 4px; padding: 0 !important; border-radius: 18px; color: var(--muted); font-weight: 600; -webkit-tap-highlight-color: transparent; position: relative; z-index: 0; }
  .nav .nv-m { order: 10; }
  .nav a.dk-on svg, .nav .nv-m svg { width: 22px !important; height: 22px !important; fill: none !important; stroke: currentColor !important; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: transform .3s cubic-bezier(.34, 1.56, .5, 1); }
  .nav a.dk-on span, .nav .nv-m > span { font-size: 10.5px !important; letter-spacing: 0 !important; line-height: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
  .nav a.dk-on::before, .nav .nv-m::before { content: ""; position: absolute; z-index: -1; top: 4px; left: 50%; width: 56px !important; height: 32px; margin-left: -28px !important; border-radius: 16px; background: var(--accent-soft); transform: scale(.5); opacity: 0; transition: transform .35s cubic-bezier(.34, 1.56, .5, 1), opacity .2s; }
  .nav a.dk-on.active, .nav .nv-m.active { color: var(--accent); }
  .nav a.dk-on.active::before, .nav .nv-m.active::before { transform: scale(1); opacity: 1; }
  .nav a.dk-on:active svg, .nav .nv-m:active svg { transform: scale(.88); }
  .nav .badge { top: 2px; right: calc(50% - 22px); }
  .nav-foot { display: none; }
  /* elementi fissi sopra il dock */
  .fab { bottom: calc(var(--dock-top) + 14px) !important; }
  .selbar, .pv-bar { bottom: calc(var(--dock-top) + 10px) !important; }
  .dk-sheet .sheet-body, .dk-sheet #sheet-body { padding-bottom: 6px; }
}
@media (max-width: 360px) { .nav a.dk-on span, .nav .nv-m > span { font-size: 9.5px !important; } .nav a.dk-on::before, .nav .nv-m::before { width: 48px !important; margin-left: -24px !important; } }

/* ---------- Preventivi sul telefono ---------- */
@media (max-width: 899px) {
  body[data-view="preventivi"] #subtitle { display: none; }
  #v-preventivi .pv-bar0 { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: center; margin-bottom: 4px; }
  #v-preventivi .pv-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); height: 44px; padding: 4px; border-radius: 14px; background: color-mix(in srgb, var(--ink) 6%, var(--bg)); }
  #v-preventivi .pv-tabs button { font-size: 13.5px; padding: 0 2px !important; border-radius: 10px; white-space: nowrap; min-width: 0; }
  #v-preventivi .pv-tabs button.on { box-shadow: 0 1px 3px rgba(15, 30, 60, .14), 0 0 0 .5px rgba(15, 30, 60, .06); }
  #v-preventivi .pv-act { display: flex; gap: 8px; flex-wrap: nowrap; margin: 0; }
  #v-preventivi .pv-act .pv-eye { width: 44px; height: 44px; min-width: 0; padding: 0; justify-content: center; border-radius: 14px; flex: none; }
  #v-preventivi .pv-act .pv-eye > span { display: none; }
  #v-preventivi:not([data-tab="cat"]) #pv-tools { display: none; }
  /* fornitori: fila scorrevole di loghi */
  #v-preventivi .pv-brand { grid-column: 1 / -1; order: 3; contain: inline-size; min-width: 0; display: flex !important; gap: 8px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x proximity; margin: 0 -16px; padding: 4px 16px 6px; background: none; border: 0; border-radius: 0; box-shadow: none; scrollbar-width: none; -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 14px, #000 calc(100% - 28px), transparent); mask-image: linear-gradient(90deg, transparent 0, #000 14px, #000 calc(100% - 28px), transparent); }
  #v-preventivi .pv-brand::-webkit-scrollbar { display: none; }
  #v-preventivi .pv-bi { display: none; }
  #v-preventivi .pv-brand button { flex: 0 0 auto; width: 78px; height: 50px; border-radius: 14px; background: var(--surface); border: 1px solid var(--line); scroll-snap-align: center; transition: border-color .2s, box-shadow .2s, transform .15s; }
  #v-preventivi .pv-brand button:active { transform: scale(.95); }
  #v-preventivi .pv-brand img { height: 30px !important; max-width: 62px; object-fit: contain; filter: grayscale(1); opacity: .5; transform: none; }
  #v-preventivi .pv-brand button.on { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft), 0 4px 12px rgba(15, 23, 42, .08); }
  #v-preventivi .pv-brand button.on img { filter: none; opacity: 1; }
  #v-preventivi .pv-brand button.on::after { display: none; }
  #v-preventivi:not([data-tab="cat"]) .pv-brand { display: none !important; }
  /* «+ Nuovo» diventa un pulsante flottante */
  #v-preventivi #pv-new { position: fixed; z-index: 19; right: max(16px, calc(50% - 270px)); bottom: calc(var(--dock-top) + 14px); height: 52px; padding: 0 22px 0 18px; border-radius: 18px; font-size: 15px; font-weight: 700; box-shadow: 0 10px 26px color-mix(in srgb, var(--accent) 45%, transparent), 0 2px 6px rgba(15, 23, 42, .12); }
  #v-preventivi #pv-new .lb-m { display: inline; } #v-preventivi #pv-new .lb-d { display: none; }
  #v-preventivi[data-mode="ed"] #pv-new, #v-preventivi[data-mode="item"] #pv-new, #v-preventivi[data-mode="cat"] #pv-new { display: none; }
  #v-preventivi[data-mode="list"] #pv-new2 { display: none; }
  /* elenco preventivi */
  .pv-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 8px; }
  .pv-k { padding: 12px 10px !important; border-radius: 14px; gap: 3px; }
  .pv-k span { font-size: 11px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .pv-k b { font-size: 21px; line-height: 1.1; }
  .pv-k small { font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .pv-ql { display: grid; gap: 10px; }
  .pv-qr { grid-template-columns: minmax(0, 1fr) auto !important; grid-template-areas: "n n" "c t" "s k"; gap: 8px 12px !important; padding: 14px !important; border: 1px solid var(--line) !important; border-radius: 16px !important; background: var(--surface); align-items: end; }
  .pv-qr:active { background: var(--bg); }
  .pv-qn { grid-area: n; grid-column: auto !important; display: flex !important; align-items: baseline; gap: 8px; }
  .pv-qn b { font-size: 13px; color: var(--muted); font-weight: 700; letter-spacing: .01em; } .pv-qn small { font-size: 12px; color: var(--muted); }
  .pv-qr > .chip { grid-area: s; justify-self: start; align-self: center; }
  .pv-qr > .pv-qs { grid-area: s; justify-self: start; align-self: center; }
  .pv-qr > .pv-qa { grid-area: k; justify-self: end; align-self: center; }
  .pv-qh { display: none !important; }
  .pv-qc { grid-area: c; min-width: 0; display: grid; gap: 2px; }
  .pv-qc b { font-size: 15.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .pv-qc small { font-size: 12.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .pv-qt { grid-area: t; font-size: 16.5px; font-weight: 800; white-space: nowrap; text-align: right; }
  /* editor */
  .pv-back { display: grid !important; grid-template-columns: auto auto 1fr auto auto; gap: 8px !important; align-items: center; }
  .pv-back .pv-sp { display: block; }
  .pv-back #pv-close { grid-column: 1 / -1; grid-row: 2; height: 46px; justify-content: center; border-radius: 14px; font-size: 15px; }
  .pv-back .btn { min-height: 0; }
  .pv-eht { display: grid !important; gap: 12px; }
  .pv-ehb { display: grid !important; grid-template-columns: 1.3fr 1fr 1fr; gap: 8px; }
  .pv-ehb .btn { justify-content: center; height: 42px; }
  .pv-ef { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; }
  .pv-ef > label:nth-child(1), .pv-ef > label:nth-child(2), .pv-ef > .pv-w2, .pv-ef > label:nth-child(8) { grid-column: 1 / -1; }
  .pv-ph { flex-wrap: wrap; gap: 10px; } .pv-ph #pv-addp { width: 100%; justify-content: center; height: 44px; }
}
@media (max-width: 699px) {
  .pv-ed .pv-tw { overflow: visible !important; margin: 0 !important; padding: 0 !important; }
  .pv-lt, .pv-lt tbody { display: block; width: 100%; min-width: 0 !important; }
  .pv-lt thead { display: none; }
  .pv-lt tr { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px 10px; padding: 16px 0; border-bottom: 1px solid var(--line); }
  .pv-lt tr:last-child { border-bottom: 0; }
  .pv-lt td { display: block; padding: 0 !important; border: 0 !important; text-align: left !important; min-width: 0; }
  .pv-lt td.pv-c-n { grid-column: 1 / 3; }
  .pv-lt td.pv-la { grid-column: 3; grid-row: 1; justify-self: end; align-self: start; display: flex; gap: 6px; }
  .pv-lt td.pv-c-sz { grid-column: 1 / -1; }
  .pv-lt .pv-szs { max-width: none; }
  .pv-lt td[data-l]::before { content: attr(data-l); display: block; font-size: 11px; font-weight: 600; color: var(--muted); margin-bottom: 5px; white-space: nowrap; }
  .pv-lt td.pv-c-q { font-size: 18px; font-weight: 700; padding-top: 0 !important; }
  .pv-lt td.pv-c-q::after { content: ""; }
  .pv-lt .pv-c-p input, .pv-lt .pv-c-sc input { width: 100% !important; height: 42px; text-align: right; font-size: 16px; }
  .pv-lt .pv-c-p small.pv-lacq { display: block; margin-top: 4px; white-space: normal; font-size: 11px; }
  .pv-lt td.pv-c-t { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; padding: 11px 14px !important; border-radius: 12px; background: var(--bg); font-size: 16px; font-weight: 800; }
  .pv-lt td.pv-c-t::before { margin: 0; font-size: 12.5px; }
  .pv-lt td.pv-c-lg { grid-column: 1 / -1; }
  .pv-lt .pv-lb { width: 38px; height: 38px; }
}
/* scheda prodotto: taglie e colori a schede sul telefono */
@media (max-width: 699px) {
  .pv-mx .pv-tw { overflow: visible; margin: 0; padding: 0; }
  .pv-mx .pv-t, .pv-mx .pv-t tbody { display: block; min-width: 0; width: 100%; }
  .pv-mx .pv-t thead { display: none; }
  .pv-mx .pv-t tr { display: grid; grid-template-columns: repeat(auto-fill, minmax(56px, 1fr)); gap: 10px 8px; padding: 14px 0 16px; border-bottom: 1px solid var(--line); }
  .pv-mx .pv-t tr:last-child { border-bottom: 0; }
  .pv-mx .pv-t tr:hover td { background: none; }
  .pv-mx .pv-t td { display: block; padding: 0; border: 0; min-width: 0 !important; }
  .pv-mx .pv-t td.pv-ch { grid-column: 1 / -1; }
  .pv-mx .pv-t td.pv-na { display: none; }
  .pv-mx .pv-t td.pv-acqc { grid-column: 1 / -1; text-align: left; }
  .pv-mx .pv-t td.pv-acqc input { width: 100%; height: 40px; }
  .pv-mx .pv-t td[data-l]::before { content: attr(data-l); display: block; font-size: 12px; font-weight: 800; color: var(--ink); margin-bottom: 4px; text-align: center; }
  .pv-mx .pv-t td.pv-acqc::before { text-align: left; font-weight: 600; color: var(--muted); }
  .pv-mx .pv-qi { width: 100%; height: 44px; font-size: 17px; border-radius: 10px; }
  .pv-mx .pv-t td.pv-rt { display: flex; flex-direction: column; justify-content: flex-end; align-items: center; font-weight: 800; font-size: 17px; }
  .pv-mx .pv-t td.pv-rt::before { color: var(--muted); font-weight: 600; }
  .pv-mx .card-h { flex-wrap: wrap; gap: 2px 10px; }
}
@media (min-width: 600px) and (max-width: 899px) { .pv-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.pv-grid > * { min-width: 0; }
@media (max-width: 400px) { #v-preventivi .pv-tabs button { font-size: 12.5px; } #v-preventivi .pv-act { gap: 6px; } #v-preventivi .pv-act .pv-eye { width: 40px; height: 40px; border-radius: 12px; } #v-preventivi .pv-tabs { height: 40px; } }
.pv-scn { display: block; margin-top: 4px; font-size: 11.5px; color: var(--muted); }
.pv-scq { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; }
.pv-scq button { border: 1px solid var(--line); background: var(--bg); color: var(--ink-2); border-radius: 999px; padding: 5px 12px; font: inherit; font-size: 12.5px; font-weight: 600; cursor: pointer; }
.pv-scq button:hover { border-color: var(--accent); color: var(--accent); }
/* v84: barra fornitori su PC — fila intera sotto le schede, loghi grandi e leggibili */
@media (min-width: 900px) {
  #v-preventivi .pv-bar0 { display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-areas: "tabs act" "brand brand"; gap: 12px 16px; align-items: center; }
  #v-preventivi .pv-tabs { grid-area: tabs; }
  #v-preventivi .pv-act { grid-area: act; justify-self: end; margin: 0; }
  #v-preventivi .pv-brand { grid-area: brand; display: flex; gap: 6px; padding: 6px; overflow-x: auto; scrollbar-width: thin; contain: inline-size; border-radius: 16px; background: var(--surface); border: 1px solid var(--line); box-shadow: 0 1px 2px rgba(15, 23, 42, .04); -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 26px), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 26px), transparent); }
  @media (min-width: 1500px) { #v-preventivi .pv-brand { -webkit-mask-image: none; mask-image: none; } }
  #v-preventivi .pv-bi { display: none; }
  #v-preventivi .pv-brand button { flex: 1 0 74px; height: 56px; border-radius: 12px; border: 1px solid transparent; background: transparent; transition: background .2s, border-color .2s, box-shadow .2s, transform .15s; }
  #v-preventivi .pv-brand button:hover { background: var(--bg); }
  #v-preventivi .pv-brand button:active { transform: scale(.97); }
  #v-preventivi .pv-brand img { height: 36px; max-width: 86%; object-fit: contain; filter: grayscale(1) contrast(1.15); opacity: .7; transform: none; }
  #v-preventivi .pv-brand button:hover img { filter: none; opacity: .9; transform: none; }
  #v-preventivi .pv-brand button.on { background: var(--surface); border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft), 0 6px 16px -8px rgba(15, 23, 42, .35); }
  #v-preventivi .pv-brand button.on img { filter: none; opacity: 1; }
  #v-preventivi .pv-brand button.on::after { display: none; }
  #v-preventivi:not([data-tab="cat"]) .pv-brand { display: none !important; }
}
/* v84: tabella prodotti del preventivo su schermi medi (PC piccoli, finestre strette) */
@media (min-width: 700px) and (max-width: 1279px) {
  .pv-ed .pv-lt th, .pv-ed .pv-lt td { padding-left: 6px; padding-right: 6px; }
  .pv-ed .pv-lt td.pv-c-sz { min-width: 118px; }
  .pv-ed .pv-lt .pv-szs { max-width: 170px; }
  .pv-ed .pv-lgtg { flex-direction: column; align-items: stretch; }
  .pv-ed .pv-lgtg button { height: 26px; font-size: 11.5px; padding: 0 8px; }
  .pv-ed .pv-li { width: 78px; } .pv-ed .pv-li.sc { width: 52px; }
  .pv-ed td.pv-la { white-space: nowrap; }
  .pv-ed .pv-lt .pv-lb { width: 30px; height: 30px; }
  .pv-ed .pv-cr small { white-space: normal; }
}
.pv-ed .pv-lt td.pv-la { text-align: right; }
/* v85: rifiniture barra fornitori e pulsanti su PC */
@media (min-width: 900px) {
  #v-preventivi .pv-brand button { flex: 1 0 62px; }
  #v-preventivi .pv-brand img { height: 34px; }
}
#v-preventivi .pv-brand button:not(.on) img { filter: grayscale(1) brightness(.82) contrast(1.7); opacity: .78; }
#v-preventivi .pv-brand button:not(.on):hover img { filter: none; opacity: 1; }
@media (min-width: 900px) and (max-width: 1199px) {
  #v-preventivi .pv-act .pv-eye > span { display: none; }
  #v-preventivi .pv-act .pv-eye { padding: 0 12px; min-width: 40px; justify-content: center; }
  #v-preventivi .pv-act { flex-wrap: nowrap; }
}
/* v86: Torental · ordini e clienti */
#v-torental .tr-tabs { padding: 4px; }
#v-torental .tr-tabs button { font-size: 13.5px; padding: 7px 16px; }
#v-torental:not([data-tab="list"]) .tr-lsb { display: none; }
#tr-body > * { margin: 0; }
#tr-body { display: grid; gap: 16px; grid-template-columns: minmax(0, 1fr); }
#v-torental:not([data-tab="list"]) #tr-body .card { margin: 0; }
.tro-sb { margin: 0 0 12px; max-width: 520px; }
.tro-add { display: grid; grid-template-columns: minmax(0, 1fr) 110px auto auto; gap: 10px; align-items: end; padding: 14px; margin: 4px 0 14px; border-radius: 14px; background: var(--bg); }
.tro-add .f { margin: 0; }
.tro-add select, .tro-add input { height: 42px; }
.tro-ab { height: 42px; white-space: nowrap; display: inline-flex; align-items: center; gap: 6px; }
.tro-ab svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.tro-tw { overflow-x: auto; }
.tro-lt { width: 100%; }
.tro-lt th { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); font-weight: 600; }
.tro-lt td { vertical-align: middle; padding-top: 10px; padding-bottom: 10px; }
.tro-c-n { min-width: 260px; }
.tro-ln { width: 100%; height: 38px; border: 1px solid transparent; border-radius: 8px; background: transparent; font: inherit; font-weight: 600; color: var(--ink); padding: 0 8px; margin-left: -8px; }
.tro-ln:hover { border-color: var(--line); } .tro-ln:focus { outline: 0; border-color: var(--accent); background: var(--surface); }
.tro-c-n small { display: block; font-size: 11.5px; color: var(--muted); margin-top: 2px; }
.tro-lt .pv-li { width: 96px; }
.tro-c-q .pv-li { width: 70px; }
.tro-c-x { white-space: nowrap; text-align: right; width: 76px; }
.tro-c-x .pv-lb:disabled { opacity: .3; cursor: default; }
.tro-ehb { flex-wrap: wrap; }
.trc-l { display: grid; gap: 8px; }
.trc-r { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); }
.trc-m { flex: 1; min-width: 0; display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; gap: 12px; align-items: center; border: 0; background: none; font: inherit; color: inherit; text-align: left; cursor: pointer; padding: 0; }
.trc-i { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; background: var(--accent-soft); color: var(--accent); font-weight: 700; font-size: 14px; }
.trc-t { min-width: 0; display: grid; gap: 2px; } .trc-t b { font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .trc-t small { color: var(--muted); font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.trc-s { display: grid; text-align: right; gap: 2px; } .trc-s b { font-size: 13px; } .trc-s small { font-size: 12px; color: var(--muted); }
.f-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 14px; } .f-grid .f-w { grid-column: 1 / -1; } .f-grid .f { margin: 0; }
@media (max-width: 899px) {
  #v-torental .gl-bar { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }
  #v-torental .tr-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); height: 44px; border-radius: 14px; }
  #v-torental .tr-tabs button { padding: 0 4px; }
  #v-torental .gl-act { justify-content: flex-start; flex-wrap: wrap; }
  .tro-add { grid-template-columns: minmax(0, 1fr) 90px; }
  .tro-add .tro-as { grid-column: 1 / -1; }
  .tro-ab { justify-content: center; }
  .trc-s { display: none; }
}
@media (max-width: 699px) {
  .tro-tw { overflow: visible; }
  .tro-lt, .tro-lt tbody { display: block; } .tro-lt thead { display: none; }
  .tro-lt tr { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; padding: 14px 0; border-bottom: 1px solid var(--line); }
  .tro-lt td { display: block; padding: 0 !important; border: 0 !important; text-align: left !important; min-width: 0 !important; }
  .tro-lt td.tro-c-n { grid-column: 1 / 3; } .tro-lt td.tro-c-x { grid-column: 3; grid-row: 1; justify-self: end; width: auto; }
  .tro-lt td[data-l]::before { content: attr(data-l); display: block; font-size: 11px; font-weight: 600; color: var(--muted); margin-bottom: 5px; }
  .tro-lt .pv-li { width: 100% !important; height: 42px; font-size: 16px; }
  .tro-lt td.tro-c-t { display: flex; flex-direction: column; justify-content: flex-end; font-weight: 800; font-size: 15px; }
  .f-grid { grid-template-columns: 1fr; }
}
@media (max-width: 899px) {
  #tro-ed .pv-ef > label:nth-child(2), #tro-ed .pv-ef > label:nth-child(8) { grid-column: auto; }
  #v-torental #tro-new2 { display: none; }
}
/* v88: ricerca in tutti i fornitori + confronto */
:root { --pv-win: #15803d; --pv-win-soft: #dcfce7; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --pv-win: #4ade80; --pv-win-soft: rgba(74, 222, 128, .14); } }
:root[data-theme="dark"] { --pv-win: #4ade80; --pv-win-soft: rgba(74, 222, 128, .14); }
.pv-brand .pv-ball { display: flex !important; flex-direction: column; align-items: center; justify-content: center; gap: 1px; color: var(--muted); }
.pv-brand .pv-ball svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.pv-brand .pv-ball span { font-size: 10.5px; font-weight: 800; letter-spacing: .02em; line-height: 1; }
.pv-brand .pv-ball.on { color: var(--accent); }
@media (min-width: 900px) { #v-preventivi .pv-brand .pv-ball { flex: 0 0 74px; flex-direction: row; gap: 6px; } #v-preventivi .pv-brand .pv-ball span { font-size: 13px; } }
@media (max-width: 899px) { #v-preventivi .pv-brand .pv-ball { width: 70px; } }
body.pv-all #pv-tools { display: none; }
.pv-ghero { position: relative; display: grid; gap: 16px; padding: 26px; border-radius: 22px; overflow: hidden; border: 1px solid var(--line);
  background: radial-gradient(120% 140% at 100% 0%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 55%), linear-gradient(135deg, var(--surface), color-mix(in srgb, var(--accent) 6%, var(--surface))); }
.pv-ght h2 { margin: 2px 0 4px; font-size: clamp(24px, 3.2vw, 34px); letter-spacing: -.02em; }
.pv-ght p { margin: 0; font-size: 14px; display: flex; align-items: center; gap: 8px; min-height: 20px; }
.pv-gbar { display: block; height: 3px; border-radius: 3px; margin-top: 10px; background: color-mix(in srgb, var(--accent) 12%, transparent); overflow: hidden; position: relative; max-width: 360px; }
.pv-gbar::after { content: ""; position: absolute; inset: 0 auto 0 0; width: var(--p, 0%); background: var(--accent); border-radius: 3px; transition: width .35s ease; }
.pv-gspin { width: 13px; height: 13px; border-radius: 50%; border: 2px solid color-mix(in srgb, var(--accent) 25%, transparent); border-top-color: var(--accent); animation: pvgspin .8s linear infinite; flex: none; }
@keyframes pvgspin { to { transform: rotate(360deg); } }
.pv-ghero .pv-gsx { width: 100%; max-width: none; justify-self: stretch; margin: 0; }
.pv-ghero .pv-gsx { height: 60px; border-radius: 16px; box-shadow: 0 10px 30px -18px rgba(20, 40, 80, .45); }
.pv-ghero .pv-gsx input { font-size: 17px; text-align: left !important; width: 100%; min-width: 0; }
.pv-ghero .pv-gsx:focus-within { border-color: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft), 0 10px 30px -18px rgba(20, 40, 80, .45); }
.pv-gsug { display: flex; flex-wrap: wrap; gap: 8px; }
.pv-gsug button { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--line); background: var(--surface); color: var(--ink-2); font: inherit; font-size: 13.5px; font-weight: 600; cursor: pointer; transition: border-color .2s, color .2s, transform .15s; }
.pv-gsug button:hover { border-color: var(--accent); color: var(--accent); }
.pv-gsug button:active { transform: scale(.96); }
.pv-gsug button svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; opacity: .7; }
#pv-gres { margin-top: 18px; display: grid; gap: 14px; }
.pv-gsups { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.pv-gsc { display: grid; grid-template-columns: 64px minmax(0, 1fr) 18px; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 16px; border: 1px solid var(--line); background: var(--surface); font: inherit; color: inherit; text-align: left; cursor: pointer; transition: transform .2s var(--out), border-color .2s, box-shadow .2s; }
.cc-anim .pv-gsc { animation: rise .45s var(--d) var(--out) both; }
.pv-gsc:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--accent) 35%, var(--line)); box-shadow: 0 14px 30px -22px rgba(20, 40, 80, .45); }
.pv-gsc img { width: 64px; height: 38px; object-fit: contain; }
.pv-gsc b { display: block; font-size: 15px; }
.pv-gsc small { color: var(--muted); font-size: 12.5px; }
.pv-gsc > svg { width: 18px; height: 18px; fill: none; stroke: var(--muted); stroke-width: 2; }
.pv-gsum { display: grid; gap: 12px; }
.pv-gsh h3 { margin: 0; font-size: 19px; letter-spacing: -.01em; }
.pv-gsh p { margin: 3px 0 0; }
.pv-gcmp { display: flex; gap: 10px; overflow-x: auto; padding: 4px 2px 8px; scroll-snap-type: x proximity; scrollbar-width: thin; }
.pv-gcmp button { position: relative; flex: 0 0 auto; min-width: 132px; display: grid; justify-items: start; gap: 3px; padding: 12px 14px; border-radius: 16px; border: 1px solid var(--line); background: var(--surface); font: inherit; color: inherit; text-align: left; cursor: pointer; scroll-snap-align: start; transition: border-color .2s, box-shadow .2s, transform .15s; }
.cc-anim .pv-gcmp button { animation: rise .4s var(--d) var(--out) both; }
.pv-gcmp button:hover { border-color: color-mix(in srgb, var(--accent) 40%, var(--line)); }
.pv-gcmp button.on { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.pv-gcmp img { height: 26px; max-width: 96px; object-fit: contain; margin-bottom: 4px; }
.pv-gcmp span { font-size: 13px; color: var(--ink-2); }
.pv-gcmp small { font-size: 12.5px; color: var(--muted); }
.pv-gcmp strong { color: var(--ink); font-size: 14px; }
.pv-gcmp .pv-gall { min-width: 84px; align-content: center; justify-items: center; }
.pv-gcmp .pv-gall b { font-size: 15px; } .pv-gcmp .pv-gall small { font-size: 13px; }
.pv-gbest { display: inline-block; font-style: normal; font-size: 10.5px; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; color: var(--pv-win); background: var(--pv-win-soft); padding: 3px 7px; border-radius: 999px; }
.pv-gcmp .pv-gbest { position: absolute; top: -8px; right: 10px; box-shadow: 0 0 0 2px var(--surface); }
.pv-gcard { position: relative; display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: var(--radius, 16px); background: var(--surface); transition: transform .2s var(--out), box-shadow .2s, border-color .2s; }
.pv-gcard:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--accent) 35%, var(--line)); box-shadow: 0 14px 30px -22px rgba(20, 40, 80, .45); }
.pv-gcard > .pv-card { flex: 1; border: 0 !important; box-shadow: none !important; background: transparent; transform: none !important; padding-bottom: 8px; }
.pv-gcard.cmp { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.pv-glogo { position: absolute; top: 12px; right: 12px; height: 18px; max-width: 64px; object-fit: contain; opacity: .95; pointer-events: none; background: var(--surface); border-radius: 4px; padding: 1px 3px; }
.pv-gcard .pv-cm b { padding-right: 58px; }
.pv-gbc { position: absolute; left: 12px; top: -8px; box-shadow: 0 0 0 2px var(--surface); pointer-events: none; }
.pv-gft { padding: 0 14px 14px 112px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px; pointer-events: none; }
.pv-gcb { pointer-events: auto; display: inline-flex; align-items: center; gap: 5px; height: 30px; padding: 0 11px; border-radius: 999px; border: 1px solid var(--line); background: var(--surface); color: var(--ink-2); font: inherit; font-size: 12.5px; font-weight: 700; cursor: pointer; transition: border-color .2s, color .2s, background .2s; }
.pv-gcb svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.pv-gcb:hover { border-color: var(--accent); color: var(--accent); }
.pv-gcb[aria-pressed="true"] { background: var(--accent); border-color: var(--accent); color: #fff; }
.pv-gmg { font-size: 11.5px; font-weight: 700; padding: 2px 7px; border-radius: 999px; pointer-events: none; }
.pv-gmg.ok { color: var(--pv-win); background: var(--pv-win-soft); } .pv-gmg.mid { color: var(--warn); background: var(--warn-soft); } .pv-gmg.low { color: var(--danger); background: var(--danger-soft); }
.pv-gtray { position: sticky; bottom: 14px; z-index: 30; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 16px; padding: 10px 12px; border-radius: 18px; background: color-mix(in srgb, var(--surface) 92%, transparent); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border: 1px solid var(--line); box-shadow: 0 18px 40px -20px rgba(15, 23, 42, .5); animation: rise .35s var(--out) both; }
.pv-gtt { display: flex; gap: 6px; }
.pv-gct { position: relative; width: 44px; height: 44px; border-radius: 10px; overflow: visible; }
.pv-gct .pv-img, .pv-gct .pv-thumb { width: 44px !important; height: 44px !important; border-radius: 10px; }
.pv-gct button { position: absolute; top: -6px; right: -6px; width: 20px; height: 20px; border-radius: 50%; border: 0; background: var(--ink); color: var(--surface); font-size: 13px; line-height: 20px; padding: 0; cursor: pointer; }
.pv-gtl { font-size: 13px; color: var(--muted); font-weight: 600; margin-right: auto; }
@media (max-width: 899px) {
  .pv-ghero { padding: 20px 16px; border-radius: 20px; gap: 14px; }
  .pv-ghero .pv-gsx { height: 54px; }
  .pv-gsug { flex-wrap: nowrap; overflow-x: auto; margin: 0 -16px; padding: 0 16px 2px; scrollbar-width: none; }
  .pv-gsug::-webkit-scrollbar { display: none; }
  .pv-gsug button { flex: none; }
  .pv-gcmp { margin: 0 -16px; padding: 10px 16px 8px; }
  .pv-gsups { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pv-gsc { grid-template-columns: minmax(0, 1fr); justify-items: start; gap: 6px; padding: 12px; }
  .pv-gsc > svg { display: none; }
  .pv-gsc img { width: 72px; height: 32px; object-position: left; }
  .pv-gtray { bottom: calc(var(--dock-top, 0px) + 8px); }
  .pv-gtl { display: none; }
  .pv-gtray .btn.primary { margin-left: auto; }
}
/* tabella di confronto */
.pv-gx { display: grid; gap: 0; overflow-x: auto; margin: 0 -4px; }
.pv-gxr { display: grid; grid-template-columns: 150px repeat(var(--n), minmax(190px, 1fr)); border-bottom: 1px solid var(--line); min-width: calc(150px + var(--n) * 190px); }
.pv-gxr > * { padding: 10px 10px; font-size: 13.5px; }
.pv-gxk { color: var(--muted); font-weight: 600; font-size: 12.5px; align-self: center; }
.pv-gxm { display: none; }
.pv-gxh .pv-gxc { display: grid; gap: 8px; align-content: start; }
.pv-gxh .pv-gxc b { font-size: 14px; line-height: 1.3; }
.pv-gxi { display: block; width: 100%; max-width: 160px; aspect-ratio: 1; border-radius: 14px; overflow: hidden; background: var(--bg); }
.pv-gxi > * { width: 100% !important; height: 100% !important; }
.pv-gxi img { object-fit: contain; }
.pv-gxl { height: 18px; max-width: 70px; object-fit: contain; vertical-align: middle; margin-right: 4px; }
.pv-gwin { color: var(--pv-win); background: var(--pv-win-soft); padding: 2px 7px; border-radius: 8px; }
.pv-gxa { border-bottom: 0; }
.pv-gxa .pv-gxc { display: grid; gap: 6px; align-content: start; }
@media (max-width: 640px) {
  .pv-gxr { grid-template-columns: repeat(var(--n), minmax(168px, 1fr)); min-width: calc(var(--n) * 168px); }
  .pv-gxr > span:first-child { display: none; }
  .pv-gxm { display: block; font-size: 11px; color: var(--muted); font-weight: 600; margin-bottom: 2px; }
}
/* v89: righe spostabili, sostituzione, modifica prodotto, scheda tecnica */
.dr-th { width: 30px; }
.pv-lt td.dr-c, .tro-lt td.dr-c { width: 30px; padding-left: 0 !important; padding-right: 0 !important; }
.dr-h { width: 28px; height: 34px; display: inline-grid; place-items: center; border: 0; border-radius: 8px; background: transparent; color: var(--muted); cursor: grab; touch-action: none; padding: 0; }
.dr-h svg { width: 16px; height: 16px; fill: currentColor; stroke: none; }
.dr-h:hover, .dr-h:focus-visible { background: var(--bg); color: var(--ink); }
.dr-h:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
body.dr-busy, body.dr-busy * { user-select: none !important; -webkit-user-select: none !important; cursor: grabbing !important; }
tbody > tr { transition: transform .18s ease; }
tbody > tr.dr-on { position: relative; z-index: 5; transition: none; background: var(--surface); box-shadow: 0 14px 34px -12px rgba(15, 23, 42, .4); border-radius: 12px; }
.pv-lt td.pv-la, .tro-lt td.tro-c-x { white-space: nowrap; }
@media (max-width: 699px) {
  .pv-lt tr, .tro-lt tr { position: relative; }
  .pv-lt td.dr-c, .tro-lt td.dr-c { grid-column: 3; grid-row: 1; justify-self: end; width: auto; }
  .pv-lt td.pv-la { grid-column: 1 / -1; grid-row: auto; justify-self: stretch; justify-content: flex-end; flex-wrap: wrap; }
  .tro-lt td.tro-c-x { grid-column: 1 / -1; grid-row: auto; justify-self: end; }
  .dr-h { width: 40px; height: 40px; background: var(--bg); }
}
.pvx-bar.plain { color: var(--muted); }
.pvx-ba { display: flex; gap: 8px; flex-wrap: wrap; }
.pvx-ba .btn svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; margin-right: 5px; vertical-align: -2px; }
.pvx-sch { border-color: color-mix(in srgb, var(--accent) 35%, var(--line)) !important; color: var(--accent) !important; }
/* sostituisci prodotto */
.pv-rs { margin-bottom: 10px; }
.pv-rres { display: grid; gap: 6px; max-height: min(56vh, 520px); overflow-y: auto; margin: 0 -4px; padding: 2px 4px; }
.pv-rrow { display: grid; grid-template-columns: 46px minmax(0, 1fr) auto auto; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 12px; border: 1px solid var(--line); background: var(--surface); font: inherit; color: inherit; text-align: left; cursor: pointer; transition: border-color .15s, background .15s; }
.pv-rrow.tr { grid-template-columns: minmax(0, 1fr) auto; }
.pv-rrow:hover { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 4%, var(--surface)); }
.pv-rrow .pv-img { width: 46px !important; height: 46px !important; border-radius: 10px; }
.pv-rrow b { display: block; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pv-rrow small { color: var(--muted); font-size: 12px; }
.pv-rrow > img { height: 18px; max-width: 64px; object-fit: contain; }
.pv-rrow em { font-style: normal; font-weight: 700; font-size: 13.5px; white-space: nowrap; }
.pv-rg { margin: 12px 0 6px; font-size: 12px; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; }
.pv-rsel { display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: 14px; align-items: center; }
.pv-rsel .pv-img { width: 84px !important; height: 84px !important; border-radius: 14px; }
.pv-rsel b { display: block; font-size: 16px; margin: 2px 0 4px; }
.pv-rvars { display: flex; flex-wrap: wrap; gap: 8px; max-height: 40vh; overflow-y: auto; }
.pv-rvars button { display: inline-flex; align-items: center; gap: 7px; min-height: 38px; padding: 6px 12px; border-radius: 999px; border: 1px solid var(--line); background: var(--surface); font: inherit; font-size: 13px; font-weight: 600; color: var(--ink-2); cursor: pointer; }
.pv-rvars button.on { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); color: var(--ink); }
.pv-rvars em { font-style: normal; color: var(--muted); font-weight: 500; }
/* modifica prodotto: prezzi per variante */
.pvm-vt { border: 1px solid var(--line); border-radius: 14px; padding: 12px 14px; display: grid; gap: 8px; margin-top: 4px; }
.pvm-vh { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; }
.pvm-vh small { color: var(--muted); font-size: 12px; }
.pvm-v { display: grid; grid-template-columns: 110px minmax(0, 1fr) 130px; gap: 8px; align-items: center; }
.pvm-v:only-of-type, .pvm-v:has(> .pvm-pi:first-child) { grid-template-columns: 1fr; }
.pvm-c { font-size: 12px; font-weight: 700; color: var(--muted); overflow: hidden; text-overflow: ellipsis; }
.pvm-v input { width: 100%; height: 38px; }
.pvm-pi { display: flex; align-items: center; gap: 6px; color: var(--muted); }
.pvm-pi input { text-align: right; }
.pvm-all { margin-top: 4px; }
.pvm-vt { max-height: 46vh; overflow-y: auto; }
@media (max-width: 520px) { .pvm-v { grid-template-columns: 1fr 110px; } .pvm-c { grid-column: 1 / -1; } }

/* =========================================================
   v93 — Accesso con email e password, utenti e gestionali, demo
   ========================================================= */
.auth { min-height: 100dvh; display: grid; grid-template-columns: minmax(0, 1fr); background: var(--bg); }
.auth[hidden] { display: none; }
.auth-side { display: none; }
.auth-main { display: grid; place-items: center; padding: 28px 16px calc(28px + env(safe-area-inset-bottom)); }
.auth-card { width: 100%; max-width: 440px; background: var(--surface); border: 1px solid var(--line); border-radius: 22px; box-shadow: 0 1px 2px rgba(0,0,0,.04), 0 18px 48px rgba(20, 40, 80, .08); padding: 28px 24px 20px; display: grid; gap: 14px; animation: vwin .3s var(--out); }
.auth-top { display: grid; justify-items: center; gap: 4px; text-align: center; }
.auth-top img { border-radius: 14px; margin-bottom: 8px; box-shadow: 0 8px 22px rgba(51, 98, 171, .22); }
.auth-top h1 { margin: 0; font-size: 22px; letter-spacing: -.01em; }
.auth-top p { margin: 0; font-size: 14px; }
.auth-tabs { display: grid; grid-template-columns: 1fr 1fr; background: var(--bg); border: 1px solid var(--line); border-radius: 12px; padding: 3px; gap: 3px; }
.auth-tabs[hidden] { display: none; }
.auth-tabs button { border: 0; background: none; height: 36px; border-radius: 9px; font: inherit; font-size: 14px; font-weight: 600; color: var(--muted); cursor: pointer; transition: background .15s, color .15s; }
.auth-tabs button.on { background: var(--surface); color: var(--ink); box-shadow: 0 1px 3px rgba(0,0,0,.08); }
.auth-form { display: grid; gap: 12px; }
.auth-form[hidden], .auth-form [hidden] { display: none !important; }
.auth-form > div[data-step] { display: grid; gap: 12px; }
.auth-form .f { margin: 0; }
.auth-form .f-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
@media (max-width: 420px) { .auth-form .f-row { grid-template-columns: 1fr; } }
.pw-w { position: relative; display: block; }
.pw-w input { width: 100%; padding-right: 44px; }
.pw-eye { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); width: 36px; height: 36px; border: 0; background: none; border-radius: 9px; color: var(--muted); cursor: pointer; display: grid; place-items: center; }
.pw-eye svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.pw-eye.on { color: var(--accent); }
.auth-code { text-transform: uppercase; letter-spacing: .12em; font-weight: 600; font-variant-numeric: tabular-nums; }
.auth-code::placeholder { letter-spacing: .04em; font-weight: 400; text-transform: none; }
.auth-hint { margin: -2px 0 0; font-size: 12.5px; color: var(--muted); line-height: 1.45; }
.auth-form .link, .auth-hint .link { border: 0; background: none; padding: 0; font: inherit; color: var(--accent); font-weight: 600; cursor: pointer; }
.auth-link { justify-self: center; font-size: 13px !important; }
.auth-form .btn.block { width: 100%; height: 46px; font-size: 15px; border-radius: 12px; margin-top: 2px; }
.auth-msg { margin: 0; padding: 10px 12px; border-radius: 10px; font-size: 13.5px; line-height: 1.4; }
.auth-msg[hidden] { display: none; }
.auth-msg.err { background: var(--danger-soft); color: var(--danger); }
.auth-msg.ok { background: #e7f6ec; color: #166534; }
@media (min-width: 960px) {
  .auth { grid-template-columns: minmax(380px, 46%) 1fr; }
  .auth-side { display: flex; flex-direction: column; justify-content: space-between; padding: 44px 48px; color: #fff; background: radial-gradient(120% 80% at 0% 0%, #4a7cc6 0%, transparent 60%), linear-gradient(160deg, #2a5395 0%, #1c3a6e 100%); position: relative; overflow: hidden; }
  .auth-side::after { content: ""; position: absolute; right: -120px; bottom: -120px; width: 380px; height: 380px; border-radius: 50%; border: 60px solid rgba(255,255,255,.05); }
  .auth-brand { display: flex; align-items: center; gap: 12px; }
  .auth-brand img { border-radius: 12px; background: #fff; padding: 3px; }
  .auth-brand b { display: block; font-size: 17px; }
  .auth-brand span { font-size: 13px; opacity: .75; }
  .auth-hero h2 { font-size: 30px; line-height: 1.2; letter-spacing: -.02em; margin: 0 0 26px; max-width: 460px; }
  .auth-hero ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
  .auth-hero li { display: flex; align-items: center; gap: 12px; font-size: 15px; opacity: .92; }
  .auth-hero svg { width: 34px; height: 34px; padding: 7px; border-radius: 10px; background: rgba(255,255,255,.12); fill: none; stroke: #fff; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; flex: none; }
  .auth-foot { margin: 0; font-size: 13.5px; opacity: .8; }
  .auth-foot b { letter-spacing: .06em; }
  .auth-card { padding: 34px 34px 22px; }
}

/* barra demo / sola lettura */
.demo-bar .btn.sm { flex: none; height: 32px; padding: 0 12px; font-size: 12.5px; background: rgba(255,255,255,.6); border-color: transparent; color: inherit; }
body.is-demo #sync, body.is-demo #sync-side { color: #a16207; }

/* profilo in Impostazioni */
#s-me { display: flex; align-items: center; gap: 12px; padding: 4px 0 6px; }
#s-me > div { flex: 1; min-width: 0; display: grid; }
#s-me b { font-size: 15px; } #s-me span, #s-me small { font-size: 12.5px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.st-av { width: 42px; height: 42px; border-radius: 50%; background: var(--accent-soft); color: var(--accent); display: grid; place-items: center; font-weight: 700; font-size: 14px; flex: none; }

/* dashboard amministratore */
.ad-load { display: flex; align-items: center; gap: 10px; color: var(--muted); padding: 30px 4px; }
.ad-kpis { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px; }
@media (max-width: 899px) { .ad-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ad-kpis > :first-child { grid-column: 1 / -1; } }
.ad-kpi { text-align: left; font: inherit; color: inherit; background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 12px 14px; display: grid; gap: 2px; cursor: pointer; transition: border-color .15s, box-shadow .15s; }
.ad-kpi:hover { border-color: var(--accent); }
.ad-kpi.on { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent) inset; }
.ad-kpi span { font-size: 12px; color: var(--muted); font-weight: 600; }
.ad-kpi b { font-size: 24px; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.ad-kpi small { font-size: 12px; color: var(--muted); }
.ad-kpi.warn b { color: var(--warn); } .ad-kpi.warn { background: var(--warn-soft); border-color: transparent; }
.ad-kpi.ok b { color: #15803d; } .ad-kpi.bad b { color: var(--danger); }
.ad-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
.ad-search { flex: 1; min-width: 180px; } .ad-search input { width: 100%; }
.ad-list { display: grid; gap: 8px; }
.ad-u { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 12px 14px; display: grid; grid-template-columns: 42px minmax(0, 1.3fr) minmax(0, 1.2fr) minmax(0, 1.1fr) 280px; align-items: center; gap: 12px; }
.ad-u.st-attesa { border-color: #f3d48a; box-shadow: 0 0 0 1px #f3d48a inset; }
.ad-u.st-bloccato { opacity: .72; }
.ad-who, .ad-when { display: grid; min-width: 0; }
.ad-who b { font-size: 14.5px; } .ad-who b em { font-style: normal; color: var(--muted); font-weight: 500; }
.ad-who span, .ad-who small, .ad-when span { font-size: 12.5px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ad-when .ad-live { color: #15803d; }
.ad-meta { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; min-width: 0; }
.ad-ws { font-size: 12.5px; color: var(--ink-2); } .ad-ws code, .ad-code code { font-size: 11.5px; background: var(--bg); border: 1px solid var(--line); border-radius: 6px; padding: 1px 6px; letter-spacing: .04em; }
.ad-pill { display: inline-flex; align-items: center; height: 22px; padding: 0 9px; border-radius: 999px; font-size: 11.5px; font-weight: 700; background: var(--bg); color: var(--ink-2); white-space: nowrap; }
.ad-pill.s-attivo { background: #e7f6ec; color: #166534; } .ad-pill.s-attesa { background: var(--warn-soft); color: var(--warn); } .ad-pill.s-bloccato { background: var(--danger-soft); color: var(--danger); }
.ad-pill.r-admin, .ad-pill.t-principale { background: var(--accent-soft); color: var(--accent); } .ad-pill.r-demo, .ad-pill.t-demo { background: #f3e8ff; color: #7e22ce; } .ad-pill.r-lettura { background: #eef2f6; color: #475569; }
.ad-act { display: flex; gap: 6px; justify-content: flex-end; flex-wrap: wrap; }
.ad-note { font-size: 12px; color: var(--muted); }
@media (max-width: 1099px) {
  .ad-u { grid-template-columns: auto minmax(0, 1fr); }
  .ad-meta, .ad-when, .ad-act { grid-column: 2; }
  .ad-act { justify-content: flex-start; }
}
.ad-wsl { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; }
@media (max-width: 639px) { .ad-wsl { grid-template-columns: 1fr; } }
.ad-w { background: var(--surface); border: 1px solid var(--line); border-radius: 16px; padding: 14px 16px; display: grid; gap: 8px; align-content: start; }
.ad-w.t-principale { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent) inset; }
.ad-w.off { opacity: .7; }
.ad-w header { display: flex; gap: 6px; flex-wrap: wrap; }
.ad-w h3 { margin: 0; font-size: 17px; } .ad-w p { margin: 0; font-size: 13px; color: var(--muted); min-height: 1em; }
.ad-code { display: flex; align-items: center; gap: 8px; background: var(--bg); border-radius: 10px; padding: 8px 10px; }
.ad-code span { font-size: 12px; color: var(--muted); flex: 1; } .ad-code code { font-size: 14px; font-weight: 700; background: var(--surface); }
.ad-wn { display: flex; gap: 12px; flex-wrap: wrap; font-size: 12.5px; color: var(--muted); } .ad-wn b { color: var(--ink); }
.ad-w footer { display: flex; gap: 6px; flex-wrap: wrap; padding-top: 4px; }
.ad-w footer a.btn { text-decoration: none; display: inline-flex; align-items: center; }
.ad-help { font-size: 12.5px; color: var(--muted); line-height: 1.5; margin: 14px 0 0; }
.ad-pw { display: flex; align-items: center; gap: 10px; margin: 8px 0; } .ad-pw code { font-size: 22px; font-weight: 700; letter-spacing: .06em; background: var(--bg); border: 1px solid var(--line); padding: 6px 12px; border-radius: 10px; user-select: all; }
.ad-menu .danger { color: var(--danger); }
.ad-menu { right: auto; width: 250px; } .ad-menu button { align-items: center; font-size: 14px; }

.ad-seg { display: inline-grid; grid-auto-flow: column; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 3px; gap: 3px; }
.ad-seg button { border: 0; background: none; height: 36px; padding: 0 16px; border-radius: 9px; font: inherit; font-size: 14px; font-weight: 600; color: var(--muted); cursor: pointer; }
.ad-seg button.on { background: var(--accent); color: var(--accent-ink); }
body[data-view="utenti"] .iva-tg, body[data-view="dipendenti"] .iva-tg, body[data-view="analisi"] .iva-tg { visibility: hidden; }
@media (max-width: 1099px) { .ad-u { grid-template-columns: 42px minmax(0, 1fr); } }
@media (min-width: 900px) { #app main > .demo-bar { margin: 0 0 16px; } }

/* ================= v95: settori di attività ================= */
.set-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 8px; }
.set-c { display: flex; align-items: flex-start; gap: 11px; padding: 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); color: var(--ink); font: inherit; text-align: left; cursor: pointer; transition: border-color .15s, background .15s, box-shadow .15s; }
.set-c:hover { border-color: color-mix(in srgb, var(--accent) 40%, var(--line)); }
.set-c.on { border-color: var(--accent); background: var(--accent-soft); box-shadow: inset 0 0 0 1px var(--accent); }
.set-ct { display: grid; gap: 2px; min-width: 0; }
.set-ct b { font-size: 13.5px; font-weight: 600; line-height: 1.3; }
.set-ct small { font-size: 12px; color: var(--muted); line-height: 1.4; }
.set-ci { flex: none; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: var(--bg); color: var(--accent); }
.set-c.on .set-ci { background: var(--surface); }
.set-ci svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.set-ci.lg { width: 44px; height: 44px; border-radius: 12px; background: var(--accent-soft); }
.set-ci.lg svg { width: 23px; height: 23px; }
.set-grid.sm { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; max-height: 236px; overflow: auto; padding: 2px; margin: 2px -2px 0; }
.set-grid.sm .set-c { align-items: center; padding: 8px 10px; gap: 9px; border-radius: 10px; }
.set-grid.sm .set-ci { width: 28px; height: 28px; border-radius: 8px; }
.set-grid.sm .set-ci svg { width: 16px; height: 16px; }
.set-grid.sm .set-ct b { font-size: 12.5px; }
@media (max-width: 380px) { .set-grid.sm { grid-template-columns: 1fr; } }

/* impostazioni › attività e sezioni */
.st-set { display: flex; align-items: center; gap: 14px; padding: 4px 0 14px; border-bottom: 1px solid var(--line); }
.st-set .st-l b { font-size: 15.5px; }
#s-mod .st-row:last-child, #s-set .st-row:last-child { border-bottom: 0; }
#s-mod .tg:disabled { opacity: .5; cursor: default; }

/* registrazione: codice o nuova azienda */
.reg-mode { position: relative; display: grid; grid-template-columns: 1fr 1fr; padding: 3px; gap: 3px; border-radius: 11px; background: var(--bg); border: 1px solid var(--line); isolation: isolate; }
.reg-mode button { position: relative; z-index: 1; height: 32px; border: 0; background: none; border-radius: 8px; font: inherit; font-size: 13px; font-weight: 600; color: var(--muted); cursor: pointer; transition: color .2s; }
.reg-mode button.on { color: var(--ink); }
.reg-mode i { position: absolute; z-index: 0; top: 3px; bottom: 3px; left: 3px; width: calc(50% - 4.5px); border-radius: 8px; background: var(--surface); box-shadow: 0 1px 3px rgba(0,0,0,.08); transform: translateX(calc(var(--i, 0) * (100% + 3px))); transition: transform .3s var(--out, ease); }
#reg-form [data-regnew] { display: grid; gap: 12px; }
#reg-form [data-regnew][hidden] { display: none; }
#reg-form [data-regcode] { display: grid; gap: 12px; }
#reg-form [data-regcode][hidden] { display: none; }

/* barra demo: attività scelta */
.demo-set { display: inline-flex; align-items: center; gap: 6px; margin: 0 2px; padding: 2px 8px 2px 6px; border: 0; border-radius: 999px; background: rgba(255,255,255,.55); color: inherit; font: inherit; font-weight: 600; cursor: pointer; vertical-align: middle; }
.demo-set svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.demo-set em { font-style: normal; font-weight: 500; opacity: .7; text-decoration: underline; text-underline-offset: 2px; }

/* amministrazione: richieste di nuove aziende, settore e piano dei gestionali */
.ad-req { display: inline-flex; align-items: center; gap: 6px; margin-top: 4px; padding: 3px 9px 3px 7px; border-radius: 999px; background: var(--accent-soft); color: var(--accent); font-size: 12px; font-weight: 600; width: fit-content; }
.ad-req svg, .ad-sp svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.ad-wset { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: -2px 0 10px; }
.ad-sp { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; color: var(--ink-2); }
.ad-pill.p-prova { background: var(--warn-soft); color: var(--warn); } .ad-pill.p-base { background: var(--accent-soft); color: var(--accent); } .ad-pill.p-pro { background: #e7f6ec; color: #166534; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .ad-pill.p-pro { background: #163323; color: #6fd39a; } :root:not([data-theme="light"]) .demo-set { background: rgba(255,255,255,.12); } }
:root[data-theme="dark"] .ad-pill.p-pro { background: #163323; color: #6fd39a; } :root[data-theme="dark"] .demo-set { background: rgba(255,255,255,.12); }
.db-areas[hidden] { display: none; }
@media (min-width: 1180px) { .db-tops.n3 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } }

/* v96: demo › maggiori informazioni */
.demo-acts { display: flex; gap: 6px; flex: none; }
.demo-bar .btn.sm.demo-info { background: #78350f; color: #fff; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .demo-bar .btn.sm.demo-info { background: #fcd34d; color: #3a2f12; } }
:root[data-theme="dark"] .demo-bar .btn.sm.demo-info { background: #fcd34d; color: #3a2f12; }
@media (max-width: 640px) { .demo-bar { flex-wrap: wrap; } .demo-acts { width: 100%; } .demo-acts .btn { flex: 1; } }
.di-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 10px; margin: 4px 0 14px; }
.di-p { display: flex; gap: 11px; padding: 12px; border: 1px solid var(--line); border-radius: 12px; }
.di-p b { display: block; font-size: 13.5px; margin-bottom: 2px; }
.di-p small { font-size: 12.5px; color: var(--muted); line-height: 1.45; }
.di-c { display: grid; gap: 10px; padding: 14px; border-radius: 12px; background: var(--accent-soft); }
.di-ch b { display: block; font-size: 14.5px; } .di-ch small { font-size: 12.5px; color: var(--ink-2); }
.di-cb { display: flex; flex-wrap: wrap; gap: 8px; }
.di-cb .btn { display: inline-flex; align-items: center; gap: 7px; text-decoration: none; }
.di-cb .btn svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.di-mail { font-size: 12px; color: var(--muted); }

/* v97: accesso › scopri cosa può fare */
.auth-foot { display: grid; gap: 12px; }
.auth-tour { justify-self: start; display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 16px; border-radius: 999px; border: 1px solid rgba(255,255,255,.35); background: rgba(255,255,255,.12); color: #fff; font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; transition: background .2s; }
.auth-tour:hover { background: rgba(255,255,255,.22); } .auth-tour span { transition: transform .2s; } .auth-tour:hover span { transform: translateX(3px); }
.auth-tour2 { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; height: 42px; margin-top: 12px; border-radius: 11px; border: 1px dashed color-mix(in srgb, var(--accent) 45%, var(--line)); background: var(--accent-soft); color: var(--accent); font: inherit; font-size: 13.5px; font-weight: 600; cursor: pointer; }
.auth-tour2 svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linejoin: round; }

/* ================= v98: clienti, magazzino, DDT e fatture ================= */
.f-row.f3 { grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr) minmax(0, .7fr); }
.f-row.gx-r3 { grid-template-columns: minmax(0, .6fr) minmax(0, .9fr) minmax(0, 2fr); }
@media (max-width: 560px) { .f-row.f3, .f-row.gx-r3 { grid-template-columns: 1fr 1fr; } .f-row.gx-r3 > :last-child, .f-row.f3 > :nth-child(2) { grid-column: 1 / -1; } }
.gx-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0 0 14px; }
.gx-bar.sm { margin: 4px 0 10px; }
.gx-act { display: flex; flex-wrap: wrap; gap: 8px; margin-left: auto; }
.gx-search { position: relative; flex: 1 1 220px; max-width: 380px; display: block; }
.gx-search svg { position: absolute; left: 11px; top: 50%; width: 16px; height: 16px; transform: translateY(-50%); fill: none; stroke: var(--muted); stroke-width: 2; stroke-linecap: round; }
.gx-search input { width: 100%; height: 38px; padding: 0 12px 0 34px; border-radius: 10px; border: 1px solid var(--line); background: var(--surface); color: var(--ink); font: inherit; font-size: 14px; }
.gx-seg { display: inline-flex; padding: 3px; gap: 3px; border-radius: 11px; background: var(--surface); border: 1px solid var(--line); }
.gx-seg button { height: 32px; padding: 0 14px; border: 0; border-radius: 8px; background: none; font: inherit; font-size: 13.5px; font-weight: 600; color: var(--muted); cursor: pointer; }
.gx-seg button.on { background: var(--accent); color: var(--accent-ink); }
.gx-seg.wide { display: grid; grid-template-columns: repeat(3, 1fr); margin-bottom: 12px; }
.gx-per { display: flex; align-items: center; gap: 6px; }
.gx-per select { height: 36px; border-radius: 10px; border: 1px solid var(--line); background: var(--surface); color: var(--ink); font: inherit; font-size: 13.5px; font-weight: 600; padding: 0 10px; }
.gx-badge { display: inline-grid; place-items: center; min-width: 20px; height: 20px; margin-left: 6px; padding: 0 6px; border-radius: 10px; background: rgba(255,255,255,.25); font-style: normal; font-size: 11.5px; }
.gx-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 0 0 14px; }
@media (max-width: 900px) { .gx-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.gx-k { padding: 14px 16px; border-radius: var(--radius); background: var(--surface); border: 1px solid var(--line); display: grid; gap: 3px; min-width: 0; }
.gx-k span { font-size: 12.5px; color: var(--muted); font-weight: 600; }
.gx-k b { font-size: 24px; letter-spacing: -.02em; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gx-k small { font-size: 12px; color: var(--muted); }
.gx-k.warn b { color: var(--warn); } .gx-k.bad b { color: var(--danger); }
.gx-list { padding: 0; overflow: hidden; }
.gx-tbl { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.gx-tbl th { text-align: left; font-size: 11.5px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; color: var(--muted); padding: 11px 14px; border-bottom: 1px solid var(--line); background: var(--bg); }
.gx-tbl td { padding: 11px 14px; border-bottom: 1px solid var(--line); vertical-align: middle; }
.gx-tbl tbody tr:last-child td { border-bottom: 0; }
.gx-tbl tbody tr[data-cli], .gx-tbl tbody tr[data-art], .gx-tbl tbody tr[data-ddt], .gx-tbl tbody tr[data-fv] { cursor: pointer; transition: background .12s; }
.gx-tbl tbody tr[data-cli]:hover, .gx-tbl tbody tr[data-art]:hover, .gx-tbl tbody tr[data-ddt]:hover, .gx-tbl tbody tr[data-fv]:hover { background: var(--bg); }
.gx-tbl td small { display: block; font-size: 12px; color: var(--muted); margin-top: 2px; }
.gx-tbl .r { text-align: right; } .gx-ra { white-space: nowrap; } .gx-ra .btn + .btn { margin-left: 4px; }
.gx-none { text-align: center; color: var(--muted); padding: 28px !important; }
.gx-q { font-weight: 700; font-variant-numeric: tabular-nums; } .gx-q.low { color: var(--danger); } .gx-q.zero { color: var(--muted); }
.gx-neg { color: var(--danger); } .gx-pos { color: #168a60; }
.gx-chips { display: flex; gap: 6px; margin: 0 0 10px; }
.chip-f { height: 32px; padding: 0 12px; border-radius: 999px; border: 1px solid var(--line); background: var(--surface); color: var(--ink-2); font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; }
.chip-f em { font-style: normal; color: var(--muted); margin-left: 4px; } .chip-f.on { background: var(--ink); color: var(--bg); border-color: var(--ink); } .chip-f.on em { color: inherit; opacity: .7; }
.gx-more { padding: 10px 14px; margin: 0; }
.gx-empty { text-align: center; padding: 40px 20px; display: grid; justify-items: center; gap: 6px; }
.gx-empty h3 { margin: 8px 0 0; font-size: 18px; } .gx-empty p { margin: 0 0 12px; color: var(--ink-2); max-width: 460px; font-size: 14px; line-height: 1.5; }
.gx-note { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; margin: 0 0 14px; border-radius: 12px; background: var(--accent-soft); color: var(--ink); font-size: 13.5px; }
.gx-note.warn { background: var(--warn-soft); }
.gx-mini { margin-top: 6px; padding: 12px; border-radius: 12px; background: var(--bg); display: grid; gap: 6px; }
.gx-mini > b { font-size: 12px; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.gx-mr { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 10px; align-items: center; font-size: 13px; }
.gx-mr small { display: block; color: var(--muted); font-size: 11.5px; }
.gx-giac { display: flex; align-items: center; justify-content: space-between; gap: 10px; height: 42px; padding: 0 6px 0 12px; border-radius: 10px; background: var(--bg); }
.gx-ro { height: 42px; display: flex; align-items: center; padding: 0 12px; border-radius: 10px; background: var(--bg); font-size: 13.5px; color: var(--ink-2); }
.gx-chk { display: flex; align-items: center; gap: 8px; font-size: 13.5px; margin: 2px 0 6px; cursor: pointer; }
.gx-docact { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
.gx-miss { margin: 0 0 14px; padding-left: 20px; display: grid; gap: 6px; font-size: 14px; }
.gx-fmt { max-height: 46vh; overflow: auto; border: 1px solid var(--line); border-radius: 12px; margin: 4px 0 8px; }
.gx-fm th:first-child, .gx-fm td:first-child { width: 36px; }
/* righe dei documenti */
.dx { margin: 6px 0 12px; display: grid; gap: 6px; }
.dx-h, .dx-r { display: grid; grid-template-columns: minmax(0, 1fr) 70px 70px 88px 58px 70px 86px 30px; gap: 6px; align-items: center; }
.dx-h { font-size: 11px; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; padding: 0 2px; }
.dx-r input, .dx-r select { height: 38px; min-width: 0; width: 100%; padding: 0 8px; border-radius: 9px; border: 1px solid var(--line); background: var(--surface); color: var(--ink); font: inherit; font-size: 13.5px; }
.dx-r input[type=number] { text-align: right; }
.dx-t { text-align: right; font-size: 13.5px; font-variant-numeric: tabular-nums; }
.dx-x { width: 30px; height: 30px; border-radius: 8px; border: 0; background: none; color: var(--muted); cursor: pointer; font-size: 13px; } .dx-x:hover { background: var(--danger-soft); color: var(--danger); }
.dx-g { grid-column: 1 / -1; margin: -2px 0 2px 4px; font-size: 11.5px; color: var(--muted); }
.dx > .btn { justify-self: start; }
.dx-tot { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px 18px; padding: 10px 2px 0; border-top: 1px solid var(--line); font-size: 13px; color: var(--ink-2); }
.dx-tot b { color: var(--ink); margin-left: 4px; font-variant-numeric: tabular-nums; } .dx-big { font-size: 16px; color: var(--ink) !important; }
@media (max-width: 760px) {
  .dx-h { display: none; }
  .dx-r { grid-template-columns: 1fr 1fr 1fr; padding: 10px; border-radius: 12px; background: var(--bg); }
  .dx-r .dx-dw { grid-column: 1 / -1; } .dx-t { grid-column: 1 / 3; text-align: left; font-weight: 700; } .dx-x { justify-self: end; }
  .gx-tbl thead { display: none; }
  .gx-tbl, .gx-tbl tbody, .gx-tbl tr, .gx-tbl td { display: block; width: 100%; }
  .gx-tbl tr { padding: 10px 14px; border-bottom: 1px solid var(--line); display: grid; grid-template-columns: 1fr auto; gap: 2px 12px; }
  .gx-tbl td { border: 0; padding: 2px 0; text-align: left !important; }
  .gx-tbl td:first-child { grid-column: 1 / -1; font-size: 14.5px; }
  .gx-tbl td[data-l]:not(:first-child)::before { content: attr(data-l) ' · '; color: var(--muted); font-size: 12px; }
  .gx-tbl td small { display: inline; margin-left: 4px; }
  .gx-fm tr { grid-template-columns: auto 1fr auto; }
  .gx-act { width: 100%; margin-left: 0; } .gx-act .btn { flex: 1 1 auto; }
  .gx-search { max-width: none; }
}
.gx-chk input { width: 18px; height: 18px; margin: 0; flex: none; accent-color: var(--accent); }

/* ================= v99: ricavi, costi e utile · incassi ================= */
#v-home { --pl-r: #1baf7a; --pl-c: #9fb4d8; --pl-u: #3362ab; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) #v-home { --pl-r: #2fc48d; --pl-c: #4b5f86; --pl-u: #8fb0ec; } }
:root[data-theme="dark"] #v-home { --pl-r: #2fc48d; --pl-c: #4b5f86; --pl-u: #8fb0ec; }
.pl { margin-bottom: 16px; padding: 20px 22px; }
.pl-h { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.pl-h h3 { margin: 0 0 2px; font-size: 17px; }
.pl-lg { display: flex; gap: 14px; font-size: 12.5px; color: var(--ink-2); }
.pl-lg span { display: inline-flex; align-items: center; gap: 6px; }
.pl-lg i { width: 10px; height: 10px; border-radius: 3px; } .pl-lg .r i { background: var(--pl-r); } .pl-lg .c i { background: var(--pl-c); } .pl-lg .u i { height: 3px; border-radius: 2px; background: var(--pl-u); width: 14px; }
.pl-k { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.pl-k > div { padding: 14px 16px; border-radius: 14px; background: var(--bg); display: grid; gap: 2px; min-width: 0; }
.pl-k span { font-size: 12.5px; font-weight: 600; color: var(--muted); }
.pl-k b { font-size: clamp(22px, 2.6vw, 30px); letter-spacing: -.02em; font-variant-numeric: tabular-nums; white-space: nowrap; }
.pl-k small { font-size: 12px; color: var(--muted); display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.pl-kr b { color: var(--pl-r); } .pl-ku { background: color-mix(in srgb, var(--pl-u) 10%, var(--bg)) !important; } .pl-ku b { color: var(--pl-u); } .pl-ku.neg b { color: var(--danger); }
.pl-d { font-style: normal; font-weight: 700; font-size: 11.5px; padding: 1px 6px; border-radius: 6px; } .pl-d.ok { color: #168a60; background: color-mix(in srgb, #1baf7a 14%, transparent); } .pl-d.ko { color: var(--danger); background: var(--danger-soft); }
.pl-ch { margin-top: 14px; }
.pl-svg { display: block; width: 100%; height: 170px; overflow: visible; }
.pl-0 { stroke: var(--line); stroke-width: 1; }
.pl-r { fill: var(--pl-r); } .pl-c { fill: var(--pl-c); }
.pl-g { transform-box: fill-box; } .pl-g rect { transform-box: fill-box; transform-origin: bottom; }
.cc-anim .pl-g rect { animation: plgrow .9s var(--out) var(--d) both; }
@keyframes plgrow { from { transform: scaleY(0); } }
.pl-g.on rect { stroke: var(--ink); stroke-width: 1.2; }
.pl-u { fill: none; stroke: var(--pl-u); stroke-width: 2.4; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.cc-anim .pl-u, .cc-anim .pl-p { animation: pl-fade .8s .5s ease both; }
@keyframes pl-fade { from { opacity: 0; } }
.pl-p { fill: var(--surface); stroke: var(--pl-u); stroke-width: 2; vector-effect: non-scaling-stroke; } .pl-p.neg { stroke: var(--danger); }
.pl-x { display: flex; margin-top: 4px; } .pl-x span { flex: 1; text-align: center; font-size: 11.5px; color: var(--muted); cursor: pointer; border-radius: 6px; padding: 2px 0; } .pl-x span.on { color: var(--ink); font-weight: 700; background: var(--bg); }
.pl-sd { margin-top: 14px; border-top: 1px solid var(--line); padding-top: 8px; font-size: 13px; }
.pl-sdh, .pl-sdr { display: grid; grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(0, 1fr)); gap: 8px; padding: 6px 2px; align-items: center; }
.pl-sdh { font-size: 11.5px; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; } .pl-sdh span, .pl-sdr span { text-align: right; font-variant-numeric: tabular-nums; }
.pl-sdr + .pl-sdr { border-top: 1px solid var(--line); } .pl-sdr .pos { color: #168a60; font-weight: 700; } .pl-sdr .neg { color: var(--danger); font-weight: 700; }
.pl-empty { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.pl-empty h3 { margin: 0 0 4px; } .pl-empty p { margin: 0; color: var(--ink-2); font-size: 14px; } .pl-cta { display: flex; gap: 8px; }
@media (max-width: 700px) { .pl { padding: 16px; } .pl-h { flex-direction: column; } .pl-k { grid-template-columns: 1fr 1fr; } .pl-ku { grid-column: 1 / -1; } .pl-svg { height: 130px; } .pl-sdh, .pl-sdr { grid-template-columns: minmax(0, 1.3fr) repeat(3, minmax(0, 1fr)); font-size: 12px; } }
/* incassi */
.in-2 { margin-bottom: 14px; }
.in-bars { display: flex; align-items: flex-end; gap: 4px; height: 170px; padding-top: 8px; }
.in-b { flex: 1; min-width: 0; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; gap: 4px; }
.in-b i { display: block; width: 100%; max-width: 34px; min-height: 2px; border-radius: 5px 5px 2px 2px; background: linear-gradient(to top, #1baf7a, #5fd3a5); }
.cc-anim .in-b i, #v-incassi .in-b i { transform-origin: bottom; animation: plgrow .8s var(--out) var(--d) both; }
.in-b.wk i { background: linear-gradient(to top, #138a5f, #3cc28d); }
.in-b span { font-size: 10.5px; color: var(--muted); }
.in-bars.days .in-b span { font-size: 9.5px; }
.in-tp { grid-template-columns: 1fr 1fr; position: relative; } .in-tp i { display: none; }
.in-tot { font-weight: 700; font-size: 17px; color: var(--ink); }

/* v100: accesso solo con credenziali + demo senza account */
.auth-or { display: flex; align-items: center; gap: 10px; color: var(--muted); font-size: 12px; margin: 4px 0; }
.auth-or::before, .auth-or::after { content: ''; flex: 1; height: 1px; background: var(--line); }
.auth-demo { display: flex; align-items: center; justify-content: center; gap: 8px; background: var(--surface); border: 1px solid var(--line); color: var(--ink); }
.auth-demo svg { width: 15px; height: 15px; fill: var(--accent); }
.auth-cred { text-align: center; margin-top: 2px; }
.auth-demo2 { border: 0; background: none; padding: 0; color: #fff; font: inherit; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.ad-sub { display: flex; align-items: center; gap: 8px; font-size: 12.5px; margin: 0 0 8px; color: var(--ink-2); }
.ad-sub span { color: var(--muted); } .ad-sub em { font-style: normal; font-weight: 700; font-size: 11px; padding: 2px 8px; border-radius: 999px; }
.ad-sub.soon em { background: var(--warn-soft); color: var(--warn); } .ad-sub.late em { background: var(--danger-soft); color: var(--danger); } .ad-sub.late b { color: var(--danger); }
.ad-wu { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 10px; }
.ad-wu > span { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; padding: 3px 9px 3px 3px; border-radius: 999px; background: var(--bg); }
.ad-wu i { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: var(--accent-soft); color: var(--accent); font-style: normal; font-size: 10px; font-weight: 700; }
.ad-wu small { color: var(--warn); }
.ad-st { margin: 14px 0 8px; font-size: 13px; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.ad-mods { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 6px; }
.ad-mod { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border: 1px solid var(--line); border-radius: 11px; cursor: pointer; }
.ad-mod input { width: 17px; height: 17px; margin: 2px 0 0; flex: none; accent-color: var(--accent); }
.ad-mod b { display: block; font-size: 13.5px; } .ad-mod small { font-size: 12px; color: var(--muted); line-height: 1.35; }
.ad-mod:has(input:checked) { border-color: var(--accent); background: var(--accent-soft); }
.ad-cred { display: grid; gap: 8px; padding: 14px; border-radius: 12px; background: var(--bg); margin: 0 0 12px; }
.ad-cred div { display: grid; grid-template-columns: 150px 1fr; gap: 10px; font-size: 14px; } .ad-cred span { color: var(--muted); } .ad-cred b { word-break: break-all; }
.ad-cred .mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 16px; letter-spacing: .04em; }
@media (max-width: 560px) { .ad-cred div { grid-template-columns: 1fr; gap: 0; } }
.fo-k { grid-template-columns: 1fr 1fr; margin-bottom: 8px; }
/* v102: l'amministratore è dentro il gestionale di un cliente (aperto dalla Console) */
.demo-bar.vis-bar { background: #e8effb; color: #1d3a6b; border-color: #c9d8f2; }
.demo-bar.vis-bar .btn.sm.demo-info { background: #3362ab; color: #fff; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .demo-bar.vis-bar { background: #15233d; color: #c8d8f4; border-color: #22365c; } :root:not([data-theme="light"]) .demo-bar.vis-bar .btn.sm.demo-info { background: #5b8fe0; color: #fff; } }
:root[data-theme="dark"] .demo-bar.vis-bar { background: #15233d; color: #c8d8f4; border-color: #22365c; }
:root[data-theme="dark"] .demo-bar.vis-bar .btn.sm.demo-info { background: #5b8fe0; color: #fff; }

/* =========================================================
   v103 · PAGINA DI ACCESSO: scena animata e modulo rifinito
   ========================================================= */
.auth-side { --ink2: rgba(225, 234, 250, .72); }
.ax-bg { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 0; background: radial-gradient(130% 90% at 0% 0%, #20407a 0%, transparent 55%), linear-gradient(165deg, #142c58 0%, #0c1a38 70%, #0a1530 100%); }
.ax-bg i { position: absolute; display: block; }
.ax-b1, .ax-b2, .ax-b3 { border-radius: 50%; filter: blur(70px); opacity: .55; will-change: transform; }
.ax-b1 { width: 520px; height: 520px; left: -140px; top: -160px; background: #3d74d6; animation: axdrift 19s ease-in-out infinite alternate; }
.ax-b2 { width: 440px; height: 440px; right: -160px; top: 30%; background: #6c4fd6; opacity: .35; animation: axdrift 23s ease-in-out infinite alternate-reverse; }
.ax-b3 { width: 380px; height: 380px; left: 20%; bottom: -200px; background: #20a58f; opacity: .28; animation: axdrift 27s ease-in-out infinite alternate; }
@keyframes axdrift { 0% { transform: translate(0, 0) scale(1); } 50% { transform: translate(60px, 40px) scale(1.12); } 100% { transform: translate(-30px, 70px) scale(.95); } }
.ax-grid { inset: 0; background-image: linear-gradient(rgba(255, 255, 255, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .045) 1px, transparent 1px); background-size: 46px 46px; -webkit-mask-image: radial-gradient(ellipse 70% 60% at 50% 55%, #000 10%, transparent 75%); mask-image: radial-gradient(ellipse 70% 60% at 50% 55%, #000 10%, transparent 75%); animation: axgrid 30s linear infinite; }
@keyframes axgrid { to { background-position: 46px 46px; } }
.ax-noise { display: none !important; }
.auth-side::after { display: none; }
.auth-side > :not(.ax-bg) { position: relative; z-index: 1; }
.auth-brand img { box-shadow: 0 8px 24px rgba(0, 0, 0, .35); }
.auth-hero h2 { font-size: clamp(28px, 2.6vw, 38px); line-height: 1.15; letter-spacing: -.03em; margin: 0 0 10px; font-weight: 700; }
.auth-hero p { margin: 0; color: var(--ink2); font-size: 15.5px; }
.auth-hero > * { animation: axup .9s cubic-bezier(.2, .8, .2, 1) both; } .auth-hero p { animation-delay: .12s; }
@keyframes axup { from { opacity: 0; transform: translateY(16px); } }
/* parola che cambia */
.ax-rot { position: relative; display: inline-block; vertical-align: bottom; height: 1.25em; line-height: 1.25; overflow: hidden; transition: width .55s cubic-bezier(.2, .8, .2, 1); white-space: nowrap; }
.ax-rot b { display: inline-block; font-weight: 700; background: linear-gradient(90deg, #9cc2ff, #c9b6ff 55%, #8ee6c9); -webkit-background-clip: text; background-clip: text; color: transparent; transition: transform .6s cubic-bezier(.2, .8, .2, 1), opacity .5s; padding-right: 2px; }
.ax-rot b.in { position: absolute; left: 0; top: 0; transform: translateY(105%); opacity: 0; }
.ax-rot b:not(.in):not(.out) { position: absolute; left: 0; top: 0; }
.ax-rot b:only-child { position: static; }
.ax-rot b.out { position: absolute; left: 0; top: 0; transform: translateY(-105%); opacity: 0; }
/* palcoscenico con le card */
.ax-stage { position: relative; height: clamp(250px, 40vh, 370px); margin: 8px 0 0; --px: 0; --py: 0; }
.ax-card, .ax-toast { position: absolute; border-radius: 18px; background: linear-gradient(160deg, rgba(255, 255, 255, .13), rgba(255, 255, 255, .05)); border: 1px solid rgba(255, 255, 255, .16); box-shadow: 0 24px 50px -18px rgba(0, 0, 0, .55), inset 0 1px 0 rgba(255, 255, 255, .12); -webkit-backdrop-filter: blur(16px) saturate(140%); backdrop-filter: blur(16px) saturate(140%); color: #fff;
  translate: calc(var(--px) * var(--z, 10) * 1px) calc(var(--py) * var(--z, 10) * 1px); transition: translate .5s cubic-bezier(.2, .8, .2, 1); animation: axin .9s cubic-bezier(.2, .8, .2, 1) both, axfloat 7s ease-in-out infinite; animation-delay: calc(var(--d, 0) * 150ms + 200ms), calc(var(--d, 0) * -1.7s); }
@keyframes axin { from { opacity: 0; scale: .92; } }
@keyframes axfloat { 50% { transform: translateY(-9px); } }
.ax-ch { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 12.5px; color: var(--ink2); font-weight: 600; }
.ax-main { left: 0; top: 0; width: 64%; padding: 16px 18px 12px; --z: 18; }
.ax-up { font-style: normal; font-size: 11.5px; font-weight: 700; color: #6be3b4; background: rgba(52, 192, 142, .16); padding: 2px 8px; border-radius: 99px; }
.ax-val { display: block; font-size: clamp(26px, 2.3vw, 34px); letter-spacing: -.03em; margin: 4px 0 6px; font-variant-numeric: tabular-nums; }
.ax-line { display: block; width: 100%; height: 86px; overflow: visible; }
#ax-path { fill: none; stroke: #9cc2ff; stroke-width: 2.6; stroke-linecap: round; vector-effect: non-scaling-stroke; stroke-dasharray: 1; stroke-dashoffset: 1; filter: drop-shadow(0 4px 10px rgba(120, 170, 255, .55)); }
.ax-on #ax-path { animation: axdraw 1.6s .5s cubic-bezier(.65, 0, .35, 1) forwards; }
@keyframes axdraw { to { stroke-dashoffset: 0; } }
#ax-area { opacity: 0; } .ax-on #ax-area { animation: axfade 1s 1.4s both; } @keyframes axfade { from { opacity: 0; } to { opacity: 1; } }
#ax-dot { fill: #fff; stroke: #9cc2ff; stroke-width: 3; opacity: 0; } .ax-on #ax-dot { animation: axfade .4s 2s both, axpulse 2s 2.4s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }
@keyframes axpulse { 50% { transform: scale(1.35); } }
.ax-mo { display: flex; justify-content: space-between; font-size: 10.5px; color: rgba(225, 234, 250, .5); margin-top: 4px; }
.ax-bars { right: 0; top: 13%; width: 38%; padding: 14px 16px 14px; --z: 30; }
.ax-bw { display: flex; align-items: flex-end; gap: 8px; height: 104px; margin-top: 12px; }
.ax-bw i { display: block; flex: 1; height: var(--h); border-radius: 6px 6px 3px 3px; background: linear-gradient(180deg, #9cc2ff, rgba(120, 160, 240, .35)); transition: height 1.1s cubic-bezier(.34, 1.3, .5, 1); transform-origin: bottom; animation: axbar 1s cubic-bezier(.2, .8, .2, 1) both; }
.ax-bw i:nth-child(1) { animation-delay: .6s; } .ax-bw i:nth-child(2) { animation-delay: .68s; background: linear-gradient(180deg, #f5c477, rgba(240, 170, 80, .35)); } .ax-bw i:nth-child(3) { animation-delay: .76s; } .ax-bw i:nth-child(4) { animation-delay: .84s; } .ax-bw i:nth-child(5) { animation-delay: .92s; }
@keyframes axbar { from { transform: scaleY(0); } }
.ax-donut { left: 8%; bottom: 0; width: 46%; padding: 14px 16px; display: flex; align-items: center; gap: 14px; --z: 24; }
.ax-donut svg { width: 64px; height: 64px; transform: rotate(-90deg); flex: none; }
.ax-donut circle { fill: none; stroke-width: 6; stroke: var(--c); transition: stroke-dasharray 1.1s cubic-bezier(.2, .8, .2, 1), stroke-dashoffset 1.1s cubic-bezier(.2, .8, .2, 1); }
.ax-donut circle.t { stroke: rgba(255, 255, 255, .1); }
.ax-donut div { display: grid; gap: 2px; min-width: 0; } .ax-donut span { font-size: 12px; color: var(--ink2); font-weight: 600; } .ax-donut b { font-size: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#ax-cat.sw { animation: axswap .6s cubic-bezier(.2, .8, .2, 1); } @keyframes axswap { from { opacity: 0; transform: translateY(8px); } }
.ax-toast { right: 3%; bottom: 9%; display: flex; align-items: center; gap: 11px; padding: 11px 15px 11px 11px; border-radius: 14px; background: rgba(255, 255, 255, .94); color: #14213d; box-shadow: 0 24px 50px -16px rgba(0, 0, 0, .6); --z: 40; opacity: 0; translate: calc(var(--px) * var(--z) * 1px) calc(var(--py) * var(--z) * 1px + 14px); scale: .96; transition: opacity .4s, translate .5s cubic-bezier(.2, .8, .2, 1), scale .5s cubic-bezier(.34, 1.4, .5, 1); animation: none; max-width: 62%; }
.ax-toast.show { opacity: 1; translate: calc(var(--px) * var(--z) * 1px) calc(var(--py) * var(--z) * 1px); scale: 1; }
.ax-toast div { display: grid; min-width: 0; } .ax-toast b { font-size: 13px; } .ax-toast small { font-size: 12px; color: #5b6478; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ax-ti { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; flex: none; background: #e7effc; color: #3362ab; }
.ax-ti svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.ax-ti.k-in, .ax-ti.k-ok { background: #e2f6ee; color: #12895f; } .ax-ti.k-warn { background: #fdf0dc; color: #b9740c; } .ax-ti.k-ddt { background: #efe9fb; color: #6646c2; }
.auth-foot { animation: axup .9s .5s both; }
.auth-tour { background: rgba(255, 255, 255, .1); border-color: rgba(255, 255, 255, .25); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }

/* lato del modulo */
.auth-main { position: relative; overflow: hidden; background: radial-gradient(560px 380px at 85% 0%, color-mix(in srgb, var(--accent) 11%, transparent), transparent 70%), radial-gradient(520px 420px at 0% 100%, color-mix(in srgb, #6c4fd6 7%, transparent), transparent 70%), var(--bg); }
.auth-main::before { content: ''; position: absolute; inset: 0; background-image: radial-gradient(color-mix(in srgb, var(--muted) 22%, transparent) 1px, transparent 1.2px); background-size: 22px 22px; -webkit-mask-image: radial-gradient(ellipse 60% 55% at 50% 50%, #000, transparent 75%); mask-image: radial-gradient(ellipse 60% 55% at 50% 50%, #000, transparent 75%); opacity: .55; pointer-events: none; }
.auth-card { position: relative; border-radius: 24px; box-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 30px 70px -24px rgba(20, 40, 90, .22); animation: axcard .8s cubic-bezier(.2, .8, .2, 1) both; isolation: isolate; }
@keyframes axcard { from { opacity: 0; transform: translateY(18px) scale(.985); } }
@property --axa { syntax: '<angle>'; inherits: false; initial-value: 0deg; }
.auth-card::before { content: ''; position: absolute; inset: -1px; border-radius: inherit; padding: 1px; background: conic-gradient(from var(--axa), transparent 0 60%, color-mix(in srgb, var(--accent) 70%, transparent) 75%, transparent 90%); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0); animation: axspin 6s linear infinite; pointer-events: none; opacity: .7; }
@keyframes axspin { to { --axa: 360deg; } }
.auth-card > * { animation: axup .7s cubic-bezier(.2, .8, .2, 1) both; }
.auth-card > :nth-child(1) { animation-delay: .1s; } .auth-card > :nth-child(2) { animation-delay: .18s; } .auth-card > :nth-child(n+3) { animation-delay: .26s; }
.auth-form > * { animation: axup .7s cubic-bezier(.2, .8, .2, 1) both; }
.auth-form > :nth-child(1) { animation-delay: .22s; } .auth-form > :nth-child(2) { animation-delay: .29s; } .auth-form > :nth-child(3) { animation-delay: .36s; } .auth-form > :nth-child(4) { animation-delay: .42s; } .auth-form > :nth-child(n+5) { animation-delay: .48s; }
.auth-top img { animation: axlogo 1s .1s cubic-bezier(.34, 1.4, .5, 1) both; position: relative; }
@keyframes axlogo { from { transform: scale(.6) rotate(-12deg); opacity: 0; } }
.auth-top h1 { font-size: 26px; letter-spacing: -.025em; }
.auth-form .f > span { font-weight: 600; }
.auth-form .f input { height: 48px; border-radius: 12px; font-size: 15px; transition: border-color .15s, box-shadow .2s, background .2s; }
.auth-form .f input:focus { box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 16%, transparent); border-color: var(--accent); }
#login-go { position: relative; overflow: hidden; color: #fff; background: linear-gradient(135deg, #3d71c2, #2c579b); box-shadow: 0 10px 24px -10px rgba(51, 98, 171, .8); transition: transform .15s, box-shadow .2s; }
#login-go:hover { box-shadow: 0 14px 30px -10px rgba(51, 98, 171, .9); transform: translateY(-1px); }
#login-go:active { transform: scale(.985); }
#login-go::after { content: ''; position: absolute; top: 0; bottom: 0; left: -60%; width: 45%; background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .28), transparent); transform: skewX(-18deg); animation: axsheen 4.5s 1.4s ease-in-out infinite; }
@keyframes axsheen { 0%, 70% { left: -60%; } 100% { left: 130%; } }
.auth-demo { transition: border-color .15s, transform .15s, box-shadow .2s; } .auth-demo:hover { border-color: var(--accent); box-shadow: 0 8px 20px -12px rgba(51, 98, 171, .6); transform: translateY(-1px); }
.auth-demo svg { transition: transform .25s; } .auth-demo:hover svg { transform: translateX(3px) scale(1.1); }

@media (min-width: 960px) {
  .auth-side { padding: 40px 48px 36px; gap: 18px; }
  .auth-hero { margin-top: auto; }
  .auth-foot { margin-top: auto; }
}
/* telefono e tablet: la scena diventa una testata animata sopra il modulo */
@media (max-width: 959px) {
  .auth { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto 1fr; }
  .auth-side { display: flex; flex-direction: column; gap: 12px; padding: calc(22px + env(safe-area-inset-top)) 20px 44px; color: #fff; position: relative; overflow: hidden; min-height: 330px; }
  .auth-brand { display: flex; align-items: center; gap: 10px; } .auth-brand img { width: 34px; height: 34px; border-radius: 10px; background: #fff; padding: 2px; } .auth-brand b { display: block; font-size: 15px; } .auth-brand span { font-size: 12px; opacity: .75; }
  .auth-hero h2 { font-size: 26px; margin: 8px 0 4px; } .auth-hero p { font-size: 14px; }
  .ax-stage { height: 150px; margin-top: 4px; }
  .ax-main { width: 64%; padding: 11px 13px 8px; } .ax-val { font-size: 21px; margin: 2px 0 2px; } .ax-line { height: 46px; } .ax-mo { display: none; }
  .ax-bars { width: 32%; top: 8%; padding: 10px 11px; } .ax-bw { height: 72px; gap: 5px; margin-top: 8px; }
  .ax-donut, .auth-foot { display: none !important; }
  .ax-toast { right: auto; left: 18%; bottom: -6px; max-width: 78%; padding: 8px 12px 8px 8px; } .ax-ti { width: 28px; height: 28px; }
  .auth-main { margin-top: -26px; border-radius: 26px 26px 0 0; position: relative; z-index: 2; align-items: start; padding-top: 18px; }
  .auth-card { box-shadow: none; border: 0; background: transparent; padding: 10px 6px 12px; }
  .auth-card::before { display: none; }
  .auth-top img { display: none; }
  .auth-main::before { display: none; }
}
@media (prefers-reduced-motion: reduce) { .auth-side *, .auth-card, .auth-card *, .auth-card::before { animation: none !important; transition: none !important; } .ax-toast { opacity: 1; translate: none; scale: 1; } #ax-path { stroke-dashoffset: 0; } #ax-area, #ax-dot { opacity: 1; } }
#ax-cat { border: 0; padding: 0; margin: 0; }
@media (min-width: 960px) and (max-height: 820px) { .ax-donut { display: none; } .ax-toast { bottom: 2%; } .ax-stage { height: clamp(230px, 38vh, 300px); } }

/* =========================================================
   v108 · MOTION DEL GESTIONALE (motion.js)
   ========================================================= */
@media (min-width: 900px) {
  .nav a { position: relative; z-index: 1; }
  .nav-ind { position: absolute; left: 0; top: 0; z-index: 0; border-radius: 10px; pointer-events: none; opacity: 0; background: var(--accent-soft); box-shadow: inset 3px 0 0 var(--accent); transition: transform .5s cubic-bezier(.34, 1.25, .5, 1), width .3s, height .3s, opacity .2s; }
  body.mv-nav .nav a.active { background: transparent; }
  .nav a:not(.active):hover { transform: translateX(2px); }
}
@media (max-width: 899px) { .nav-ind { display: none; } }
#mv-prog { position: fixed; top: 0; left: 0; right: 0; height: 2px; z-index: 1000; pointer-events: none; opacity: 0; overflow: hidden; transition: opacity .3s; }
#mv-prog.on { opacity: 1; }
#mv-prog i { display: block; height: 100%; width: 40%; background: linear-gradient(90deg, transparent, var(--accent), #8b6cf0, transparent); animation: mvprog 1.1s ease-in-out infinite; }
@keyframes mvprog { from { transform: translateX(-100%); } to { transform: translateX(260%); } }
.mv-rh { overflow: hidden; }
.mv-rip { position: absolute; border-radius: 50%; background: currentColor; opacity: .18; transform: scale(0); animation: mvrip .6s ease-out forwards; pointer-events: none; }
@keyframes mvrip { to { transform: scale(1); opacity: 0; } }
/* card e KPI: leggero sollevamento */
.gx-k { transition: transform .25s cubic-bezier(.2, .8, .2, 1), box-shadow .25s, border-color .25s; }
.gx-k:hover { transform: translateY(-2px); box-shadow: 0 14px 30px -18px rgba(20, 40, 90, .35); }
a.card { transition: transform .25s cubic-bezier(.2, .8, .2, 1), box-shadow .25s; }
a.card:hover { transform: translateY(-2px); box-shadow: 0 16px 34px -20px rgba(20, 40, 90, .35); }
.gx-list tbody tr { transition: background .15s, box-shadow .15s; }
.gx-list tbody tr:hover { box-shadow: inset 3px 0 0 var(--accent); }
/* luce ambientale in alto, molto leggera */
@media (min-width: 900px) {
  .app main { position: relative; isolation: isolate; }
  .app main::before { content: ''; position: fixed; z-index: -1; pointer-events: none; top: -220px; right: -160px; width: 620px; height: 520px; border-radius: 50%; background: radial-gradient(circle, color-mix(in srgb, var(--accent) 9%, transparent), transparent 70%); animation: mvglow 18s ease-in-out infinite alternate; }
}
@keyframes mvglow { from { transform: translate(0, 0) scale(1); } to { transform: translate(-120px, 60px) scale(1.15); } }
@media (prefers-reduced-motion: reduce) { .nav-ind, .app main::before, #mv-prog i { animation: none !important; transition: none !important; } }

/* v110: link «solo Preventivi» — niente menu, solo la sezione Preventivi */
body.solo-pv .nav, body.solo-pv #fab, body.solo-pv .nav-ind { display: none !important; }
body.solo-pv main { padding-bottom: calc(32px + env(safe-area-inset-bottom)); }
@media (min-width: 900px) { body.solo-pv main { margin-left: 0; } }
.solo-all { display: inline-flex; align-items: center; gap: 6px; text-decoration: none; }
.solo-all[hidden] { display: none; }
.solo-all svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; }
@media (max-width: 640px) { .solo-all span { display: none; } }

/* v111: lettore codici a barre */
.pv-brand button[hidden] { display: none; }
.scan-fld { position: relative; display: block; }
.scan-fld input { width: 100%; padding-right: 44px; }
.scan-fld .scan-ib { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); }
.scan-ib { display: inline-grid; place-items: center; width: 34px; height: 34px; border: 0; border-radius: 9px; background: transparent; color: var(--accent); cursor: pointer; transition: background .2s, transform .2s; }
.scan-ib:hover { background: var(--accent-soft, rgba(51, 98, 171, .1)); }
.scan-ib:active { transform: translateY(-50%) scale(.92); }
.gx-search .scan-ib { position: absolute; right: 3px; top: 50%; transform: translateY(-50%); width: 32px; height: 32px; }
.gx-search .scan-ib:active { transform: translateY(-50%) scale(.92); }
.gx-search .scan-ib svg { position: static; transform: none; width: 18px; height: 18px; stroke: var(--accent); stroke-width: 1.8; }
.gx-search:has(.scan-ib) input { padding-right: 40px; }
.scan-ib svg, .dx-adds svg, .pv-addb svg, .scan-lk svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.dx-adds { display: flex; gap: 8px; flex-wrap: wrap; }
.dx-adds .btn svg, .pv-addb .btn svg { width: 16px; height: 16px; margin-right: 4px; vertical-align: -3px; }
.pv-addb { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.scan-lk { display: inline-flex; align-items: center; gap: 4px; margin-left: 8px; font-size: 12px; }
.scan-lk svg { width: 14px; height: 14px; }
body.scn-on { overflow: hidden; }
.scn { position: fixed; inset: 0; z-index: 9000; background: #05070b; color: #fff; opacity: 0; transition: opacity .25s; display: grid; grid-template-rows: auto 1fr auto; font-family: inherit; }
.scn.in { opacity: 1; }
.scn-v { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.scn-shade { position: absolute; inset: 0; pointer-events: none; z-index: 1; background: linear-gradient(rgba(0, 0, 0, .5), transparent 24%, transparent 70%, rgba(0, 0, 0, .65)); }
.scn-top { position: relative; z-index: 2; display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: calc(16px + env(safe-area-inset-top)) 18px 0; }
.scn-top b { display: block; font-size: 18px; font-weight: 650; letter-spacing: -.01em; }
.scn-top span { display: block; margin-top: 3px; font-size: 13px; color: rgba(255, 255, 255, .72); }
.scn-x { width: 42px; height: 42px; border-radius: 50%; border: 0; background: rgba(255, 255, 255, .14); color: #fff; display: grid; place-items: center; cursor: pointer; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); flex: none; }
.scn-x svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.scn-frame { position: absolute; left: 50%; top: 50%; width: min(86vw, 520px); height: min(30vh, 220px); border-radius: 18px; box-shadow: 0 0 0 200vmax rgba(0, 0, 0, .42); transform: translate(-50%, -50%) scale(.94); transition: transform .4s cubic-bezier(.34, 1.4, .5, 1); pointer-events: none; z-index: 1; }
.scn.in .scn-frame { transform: translate(-50%, -50%) scale(1); }
.scn-frame i { position: absolute; width: 34px; height: 34px; border: 3px solid #fff; border-radius: 4px; transition: border-color .2s; }
.scn-frame i:nth-child(1) { left: 0; top: 0; border-right: 0; border-bottom: 0; border-top-left-radius: 14px; }
.scn-frame i:nth-child(2) { right: 0; top: 0; border-left: 0; border-bottom: 0; border-top-right-radius: 14px; }
.scn-frame i:nth-child(3) { left: 0; bottom: 0; border-right: 0; border-top: 0; border-bottom-left-radius: 14px; }
.scn-frame i:nth-child(4) { right: 0; bottom: 0; border-left: 0; border-top: 0; border-bottom-right-radius: 14px; }
.scn-line { position: absolute; left: 6%; right: 6%; top: 50%; height: 2px; border-radius: 2px; background: linear-gradient(90deg, transparent, #ff4d4d 20%, #ff4d4d 80%, transparent); box-shadow: 0 0 14px 2px rgba(255, 77, 77, .6); opacity: 0; }
.scn.live .scn-line { opacity: 1; animation: scnLine 2.2s ease-in-out infinite; }
@keyframes scnLine { 0%, 100% { transform: translateY(-70px); } 50% { transform: translateY(70px); } }
.scn.ok .scn-frame i { border-color: #34d399; animation: scnHit .45s ease; }
.scn.ko .scn-frame i { border-color: #fbbf24; animation: scnHit .45s ease; }
@keyframes scnHit { 40% { transform: scale(1.08); } }
.scn.nocam .scn-frame, .scn.nocam .scn-shade { display: none; }
.scn-msg { position: absolute; left: 0; right: 0; top: calc(50% + min(15vh, 110px) + 18px); display: flex; justify-content: center; padding: 0 18px; z-index: 2; pointer-events: none; }
.scn.nocam .scn-msg { top: 38%; }
.scn-msg span { max-width: 520px; padding: 10px 16px; border-radius: 14px; background: rgba(20, 24, 32, .82); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); font-size: 14px; font-weight: 550; text-align: center; line-height: 1.35; }
.scn-msg span.ok { background: rgba(16, 122, 84, .9); }
.scn-msg span.ko { background: rgba(146, 92, 12, .92); }
.scn-msg.pop span { animation: scnPop .35s cubic-bezier(.34, 1.5, .5, 1); }
@keyframes scnPop { from { opacity: 0; transform: translateY(8px) scale(.96); } }
.scn-bot { position: relative; z-index: 2; grid-row: 3; display: grid; gap: 12px; padding: 0 18px calc(18px + env(safe-area-inset-bottom)); max-width: 560px; width: 100%; margin: 0 auto; box-sizing: border-box; }
.scn-man { display: flex; gap: 8px; }
.scn-man input { flex: 1; min-width: 0; height: 48px; border-radius: 14px; border: 1px solid rgba(255, 255, 255, .22); background: rgba(255, 255, 255, .12); color: #fff; padding: 0 16px; font-size: 16px; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.scn-man input::placeholder { color: rgba(255, 255, 255, .6); }
.scn-man input:focus { outline: none; border-color: #fff; }
.scn-man button { height: 48px; padding: 0 18px; border-radius: 14px; border: 0; background: #fff; color: #111; font-weight: 650; font-size: 15px; cursor: pointer; }
.scn-btns { display: flex; gap: 10px; justify-content: center; }
.scn-btns:empty { display: none; }
.scn-b { display: inline-flex; align-items: center; gap: 8px; height: 48px; padding: 0 20px; border-radius: 24px; border: 0; background: rgba(255, 255, 255, .16); color: #fff; font-size: 15px; font-weight: 600; cursor: pointer; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.scn-b svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linejoin: round; }
.scn-b.on { background: #fff; color: #111; }
.scn-done { background: var(--accent, #3362ab); }
.scn-n { font-style: normal; min-width: 24px; height: 24px; padding: 0 6px; border-radius: 12px; background: rgba(255, 255, 255, .25); display: grid; place-items: center; font-size: 13px; }
.scn-n.bump { animation: scnPop .4s cubic-bezier(.34, 1.6, .5, 1); }
.scn-c { display: none; }
@media (prefers-reduced-motion: reduce) { .scn.live .scn-line { animation: none; } }

/* v111: documento allegato e archivio fornitori */
.ad-box { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px dashed var(--line); border-radius: 14px; background: var(--surface); margin: 2px 0 12px; }
.ad-box .btn { flex: none; }
.ad-ic { width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center; background: var(--accent-soft, rgba(51, 98, 171, .1)); color: var(--accent); flex: none; }
.ad-ic.ok { background: rgba(16, 150, 100, .12); color: #10966a; }
.ad-ic svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.ad-t { flex: 1; min-width: 0; display: grid; gap: 2px; }
.ad-t b { font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ad-t small { color: var(--muted); font-size: 12px; }
.mv-ddt[hidden] { display: none; }
.df-seg { margin-bottom: 12px; display: grid !important; grid-template-columns: repeat(5, 1fr); }
.ar-open { display: inline-flex; align-items: center; gap: 5px; }
.ar-open svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.ar-tbl td .chip { margin-bottom: 2px; }
.gx-mini > .btn { margin-top: 8px; }
.gx-mr .btn { flex: none; }
.dv { position: fixed; inset: 0; z-index: 8000; background: rgba(10, 12, 16, .86); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); display: grid; grid-template-rows: auto 1fr; opacity: 0; transition: opacity .22s; }
.dv.in { opacity: 1; }
.dv-bar { display: flex; align-items: center; gap: 10px; padding: calc(12px + env(safe-area-inset-top)) 16px 12px; color: #fff; }
.dv-bar b { font-size: 15px; font-weight: 600; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dv-bar span { flex: 1; }
.dv-x { width: 38px; height: 38px; border-radius: 50%; border: 0; background: rgba(255, 255, 255, .14); color: #fff; display: grid; place-items: center; cursor: pointer; flex: none; }
.dv-x svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.dv-pages { overflow: auto; padding: 4px 12px calc(24px + env(safe-area-inset-bottom)); display: flex; flex-direction: column; align-items: center; gap: 14px; transform: translateY(10px); transition: transform .3s cubic-bezier(.2, .8, .2, 1); }
.dv.in .dv-pages { transform: none; }
.dv-pages canvas, .dv-pages img { max-width: 100%; background: #fff; border-radius: 6px; box-shadow: 0 18px 40px -20px rgba(0, 0, 0, .7); }
.dv-pages .empty { color: rgba(255, 255, 255, .75); margin-top: 18vh; }
@media (max-width: 640px) { .ad-box { flex-wrap: wrap; } .ad-t { flex-basis: calc(100% - 52px); } }

/* v113: righe dei documenti con foto, margine e ricarico; servizi; finestra «Aggiungi prodotti» */
.dx-dw { display: flex; align-items: center; gap: 8px; min-width: 0; }
.dx-dw input { flex: 1; }
.dx-dw .pv-img.sm, .dx-dw .pv-sw { flex: none; }
.dx-mok { color: #10966a; } .dx-mko { color: var(--danger, #d23b3b); }
.dx-mg { margin-right: auto; }
.dx-ric { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 10px 12px; border-radius: 12px; background: var(--bg); margin: 2px 0 10px; }
.dx-ric .pv-rf { margin: 0; }
.dx-eye { margin-left: auto; }
.pk-si { display: grid; place-items: center; color: #eb6834; background: rgba(235, 104, 52, .1); }
.pk-si svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.srv-row { width: 100%; text-align: left; border: 0; background: none; color: inherit; font: inherit; cursor: pointer; border-radius: 10px; }
.srv-row:hover { background: var(--bg); }
.srv-p { font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.md, .pk { position: fixed; inset: 0; z-index: 7000; background: rgba(12, 15, 22, .48); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); display: grid; place-items: center; padding: 16px; opacity: 0; transition: opacity .2s; }
.md.in, .pk.in { opacity: 1; }
.md-box, .pk-box { width: min(560px, 100%); max-height: calc(100dvh - 32px); display: flex; flex-direction: column; background: var(--surface); color: var(--ink); border-radius: 20px; box-shadow: 0 30px 80px -30px rgba(0, 0, 0, .55); transform: translateY(14px) scale(.98); transition: transform .3s cubic-bezier(.2, .9, .2, 1); overflow: hidden; }
.md.in .md-box, .pk.in .pk-box { transform: none; }
.md-h, .pk-h { display: flex; align-items: center; gap: 10px; padding: 16px 18px 10px; }
.md-h b, .pk-h b { font-size: 17px; }
.md-x { margin-left: auto; width: 34px; height: 34px; border-radius: 50%; border: 0; background: var(--bg); color: var(--ink-2); display: grid; place-items: center; cursor: pointer; flex: none; }
.md-x svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.md-b { padding: 4px 18px 8px; overflow: auto; }
.md-f, .pk-f { display: flex; align-items: center; gap: 8px; padding: 12px 18px 16px; border-top: 1px solid var(--line); }
.md-f > span { flex: 1; }
.pk-box { width: min(860px, 100%); height: min(760px, calc(100dvh - 32px)); }
.pk-cli { font-size: 12.5px; color: var(--muted); }
.pk-sp { flex: 1; }
.pk-h .md-x { margin-left: 0; }
.pk-s { padding: 0 18px 8px; }
.pk-s .gx-search { max-width: none; }
.pk-s .gx-search input { height: 44px; font-size: 15px; }
.pk-src { display: flex; gap: 6px; overflow-x: auto; padding: 2px 18px 10px; scrollbar-width: none; }
.pk-src::-webkit-scrollbar { display: none; }
.pk-c { flex: none; height: 36px; padding: 0 12px; border-radius: 18px; border: 1px solid var(--line); background: var(--surface); color: var(--ink-2); font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; display: grid; place-items: center; transition: background .2s, border-color .2s; }
.pk-c img { height: 20px; width: auto; max-width: 70px; object-fit: contain; }
.pk-c.on { background: var(--accent); border-color: var(--accent); color: #fff; }
.pk-c.on img { filter: brightness(0) invert(1); }
.pk-list { flex: 1; overflow: auto; padding: 0 12px 8px; }
.pk-r { display: grid; grid-template-columns: auto minmax(0, 1fr) auto 40px; gap: 12px; align-items: center; padding: 8px 6px; border-radius: 12px; cursor: pointer; animation: pkIn .3s both; }
.pk-r:hover { background: var(--bg); }
@keyframes pkIn { from { opacity: 0; transform: translateY(6px); } }
.pk-t { display: grid; gap: 2px; min-width: 0; }
.pk-t b { font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pk-t small { font-size: 12px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pk-p { display: grid; justify-items: end; font-size: 13.5px; font-variant-numeric: tabular-nums; }
.pk-p small, td small { font-size: 11px; color: var(--muted); }
.pk-add { width: 36px; height: 36px; border-radius: 50%; border: 0; background: var(--accent-soft, rgba(51, 98, 171, .1)); color: var(--accent); display: grid; place-items: center; cursor: pointer; transition: transform .2s, background .2s; }
.pk-add:hover { background: var(--accent); color: #fff; } .pk-add:active { transform: scale(.9); }
.pk-add svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.pk-hint { padding: 22px 10px; text-align: center; color: var(--muted); font-size: 13.5px; }
.pk-d { padding: 4px 6px 12px; animation: pkIn .3s both; }
.pk-dh { display: flex; gap: 16px; align-items: center; margin: 12px 0 14px; }
.pk-dh .pv-img.big { width: 96px; height: 96px; flex: none; }
.pk-dh h3 { margin: 2px 0 4px; font-size: 18px; }
.pk-dh small { color: var(--muted); font-size: 12px; }
.pk-tw { overflow-x: auto; }
.pk-g { border-collapse: collapse; min-width: 100%; font-size: 13px; }
.pk-g th { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); padding: 6px; text-align: center; white-space: nowrap; }
.pk-g th:first-child { text-align: left; }
.pk-g td { padding: 5px 6px; border-top: 1px solid var(--line); vertical-align: middle; }
.pk-g td b { display: block; font-size: 13px; } .pk-g td small { display: block; }
.pk-g .r { text-align: right; }
.pk-q { width: 58px; height: 36px; text-align: center; border-radius: 9px; border: 1px solid var(--line); background: var(--surface); color: var(--ink); font: inherit; }
.pk-da { display: flex; justify-content: flex-end; margin-top: 12px; }
.pk-msg { flex: 1; font-size: 13px; color: #10966a; font-weight: 600; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pk-msg.pop { animation: scnPop .35s cubic-bezier(.34, 1.5, .5, 1); }
.pk-n { font-style: normal; display: inline-grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px; margin-left: 6px; border-radius: 11px; background: rgba(255, 255, 255, .25); font-size: 12px; }
.pk-n.bump { animation: scnPop .4s cubic-bezier(.34, 1.6, .5, 1); }
@media (max-width: 640px) {
  .md, .pk { padding: 0; place-items: end stretch; }
  .md-box, .pk-box { width: 100%; max-height: 94dvh; border-radius: 20px 20px 0 0; }
  .pk-box { height: 94dvh; }
  .pk-r { grid-template-columns: auto minmax(0, 1fr) 36px; }
  .pk-p { grid-column: 2; justify-items: start; grid-row: 2; }
  .pk-f .btn.sm { display: none; }
}
.dx-tot b.dx-mok { color: #10966a; } .dx-tot b.dx-mko { color: var(--danger, #d23b3b); }

/* v114: preventivo → DDT / fattura, stato fatturato */
.pv-fchip { cursor: pointer; display: inline-flex; align-items: center; gap: 6px; user-select: none; transition: transform .15s, filter .2s; }
.pv-fchip:hover { filter: brightness(.96); } .pv-fchip:active { transform: scale(.94); }
.pv-fchip i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; opacity: .75; }
.pv-qh { display: grid; grid-template-columns: 128px minmax(0, 1fr) 190px 112px 120px; gap: 20px; align-items: end; padding: 0 12px 10px; border-bottom: 1px solid var(--line); font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.pv-qh span:last-child { text-align: right; }
.pv-qs { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; min-width: 0; }
.pv-qr .pv-qn b { font-size: 13.5px; font-variant-numeric: tabular-nums; letter-spacing: .01em; }
.pv-qr .pv-qc b { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pv-qr .pv-qt { font-size: 15px; font-weight: 700; white-space: nowrap; }
.pv-qr:last-child { border-bottom: 0; }
@media (max-width: 1180px) { .pv-qr, .pv-qh { grid-template-columns: 112px minmax(0, 1fr) 170px 104px 108px; gap: 14px; } }
.pv-back [data-pvconv] { display: inline-flex; align-items: center; gap: 6px; }
.pv-back [data-pvconv] svg, .pv-doc svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.pv-docs { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 12px; }
.pv-doc { display: inline-flex; align-items: center; gap: 10px; padding: 8px 14px; border-radius: 12px; border: 1px solid var(--line); background: var(--surface); color: var(--ink); font: inherit; cursor: pointer; text-align: left; animation: pkIn .35s both; }
.pv-doc:hover { border-color: var(--accent); }
.pv-doc svg { color: var(--accent); }
.pv-doc b { display: block; font-size: 13.5px; } .pv-doc small { display: block; font-size: 12px; color: var(--muted); }
@media (max-width: 640px) {
  .pv-back { grid-template-columns: auto auto 1fr !important; }
  .pv-back .pv-sp { display: none !important; }
  .pv-back .pv-fchip { justify-self: start; }
  .pv-back [data-pvconv] { grid-row: 3; justify-content: center; height: 42px; }
  .pv-back [data-pvconv="ddt"] { grid-column: 1 / 2; } .pv-back [data-pvconv="fv"] { grid-column: 2 / -1; }
  .pv-back #pv-dup, .pv-back #pv-del { grid-row: 4; }
  .pv-docs { display: grid; } .pv-doc { width: 100%; }
}

/* v121: Analisi — cerca, filtra, raggruppa ed esporta */
#an-body { display: grid; gap: 14px; }
#an-body svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.ax-top { display: grid; gap: 14px; padding: 18px; }
.ax-tt { display: flex; align-items: center; gap: 12px; min-width: 0; }
.ax-tt > div:not(.ax-ex) { min-width: 0; flex: 1; } .ax-tt h3 { margin: 0; font-size: 17px; } .ax-tt p { margin: 2px 0 0; font-size: 12.5px; color: var(--muted); }
.ax-back { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; border: 1px solid var(--line); background: var(--surface); color: var(--ink); cursor: pointer; flex: none; }
.ax-back:hover { border-color: var(--muted); }
.ax-ex { display: flex; gap: 8px; flex: none; margin-left: auto; } .ax-ex .btn, .ax-tg { display: inline-flex; align-items: center; gap: 6px; }
.ax-tg.on { border-color: var(--accent); color: var(--accent); background: var(--accent-soft); }
.ax-tg em { font-style: normal; font-size: 11px; font-weight: 700; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--accent); color: var(--accent-ink); display: inline-grid; place-items: center; }
.ax-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ax-sb { position: relative; flex: 1 1 280px; min-width: 0; }
.ax-sb > svg { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--muted); pointer-events: none; }
.ax-sb input { width: 100%; height: 38px; padding: 0 36px 0 36px; border-radius: 10px; border: 1px solid var(--line); background: var(--bg); font: inherit; font-size: 14px; color: var(--ink); }
.ax-sb input:focus { outline: none; border-color: var(--accent); background: var(--surface); box-shadow: 0 0 0 3px var(--accent-soft); }
.ax-sb input::-webkit-search-cancel-button { display: none; }
.ax-qx { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); width: 26px; height: 26px; border: 0; border-radius: 8px; background: transparent; color: var(--muted); display: grid; place-items: center; cursor: pointer; }
.ax-per select, .ax-gr select, .ax-dt input, .ax-f select, .ax-f input { height: 32px; border-radius: 8px; border: 1px solid var(--line); background: var(--surface); font: inherit; font-size: 13px; color: var(--ink); padding: 0 8px; }
.ax-dt, .ax-gr { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; font-size: 12.5px; color: var(--muted); }
.ax-gr { margin-left: auto; }
.ax-pan { display: grid; gap: 10px 12px; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); padding: 14px; border-radius: 12px; background: var(--bg); border: 1px solid var(--line); align-items: end; }
.ax-f { display: grid; gap: 4px; min-width: 0; } .ax-f span { font-size: 11.5px; font-weight: 600; color: var(--muted); } .ax-f select, .ax-f input { width: 100%; min-width: 0; }
.ax-cc { display: flex; align-items: center; gap: 8px; font-size: 13px; cursor: pointer; }
.ax-cc input { width: 16px; height: 16px; accent-color: var(--accent); }
.ax-clr { justify-self: start; }
.ax-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.ax-chip { display: inline-flex; align-items: center; gap: 6px; padding: 5px 8px 5px 11px; border-radius: 999px; border: 1px solid color-mix(in srgb, var(--accent) 30%, transparent); background: var(--accent-soft); color: var(--accent); font: inherit; font-size: 12.5px; cursor: pointer; }
.ax-chip b { font-weight: 700; } #an-body .ax-chip svg { width: 13px; height: 13px; }
.ax-kpis { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }
.ax-k { display: grid; gap: 3px; padding: 14px 16px; } .ax-k span { font-size: 12px; color: var(--muted); } .ax-k b { font-size: 20px; font-weight: 800; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .ax-k small { font-size: 11.5px; color: var(--muted); }
.ax-tw { overflow-x: auto; margin: 0 -16px; padding: 0 16px; }
.ax-t { width: 100%; border-collapse: collapse; font-size: 13px; font-variant-numeric: tabular-nums; }
.ax-t th { position: sticky; top: 0; text-align: left; font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); padding: 0 10px 9px; border-bottom: 1px solid var(--line); white-space: nowrap; background: var(--surface); }
.ax-t th button { all: unset; cursor: pointer; display: inline-flex; align-items: center; gap: 3px; } .ax-t th button:hover { color: var(--ink); } #an-body .ax-t th svg { width: 12px; height: 12px; }
.ax-t td { padding: 9px 10px; border-bottom: 1px solid var(--line); white-space: nowrap; max-width: 320px; overflow: hidden; text-overflow: ellipsis; }
.ax-t td.ax-m { font-weight: 600; white-space: normal; min-width: 180px; }
.ax-t .r { text-align: right; } .ax-t th.r button { justify-content: flex-end; }
.ax-t tbody tr:hover td { background: var(--bg); }
.ax-t tfoot td { font-weight: 800; border-bottom: 0; border-top: 1.5px solid var(--line); padding-top: 11px; }
.ax-gt tbody tr { cursor: pointer; }
.ax-bc { width: 22%; min-width: 90px; } .ax-bc i { display: block; height: 8px; border-radius: 4px; background: var(--bar, var(--accent)); opacity: .8; }
.ax-more { margin-top: 12px; }
.ax-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
.ax-src { display: grid; align-content: start; gap: 4px; text-align: left; border: 1px solid transparent; font: inherit; color: inherit; cursor: pointer; padding: 16px; transition: border-color .15s, transform .15s; }
.ax-src:hover { border-color: color-mix(in srgb, var(--accent) 40%, transparent); transform: translateY(-1px); }
.ax-src b { font-size: 14.5px; margin-top: 6px; } .ax-src small { font-size: 12px; color: var(--muted); line-height: 1.35; }
.ax-sn { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--line); }
.ax-sn em { font-style: normal; font-size: 12px; color: var(--muted); } .ax-sn strong { font-size: 14px; font-variant-numeric: tabular-nums; }
.ax-si { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; background: var(--accent-soft); color: var(--accent); flex: none; }
.ax-si.sm { width: 34px; height: 34px; }
.ax-hits { display: grid; gap: 2px; }
.ax-hit { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; align-items: center; gap: 12px; padding: 10px 8px; border: 0; border-bottom: 1px solid var(--line); background: transparent; font: inherit; color: inherit; text-align: left; cursor: pointer; border-radius: 0; }
.ax-hit:last-child { border-bottom: 0; } .ax-hit:hover { background: var(--bg); }
.ax-hi { width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; background: var(--accent-soft); color: var(--accent); }
.ax-hm { display: grid; min-width: 0; } .ax-hm b { font-size: 14px; } .ax-hm small { font-size: 12px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ax-hn { display: grid; justify-items: end; } .ax-hn b { font-size: 14px; } .ax-hn small { font-size: 11.5px; color: var(--muted); font-variant-numeric: tabular-nums; }
#an-body .ax-go { color: var(--muted); }
@media (max-width: 899px) {
  .ax-top { padding: 14px; }
  .ax-tt { flex-wrap: wrap; } .ax-ex { width: 100%; } .ax-ex .btn { flex: 1; justify-content: center; height: 38px; }
  .ax-gr { margin-left: 0; width: 100%; justify-content: space-between; } .ax-gr select { flex: 1; max-width: 60%; }
  .ax-per { flex: 1 1 100%; } .ax-per select { width: 100%; } .ax-tg { flex: 1; justify-content: center; }
  .ax-tg { height: 36px; }
  .ax-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .ax-k b { font-size: 17px; }
  .ax-grid { grid-template-columns: 1fr 1fr; gap: 8px; } .ax-src { padding: 14px; } .ax-src small { display: none; }
  .ax-sn { flex-direction: column; gap: 2px; }
  .ax-hit { grid-template-columns: auto minmax(0, 1fr) auto; } #an-body .ax-go { display: none; }
}
#an-body .ax-bar select, #an-body .ax-bar input[type=date], #an-body .ax-bar .btn { height: 38px; min-height: 38px; padding-top: 0; padding-bottom: 0; border-radius: 10px; font-size: 13.5px; box-sizing: border-box; }
#an-body .ax-bar select { padding: 0 30px 0 12px; }
#an-body .ax-pan select, #an-body .ax-pan input { height: 36px; min-height: 36px; padding-top: 0; padding-bottom: 0; box-sizing: border-box; }
.ax-ml { display: none; }
@media (max-width: 899px) {
  .ax-dc .ax-tw { display: none; } .ax-ml { display: grid; }
  .ax-mr { display: grid; gap: 3px; padding: 11px 0; border: 0; border-bottom: 1px solid var(--line); background: transparent; font: inherit; color: inherit; text-align: left; width: 100%; } button.ax-mr { cursor: pointer; } .ax-mr:last-child { border-bottom: 0; }
  .ax-mt { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; } .ax-mt b { font-size: 14px; font-weight: 600; min-width: 0; } .ax-mt strong { font-size: 14px; white-space: nowrap; font-variant-numeric: tabular-nums; }
  .ax-mr small { font-size: 12px; color: var(--muted); line-height: 1.4; }
  .ax-gt .ax-bc { display: none; }
}

/* v122: tutto collegato — destinatario del preventivo, schede con documenti collegati */
.pv-dest { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 2px 0 12px; }
.pv-dest > span { font-size: 12px; font-weight: 600; color: var(--muted); }
.pv-dest small { font-size: 12px; }
.pv-dseg { display: inline-flex; padding: 3px; gap: 2px; border-radius: 10px; background: var(--bg); border: 1px solid var(--line); }
.pv-dseg button { border: 0; background: transparent; font: inherit; font-size: 13px; font-weight: 600; color: var(--ink-2); padding: 6px 14px; border-radius: 8px; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.pv-dseg button.on { background: var(--surface); color: var(--ink); box-shadow: 0 1px 2px rgba(0,0,0,.08), 0 1px 6px rgba(0,0,0,.05); }
.pv-dseg button em { font-style: normal; font-size: 11px; font-weight: 700; color: var(--muted); background: var(--bg); border-radius: 8px; padding: 1px 6px; }
.pv-dseg button.on em { background: var(--accent-soft); color: var(--accent); }
.pv-ana { display: inline-flex; align-items: center; gap: 6px; }
.pv-ana svg, .lk-box svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.pv-clinote { margin: -4px 0 12px; }
.lk-box { margin-top: 8px; padding: 14px; border-radius: 14px; background: var(--bg); border: 1px solid var(--line); display: grid; gap: 10px; }
.lk-h { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; } .lk-h b { font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); } .lk-h span { font-size: 12px; color: var(--muted); }
.lk-l { display: grid; border-radius: 10px; background: var(--surface); border: 1px solid var(--line); overflow: hidden; }
.lk-r { display: grid; grid-template-columns: 92px minmax(0, 1fr) auto 96px; gap: 10px; align-items: center; padding: 9px 12px; border: 0; border-bottom: 1px solid var(--line); background: transparent; font: inherit; color: inherit; text-align: left; cursor: pointer; }
.lk-r:last-child { border-bottom: 0; } .lk-r:hover { background: var(--accent-soft); }
.lk-t { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }
.lk-n { display: grid; min-width: 0; } .lk-n b { font-size: 13.5px; } .lk-n small { font-size: 11.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lk-v { text-align: right; font-size: 13.5px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.lk-more { font-size: 12px; color: var(--muted); }
.lk-a { display: flex; flex-wrap: wrap; gap: 8px; } .lk-a .btn { display: inline-flex; align-items: center; gap: 6px; text-decoration: none; }
.ax-lnk { all: unset; cursor: pointer; color: var(--accent); font-weight: 600; } .ax-lnk:hover { text-decoration: underline; }
@media (max-width: 640px) { .lk-r { grid-template-columns: minmax(0, 1fr) auto; } .lk-t { grid-column: 1 / -1; } .lk-r .chip { display: none; } }
.pv-ftag { font-style: normal; font-size: 10px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--warn); background: var(--warn-soft); border-radius: 6px; padding: 2px 6px; margin-right: 7px; vertical-align: 2px; }

/* v123: Dashboard — barra del periodo staccata dal contenuto, cifra principale sempre su una riga */
#v-home { gap: 16px; }
#v-home > .gl-bar { padding: 0; }
#v-home .gl-month { box-shadow: var(--shadow); border-color: transparent; padding: 4px; }
#v-home .gl-month select { padding-left: 12px; }
.db-hero .gh-big { white-space: nowrap; font-size: clamp(36px, 4.1vw, 60px); }
@media (min-width: 980px) { .db-top { grid-template-columns: minmax(0, 1fr) minmax(340px, .9fr); } }
@media (max-width: 899px) { #v-home { gap: 12px; } #v-home .gl-month { display: flex; width: 100%; } #v-home .gl-month select { flex: 1; text-align: center; text-align-last: center; } .db-hero .gh-big { font-size: clamp(34px, 10vw, 46px); } }

/* v124: preventivo di sola stampa sui capi del cliente */
.pv-empty2 { display: grid; justify-items: center; gap: 12px; padding: 22px 0 10px; }
.pv-empty2 .btn, .pv-solo .btn { display: inline-flex; align-items: center; gap: 7px; }
.pv-empty2 svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.pv-sof { display: grid; gap: 12px; grid-template-columns: 200px minmax(0, 1fr); }
@media (max-width: 640px) { .pv-sof { grid-template-columns: 1fr; } }
.pv-spos { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0 0 14px; } .pv-spos > span { font-size: 12px; font-weight: 600; color: var(--muted); }
@media (max-width: 640px) { .pv-spos .pv-dseg { width: 100%; } .pv-spos .pv-dseg button { flex: 1; padding: 7px 6px; } }

/* ===== v127: Dipendenti e presenze (dipendenti.js, prefisso dp-) ===== */
#dp-body { display: grid; gap: 14px; }
#dp-body svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; flex: none; }
#dp-body .btn svg { width: 15px; height: 15px; margin-right: 5px; vertical-align: -3px; }
.dp-bar { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.dp-act { display: flex; gap: 8px; flex-wrap: wrap; }
#dp-body .seg.dp-tabs, #dp-body .seg.dp-fs, .seg.dp-p3 { display: inline-flex; grid-template-columns: none; width: auto; max-width: 100%; overflow-x: auto; scrollbar-width: none; }
#dp-body .seg.dp-tabs button, #dp-body .seg.dp-fs button { height: 34px; padding: 0 14px; white-space: nowrap; display: inline-flex; align-items: center; gap: 6px; }
.dp-tabs button em { font-style: normal; font-size: 11px; font-weight: 800; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; display: inline-grid; place-items: center; background: var(--danger); color: #fff; }
.dp-tabs button.on em { background: #fff; color: var(--accent); }
.dp-kpis { display: grid; gap: 12px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.dp-k { display: grid; gap: 3px; padding: 14px 16px; text-align: left; font: inherit; color: inherit; border: 1px solid transparent; }
button.dp-k { cursor: pointer; transition: border-color .15s, transform .15s; } button.dp-k:hover { border-color: color-mix(in srgb, var(--accent) 35%, transparent); transform: translateY(-1px); }
.dp-k span { font-size: 12px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dp-k b { font-size: 22px; font-weight: 800; font-variant-numeric: tabular-nums; letter-spacing: -.01em; }
.dp-k b em { font-style: normal; font-size: 13px; font-weight: 600; color: var(--muted); }
.dp-k small { font-size: 11.5px; color: var(--muted); }
.dp-k.warn b { color: var(--warn); }
.dp-empty { display: grid; justify-items: center; text-align: center; gap: 8px; padding: 40px 20px; }
.dp-empty h3 { margin: 4px 0 0; } .dp-empty p { margin: 0 0 8px; max-width: 460px; color: var(--muted); font-size: 13.5px; }
#dp-body .dp-ei { width: 44px; height: 44px; color: var(--accent); stroke-width: 1.5; }
.dp-list { padding-top: 12px; }
.dp-lh { display: flex; gap: 10px; align-items: center; justify-content: space-between; flex-wrap: wrap; margin-bottom: 10px; }
.dp-sb { position: relative; flex: 1 1 260px; max-width: 420px; }
#dp-body .dp-sb svg { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); color: var(--muted); }
.dp-sb input { width: 100%; padding-left: 36px; }
.dp-tw { overflow-x: auto; margin: 0 -16px; padding: 0 16px; }
.dp-t { width: 100%; border-collapse: collapse; font-size: 13px; font-variant-numeric: tabular-nums; }
.dp-t th { text-align: left; font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); padding: 0 10px 9px; border-bottom: 1px solid var(--line); white-space: nowrap; background: var(--surface); }
.dp-t td { padding: 9px 10px; border-bottom: 1px solid var(--line); white-space: nowrap; vertical-align: middle; }
.dp-t tbody tr:last-child td { border-bottom: 0; }
.dp-t .r { text-align: right; }
.dp-t tbody tr[data-dp] { cursor: pointer; } .dp-t tbody tr[data-dp]:hover td { background: var(--bg); }
.dp-t td.dp-go { width: 1%; text-align: right; color: var(--muted); }
.dp-who { display: flex; align-items: center; gap: 10px; min-width: 0; }
.dp-who > span:last-child { display: grid; min-width: 0; } .dp-who b { font-weight: 650; } .dp-who small { font-size: 11.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 340px; }
.dp-av { --c: var(--accent); width: 36px; height: 36px; border-radius: 50%; display: inline-grid; place-items: center; flex: none; font-size: 13px; font-weight: 800; color: var(--c); background: color-mix(in srgb, var(--c) 14%, var(--surface)); border: 1px solid color-mix(in srgb, var(--c) 25%, transparent); }
.dp-av.sm { width: 30px; height: 30px; font-size: 11.5px; }
.dp-av.lg { width: 58px; height: 58px; font-size: 20px; }
#dp-body .dp-av.lg svg { width: 24px; height: 24px; }
.dp-c2 { display: grid; } .dp-c2 small { font-size: 11.5px; color: var(--muted); }
.dp-warn { display: inline-flex; margin-left: 6px; color: var(--warn); vertical-align: middle; }
.chip.ass { background: color-mix(in srgb, #8b5cf6 13%, transparent); color: #7c4ddb; }
#dp-body .chip svg { width: 12px; height: 12px; margin-right: 4px; vertical-align: -2px; }
.dp-an { font-style: normal; color: var(--danger); font-weight: 600; }
.dp-neg { color: var(--danger); }
/* presenze */
.dp-pc { padding-top: 12px; }
.dp-ph { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.dp-nav { display: flex; align-items: center; gap: 6px; flex: 1; min-width: 0; }
.dp-nav b { font-size: 14.5px; min-width: 150px; text-align: center; white-space: nowrap; }
.dp-nav .icon-btn { font-size: 20px; line-height: 1; width: 34px; height: 34px; } .dp-nav .icon-btn:disabled { opacity: .3; cursor: default; }
.dp-ex { display: flex; gap: 8px; }
.dp-day td.dp-axc, .dp-day th.dp-axh { width: 38%; min-width: 260px; }
.dp-ax { position: relative; height: 14px; }
.dp-ax span { position: absolute; transform: translateX(-50%); font-size: 10px; letter-spacing: 0; }
.dp-bar2 { position: relative; height: 12px; border-radius: 6px; background: repeating-linear-gradient(90deg, var(--bg) 0 calc(12.5% - 1px), var(--line) calc(12.5% - 1px) 12.5%); }
.dp-bar2 i { position: absolute; top: 0; bottom: 0; border-radius: 6px; background: var(--accent); }
.dp-bar2 i.open { background: linear-gradient(90deg, var(--accent), color-mix(in srgb, var(--accent) 35%, transparent)); }
.dp-bar2.abs { background: color-mix(in srgb, #8b5cf6 12%, transparent); display: grid; place-items: center; height: 18px; }
.dp-bar2.abs span { font-size: 10.5px; font-weight: 700; color: #7c4ddb; }
.dp-note { margin: 10px 0 0; }
.dp-mw { max-height: 70vh; }
.dp-mon { font-size: 12px; }
.dp-mon th.c, .dp-mon td.c { text-align: center; padding: 6px 2px; min-width: 30px; }
.dp-mon th.c span { display: block; font-size: 9.5px; opacity: .7; }
.dp-mon th { position: sticky; top: 0; z-index: 1; }
.dp-mon .we { background: color-mix(in srgb, var(--bg) 70%, var(--line)); }
.dp-mon th.td, .dp-mon td.td { box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--accent) 45%, transparent); }
.dp-mon td.c b { font-weight: 650; }
.dp-mon td.an { background: var(--danger-soft); }
.dp-mon td.ed { cursor: pointer; } .dp-mon td.ed:hover { background: var(--accent-soft); }
.dp-stk { position: sticky; left: 0; z-index: 2; background: var(--surface); min-width: 170px; box-shadow: 1px 0 0 var(--line); }
.dp-mon thead .dp-stk { z-index: 3; }
.dp-al { font-style: normal; font-weight: 800; font-size: 11px; display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: 6px; }
.dp-al.ferie { background: color-mix(in srgb, #0e9fb4 16%, transparent); color: #0b7d8e; }
.dp-al.permesso { background: var(--warn-soft); color: var(--warn); }
.dp-al.malattia { background: color-mix(in srgb, #8b5cf6 15%, transparent); color: #7c4ddb; }
.dp-al.altro { background: var(--bg); color: var(--muted); }
.dp-al.an { background: var(--danger-soft); color: var(--danger); }
.dp-leg { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 12px; font-size: 12px; color: var(--muted); }
.dp-leg span { display: inline-flex; align-items: center; gap: 6px; }
/* richieste */
.dp-two { display: grid; gap: 14px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dp-req { display: flex; align-items: center; gap: 10px; padding: 11px 0; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.dp-req:last-child { border-bottom: 0; }
.dp-rq { display: grid; flex: 1; min-width: 180px; } .dp-rq b { font-weight: 650; font-size: 13.5px; } .dp-rq small { font-size: 12px; color: var(--muted); }
.dp-ra { display: flex; gap: 6px; }
#dp-body .dp-ok { background: var(--accent); color: var(--accent-ink); border-color: transparent; }
.dp-sc { display: flex; align-items: center; gap: 10px; width: 100%; padding: 11px 4px; border: 0; border-bottom: 1px solid var(--line); background: none; font: inherit; color: inherit; text-align: left; cursor: pointer; }
.dp-sc:last-child { border-bottom: 0; } .dp-sc:hover { background: var(--bg); }
#dp-body .dp-gi { color: var(--muted); }
/* scheda */
.dp-dh { display: flex; }
.dp-hero { display: flex; align-items: center; gap: 16px; padding: 18px 20px; flex-wrap: wrap; }
.dp-ht { flex: 1; min-width: 200px; } .dp-ht h2 { margin: 0; font-size: 21px; letter-spacing: -.01em; } .dp-ht p { margin: 2px 0 0; color: var(--muted); font-size: 13.5px; }
.dp-hc { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; }
.dp-dt { margin-top: -2px; }
.dp-tl { display: grid; gap: 0; position: relative; padding-left: 18px; }
.dp-tl::before { content: ''; position: absolute; left: 5px; top: 8px; bottom: 8px; width: 2px; background: var(--line); }
.dp-tli { display: flex; gap: 12px; align-items: baseline; padding: 6px 0; position: relative; }
.dp-tli::before { content: ''; position: absolute; left: -17px; top: 11px; width: 10px; height: 10px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 3px var(--surface); }
.dp-tli.pausa::before { background: var(--warn); } .dp-tli.out::before { background: var(--ink-2); }
.dp-tli b { font-variant-numeric: tabular-nums; min-width: 44px; } .dp-tli em { font-style: normal; font-size: 11px; color: var(--muted); }
.dp-tot { margin: 8px 0 0; padding-top: 10px; border-top: 1px solid var(--line); font-size: 13px; color: var(--muted); } .dp-tot b { color: var(--ink); font-size: 15px; }
.dp-sr { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 9px 0; border-bottom: 1px solid var(--line); }
.dp-sr:last-child { border-bottom: 0; } .dp-sr span:first-child { display: grid; font-weight: 600; font-size: 13.5px; } .dp-sr small { font-weight: 400; color: var(--muted); font-size: 12px; }
.dp-kv { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 16px; }
.dp-kv div { display: grid; min-width: 0; } .dp-kv span { font-size: 11.5px; color: var(--muted); } .dp-kv b { font-weight: 600; font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; }
.dp-kv a { color: var(--accent); text-decoration: none; }
.dp-link { display: flex; align-items: center; gap: 10px; width: 100%; margin-top: 14px; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--line); background: var(--bg); font: inherit; color: inherit; cursor: pointer; text-align: left; }
.dp-link span { flex: 1; font-size: 13px; } .dp-link:hover { border-color: color-mix(in srgb, var(--accent) 40%, transparent); }
.dp-form { padding: 18px 20px; }
.dp-form h4, .dp-acc h4 { margin: 18px 0 10px; font-size: 11.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.dp-form h4:first-child { margin-top: 0; }
.dp-g { display: grid; gap: 0 14px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.dp-g .dp-w2 { grid-column: span 2; }
.dp-g textarea { width: 100%; resize: vertical; }
.dp-fa { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--line); }
.dp-fa > span { flex: 1; }
.dp-days { display: grid; }
.dp-dr { display: flex; align-items: center; gap: 12px; padding: 8px 4px; border-bottom: 1px solid var(--line); }
.dp-dr:last-child { border-bottom: 0; } .dp-dr.we { opacity: .6; } .dp-dr.an { background: var(--danger-soft); border-radius: 8px; }
.dp-dd { display: grid; justify-items: center; width: 38px; font-size: 11px; color: var(--muted); text-transform: uppercase; } .dp-dd b { font-size: 16px; color: var(--ink); }
.dp-dl { flex: 1; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; min-width: 0; }
.dp-pu { font-size: 12px; padding: 3px 8px; border-radius: 7px; background: var(--accent-soft); color: var(--accent); font-variant-numeric: tabular-nums; font-weight: 600; }
.dp-pu.pausa { background: var(--warn-soft); color: var(--warn); } .dp-pu.out { background: var(--bg); color: var(--ink-2); border: 1px solid var(--line); }
.dp-dh2 { font-variant-numeric: tabular-nums; min-width: 44px; text-align: right; }
/* accesso */
.dp-acc { padding: 18px 20px; }
.dp-kind { display: grid; gap: 8px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dp-ko { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border: 1.5px solid var(--line); border-radius: 12px; cursor: pointer; transition: border-color .15s, background .15s; }
.dp-ko input { margin-top: 3px; accent-color: var(--accent); }
.dp-ko span { display: grid; gap: 2px; } .dp-ko b { font-size: 13.5px; } .dp-ko small { font-size: 12px; color: var(--muted); line-height: 1.35; }
.dp-ko.on { border-color: var(--accent); background: var(--accent-soft); }
.dp-pm { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 20px; }
.dp-pr { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 7px 0; border-bottom: 1px solid var(--line); }
.dp-pr > span { font-size: 13.5px; font-weight: 550; }
.seg.dp-p3 { padding: 3px; gap: 2px; border-radius: 10px; }
.seg.dp-p3 button { height: 28px; padding: 0 10px; font-size: 12px; border-radius: 7px; }
.seg.dp-p3 button[data-pv=""].on { background: var(--bg); color: var(--ink); box-shadow: inset 0 0 0 1px var(--line); }
.seg.dp-p3 button[data-pv="r"].on { background: color-mix(in srgb, var(--accent) 18%, var(--surface)); color: var(--accent); box-shadow: none; }
.dp-chk { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; cursor: pointer; }
.dp-chk input { width: 16px; height: 16px; accent-color: var(--accent); }
.dp-chkb { align-items: flex-start; padding: 12px; border: 1px solid var(--line); border-radius: 12px; margin-bottom: 12px; }
.dp-chkb span { display: grid; gap: 2px; } .dp-chkb small { color: var(--muted); font-size: 12px; }
.dp-cred { display: flex; gap: 16px; padding: 18px 20px; border: 1.5px solid color-mix(in srgb, var(--accent) 40%, transparent); background: linear-gradient(135deg, var(--accent-soft), var(--surface) 70%); }
.dp-credi { width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; background: var(--accent); color: var(--accent-ink); flex: none; }
#dp-body .dp-credi svg { width: 22px; height: 22px; }
.dp-cred h3 { margin: 0 0 4px; } .dp-cred p { margin: 0 0 12px; font-size: 13px; color: var(--ink-2); }
.dp-cr { display: flex; align-items: center; gap: 10px; padding: 8px 12px; border-radius: 10px; background: var(--surface); border: 1px solid var(--line); margin-bottom: 6px; max-width: 460px; }
.dp-cr span { font-size: 12px; color: var(--muted); width: 70px; } .dp-cr b { flex: 1; font-size: 15px; letter-spacing: .02em; word-break: break-all; }
.dp-cr .mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.dp-cra { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.dp-pzl { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 10px 12px; border-radius: 10px; background: var(--bg); border: 1px solid var(--line); }
.dp-pzl span { font-size: 12px; color: var(--muted); } .dp-pzl b { flex: 1; min-width: 160px; font-size: 13px; word-break: break-all; }
.dp-pzl svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.9; margin-right: 4px; vertical-align: -2px; }
/* correzione timbrature (nel foglio) */
.dp-fxl { display: grid; gap: 8px; }
.dp-fx { display: grid; grid-template-columns: 130px 140px minmax(0, 1fr) 34px; gap: 8px; align-items: center; }
.dp-fx small { grid-column: 1 / -1; margin-top: -4px; font-size: 11px; color: var(--muted); }
.dp-fx svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; }
.dp-fxa { display: flex; gap: 8px; margin-top: 12px; flex-wrap: wrap; }
.dp-fxa svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; margin-right: 4px; vertical-align: -2px; }
.dp-hm { display: inline; }
/* dipendente con accesso limitato: niente impostazioni dell'azienda, sezioni in sola visione senza pulsanti di modifica */
body.dip-noset #st-set, body.dip-noset #st-doc, body.dip-noset #st-srv, body.dip-noset #st-gen, body.dip-noset #st-dati, body.dip-noset #st-cdc, body.dip-noset #st-bud, body.dip-noset #st-ai,
body.dip-noset [data-st-go="st-set"], body.dip-noset [data-st-go="st-doc"], body.dip-noset [data-st-go="st-srv"], body.dip-noset [data-st-go="st-gen"], body.dip-noset [data-st-go="st-dati"], body.dip-noset [data-st-go="st-cdc"], body.dip-noset [data-st-go="st-bud"], body.dip-noset [data-st-go="st-ai"] { display: none !important; }
body.view-ro #fab, body.view-ro #add-top { display: none !important; }
@media (max-width: 1100px) { .dp-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } .dp-g { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) {
  .dp-two, .dp-kind, .dp-pm { grid-template-columns: minmax(0, 1fr); }
  .dp-k b { font-size: 19px; }
  .dp-hm { display: none; }
  .dp-bar { align-items: stretch; } .dp-act { width: 100%; } .dp-act .btn { flex: 1; justify-content: center; }
  .dp-kv { grid-template-columns: minmax(0, 1fr); }
  .dp-g { grid-template-columns: minmax(0, 1fr); } .dp-g .dp-w2 { grid-column: auto; }
  .dp-fx { grid-template-columns: 1fr 1fr 34px; } .dp-fx input[name^="n"] { grid-column: 1 / 3; grid-row: 2; }
  .dp-hero { padding: 16px; } .dp-ha { width: 100%; } .dp-ha .btn { width: 100%; }
  .dp-cred { flex-direction: column; }
  .dp-nav b { min-width: 0; flex: 1; font-size: 13.5px; }
}
.dp-mon td.dp-mt, .dp-mon th.dp-mt { padding: 6px 8px; background: color-mix(in srgb, var(--accent-soft) 45%, var(--surface)); }
.dp-mon th.dp-mt2, .dp-mon td.dp-mt2 { box-shadow: inset -1px 0 0 var(--line); }
.dp-mon .dp-stk { min-width: 150px; }
#dp-body { grid-template-columns: minmax(0, 1fr); } #dp-body > *, .dp-two > *, .dp-kpis > * { min-width: 0; }
@media (max-width: 760px) {
  .dp-pt th:nth-child(2), .dp-pt td:nth-child(2), .dp-pt th:nth-child(3), .dp-pt td:nth-child(3), .dp-pt th:nth-child(5), .dp-pt td:nth-child(5), .dp-pt th:nth-child(6), .dp-pt td:nth-child(6) { display: none; }
  .dp-pt td { white-space: normal; } .dp-who small { max-width: 52vw; }
  .dp-sb { max-width: none; flex-basis: 100%; }
  .dp-bar > .dp-tabs { width: 100%; }
}
.dp-ko input[type=radio], .dp-chk input[type=checkbox] { width: 18px !important; height: 18px !important; min-height: 0 !important; min-width: 18px; padding: 0 !important; margin: 2px 0 0 !important; flex: none; box-shadow: none; }
@media (max-width: 760px) { .dp-day th:nth-child(4), .dp-day td:nth-child(4), .dp-day .dp-axh, .dp-day .dp-axc { display: none; } .dp-day td { white-space: normal; } }
/* v130: eliminazione dipendenti */
#sheet-ok.dp-danger { background: var(--danger); border-color: var(--danger); color: #fff; }
#dp-body .dp-del { color: var(--danger); }
.dp-ha { display: flex; gap: 8px; flex-wrap: wrap; }
.dp-rdel { display: inline-grid; place-items: center; width: 30px; height: 30px; margin-right: 4px; border: 0; border-radius: 8px; background: none; color: var(--muted); cursor: pointer; opacity: 0; transition: opacity .15s, background .15s, color .15s; vertical-align: middle; }
.dp-t tbody tr:hover .dp-rdel, .dp-rdel:focus-visible { opacity: 1; }
.dp-rdel:hover { background: var(--danger-soft); color: var(--danger); }
#dp-body .dp-rdel svg { width: 15px; height: 15px; }
@media (hover: none) { .dp-rdel { opacity: .7; } }
#sheet-body .dp-pzl b { font-weight: 500; font-size: 12.5px; color: var(--ink-2); }
.dp-alt { display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: 12px; background: var(--bg); border: 1px solid var(--line); }
.dp-alt div { flex: 1; display: grid; gap: 2px; } .dp-alt b { font-size: 13.5px; } .dp-alt small { font-size: 12px; color: var(--muted); }

/* v132: Dashboard «ferma» mostrata all'apertura mentre si leggono i dati */
#v-snap, #v-snap * { animation: none !important; transition: none !important; }

/* v136: selezione multipla nel magazzino */
.mg-bar { flex-wrap: wrap; }
.mg-acts { display: flex; flex-wrap: wrap; gap: 8px; }
.gx-tbl tr.mg-on { background: var(--accent-soft); }
.mg-ck { width: 18px; height: 18px; margin: 0 10px 0 0; vertical-align: middle; accent-color: var(--accent); cursor: pointer; }

/* v139: prodotti arrivati con DDT e fatture dei fornitori */
.acq { display: grid; gap: 10px; margin-top: 4px; padding-top: 12px; border-top: 1px solid var(--line); }
.acq-h { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.acq-r { display: grid; grid-template-columns: minmax(0, 1fr) 76px 92px 32px; gap: 6px; align-items: center; margin-bottom: 8px; }
.acq-r input { min-width: 0; }
.acq-s { grid-column: 1 / -1; margin-top: -2px; font-size: 12px; color: var(--muted); }
.acq-s em { font-style: normal; color: var(--accent); }
.acq-a { display: flex; gap: 8px; flex-wrap: wrap; }
.acq-a svg { width: 15px; height: 15px; }

/* v141: Acquisti — DDT e fatture collegati */
#m-mode { margin: 0 0 12px; }
.acq-tbl .acq-dn { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; margin-right: 8px; }
.acq-clip { width: 14px; height: 14px; fill: none; stroke: var(--muted); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.acq-ch { display: grid; gap: 10px; }
.acq-ch .btn { justify-content: center; padding: 14px; }
.lnk > div { display: grid; gap: 8px; margin-top: 6px; }
.lnk-ok, .lnk-no { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; }
.lnk-ok { border-color: color-mix(in srgb, var(--accent) 35%, var(--line)); }
.lnk-t { display: grid; flex: 1; min-width: 140px; } .lnk-t small { color: var(--muted); font-size: 12px; }
.lnk-no select { flex: 1; min-width: 180px; }
.lnk-l { display: grid; gap: 8px; }
.lnk-r { display: grid; grid-template-columns: 1fr auto; gap: 8px; align-items: center; }

/* v147: movimenti nella scheda articolo */
.am-h { display: flex; justify-content: space-between; align-items: baseline; margin: 18px 0 6px; font-size: 13px; }
.am-list { max-height: 260px; overflow: auto; border: 1px solid var(--line); border-radius: 10px; }
.am-r { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 9px 12px; border-bottom: 1px solid var(--line); font-size: 13.5px; }
.am-r:last-child { border-bottom: 0; }
.am-r small { display: block; margin-top: 2px; font-size: 12px; color: var(--muted); }
.am-r > b { white-space: nowrap; }

/* v148: prodotto senza foto — simbolo al posto del riquadro grigio */
.pv-img:not(.has):not(.sm), .pv-card .pv-img:not(.has) { background: radial-gradient(circle at 30% 20%, #fff, color-mix(in srgb, var(--accent) 9%, #fff)); border: 1px solid color-mix(in srgb, var(--accent) 14%, var(--line)); }
.pv-img b.ph { display: grid; place-items: center; width: 42%; max-width: 64px; aspect-ratio: 1; font-size: 0; color: color-mix(in srgb, var(--accent) 60%, var(--muted)); opacity: .9; }
.pv-img b.ph svg { width: 100%; height: 100%; display: block; }
.pv-img.big b.ph { max-width: 84px; }

/* v151: converti il preventivo */
.pv-qa { display: flex; justify-content: flex-end; min-width: 0; }
.pv-cv { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 12px 0 14px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); color: var(--text, inherit); font: inherit; font-size: 13px; font-weight: 600; letter-spacing: .005em; white-space: nowrap; cursor: pointer; transition: border-color .15s, background .15s, color .15s; }
.pv-cv svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; opacity: .55; }
.pv-cv:hover { border-color: var(--accent); color: var(--accent); background: color-mix(in srgb, var(--accent) 6%, var(--surface)); }
.pv-cv:hover svg { opacity: 1; }
.pv-cv:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.pv-cmw { display: grid; gap: 10px; }
.pv-cvb { display: grid; gap: 2px; text-align: left; padding: 14px 16px; height: auto; justify-content: stretch; white-space: normal; }
.pv-cvb small { font-weight: 400; color: var(--muted); font-size: 12.5px; }

/* v152: Magazzino e Servizi nei preventivi (senza foto) */
.pvl-ic { flex: none; display: grid; place-items: center; width: 56px; height: 56px; border-radius: 16px; background: color-mix(in srgb, var(--accent) 10%, var(--surface)); color: var(--accent); }
.pvl-ic svg { width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.pvl-cats { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)) !important; gap: 10px; }
.pv-cat.pvl-cat { grid-template-rows: none; grid-template-columns: 40px minmax(0, 1fr); align-items: center; gap: 12px; padding: 14px 40px 14px 14px; border-radius: 14px; }
.pv-cat.pvl-cat:hover { transform: translateY(-2px); }
.pvl-cat .pv-cat-t { padding: 0; }
.pvl-cat .pv-cat-go { bottom: auto; top: 50%; margin-top: -9px; }
.pvl-ci { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 11px; background: color-mix(in srgb, var(--accent) 10%, var(--surface)); color: var(--accent); font-weight: 800; font-size: 16px; }
.pvl-list { display: grid; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); overflow: hidden; }
.pvl-r { display: grid; grid-template-columns: minmax(0, 1fr) 190px 130px; gap: 16px; align-items: center; padding: 13px 18px; border: 0; border-bottom: 1px solid var(--line); background: transparent; font: inherit; color: inherit; text-align: left; cursor: pointer; transition: background .15s; }
.pvl-r:last-child { border-bottom: 0; }
.pvl-r:hover { background: var(--bg); }
.cc-anim .pvl-r { animation: rise .4s var(--d) var(--out) both; }
.pvl-n { display: grid; gap: 2px; min-width: 0; }
.pvl-n b { font-size: 14.5px; font-weight: 650; letter-spacing: -.01em; }
.pvl-n small { font-size: 12px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pvl-p { display: grid; gap: 1px; justify-items: end; text-align: right; }
.pvl-p strong { font-size: 15.5px; font-variant-numeric: tabular-nums; }
.pvl-p small { font-size: 11.5px; color: var(--muted); font-variant-numeric: tabular-nums; }
.pvl-u { font-size: 12.5px; color: var(--muted); }
.pvl-st { display: inline-flex; align-items: center; gap: 7px; font-size: 12.5px; font-weight: 600; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.pvl-st i { width: 8px; height: 8px; border-radius: 50%; background: #22a06b; flex: none; }
.pvl-st.low i { background: #e6a23c; }
.pvl-st.out { color: var(--muted); } .pvl-st.out i { background: #d64545; }
.pvl-stw { margin: 0 0 10px; }
.pvl-hd .pv-hi { padding-right: 0; }
@media (min-width: 1000px) { .pv-hd.pvl-hd { grid-template-columns: minmax(0, 1fr) 280px; } }
@media (max-width: 700px) {
  .pvl-r { grid-template-columns: minmax(0, 1fr) auto; gap: 4px 12px; padding: 13px 14px; }
  .pvl-n { grid-column: 1; grid-row: 1; } .pvl-p { grid-column: 2; grid-row: 1 / span 2; align-self: start; }
  .pvl-s { grid-column: 1; grid-row: 2; }
  .pvl-cats { grid-template-columns: 1fr !important; }
}

/* v155: dashboard a blocchi */
.dsh { display: grid; gap: 12px; grid-template-columns: minmax(0, 1fr); }
.dsh-b { min-width: 0; display: grid; }
.dsh-b > .card, .dsh-b > .db-side { align-self: stretch; }
.dsh-b.dsh-top { align-self: start; }
@media (min-width: 900px) { .dsh { gap: 16px; } }
@media (min-width: 1020px) { .dsh { grid-template-columns: repeat(12, minmax(0, 1fr)); } .dsh-b { grid-column: span var(--sp, 12); } }
.dsh-btn { display: inline-flex; align-items: center; gap: 7px; height: 36px; padding: 0 14px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); color: inherit; font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; transition: border-color .15s, color .15s; }
.dsh-btn svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.dsh-btn:hover { border-color: var(--accent); color: var(--accent); }
.dsh-list { display: grid; }
.dsh-r { display: flex; align-items: center; gap: 8px; border-top: 1px solid var(--line); }
.dsh-r:first-child { border-top: 0; }
.dsh-r .sw { flex: 1; min-width: 0; border-top: 0 !important; padding: 10px 0 !important; }
.dsh-mv { display: flex; gap: 2px; flex: none; }
.dsh-mv .icon-btn svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.dsh-adm { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--line); }
.dsh-adm .sw { border-top: 0; padding: 0; }

/* v156: interruttore Netto / +IVA — movimento */
.iva-tg { --ring: color-mix(in srgb, var(--ink) 40%, transparent); }
.iva-tg.on { --ring: color-mix(in srgb, var(--accent) 50%, transparent); }
.iva-tg i { transition: transform .5s var(--spring), background .35s ease, box-shadow .35s ease; box-shadow: 0 1px 2px rgba(0,0,0,.12); }
.iva-tg.on i { box-shadow: 0 3px 10px -2px color-mix(in srgb, var(--accent) 55%, transparent); }
.iva-tg i::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0; }
.iva-tg span { transition: color .3s ease, opacity .3s ease; }
.iva-tg:not(.on) span:nth-child(2), .iva-tg.on span:first-child { opacity: .75; }
.iva-tg.pop i { animation: ivaStretch .6s cubic-bezier(.3, .7, .2, 1); }
.iva-tg.pop i::after { animation: ivaRing .65s ease-out; }
.iva-tg.pop span { animation: ivaLbl .5s cubic-bezier(.3, .7, .2, 1) both; }
@keyframes ivaStretch { 0%, 100% { scale: 1 1; } 38% { scale: 1.08 .9; } 70% { scale: .99 1.02; } }
@keyframes ivaRing { 0% { box-shadow: 0 0 0 0 var(--ring); opacity: 1; } 100% { box-shadow: 0 0 0 11px transparent; opacity: 0; } }
@keyframes ivaLbl { 0% { transform: translateY(0); } 35% { transform: translateY(-2px); } 100% { transform: translateY(0); } }
/* gli importi della pagina si riassestano con un leggero scorrimento */
body.iva-anim .view:not([hidden]) :is(.gh-big, .gh-k b, .db-av b, .gx-kpi b, .pv-k b, .pv-qt, .db-mv b, .pl-k b, .in-b, td.r, .db-sr strong, .db-mr b) { animation: ivaNum .55s cubic-bezier(.2, .8, .2, 1) both; }
@keyframes ivaNum { 0% { opacity: .25; transform: translateY(7px); filter: blur(2px); } 100% { opacity: 1; transform: none; filter: none; } }
@media (prefers-reduced-motion: reduce) { .iva-tg.pop i, .iva-tg.pop i::after, .iva-tg.pop span, body.iva-anim .view :is(.gh-big, .gh-k b, td.r) { animation: none !important; } }

/* v157: documenti interni (scarichi non fiscali e trasferimenti) */
.xi-tbl small { display: block; }
.xi-tbl tr.xi-void td { opacity: .5; } .xi-tbl tr.xi-void td:first-child b { text-decoration: line-through; }
.xi-cc { display: grid; gap: 4px; }
.xi-cr { display: grid; grid-template-columns: minmax(90px, 190px) minmax(0, 1fr) 96px; gap: 14px; align-items: center; padding: 6px 0; font-size: 13.5px; }
.xi-cr > span { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.xi-cr > i { display: block; height: 8px; border-radius: 4px; background: var(--bg); overflow: hidden; }
.xi-cr > i b { display: block; height: 100%; border-radius: 4px; background: #0e9aa7; transition: width .6s var(--spring); }
.xi-cr > strong { text-align: right; font-variant-numeric: tabular-nums; }
.xi-dt { display: inline-flex; padding: 3px; gap: 2px; border: 1px solid var(--line); border-radius: 11px; background: var(--surface); margin: 2px 0 12px; }
.xi-dt button { height: 32px; padding: 0 14px; border: 0; border-radius: 8px; background: none; color: var(--muted); font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; transition: background .2s, color .2s; }
.xi-dt button.on { background: var(--ink); color: var(--bg); }
.xi-rows { display: grid; gap: 8px; margin: 12px 0 10px; }
.xi-h, .xi-r { display: grid; grid-template-columns: minmax(0, 1fr) 46px 88px 118px 30px; gap: 10px; align-items: center; }
.xi-h { font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); padding: 0 2px; }
.xi-um { font-size: 12.5px; color: var(--muted); text-align: center; }
.xi-g { font-size: 12.5px; color: var(--muted); font-variant-numeric: tabular-nums; } .xi-g.bad { color: var(--danger, #d92d20); font-weight: 600; }
.xi-rc { grid-template-columns: minmax(0, 1fr) 100px; padding: 8px 0; border-top: 1px solid var(--line); } .xi-rc:first-child { border-top: 0; }
.xi-n { display: grid; min-width: 0; } .xi-n small { color: var(--muted); font-size: 12px; }
.xi-tot { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 6px 18px; margin: 12px 0 14px; padding: 11px 14px; border-radius: 12px; background: var(--bg); font-size: 13.5px; font-variant-numeric: tabular-nums; }
.xi-tot small { color: var(--muted); }
.xi-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px; margin-bottom: 14px; }
.xi-tiles > div { display: grid; gap: 3px; padding: 11px 13px; border: 1px solid var(--line); border-radius: 12px; }
.xi-tiles span { font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); }
.xi-tiles b { font-size: 14px; }
.xi-dtbl .xi-bad { color: var(--danger, #d92d20); font-weight: 700; }
@media (max-width: 639px) {
  .xi-h { display: none; }
  .xi-r:not(.xi-rc) { grid-template-columns: 44px 96px minmax(0, 1fr) 30px; grid-template-areas: "d d d x" "u q g g"; padding: 10px; border: 1px solid var(--line); border-radius: 12px; }
  .xi-r:not(.xi-rc) > input[data-k="d"] { grid-area: d; } .xi-r:not(.xi-rc) > .xi-um { grid-area: u; text-align: left; } .xi-r:not(.xi-rc) > input[data-k="q"] { grid-area: q; } .xi-r:not(.xi-rc) > .xi-g { grid-area: g; } .xi-r:not(.xi-rc) > .dx-x { grid-area: x; }
  .xi-cr { grid-template-columns: minmax(70px, 110px) minmax(0, 1fr) 80px; gap: 10px; }
}
.xi-top { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; }
#xi-body .gx-chips { flex-wrap: wrap; } #xi-body .chip-f { white-space: nowrap; }

/* v163: riquadri dei fornitori tutti uguali + modalità «Personalizza» (ordine e visibilità) */
.pv-gsc { grid-template-columns: 72px minmax(0, 1fr) 18px; height: 84px; box-sizing: border-box; padding: 0 14px; }
.pv-gsc img { width: 72px; height: 44px; object-fit: contain; object-position: center; }
.pv-gsc > span { min-width: 0; }
.pv-gsc b { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.2; }
.pv-brand img { width: calc(100% - 10px); max-width: 100%; height: 28px; object-fit: contain; }
#v-preventivi .pv-brand img { width: 62px !important; height: 30px !important; max-width: 62px; object-fit: contain; }
.pv-sh .pv-sha { display: inline-flex; align-items: center; gap: 14px; }
.pv-gsc.ed { grid-template-columns: 22px 72px minmax(0, 1fr) 36px; gap: 10px; padding: 0 8px 0 6px; cursor: default; border-style: dashed; }
.pv-gsc.ed:hover { transform: none; box-shadow: none; }
.pv-gsc.ed.off { opacity: .45; }
.pv-gsc.ed.off img { filter: grayscale(1); }
.pv-gsc.drag { opacity: .85; border-style: solid; border-color: var(--accent); box-shadow: 0 14px 30px -14px rgba(20, 40, 80, .5); transform: scale(1.02); z-index: 2; }
.pv-grip { display: grid; place-items: center; height: 100%; cursor: grab; touch-action: none; color: var(--muted); }
.pv-grip svg { width: 18px; height: 18px; fill: currentColor; }
.pv-grip:active { cursor: grabbing; }
.pv-eyeb { display: grid; place-items: center; width: 36px; height: 36px; border: 0; background: transparent; border-radius: 10px; cursor: pointer; color: var(--ink-2); padding: 0; }
.pv-eyeb:hover { background: var(--bg); }
.pv-eyeb svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
@media (max-width: 640px) {
  .pv-gsc { height: 112px; padding: 12px; align-content: center; }
  .pv-gsups.ed { grid-template-columns: minmax(0, 1fr); }
  .pv-gsc.ed { height: 64px; grid-template-columns: 22px 72px minmax(0, 1fr) 36px; align-content: normal; padding: 0 8px 0 6px; }
  .pv-gsc.ed img { width: 72px; height: 40px; object-position: center; }
}

/* v172 — «Tutti» sempre agganciato a sinistra nella barra fornitori: da qualsiasi fornitore si torna alla ricerca globale con un tocco, senza scorrere indietro */
#v-preventivi .pv-brand .pv-ball { position: sticky; left: 6px; z-index: 3; background: var(--surface); transition: background .2s, border-color .2s, box-shadow .25s, transform .15s; }
#v-preventivi .pv-brand .pv-ball:hover { background: var(--bg); }
#v-preventivi .pv-brand .pv-ball.on { background: var(--surface); }
#v-preventivi .pv-brand.sc .pv-ball:not(.on) { box-shadow: 10px 0 12px -8px rgba(15, 23, 42, .28); }
#v-preventivi .pv-brand.sc .pv-ball.on { box-shadow: 0 0 0 3px var(--accent-soft), 10px 0 12px -8px rgba(15, 23, 42, .28); }
@media (max-width: 899px) { #v-preventivi .pv-brand .pv-ball { left: 16px; } }

/* v182 — elenco preventivi: intestazione allineata alle colonne delle righe */
.pv-qh span { white-space: nowrap; }
.pv-qr .pv-qt { text-align: right; justify-self: end; }
@media (max-width: 1180px) and (min-width: 641px) { .pv-qr, .pv-qh { grid-template-columns: 92px minmax(0, 1fr) 128px 100px 92px; gap: 12px; } .pv-qh span { overflow: hidden; text-overflow: ellipsis; } .pv-qr .pv-qt { font-size: 14px; } }

/* ===== Fischer — v183 (ordini al fornitore: usa hero, spunta e tabelle di GLS e Torental) ===== */
#v-home { --a-fi: #c8323a; } #v-home .a-fi { --a: var(--a-fi); }
.fi-body { display: grid; gap: 14px; margin-top: 14px; }
.fi-body > * { min-width: 0; }
.fi-pz + .fi-pz { margin-top: 20px; }
.fi-ph { display: flex; justify-content: space-between; align-items: baseline; gap: 4px 14px; flex-wrap: wrap; margin: 0 0 8px; }
.fi-ph b { font-size: 14.5px; } .fi-ph > span { font-size: 12.5px; color: var(--muted); } .fi-ph em { font-style: normal; }
.fi-td { color: var(--warn); font-weight: 600; } .fi-ok { color: #15803d; font-weight: 600; }
.fi-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px; }
.fi-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; align-items: start; }
@media (max-width: 900px) { .fi-2 { grid-template-columns: 1fr; } }
.fi-br { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(50px, 1fr) 84px; gap: 12px; align-items: center; padding: 9px 0; border-bottom: 1px solid var(--line); }
.fi-br:last-child { border-bottom: 0; }
.fi-bn { display: grid; gap: 1px; min-width: 0; } .fi-bn b { font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .fi-bn small { font-size: 11.5px; color: var(--muted); }
.fi-bt { height: 8px; border-radius: 999px; background: var(--bg); overflow: hidden; } .fi-bt i { display: block; height: 100%; border-radius: 999px; background: var(--accent); }
.fi-bv { text-align: right; font-size: 13.5px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.fi-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 2px; }
.fi-ol { display: grid; margin-top: 8px; }
.fi-or { display: grid; grid-template-columns: 130px minmax(0, 1fr) auto 120px; gap: 18px; align-items: center; width: 100%; padding: 13px 12px; border: 0; border-bottom: 1px solid var(--line); background: transparent; font: inherit; color: inherit; text-align: left; cursor: pointer; }
.fi-or:hover { background: var(--bg); } .fi-or:last-child { border-bottom: 0; }
.fi-or .pv-qn, .fi-or .pv-qc { display: grid; gap: 2px; min-width: 0; } .fi-or b { font-size: 13.5px; } .fi-or .pv-qc b { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fi-or small { font-size: 11.5px; color: var(--muted); } .fi-or .pv-qt { text-align: right; font-size: 15px; font-weight: 700; white-space: nowrap; }
.fi-cs { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
@media (max-width: 760px) { .fi-or { grid-template-columns: minmax(0, 1fr) auto; gap: 6px 12px; } .fi-or .fi-cs { grid-column: 1 / -1; justify-content: flex-start; order: 3; } }
.fi-kv { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 12px 18px; margin: 2px 0 16px; }
.fi-kv small { display: block; font-size: 11.5px; color: var(--muted); } .fi-kv b { font-size: 13.5px; font-weight: 600; }
.fi-act { display: flex; flex-wrap: wrap; gap: 14px 22px; align-items: flex-end; padding-top: 14px; border-top: 1px solid var(--line); }
.fi-fatt { min-width: 230px; }
.fi-sel { display: grid; gap: 4px; } .fi-sel small { font-size: 11.5px; color: var(--muted); }
.fi-sel select { height: 36px; min-width: 210px; padding: 0 10px; border-radius: 10px; border: 1px solid var(--line); background: var(--surface); color: var(--ink); font: inherit; }
.fi-ean { display: block; font-size: 11px; color: var(--muted); }
.fi-tot { display: grid; gap: 6px; margin: 14px 0 0 auto; max-width: 340px; }
.fi-tot > div { display: flex; justify-content: space-between; gap: 18px; font-size: 13.5px; font-variant-numeric: tabular-nums; } .fi-tot span { color: var(--ink-2); }
.fi-tt { padding-top: 8px; border-top: 1px solid var(--line); } .fi-tt b { font-size: 16px; }
.fi-mi { display: flex; gap: 12px; align-items: flex-start; padding: 9px 0; } .fi-mi i { flex: none; width: 9px; height: 9px; margin-top: 5px; border-radius: 50%; background: var(--accent); }
.fi-mi b { display: block; font-size: 13.5px; } .fi-mi small { font-size: 11.5px; color: var(--muted); }
.fi-note { display: flex; gap: 8px; margin-top: 12px; } .fi-note input { flex: 1; min-width: 0; height: 36px; padding: 0 12px; border-radius: 10px; border: 1px solid var(--line); background: var(--surface); color: var(--ink); font: inherit; }
/* Fischer — v184: fatture, DDT, spunta per piazzale */
.fi-dn { margin-top: 10px; } .fi-dn summary { cursor: pointer; font-size: 12.5px; color: var(--muted); padding: 4px 0 8px; list-style: none; } .fi-dn summary::before { content: '›'; display: inline-block; width: 14px; transition: transform .15s; } .fi-dn[open] summary::before { transform: rotate(90deg); }
.fi-all { border: 0; background: none; padding: 0; font: inherit; font-size: 12.5px; color: var(--accent); cursor: pointer; } .fi-all:hover { text-decoration: underline; }
.fi-or.fi-sm { grid-template-columns: 92px minmax(0, 1fr) auto 96px; gap: 12px; padding: 10px 8px; }
@media (max-width: 760px) { .fi-or.fi-sm { grid-template-columns: minmax(0, 1fr) auto; } .fi-or.fi-sm .fi-cs { grid-column: auto; order: 0; } }
.fi-ddt td { background: var(--bg); padding: 9px 12px; font-size: 12.5px; text-align: left !important; color: var(--ink-2); } .fi-ddt td span { color: var(--muted); } .fi-ddt small { color: var(--muted); margin-left: 6px; }
.fi-parts { gap: 10px 14px; } .fi-parts .fi-fatt { display: grid; gap: 4px; } .fi-pn { font-size: 11.5px; color: var(--muted); padding-left: 4px; }
.fi-links { display: flex; flex-wrap: wrap; gap: 6px; } .fi-na { font-size: 13.5px; color: var(--muted); font-weight: 500; }
#v-fischer table.mx th.l, #v-fischer table.mx td.l { text-align: left; }

/* v187 Fischer: ricerca, esporta, listino */
.fi-gs{margin:0 0 12px}
.fi-xm{position:relative;display:inline-block}
.fi-xm .btn{display:inline-flex;align-items:center;gap:6px}
.fi-xd{position:absolute;right:0;top:calc(100% + 6px);z-index:30;min-width:270px;background:var(--card,#fff);border:1px solid var(--line,#e3e7ee);border-radius:12px;box-shadow:0 12px 32px rgba(20,30,60,.16);padding:6px}
.fi-xd[hidden]{display:none}
.fi-xd button{display:block;width:100%;text-align:left;background:none;border:0;border-radius:8px;padding:9px 11px;cursor:pointer;font:inherit;color:inherit}
.fi-xd button:hover{background:var(--soft,#f3f5fa)}
.fi-xd b{display:block;font-size:13px}.fi-xd small{display:block;color:var(--muted,#78808e);font-size:11.5px;margin-top:1px}
.fi-sres{display:grid;gap:14px}.fi-sh{font-size:13px;color:var(--muted,#78808e)}.fi-sh b{color:inherit}
.fi-lt td,.fi-lt th{vertical-align:middle}
.fi-in{width:96px;text-align:right;font:inherit;padding:6px 8px;border:1px solid var(--line,#dfe4ec);border-radius:8px;background:var(--card,#fff);color:inherit}
.fi-in:focus{outline:2px solid #3362ab55;border-color:#3362ab}
.fi-k{white-space:nowrap}.fi-k small,.fi-mod{display:block;color:var(--muted,#78808e);font-size:11px}
.fi-neg{color:#c0392b}
.fi-x{border:0;background:none;color:var(--muted,#78808e);cursor:pointer;font-size:16px}
.fi-add{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.fi-add input{font:inherit;padding:7px 9px;border:1px solid var(--line,#dfe4ec);border-radius:8px;background:var(--card,#fff);color:inherit;flex:1;min-width:90px}
.tr-none{padding:8px 4px}
@media (max-width:640px){.fi-xd{right:-10px;min-width:240px}.fi-lt{font-size:12px}.fi-in{width:72px}}

/* v189 Fischer: fatturazione ai piazzali + movimento */
.fx-top { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 34px; align-items: center; padding: 6px 4px 20px; margin-bottom: 4px; border-bottom: 1px solid var(--line); }
.fx-ring { position: relative; width: 136px; height: 136px; flex: none; }
.fx-ring svg, .fx-mini svg { width: 100%; height: 100%; transform: rotate(-90deg); overflow: visible; }
.fx-rt { fill: none; stroke: color-mix(in srgb, var(--ink) 8%, transparent); stroke-width: 9; }
.fx-rp { fill: none; stroke: var(--accent); stroke-width: 9; stroke-linecap: round; stroke-dasharray: 100; transition: stroke-dashoffset 1.1s var(--out), stroke .5s; }
.fx-mini .fx-rt, .fx-mini .fx-rp { stroke-width: 4.5; }
.fx-ring.full .fx-rp, .fx-pz.full .fx-rp { stroke: #16a34a; }
.fx-ring.zero .fx-rp { opacity: 0; }
.fx-ring.full { filter: drop-shadow(0 0 14px color-mix(in srgb, #16a34a 35%, transparent)); transition: filter .6s; }
.fx-ring.pulse { animation: fxpulse 1s var(--spring); }
@keyframes fxpulse { 30% { transform: scale(1.08); } 100% { transform: none; } }
.fx-rc { position: absolute; inset: 0; display: grid; place-content: center; text-align: center; gap: 2px; }
.fx-rc b { font-size: 30px; letter-spacing: -.03em; font-variant-numeric: tabular-nums; line-height: 1; }
.fx-rc small { font-size: 10.5px; color: var(--muted); text-transform: uppercase; letter-spacing: .09em; }
.fx-kpi { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.fx-kpi > div { padding: 14px 16px; border-radius: 14px; background: color-mix(in srgb, var(--ink) 3%, transparent); display: grid; gap: 6px; transition: transform .25s var(--spring), background .25s; }
.fx-kpi > div:hover { transform: translateY(-2px); background: color-mix(in srgb, var(--ink) 5%, transparent); }
.fx-kpi span { font-size: 11.5px; color: var(--muted); text-transform: uppercase; letter-spacing: .06em; }
.fx-kpi b { font-size: 22px; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.fx-kpi b.w { color: var(--warn); } .fx-kpi b.g { color: #15803d; }
.fx-pz { border-bottom: 1px solid var(--line); border-radius: 14px; transition: background .5s; }
.fx-pz:last-child { border-bottom: 0; }
.fx-pz.pop { animation: fxpop .9s var(--spring); background: color-mix(in srgb, #16a34a 8%, transparent); }
@keyframes fxpop { 40% { transform: scale(1.012); } 100% { transform: none; } }
.fx-row { display: grid; grid-template-columns: 44px minmax(0, 1.2fr) minmax(90px, 1fr) 160px 18px; gap: 16px; align-items: center; width: 100%; padding: 13px 8px; background: none; border: 0; text-align: left; cursor: pointer; color: inherit; font: inherit; border-radius: 14px; transition: background .2s, transform .15s; }
.fx-row:hover { background: color-mix(in srgb, var(--ink) 3.5%, transparent); }
.fx-row:active { transform: scale(.992); }
.fx-row:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.fx-mini { position: relative; width: 42px; height: 42px; }
.fx-mc { position: absolute; inset: 0; display: grid; place-items: center; font-size: 10.5px; font-weight: 700; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.fx-mc svg { width: 16px; height: 16px; fill: none; stroke: #16a34a; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 24; animation: fxdraw .6s .1s var(--out) both; }
@keyframes fxdraw { from { stroke-dashoffset: 24; } }
.fx-nm { display: grid; gap: 2px; min-width: 0; } .fx-nm b { font-size: 14.5px; } .fx-nm small { color: var(--muted); font-size: 12px; }
.fx-bar { height: 6px; border-radius: 99px; background: color-mix(in srgb, var(--ink) 7%, transparent); overflow: hidden; }
.fx-bar i { display: block; height: 100%; width: var(--p); background: var(--accent); border-radius: inherit; transition: width .9s var(--out), background .5s; transform-origin: left; }
.fx-pz.full .fx-bar i { background: #16a34a; }
.fx-chip { justify-self: end; font-size: 12px; font-weight: 600; padding: 5px 11px; border-radius: 99px; background: var(--warn-soft); color: var(--warn); white-space: nowrap; font-variant-numeric: tabular-nums; transition: background .4s, color .4s; }
.fx-pz.full .fx-chip { background: color-mix(in srgb, #16a34a 12%, transparent); color: #15803d; }
.fx-chev { width: 18px; height: 18px; fill: none; stroke: var(--muted); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; transition: transform .4s var(--spring); }
.fx-pz.open .fx-chev { transform: rotate(90deg); }
.fx-panel { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .45s var(--out); }
.fx-pz.open .fx-panel { grid-template-rows: 1fr; }
.fx-in { overflow: hidden; min-height: 0; padding: 0 8px; }
.fx-pz.open .fx-in { padding-bottom: 12px; }
.fx-ph { display: flex; justify-content: space-between; align-items: center; padding: 2px 4px 8px 4px; font-size: 12.5px; color: var(--muted); }
.fx-ph .fi-all[hidden] { display: none; }
.fx-o { position: relative; display: grid; grid-template-columns: 24px minmax(0, 1fr) auto 96px; gap: 14px; align-items: center; padding: 10px 12px; border-radius: 11px; cursor: pointer; user-select: none; -webkit-user-select: none; transition: background .3s; opacity: 0; transform: translateY(-6px); }
.fx-pz.open .fx-o { opacity: 1; transform: none; transition: background .3s, opacity .4s var(--out), transform .4s var(--out); }
.fx-pz.open .fx-o:nth-child(2) { transition-delay: 0s, 60ms, 60ms; } .fx-pz.open .fx-o:nth-child(3) { transition-delay: 0s, 100ms, 100ms; } .fx-pz.open .fx-o:nth-child(4) { transition-delay: 0s, 140ms, 140ms; } .fx-pz.open .fx-o:nth-child(5) { transition-delay: 0s, 180ms, 180ms; } .fx-pz.open .fx-o:nth-child(n+6) { transition-delay: 0s, 220ms, 220ms; }
.fx-o:hover { background: color-mix(in srgb, var(--ink) 4%, transparent); }
.fx-o.on { background: color-mix(in srgb, #16a34a 6%, transparent); }
.fx-o.just { animation: fxflash 1s var(--out); }
@keyframes fxflash { 0% { background: color-mix(in srgb, #16a34a 30%, transparent); } }
.fx-o input { position: absolute; opacity: 0; pointer-events: none; }
.fx-sw { width: 22px; height: 22px; border-radius: 50%; border: 1.7px solid color-mix(in srgb, var(--ink) 25%, transparent); display: grid; place-items: center; transition: background .25s, border-color .25s, transform .4s var(--spring); }
.fx-sw svg { width: 13px; height: 13px; fill: none; stroke: #fff; stroke-width: 3.2; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 24; stroke-dashoffset: 24; transition: stroke-dashoffset .4s .08s var(--out); }
.fx-o:hover .fx-sw { border-color: var(--accent); }
.fx-o.on .fx-sw { background: #16a34a; border-color: #16a34a; }
.fx-o.on .fx-sw svg { stroke-dashoffset: 0; }
.fx-o.just .fx-sw { animation: fxsw .5s var(--spring); }
@keyframes fxsw { 40% { transform: scale(1.35); } }
.fx-o:active .fx-sw { transform: scale(.85); }
.fx-o input:focus-visible + .fx-sw { outline: 2px solid var(--accent); outline-offset: 2px; }
.fx-on { display: grid; gap: 1px; } .fx-on b { font-size: 13.5px; } .fx-on small { font-size: 11.5px; color: var(--muted); }
.fx-od { font-size: 12px; color: #15803d; white-space: nowrap; }
.fx-ov { text-align: right; font-size: 13.5px; font-variant-numeric: tabular-nums; }
.fx-burst { position: absolute; left: 50%; top: 50%; width: 0; height: 0; pointer-events: none; z-index: 5; }
.fx-burst i { position: absolute; width: var(--s); height: var(--s); margin: calc(var(--s) / -2); border-radius: 50%; background: var(--c); animation: fxb .9s var(--out) forwards; }
@keyframes fxb { from { transform: translate(0, 0) scale(1); opacity: 1; } to { transform: translate(var(--x), var(--y)) scale(.3); opacity: 0; } }
/* movimento: entrata, barre, schede che si svelano allo scroll */
.cc-anim .fx-ring .fx-rp { animation: fxring 1.4s .25s var(--out) both; } .cc-anim .fx-mini .fx-rp { animation: fxring 1.1s var(--d) var(--out) both; }
@keyframes fxring { from { stroke-dashoffset: 100; } }
.cc-anim .fx-ring { animation: cmpop .7s .1s var(--spring) both; }
.cc-anim .fx-kpi > div { animation: rise .55s var(--out) both; } .cc-anim .fx-kpi > div:nth-child(1) { animation-delay: .25s; } .cc-anim .fx-kpi > div:nth-child(2) { animation-delay: .32s; } .cc-anim .fx-kpi > div:nth-child(3) { animation-delay: .39s; }
.cc-anim .fx-pz { animation: rise .55s var(--d) var(--out) both; }
.cc-anim .fx-bar i { animation: crgrow 1s calc(var(--d) + 200ms) var(--out) both; }
.fi-body.cc-anim { animation: fadein .35s both; }
.cc-anim .fi-br { animation: rise .5s var(--out) both; } .cc-anim .fi-br:nth-child(2) { animation-delay: .06s; } .cc-anim .fi-br:nth-child(3) { animation-delay: .12s; } .cc-anim .fi-br:nth-child(4) { animation-delay: .18s; } .cc-anim .fi-br:nth-child(n+5) { animation-delay: .24s; }
.cc-anim .fi-bt i { animation: crgrow 1s .35s var(--out) both; transform-origin: left; }
.cc-anim .fi-or { animation: rise .45s var(--out) both; } .cc-anim .fi-or:nth-child(2) { animation-delay: .04s; } .cc-anim .fi-or:nth-child(3) { animation-delay: .08s; } .cc-anim .fi-or:nth-child(4) { animation-delay: .12s; } .cc-anim .fi-or:nth-child(5) { animation-delay: .16s; } .cc-anim .fi-or:nth-child(n+6) { animation-delay: .2s; }
.fi-or { transition: transform .2s var(--spring), box-shadow .2s, background .2s; } .fi-or:hover { transform: translateY(-1px); }
.rv { opacity: 0; transform: translateY(26px) scale(.985); }
.rv-on { opacity: 1; transform: none; transition: opacity .7s var(--out), transform .8s var(--out); }
@media (max-width: 760px) {
  .fx-top { grid-template-columns: 1fr; justify-items: center; gap: 18px; }
  .fx-kpi { width: 100%; gap: 8px; } .fx-kpi > div { padding: 11px 10px; } .fx-kpi b { font-size: 15px; } .fx-kpi span { font-size: 10px; }
  .fx-row { grid-template-columns: 42px minmax(0, 1fr) auto 16px; gap: 11px; } .fx-bar { display: none; }
  .fx-o { grid-template-columns: 24px minmax(0, 1fr) auto; } .fx-od { display: none; }
}
@media (prefers-reduced-motion: reduce) { .fx-card *, .rv, .rv-on, .fi-body.cc-anim { animation: none !important; transition: none !important; } .rv { opacity: 1; transform: none; } .fx-o { opacity: 1; transform: none; } }

.fx-ol { max-height: 440px; overflow: auto; overscroll-behavior: contain; display: grid; grid-template-columns: 1fr 1fr; column-gap: 14px; align-content: start; scrollbar-width: thin; }
@media (max-width: 1000px) { .fx-ol { grid-template-columns: 1fr; } .fx-row { grid-template-columns: 44px minmax(0, 1.2fr) minmax(70px, 1fr) auto 18px; } }
@media (max-width: 760px) { .fx-ol { max-height: 380px; } }
@media (max-width: 760px) { .fx-cw { display: none; } .fx-nm b { font-size: 14px; } .fx-chip { padding: 4px 9px; } }

/* v190 Preventivi: ricerca globale potenziata */
.pv-ghint { margin: 8px 2px 0; font-size: 12px; color: var(--muted); }
.pv-ghint code, .pv-ghint kbd { font: inherit; font-size: 11.5px; padding: 1px 6px; border-radius: 6px; background: color-mix(in srgb, var(--ink) 6%, transparent); color: var(--ink-2); }
.pv-gsh { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.pv-gsh .btn svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; margin-right: 6px; vertical-align: -2px; }
.pv-gfz { margin: 6px 0 0; font-size: 12.5px; color: var(--warn); }
.pv-gcats { display: flex; gap: 8px; overflow-x: auto; padding: 2px 2px 8px; scrollbar-width: thin; -webkit-mask-image: linear-gradient(90deg, #000 94%, transparent); mask-image: linear-gradient(90deg, #000 94%, transparent); }
.pv-gcats button { flex: none; display: inline-flex; align-items: center; gap: 7px; height: 32px; padding: 0 13px; border-radius: 99px; border: 1px solid var(--line); background: var(--surface); color: var(--ink-2); font: inherit; font-size: 13px; cursor: pointer; white-space: nowrap; transition: background .2s, border-color .2s, color .2s, transform .15s var(--spring); }
.pv-gcats button:hover { border-color: color-mix(in srgb, var(--accent) 45%, var(--line)); transform: translateY(-1px); }
.pv-gcats button:active { transform: scale(.96); }
.pv-gcats button.on { background: var(--accent); border-color: var(--accent); color: #fff; }
.pv-gcats em { font-style: normal; font-size: 11.5px; opacity: .65; font-variant-numeric: tabular-nums; }
.pv-gpr { display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 10px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); font-size: 13.5px; color: var(--muted); }
.pv-gpr input { width: 58px; border: 0; background: none; outline: 0; font: inherit; color: var(--ink); text-align: center; min-height: 0; padding: 0; }
.pv-gpr:focus-within { border-color: var(--accent); }
.pv-gvw button { display: grid; place-items: center; padding: 0 11px; } .pv-gvw svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.pv-glist { display: grid; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); overflow: hidden; }
.pv-glr { display: grid; grid-template-columns: minmax(0, 1fr) 40px; align-items: center; border-bottom: 1px solid var(--line); position: relative; }
.pv-glr:last-child { border-bottom: 0; }
.pv-glr.pv-glh { display: grid; grid-template-columns: 34px minmax(0, 1fr) 110px 90px 80px 40px; gap: 14px; padding: 9px 6px 9px 14px; font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); background: color-mix(in srgb, var(--ink) 3%, transparent); }
.pv-glh span:nth-child(n+3):not(:last-child) { text-align: right; }
.pv-glm { display: grid; grid-template-columns: 34px minmax(0, 1fr) 110px 90px 80px; gap: 14px; align-items: center; width: 100%; padding: 11px 6px 11px 14px; background: none; border: 0; text-align: left; font: inherit; color: inherit; cursor: pointer; transition: background .2s; }
.pv-glr:hover .pv-glm { background: color-mix(in srgb, var(--ink) 3.5%, transparent); }
.pv-glr.cmp { background: var(--accent-soft); }
.cc-anim .pv-glr, .pv-gres-anim .pv-glr { animation: rise .4s var(--d) var(--out) both; }
.pv-gll { width: 34px; height: 34px; object-fit: contain; border-radius: 8px; background: #fff; border: 1px solid var(--line); padding: 3px; }
.pv-gln { display: grid; gap: 2px; min-width: 0; } .pv-gln b { font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .pv-gln small { font-size: 12px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pv-glp { text-align: right; font-size: 13.5px; font-variant-numeric: tabular-nums; display: grid; justify-items: end; gap: 2px; } .pv-glp em { font-style: normal; font-size: 11px; color: var(--muted); }
.pv-glp strong em { font-weight: 400; }
.pv-glr > .pv-gcb { width: 30px; height: 30px; border-radius: 50%; border: 1px solid var(--line); background: var(--surface); display: grid; place-items: center; cursor: pointer; margin-right: 8px; padding: 0; transition: background .2s, border-color .2s, transform .2s var(--spring); }
.pv-glr > .pv-gcb:hover { border-color: var(--accent); transform: scale(1.1); } .pv-glr > .pv-gcb svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.pv-glr > .pv-gcb[aria-pressed="true"] { background: var(--accent); border-color: var(--accent); color: #fff; }
mark { background: color-mix(in srgb, #f5b301 40%, transparent); color: inherit; border-radius: 3px; padding: 0 1px; }
@media (max-width: 760px) { .pv-glm { grid-template-columns: 34px minmax(0, 1fr) auto; } .pv-glp.x { display: none; } .pv-gpr input { width: 46px; } .pv-gsh .btn { flex: none; } }
@media (max-width: 760px) { .pv-glr.pv-glh { display: none; } }

/* ===== v204 — Nota spese ===== */
#ns-body { --nsok: #12a36f; display: grid; gap: 14px; }
.ns-bar { display: flex; gap: 10px; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.ns-tabs { overflow-x: auto; max-width: 100%; scrollbar-width: none; } .ns-tabs button { white-space: nowrap; }
.ns-tabs em { font-style: normal; font-size: 11px; font-weight: 700; background: var(--warn); color: #fff; border-radius: 99px; padding: 1px 6px; margin-left: 6px; }
.ns-act { display: flex; gap: 8px; } .ns-act svg, .ns-estb svg, .ns-list .btn svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; vertical-align: -3px; margin-right: 5px; }
.ns-body { display: grid; gap: 14px; }
.ns-anim > * , .ns-anim .ns-k, .ns-anim .ns-box, .ns-anim .ns-cw, .ns-anim .ns-pc { animation: nsUp .5s cubic-bezier(.2,.8,.2,1) backwards; animation-delay: calc(var(--i, 0) * 55ms); }
.ns-sp, .ns-lg, .ns-es, .ns-a, .ns-br { animation: nsUp .45s cubic-bezier(.2,.8,.2,1) backwards; animation-delay: calc(var(--i, 0) * 30ms); }
@keyframes nsUp { from { opacity: 0; transform: translateY(10px); } }
.ns-kpis, .ns-sum { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.ns-k { text-align: left; padding: 14px 16px; display: grid; gap: 3px; cursor: pointer; border: 1px solid var(--line); transition: transform .2s, box-shadow .2s; font: inherit; color: inherit; }
.ns-k:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.ns-k span { font-size: 12px; color: var(--muted); } .ns-k b { font-size: 24px; letter-spacing: -.02em; font-variant-numeric: tabular-nums; } .ns-k small { color: var(--muted); font-size: 12px; }
.ns-k.warn b { color: var(--warn); } .ns-k.bad b { color: var(--danger); }
.ns-g2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.ns-box { padding: 16px; } .ns-bh { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 12px; } .ns-bh h3 { margin: 0; font-size: 15px; } .ns-bh span { font-size: 12px; color: var(--muted); }
.ns-cols { display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; align-items: end; height: 170px; }
.ns-col { display: grid; grid-template-rows: 1fr auto auto; gap: 4px; text-align: center; height: 100%; font-size: 11px; color: var(--muted); }
.ns-col-b { display: flex; align-items: flex-end; } .ns-col-b i { display: block; width: 100%; height: var(--h); min-height: 3px; background: var(--accent-soft); border-radius: 6px 6px 3px 3px; transform-origin: bottom; animation: nsGrow .8s cubic-bezier(.2,.8,.2,1) backwards; animation-delay: calc(var(--i) * 70ms + 200ms); }
.ns-col.cur .ns-col-b i { background: var(--accent); } .ns-col b { color: var(--ink); font-size: 11px; font-weight: 600; }
@keyframes nsGrow { from { transform: scaleY(0); } }
.ns-br { margin-bottom: 10px; } .ns-br-t { display: flex; justify-content: space-between; gap: 8px; font-size: 13px; margin-bottom: 5px; } .ns-br-t span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .ns-br-t b { font-variant-numeric: tabular-nums; }
.ns-br-b { height: 6px; background: var(--line); border-radius: 9px; overflow: hidden; } .ns-br-b i { display: block; height: 100%; width: var(--w); background: var(--accent); border-radius: 9px; animation: nsBar .9s cubic-bezier(.2,.8,.2,1) backwards .25s; } .ns-br-b i.alt { background: var(--nsok); } .ns-br-b i.over { background: var(--danger); }
@keyframes nsBar { from { width: 0; } }
.ns-none, .ns-note { color: var(--muted); font-size: 13px; margin: 6px 0; }
.ns-al { display: grid; gap: 8px; } .ns-a { display: grid; grid-template-columns: 32px 1fr 16px; gap: 10px; align-items: center; text-align: left; padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); font: inherit; color: inherit; cursor: pointer; transition: border-color .2s, transform .2s; }
.ns-a:hover { border-color: var(--accent); transform: translateX(2px); } .ns-a i { width: 32px; height: 32px; border-radius: 10px; display: grid; place-items: center; background: var(--warn-soft); color: var(--warn); } .ns-a.no i { background: var(--danger-soft); color: var(--danger); } .ns-a.wait i { background: var(--accent-soft); color: var(--accent); }
.ns-a svg, .ns-empty-i svg, .ns-ok i svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } .ns-a > svg { width: 14px; height: 14px; color: var(--muted); }
.ns-a b { display: block; font-size: 13px; } .ns-a small { color: var(--muted); font-size: 12px; }
.ns-ok { text-align: center; padding: 18px 8px; } .ns-ok i { width: 46px; height: 46px; border-radius: 50%; background: color-mix(in srgb, var(--nsok) 14%, transparent); color: var(--nsok); display: grid; place-items: center; margin: 0 auto 8px; animation: nsPop .6s cubic-bezier(.34,1.4,.5,1) backwards; } .ns-ok p { color: var(--muted); font-size: 13px; margin: 4px 0 0; }
@keyframes nsPop { from { transform: scale(.4); opacity: 0; } }
/* spese */
.ns-flt { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; } .ns-flt select, .ns-q { height: 36px; border: 1px solid var(--line); background: var(--surface); border-radius: 10px; padding: 0 10px; color: var(--ink); font: inherit; font-size: 13px; max-width: 100%; } .ns-q { flex: 1 1 200px; min-width: 150px; }
.ns-mn { display: flex; align-items: center; gap: 4px; } .ns-mn b { min-width: 130px; text-align: center; font-size: 14px; }
.ns-ib { width: 32px; height: 32px; border: 0; border-radius: 9px; background: transparent; color: var(--ink-2); display: inline-grid; place-items: center; cursor: pointer; transition: background .15s, transform .15s; flex: none; } .ns-ib:hover:not(:disabled) { background: var(--accent-soft); } .ns-ib:disabled { opacity: .35; cursor: default; } .ns-ib.sp { visibility: hidden; }
.ns-ib svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; } .ns-ib.ok { color: var(--nsok); } .ns-ib.ok:hover { background: color-mix(in srgb, var(--nsok) 14%, transparent); } .ns-ib.no { color: var(--danger); } .ns-ib.no:hover { background: var(--danger-soft); }
.ns-chip { height: 36px; padding: 0 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); font: inherit; font-size: 13px; color: var(--ink-2); cursor: pointer; } .ns-chip.on { background: var(--accent-soft); color: var(--accent); border-color: transparent; }
.ns-list { overflow: hidden; padding: 4px 0; }
.ns-sp, .ns-lg { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto auto auto auto auto; gap: 12px; align-items: center; padding: 10px 16px; border-top: 1px solid var(--line); cursor: pointer; transition: background .15s; } .ns-lg { grid-template-columns: 36px minmax(0, 1fr) auto 32px; cursor: default; }
.ns-sp:first-child, .ns-lg:first-of-type { border-top: 0; } .ns-sp:hover { background: var(--accent-soft); }
.ns-sp-m { min-width: 0; } .ns-sp-m b { display: block; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .ns-sp-m small { color: var(--muted); font-size: 12px; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ns-av { width: 36px; height: 36px; border-radius: 50%; background: color-mix(in srgb, var(--c) 16%, transparent); color: var(--c); display: inline-grid; place-items: center; font-size: 12px; font-weight: 700; flex: none; }
.ns-me { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: var(--ink-2); background: var(--bg); border: 1px solid var(--line); padding: 3px 8px; border-radius: 99px; } .ns-me svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; } .ns-me em { font-style: normal; }
.ns-rc { color: var(--warn); display: grid; } .ns-rc.on { color: var(--nsok); } .ns-rc svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ns-am { font-variant-numeric: tabular-nums; text-align: right; font-size: 14px; } .ns-am.pos { color: var(--nsok); } .ns-am.neg { color: var(--ink-2); }
.ns-st { font-size: 11px; font-weight: 600; padding: 3px 9px; border-radius: 99px; white-space: nowrap; background: var(--bg); color: var(--ink-2); } .ns-st.ok { background: color-mix(in srgb, var(--nsok) 14%, transparent); color: var(--nsok); } .ns-st.wait { background: var(--accent-soft); color: var(--accent); } .ns-st.no { background: var(--danger-soft); color: var(--danger); } .ns-st.mute { background: var(--bg); color: var(--muted); }
.ns-ac { display: inline-flex; align-items: center; min-width: 32px; gap: 2px; } .ns-mt { color: var(--accent); display: grid; } .ns-mt svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; }
.ns-foot { display: flex; justify-content: space-between; padding: 12px 16px; border-top: 1px solid var(--line); font-size: 13px; color: var(--muted); } .ns-foot b { color: var(--ink); }
.ns-empty { text-align: center; padding: 34px 20px; display: grid; gap: 6px; justify-items: center; } .ns-empty p { color: var(--muted); font-size: 13px; max-width: 420px; margin: 0 0 6px; } .ns-empty-i { width: 52px; height: 52px; border-radius: 16px; background: var(--accent-soft); color: var(--accent); display: grid; place-items: center; animation: nsFloat 3s ease-in-out infinite; }
@keyframes nsFloat { 50% { transform: translateY(-4px); } }
/* carte */
.ns-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 16px; }
.ns-cw { display: grid; gap: 10px; align-content: start; }
.ns-cc { --a: #1f3f78; --b: #3362ab; position: relative; width: 100%; aspect-ratio: 1.586; border: 0; border-radius: 18px; padding: 18px 20px; color: #fff; text-align: left; display: flex; flex-direction: column; justify-content: space-between; cursor: pointer; background: linear-gradient(135deg, var(--a), var(--b)); box-shadow: 0 10px 24px -12px var(--a); overflow: hidden; transition: transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s; font: inherit; }
.ns-cc::after { content: ""; position: absolute; inset: 0; background: linear-gradient(115deg, transparent 35%, rgba(255,255,255,.22) 50%, transparent 65%); transform: translateX(-120%); transition: transform .8s; pointer-events: none; }
.ns-cc:hover { transform: translateY(-4px) rotate(-.4deg); box-shadow: 0 18px 30px -14px var(--a); } .ns-cc:hover::after { transform: translateX(120%); }
.c-nero { --a: #111827; --b: #374151; } .c-verde { --a: #0b6b4c; --b: #19a174; } .c-viola { --a: #4c2a9a; --b: #8b5cf6; } .c-arancio { --a: #b8461a; --b: #eb6834; } .c-blu { --a: #1f3f78; --b: #3362ab; }
.ns-cc-top { display: flex; justify-content: space-between; align-items: center; } .ns-cc-top b { font-size: 15px; } .ns-chip-ic { width: 34px; height: 25px; border-radius: 6px; background: linear-gradient(135deg, #f1d38a, #c9a24a); opacity: .9; }
.ns-cc-num { font-size: 18px; letter-spacing: .12em; font-variant-numeric: tabular-nums; } .ns-cc-bot { display: flex; justify-content: space-between; align-items: flex-end; gap: 8px; } .ns-cc-bot small { display: block; font-size: 11px; opacity: .75; } .ns-cc-bot b { font-size: 14px; }
.ns-cc-r { position: relative; width: 44px; height: 44px; display: grid; place-items: center; } .ns-cc-r em { position: absolute; font-style: normal; font-size: 10px; font-weight: 700; }
.ns-cc.blk { filter: grayscale(.85); opacity: .75; } .ns-cc-bk { position: absolute; top: 14px; right: 14px; background: rgba(0,0,0,.55); padding: 3px 10px; border-radius: 99px; font-size: 11px; }
.ns-ring { width: 44px; height: 44px; transform: rotate(-90deg); } .ns-ring circle { fill: none; stroke-width: 4; } .ns-ring .bg { stroke: rgba(255,255,255,.25); } .ns-ring .fg { stroke: #fff; stroke-linecap: round; stroke-dashoffset: var(--to); animation: nsRing 1.1s cubic-bezier(.2,.8,.2,1) backwards .3s; } .ns-ring .fg.over { stroke: #ff8b7a; } .ns-ring.big { width: 62px; height: 62px; }
@keyframes nsRing { from { stroke-dashoffset: 107; } }
.ns-cm { font-size: 12px; color: var(--muted); display: grid; gap: 6px; padding: 0 4px; } .ns-cm b { color: var(--ink); }
.ns-add { border: 1.5px dashed var(--line); border-radius: 18px; background: transparent; min-height: 150px; align-content: center; justify-items: center; text-align: center; padding: 20px; cursor: pointer; font: inherit; color: var(--ink-2); transition: border-color .2s, background .2s; } .ns-add:hover { border-color: var(--accent); background: var(--accent-soft); color: var(--accent); }
.ns-add i { width: 40px; height: 40px; border-radius: 50%; background: var(--accent-soft); color: var(--accent); display: grid; place-items: center; } .ns-add svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; } .ns-add small { color: var(--muted); font-size: 12px; }
.ns-prev { max-width: 280px; margin: 0 auto 14px; } .ns-prev .ns-cc { cursor: default; }
.ns-sw { display: flex; gap: 10px; } .ns-sw label { cursor: pointer; } .ns-sw input { position: absolute; opacity: 0; } .ns-sw i { display: block; width: 30px; height: 30px; border-radius: 50%; background: linear-gradient(135deg, var(--a), var(--b)); transition: transform .2s, box-shadow .2s; } .ns-sw input:checked + i { box-shadow: 0 0 0 2px var(--surface), 0 0 0 4px var(--b); transform: scale(1.08); }
/* contanti */
.ns-peo { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 12px; }
.ns-pc { padding: 14px 16px; display: grid; gap: 10px; text-align: left; cursor: pointer; font: inherit; color: inherit; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); transition: transform .2s, border-color .2s; } .ns-pc:hover { transform: translateY(-2px); } .ns-pc.on { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.ns-pc.ns-add { border: 1.5px dashed var(--line); background: transparent; justify-items: center; align-content: center; text-align: center; }
.ns-pc-h { display: flex; align-items: center; gap: 10px; } .ns-pc-v small { display: block; color: var(--muted); font-size: 12px; } .ns-pc-v b { font-size: 24px; letter-spacing: -.02em; font-variant-numeric: tabular-nums; } .ns-pc-v.neg b { color: var(--danger); }
.ns-pc-f { display: flex; justify-content: space-between; font-size: 12px; color: var(--muted); }
.ns-sg { margin-bottom: 12px; } .ns-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
/* estratto */
.ns-estb { display: grid; gap: 10px; }
.ns-rg { padding: 14px 16px; display: flex; align-items: center; gap: 14px; } .ns-rg h3 { margin: 0; font-size: 14px; } .ns-rg p { margin: 2px 0 0; color: var(--muted); font-size: 12px; }
.ns-rg-r { position: relative; display: grid; place-items: center; } .ns-rg-r b { position: absolute; font-size: 13px; } .ns-rg .ns-ring .bg { stroke: var(--line); } .ns-rg .ns-ring .fg { stroke: var(--nsok); }
.ns-es { display: grid; grid-template-columns: 74px minmax(0, 1fr) auto auto auto; gap: 12px; align-items: center; padding: 10px 16px; border-top: 1px solid var(--line); transition: background .15s; } .ns-es:first-child { border-top: 0; } .ns-es.m { background: color-mix(in srgb, var(--nsok) 5%, transparent); } .ns-es.ig { opacity: .6; }
.ns-es-d { font-size: 12px; color: var(--muted); } .ns-ac2 { display: inline-flex; gap: 6px; align-items: center; justify-content: flex-end; min-width: 120px; }
.ns-ln { display: flex !important; gap: 5px; align-items: center; color: var(--nsok) !important; } .ns-ln.sg { color: var(--accent) !important; } .ns-ln i { display: grid; } .ns-ln svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 2; }
.ns-miss { border: 1px solid color-mix(in srgb, var(--danger) 35%, var(--line)); }
.ns-drop { position: relative; overflow: hidden; border: 1.5px dashed var(--line); border-radius: 18px; padding: 44px 24px; display: grid; justify-items: center; gap: 8px; text-align: center; cursor: pointer; background: var(--surface); transition: border-color .2s, background .2s; } .ns-drop:hover { border-color: var(--accent); background: var(--accent-soft); }
.ns-drop p { max-width: 460px; color: var(--muted); font-size: 13px; margin: 0 0 8px; } .ns-drop-i { width: 54px; height: 54px; border-radius: 16px; background: var(--accent-soft); color: var(--accent); display: grid; place-items: center; animation: nsFloat 3s ease-in-out infinite; } .ns-drop-i svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ns-scan { position: absolute; inset: 0; pointer-events: none; overflow: hidden; } .ns-scan i { position: absolute; left: 0; right: 0; height: 60px; background: linear-gradient(transparent, color-mix(in srgb, var(--accent) 12%, transparent), transparent); animation: nsScan 4s linear infinite; }
@keyframes nsScan { from { top: -60px; } to { top: 100%; } }
.ns-ifile { display: flex; gap: 12px; align-items: center; margin-bottom: 12px; } .ns-ifile i { width: 40px; height: 40px; border-radius: 12px; background: var(--accent-soft); color: var(--accent); display: grid; place-items: center; } .ns-ifile svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; } .ns-ifile small, .ns-ik small { display: block; color: var(--muted); font-size: 12px; }
.ns-ik { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 12px 0; } .ns-ik > div { background: var(--bg); border-radius: 12px; padding: 10px 12px; } .ns-ik span { font-size: 12px; color: var(--muted); } .ns-ik b { display: block; font-size: 18px; }
.ns-chk { display: flex; gap: 8px; align-items: center; font-size: 13px; margin-bottom: 10px; }
.ns-iprev { border: 1px solid var(--line); border-radius: 12px; overflow: hidden; } .ns-iprev > div { display: grid; grid-template-columns: 70px 1fr auto; gap: 8px; padding: 7px 10px; font-size: 12px; border-top: 1px solid var(--line); } .ns-iprev > div:first-child { border-top: 0; } .ns-iprev b { font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .ns-iprev em { font-style: normal; } .ns-iprev em.pos { color: var(--nsok); } .ns-iprev small { display: block; padding: 7px 10px; color: var(--muted); }
.ns-pk0 { display: flex; justify-content: space-between; gap: 10px; background: var(--bg); padding: 10px 12px; border-radius: 12px; margin-bottom: 10px; font-size: 13px; } .ns-pk0 span { color: var(--muted); }
.ns-pk { display: grid; gap: 6px; max-height: 40vh; overflow: auto; margin-bottom: 12px; } .ns-pki { display: grid; grid-template-columns: 36px 1fr auto; gap: 10px; align-items: center; text-align: left; border: 1px solid var(--line); background: var(--surface); border-radius: 12px; padding: 8px 10px; cursor: pointer; font: inherit; color: inherit; transition: border-color .15s; } .ns-pki:hover { border-color: var(--accent); } .ns-pki small { display: block; color: var(--muted); font-size: 12px; } .ns-pki .pos { color: var(--nsok); }
.ns-ph { display: flex; gap: 10px; align-items: center; border: 1px solid var(--line); border-radius: 12px; padding: 10px; } .ns-ph > div { flex: 1; min-width: 0; } .ns-ph small { display: block; color: var(--muted); font-size: 12px; } .ns-ph img { width: 54px; height: 54px; object-fit: cover; border-radius: 8px; } .ns-ph-i { width: 40px; height: 40px; border-radius: 12px; background: var(--bg); display: grid; place-items: center; color: var(--muted); } .ns-ph-i.ok { background: color-mix(in srgb, var(--nsok) 14%, transparent); color: var(--nsok); } .ns-ph-i svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; }
@media (max-width: 900px) { .ns-kpis, .ns-sum { grid-template-columns: repeat(2, 1fr); } .ns-g2 { grid-template-columns: 1fr; } }
@media (max-width: 700px) {
  .ns-sp { grid-template-columns: 36px minmax(0, 1fr) auto; row-gap: 6px; } .ns-sp .ns-me, .ns-sp .ns-rc { display: none; } .ns-sp .ns-st { grid-column: 2; justify-self: start; } .ns-sp .ns-ac { grid-column: 3; justify-self: end; }
  .ns-es { grid-template-columns: minmax(0, 1fr) auto; } .ns-es-d { grid-column: 1 / -1; } .ns-es .ns-st { justify-self: start; } .ns-ac2 { grid-column: 1 / -1; justify-content: flex-start; } .ns-hm { display: none; } .ns-mn b { min-width: 100px; }
}
@media (prefers-reduced-motion: reduce) { .ns-anim *, .ns-sp, .ns-lg, .ns-es, .ns-a, .ns-br, .ns-col-b i, .ns-br-b i, .ns-ring .fg, .ns-scan i, .ns-empty-i, .ns-drop-i, .ns-ok i { animation: none !important; } .ns-cc, .ns-cc::after { transition: none; } }
#ns-body .seg.ns-tabs, .seg.ns-sg { display: inline-flex; grid-template-columns: none; width: auto; max-width: 100%; }
.seg.ns-sg { display: flex; } .seg.ns-sg button { flex: 1; height: 36px; }
#ns-body .seg.ns-tabs button { height: 34px; padding: 0 14px; display: inline-flex; align-items: center; }
.ns-flt select { width: auto; min-width: 0; flex: 0 1 auto; } .ns-estb .ns-flt select { max-width: 260px; }
/* nota spese: badge banca + pillola metodo */
.ns-bk { --bk: #3362ab; --bki: #fff; display: inline-grid; place-items: center; min-width: 24px; height: 24px; padding: 0 5px; border-radius: 7px; background: var(--bk); color: var(--bki); font-size: 10px; font-weight: 800; letter-spacing: .02em; flex: none; box-shadow: 0 0 0 1.5px rgba(255,255,255,.35); animation: nsPop .5s cubic-bezier(.34,1.4,.5,1) backwards; }
.ns-bk b { font-weight: 800; }
.ns-cc-nm { display: inline-flex; align-items: center; gap: 8px; min-width: 0; } .ns-cc-nm b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ns-bi { display: flex; align-items: center; gap: 8px; } .ns-bi input { flex: 1; min-width: 0; } .ns-bi .ns-bk { box-shadow: none; } #ns-bb:empty { display: none; }
.ns-me { white-space: nowrap; align-self: center; flex: none; width: max-content; height: auto; flex-direction: row; } .ns-me .ns-bk { min-width: 20px; height: 20px; font-size: 9px; border-radius: 6px; box-shadow: none; }
@media (max-width: 1100px) { .ns-sp { grid-template-columns: 36px minmax(0, 1fr) auto auto auto; } .ns-sp .ns-me em { display: none; } .ns-sp .ns-rc { display: none; } .ns-sp .ns-st { grid-column: auto; } }
@media (max-width: 700px) { .ns-sp { grid-template-columns: 36px minmax(0, 1fr) auto; } .ns-sp .ns-me { display: none; } }

.ns-bbw { display: contents; font-style: normal; } .ns-bi { display: flex; align-items: center; gap: 8px; } .ns-bi input { flex: 1; min-width: 0; width: 100%; }
.ns-sp { display: flex !important; align-items: center; gap: 12px; flex-wrap: nowrap; } .ns-sp > .ns-sp-m { flex: 1 1 0; } .ns-sp > *:not(.ns-sp-m) { flex: none; } .ns-sp .ns-me { align-self: center; height: auto; }
.ns-sp .ns-ac { min-width: 0; } .ns-sp .ns-ac:empty { display: none; }
@media (max-width: 1100px) { .ns-sp .ns-me em { display: none; } .ns-sp .ns-rc { display: none; } }
@media (max-width: 700px) { .ns-sp { flex-wrap: wrap; row-gap: 6px; } .ns-sp .ns-me { display: none; } .ns-sp > .ns-sp-m { flex-basis: calc(100% - 140px); } .ns-sp .ns-ac { margin-left: auto; } }
.ns-bk.lg { position: relative; background: #fff; overflow: hidden; padding: 0; min-width: 26px; width: 26px; box-shadow: 0 0 0 1px rgba(0,0,0,.08); } .ns-bk.lg b { opacity: 0; } .ns-bk.lg img { position: absolute; inset: 3px; width: calc(100% - 6px); height: calc(100% - 6px); object-fit: contain; }
.ns-me .ns-bk.lg { width: 22px; min-width: 22px; } .ns-bi .ns-bk.lg { box-shadow: 0 0 0 1px var(--line); }