@font-face{font-family:'Inter Tight';src:url('fonts/InterTight.ttf') format('truetype');font-style:normal;font-weight:100 900;font-display:swap}
@font-face{font-family:'JetBrains Mono';src:url('fonts/JetBrainsMono.ttf') format('truetype');font-style:normal;font-weight:100 800;font-display:swap}
@font-face{font-family:'Caveat';src:url('fonts/Caveat.ttf') format('truetype');font-style:normal;font-weight:400 700;font-display:swap}

:root{
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-7:32px;--space-8:48px;
  --topbar:56px;--page-header:72px;--subtab:40px;--page-margin:24px;--page-margin-sm:20px;
  --sidebar:280px;--sidebar-collapsed:56px;--control-h:40px;--control-h-sm:32px;--control-px:12px;
  --button-px:16px;--row-h:44px;--row-h-dense:36px;--hit-min:44px;
  --radius-panel:12px;--radius-control:8px;--radius-chip:6px;--radius-full:999px;--border-width:1px;
  --shadow-card:0 1px 2px rgba(15,27,45,.04);--shadow-pop:0 18px 44px rgba(15,27,45,.14);
  --display-size:26px;--display-weight:600;--display-line:1;--display-tracking:-.025em;
  --metric-size:20px;--metric-weight:600;--metric-line:1.1;--metric-tracking:-.025em;
  --metric-sm-size:18px;--metric-sm-weight:600;--metric-sm-line:1.2;--metric-sm-tracking:-.015em;
  --title-size:15.5px;--title-weight:600;--title-line:1.3;--title-tracking:-.01em;
  --body-size:13px;--body-weight:400;--body-line:1.45;--body-strong-weight:600;
  --body-sm-size:13px;--body-sm-weight:400;--body-sm-line:1.45;
  --caption-size:12.5px;--caption-weight:400;--caption-line:1.4;
  --micro-size:12px;--micro-weight:400;--micro-line:1.35;
  --mono-size:12px;--mono-weight:500;--mono-line:1.3;--mono-sm-size:11.5px;--mono-sm-weight:400;--mono-sm-line:1.3;
  --overline-size:10.5px;--overline-weight:500;--overline-line:1.2;--overline-tracking:.13em;
  --tag-size:9.5px;--tag-weight:500;--tag-line:1.2;--tag-tracking:.06em;
  --text:#0F1B2D;--text-2:#3D4657;--text-3:#6B6862;--text-4:#8A8578;--text-disabled:#A8A29A;
  --text-inverse:#FBF9F5;--link:#2563EB;--link-hover:#1D4ED8;
  --bg:#FBF9F5;--surface:#FFFFFF;--surface-2:#F4F1EA;--surface-3:#F2EFE8;--surface-hover:#FCFBF8;
  --border:#E7E2D8;--border-2:#EDE9E0;--border-strong:#D3CCBE;
  --ink:#0F1B2D;--accent:#E8590C;--accent-soft:#FBEAE0;--accent-text:#C2410C;
  --info:#2563EB;--info-soft:#E4EDFB;--positive:#2F8F5B;--positive-soft:#EDF6F0;--positive-text:#1F6B45;--negative:#B3261E;
  --navy:var(--ink);--navy-dark:var(--ink);--orange:var(--accent);--card:var(--surface);
  --line:var(--border);--line2:var(--border-2);--muted:var(--text-3);--light:var(--text-4);
  --blue:var(--info);--blue-light:var(--surface-2);--grey:var(--text-disabled);--grey-bg:var(--surface-2);
  --green:var(--positive-text);--green-bg:var(--positive-soft);--amber:var(--accent-text);--amber-bg:var(--accent-soft);
  --red:var(--negative);--red-bg:#FCEAEA;--radius:var(--radius-control);--radius-lg:var(--radius-panel);
  --shadow-sm:var(--shadow-card);--shadow-md:var(--shadow-pop);
  --measure:68ch;--bar-track:200px;--bar-track-lg:280px;--chart-min:320px;--panel-detail:200px;
  --popover:400px;--modal:560px;--content-width:100%;
  /* Token condivisi di tipografia, superfici e grafici. */
  --font-sans:'Inter Tight',Helvetica,Arial,sans-serif;--font-mono:'JetBrains Mono',ui-monospace,Menlo,monospace;
  --font-hand:'Caveat','Segoe Print','Bradley Hand',cursive;
  --surface-sunken:#F7F4EE;--radius-card:var(--radius-panel);--radius-lg-panel:14px;
  --warning:#B45309;--warning-soft:#FDF1DE;--warning-text:#92400E;
  --focus-ring:0 0 0 3px rgba(37,99,235,.18);--shadow-raise:0 6px 18px rgba(15,27,45,.07);
  --ease-out:cubic-bezier(.22,.8,.24,1);--dur:180ms;
  /* Toni di famiglia per mappe, legende e tratteggi (stessi della tab Settori). */
  --tone-blue:#2563EB;--tone-blue-tint:#E4EDFB;--tone-navy:#1E3A5F;--tone-navy-tint:#E6EAF0;
  --tone-mist:#6E86AD;--tone-mist-tint:#EEF1F6;--tone-warm:#6B6862;--tone-warm-tint:#F0EDE8;
  --hatch-navy:repeating-linear-gradient(45deg,var(--tone-navy) 0 1.4px,var(--tone-navy-tint) 1.4px 4.5px);
  --hatch-accent:repeating-linear-gradient(45deg,var(--accent) 0 1.4px,var(--accent-soft) 1.4px 4.5px);
}

/* Ogni pagina ridichiarava box-sizing nel proprio <style> inline; una pagina
   che se lo dimenticava sforava in larghezza perche il padding si sommava.
   Dichiarato una volta qui, dove stanno i token. */
*,*::before,*::after{box-sizing:border-box}

.workspace-light{
  font-family:'Inter Tight',Helvetica,sans-serif!important;font-size:var(--body-size);font-weight:var(--body-weight);
  line-height:var(--body-line);color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;
  font-variant-numeric:tabular-nums;scrollbar-width:thin;scrollbar-color:#ddd9d3 transparent;
}
.workspace-light ::-webkit-scrollbar{width:6px;height:6px}
.workspace-light ::-webkit-scrollbar-track{background:transparent}
.workspace-light ::-webkit-scrollbar-thumb{background:#ddd9d3;border-radius:4px}
.workspace-light :where(*){font-family:'Inter Tight',Helvetica,sans-serif;font-style:normal}
.workspace-light :where(button,input,select,textarea){
  font-family:'Inter Tight',Helvetica,sans-serif!important;font-size:var(--body-size);font-weight:var(--body-weight);line-height:var(--body-line);
}
.workspace-light :where(.card-header h1,.database-page .card-title){
  font:var(--display-weight) var(--display-size)/var(--display-line) 'Inter Tight',Helvetica,sans-serif!important;
  letter-spacing:var(--display-tracking)!important;color:var(--text);
}
.workspace-light :where(.card-title h2,.section-title,.modal h2){
  font:var(--title-weight) var(--title-size)/var(--title-line) 'Inter Tight',Helvetica,sans-serif!important;
  letter-spacing:var(--title-tracking)!important;color:var(--text);
}
.workspace-light :where(.kpi-val,.kpi .value,.metric-item .value){
  font:var(--metric-weight) var(--metric-size)/var(--metric-line) 'Inter Tight',Helvetica,sans-serif!important;
  letter-spacing:var(--metric-tracking)!important;font-variant-numeric:tabular-nums;
}
.workspace-light :where(th,.overline,.rp-label,.af-title,.metrics-head span,.kpi .label){
  font:var(--overline-weight) var(--overline-size)/var(--overline-line) 'JetBrains Mono',monospace!important;
  letter-spacing:var(--overline-tracking)!important;text-transform:uppercase;color:var(--text-4);
}
.workspace-light :where(td.num,.card-stat b,.bar-row b,.bar-row em,.bar-row strong,.funnel-row span:not(:first-child)){
  font:var(--mono-weight) var(--mono-size)/var(--mono-line) 'JetBrains Mono',monospace!important;font-variant-numeric:tabular-nums;
}
.workspace-light :where(.badge,.tag){border-radius:var(--radius-chip)!important}
.workspace-light :where(p,.section-desc,.hint){text-wrap:pretty}
.workspace-light :where(.section-desc,.hint,.meta){font-size:var(--caption-size);line-height:var(--caption-line);color:var(--text-3)}
.workspace-light :where(input,textarea)::placeholder{color:var(--text-disabled)}
.workspace-light a:not(.topbar-brand):not(.topbar-item){color:var(--link)}
.workspace-light a:not(.topbar-brand):not(.topbar-item):hover{color:var(--link-hover)}
.workspace-light :where(.card,.metrics-card,.kpi-card){
  border:var(--border-width) solid var(--border);border-radius:var(--radius-panel);background:var(--surface);box-shadow:var(--shadow-card);
}
.workspace-light :where(input,select,textarea,button,.btn,.rp-input,.rp-select,.rp-btn){border-radius:var(--radius-control)}
.workspace-light table{font-variant-numeric:tabular-nums}
.workspace-light tbody tr:hover{background:var(--surface-hover)}
.workspace-light :where(.negativo,.negative){color:var(--negative)!important}
.workspace-light .badge.verde{background:var(--positive-soft);color:var(--positive-text)}
.workspace-light .badge.arancione{background:var(--accent-soft);color:var(--accent-text)}
.workspace-light .badge.rosso{background:#FCEAEA;color:var(--negative)}
.workspace-light .badge.grigio{background:var(--surface-2);color:var(--text-4)}

@media(max-width:1199px){:root{--page-margin:var(--page-margin-sm)}}

/* ── Base condivisa ────────────────────────────────────────────────────── */
.workspace-light ::selection{background:var(--accent-soft);color:var(--text)}
.workspace-light :where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:none;box-shadow:var(--focus-ring)}
.workspace-light :where(input,select,textarea):focus{border-color:#9DB5E8}
@media (prefers-reduced-motion:reduce){.workspace-light *{transition-duration:0s!important;animation-duration:0s!important}}
