/* Easycom OS — Atelier Console: Dark Editorial Cockpit */

/* --- Self-hosted fonts (latin subset, woff2) --- */
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/inter-400.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/inter-500.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/inter-600.woff2') format('woff2')}
@font-face{font-family:'Geist';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/geist-600.woff2') format('woff2')}
@font-face{font-family:'Geist';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/geist-700.woff2') format('woff2')}
/* Display face — Bricolage Grotesque (variable, latin), self-hosted: unifies gestionale + public site */
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:500 800;font-display:swap;src:url('fonts/bricolage.woff2') format('woff2')}

/* ============================================================
   TOKENS
   ============================================================ */
:root{
  /* --- PRIMITIVES (hue layer — darkened so they read on a light canvas) --- */
  --teal:oklch(58% 0.11 200);
  --indigo:oklch(52% 0.16 270);
  --rose:oklch(56% 0.18 18);
  --amber:oklch(64% 0.14 70);
  --green:oklch(56% 0.13 158);

  /* --- SURFACE / TINT LADDER (Apple light: parchment ground, white panels) --- */
  --bg:#f5f5f7;
  --bg-2:#eeeef1;
  --panel:#ffffff;
  --panel-2:#ffffff;
  --surface:#f0f0f3;
  --surface-2:#e6e6ec;

  /* --- HAIRLINES (black-alpha on light) --- */
  --line:oklch(0% 0 0 / 0.10);
  --line-2:oklch(0% 0 0 / 0.16);
  --border:var(--line);

  /* --- TEXT (Apple ink ladder) --- */
  --text:#1d1d1f;
  --muted:#6e6e73;
  --muted-2:#86868b;
  --faint:#a1a1a6;

  /* --- ROLE / SEMANTIC ACCENTS --- */
  --accent:#004aad;            /* Easycom royal blue — brand ufficiale (easycomitalia.com) */
  --on-accent:#ffffff;
  --focus-ring:oklch(48% 0.18 255 / 0.45);

  --color-success:var(--green);
  --color-warning:var(--amber);
  --color-danger:var(--rose);
  --color-info:var(--indigo);
  --bad:var(--color-danger);

  /* wayfinding accent — kept uniform (Apple: one accent) */
  --section-accent:var(--accent);

  /* --- ALPHA SCALE (state tints) --- */
  --tint-subtle:0.08;
  --tint-soft:0.14;
  --tint-strong:0.30;

  /* --- GENERATED STATE FILLS / TEXT / BORDERS (mix toward BLACK for contrast on light) --- */
  --bg-success:color-mix(in oklch, var(--color-success) 12%, transparent);
  --fg-success:color-mix(in oklch, var(--color-success) 82%, black);
  --border-success:color-mix(in oklch, var(--color-success) 34%, transparent);

  --bg-warning:color-mix(in oklch, var(--color-warning) 14%, transparent);
  --fg-warning:color-mix(in oklch, var(--color-warning) 78%, black);
  --border-warning:color-mix(in oklch, var(--color-warning) 34%, transparent);

  --bg-danger:color-mix(in oklch, var(--color-danger) 12%, transparent);
  --fg-danger:color-mix(in oklch, var(--color-danger) 80%, black);
  --border-danger:color-mix(in oklch, var(--color-danger) 34%, transparent);

  --bg-info:color-mix(in oklch, var(--color-info) 12%, transparent);
  --fg-info:color-mix(in oklch, var(--color-info) 80%, black);
  --border-info:color-mix(in oklch, var(--color-info) 34%, transparent);

  /* --- BRAND SIGNATURE GRADIENT (rationed) — Easycom blue family --- */
  --grad:linear-gradient(120deg, oklch(66% 0.12 248), #004aad 52%, oklch(34% 0.12 268));

  /* --- ELEVATION (Apple-soft, tinted toward background) --- */
  --shadow-1:0 1px 2px oklch(0% 0 0 / .05);
  --shadow-2:0 6px 20px -8px oklch(0% 0 0 / .10);
  --shadow-3:0 24px 60px -18px oklch(0% 0 0 / .16);
  --edge-light:inset 0 1px 0 oklch(100% 0 0 / 0);   /* no-op on light */

  /* --- RADIUS --- */
  --radius-xs:6px;
  --radius-sm:9px;
  --radius-md:12px;
  --radius-lg:16px;
  --radius-xl:20px;
  --radius-pill:999px;

  /* --- SPACING (base-4) --- */
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-5:20px;
  --space-6:24px;
  --space-7:32px;
  --space-8:40px;
  --space-section:clamp(2.5rem,2rem + 3vw,4.5rem);

  /* --- MOTION --- */
  --duration-fast:120ms;
  --duration-normal:180ms;
  --duration-slow:250ms;
  --ease-out:cubic-bezier(.16,1,.3,1);
  --ease-standard:cubic-bezier(.2,.7,.3,1);

  /* --- TYPE SCALE --- */
  --text-2xs:11px;
  --text-xs:12px;
  --text-sm:13px;
  --text-base:15px;
  --text-md:17px;
  --text-h3:clamp(1.05rem,1rem + 0.3vw,1.1875rem);
  --text-h2:clamp(1.25rem,1.1rem + 0.6vw,1.5rem);
  --text-h1:clamp(1.375rem,1.2rem + 0.7vw,1.625rem);
  --text-display:clamp(1.875rem,1.4rem + 2vw,2.75rem);
  --text-display-sm:clamp(1.375rem,1.2rem + 0.8vw,1.625rem);

  /* --- FONT STACK (SF Pro first to match easycom.one homepage) --- */
  --fb:-apple-system,BlinkMacSystemFont,'SF Pro Text','Inter',system-ui,'Segoe UI',Roboto,sans-serif;
  --fd:-apple-system,BlinkMacSystemFont,'SF Pro Display','Bricolage Grotesque','Inter',system-ui,'Segoe UI',sans-serif;
  --fm:ui-monospace,Menlo,Consolas,monospace;
}

/* --- WAYFINDING: domain accent flips --- */
.sec-finance{--section-accent:var(--accent)}
.sec-crm{--section-accent:var(--accent)}
.sec-academy{--section-accent:var(--accent)}
.sec-ai{--section-accent:var(--accent)}

/* ============================================================
   BASE
   ============================================================ */
*{margin:0;padding:0;box-sizing:border-box}
body{
  font-family:var(--fb);background:var(--bg);color:var(--text);
  font-size:var(--text-base);line-height:1.5;
  font-feature-settings:'cv05','ss01';
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  position:relative;
}

/* Atmosphere layer — fixed, never affects layout/scroll */
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background:none;
}
body > *{position:relative;z-index:1}

a{color:inherit;text-decoration:none}
h1,h2,h3{letter-spacing:-.01em;line-height:1.15;font-family:var(--fd)}
h2{font-size:var(--text-h2);letter-spacing:-.015em}
h3{font-size:var(--text-h3);font-weight:600;margin-bottom:var(--space-1)}
small{font-size:var(--text-xs)}
code{background:var(--surface-2);padding:1px 6px;border-radius:var(--radius-xs);font-size:var(--text-xs);font-family:var(--fm)}
hr{border:none;border-top:1px solid var(--line);margin:var(--space-5) 0}

/* --- UNIVERSAL FOCUS-VISIBLE RING --- */
:focus-visible{outline:none;box-shadow:0 0 0 3px var(--focus-ring);border-radius:inherit}

/* --- ACCESSIBILITÀ: skip-link + sr-only --- */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:-9999px;top:8px;z-index:200;background:var(--accent);color:var(--on-accent);padding:9px 16px;border-radius:var(--radius-sm);font-weight:600;font-size:14px}
.skip-link:focus{left:12px}
.content:focus{outline:none}

/* ============================================================
   LAYOUT
   ============================================================ */
.layout{display:flex;min-height:100vh}
.sidebar{width:248px;flex-shrink:0;background:var(--bg-2);border-right:1px solid var(--line);display:flex;flex-direction:column;position:sticky;top:0;height:100vh}
.brand{font-size:20px;font-weight:600;padding:22px 22px 18px;font-family:var(--fd);letter-spacing:-.02em}
.brand .dot{
  background:var(--grad);-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:var(--teal);
}
.brand small{color:var(--muted);font-weight:500;font-size:var(--text-xs);letter-spacing:.12em;text-transform:uppercase}
.brand.center{text-align:center;padding:6px 0 18px}
.brand-logo{display:block;height:30px;width:auto;max-width:100%}
.brand.center .brand-logo{margin:0 auto;height:42px}

.nav{flex:1;padding:6px 12px;display:flex;flex-direction:column;gap:2px;overflow-y:auto}
.nav-link{
  display:flex;align-items:center;gap:11px;padding:10px 13px;
  border-radius:var(--radius-sm);color:var(--muted);font-weight:500;font-size:14.5px;
  transition:background-color var(--duration-fast) var(--ease-standard),
             color var(--duration-fast) var(--ease-standard),
             box-shadow var(--duration-fast) var(--ease-out);
}
.nav-link .ic{width:20px;text-align:center;opacity:.8;transition:color var(--duration-fast) var(--ease-standard)}
.nav-link:hover{background:var(--surface);color:var(--text)}
.nav-link:active{background:var(--surface-2)}
.nav-link:focus-visible{box-shadow:0 0 0 3px var(--focus-ring)}
.nav-link.on{
  color:var(--text);background:transparent;
  box-shadow:inset 3px 0 0 var(--section-accent);
}
.nav-link.on:hover{background:var(--surface)}
.nav-link.on .ic{color:var(--section-accent);opacity:1}
.nav-group{display:flex;flex-direction:column;gap:2px}
.nav-group>summary{list-style:none;cursor:pointer}
.nav-group>summary::-webkit-details-marker{display:none}
.nav-group>summary .nav-caret{margin-left:auto;font-size:10px;opacity:.55;transition:transform var(--duration-fast) var(--ease-standard)}
.nav-group[open]>summary .nav-caret{transform:rotate(90deg)}
.nav-sub{display:flex;flex-direction:column;gap:2px;margin-top:2px;border-left:1px solid var(--line);padding-left:12px;margin-left:8px}
.nav-sub .nav-link{padding-left:18px;font-size:14px}

.side-foot{border-top:1px solid var(--line);padding:14px}
.who{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.avatar{width:36px;height:36px;border-radius:50%;background:var(--grad);color:var(--on-accent);display:grid;place-items:center;font-weight:700;box-shadow:var(--edge-light),var(--shadow-1)}
.who-txt strong{display:block;font-size:14px}
.who-txt small{color:var(--muted)}
.logout{
  display:block;text-align:center;padding:8px;border:1px solid var(--line);
  border-radius:var(--radius-sm);color:var(--muted);font-size:var(--text-sm);
  transition:border-color var(--duration-fast) var(--ease-standard),
             color var(--duration-fast) var(--ease-standard),
             background-color var(--duration-fast) var(--ease-standard);
}
.logout:hover{border-color:var(--line-2);color:var(--text);background:var(--surface)}
.logout:focus-visible{box-shadow:0 0 0 3px var(--focus-ring)}

.main{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{
  display:flex;align-items:center;gap:14px;padding:18px 28px;
  border-bottom:1px solid var(--line);position:sticky;top:0;
  background:color-mix(in oklch, var(--bg) 82%, transparent);
  backdrop-filter:blur(14px) saturate(1.4);z-index:30;
}
.topbar h1{font-size:var(--text-h1);font-weight:650;letter-spacing:-.02em;font-family:var(--fd);flex:1;min-width:0}
.topbar-meta{display:flex;flex-direction:column;align-items:flex-end;gap:2px;font-size:var(--text-xs);color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.topbar-actions{display:flex;align-items:center;gap:10px;flex-shrink:0}
.burger{display:none;background:none;border:none;color:var(--text);font-size:22px;cursor:pointer}
.sb-toggle{
  display:inline-flex;align-items:center;justify-content:center;background:none;
  border:1px solid var(--line);color:var(--muted);font-size:15px;cursor:pointer;
  width:34px;height:34px;border-radius:var(--radius-sm);flex-shrink:0;
  transition:background-color var(--duration-fast) var(--ease-standard),
             color var(--duration-fast) var(--ease-standard),
             border-color var(--duration-fast) var(--ease-standard);
}
.sb-toggle:hover{background:var(--surface);color:var(--text);border-color:var(--line-2)}
.sb-toggle:focus-visible{box-shadow:0 0 0 3px var(--focus-ring)}
@media(min-width:901px){.layout.sb-collapsed .sidebar{display:none}}
.content{padding:24px 28px 60px;max-width:1280px;width:100%}
.content.is-reading{max-width:880px}
.appfoot{padding:18px 28px;color:var(--faint);font-size:var(--text-xs);border-top:1px solid var(--line)}

/* ============================================================
   SECTION RHYTHM
   ============================================================ */
.section-gap{margin-top:var(--space-section)}
.section-title{
  display:flex;align-items:center;gap:12px;
  font-size:var(--text-2xs);font-weight:600;color:var(--muted);
  text-transform:uppercase;letter-spacing:.08em;margin-bottom:14px;
  font-family:var(--fb);
}
.section-title::after{content:"";flex:1;height:1px;background:var(--line)}

/* ============================================================
   CARDS / GRID
   ============================================================ */
.card{
  background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:20px;margin-bottom:18px;
  box-shadow:var(--shadow-1),var(--edge-light);
  transition:transform var(--duration-fast) var(--ease-out),
             border-color var(--duration-fast) var(--ease-standard),
             box-shadow var(--duration-fast) var(--ease-out);
}
.card.is-hero{
  padding:24px;box-shadow:var(--shadow-2),var(--edge-light);
  border-left:2px solid var(--section-accent);
}
.card.is-quiet{background:var(--bg-2);border-color:var(--line);box-shadow:none}
.card.is-flush{padding:14px}
a.card,.card.is-link{cursor:pointer}
a.card:hover,.card.is-link:hover{transform:translateY(-1px);border-color:var(--line-2);box-shadow:var(--shadow-2),var(--edge-light)}
a.card:focus-visible,.card.is-link:focus-visible{box-shadow:0 0 0 3px var(--focus-ring)}

.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.grid-2 .card{margin-bottom:0}
.span-2{grid-column:1 / -1}
.card-h{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.card-h h3{margin:0}

/* Bento layout */
.bento{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--space-4)}
.bento .card{margin-bottom:0}
.col-12{grid-column:span 12}
.col-8{grid-column:span 8}
.col-6{grid-column:span 6}
.col-4{grid-column:span 4}

/* ============================================================
   KPI
   ============================================================ */
.kpi-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin-bottom:18px}
.kpi{
  background:linear-gradient(180deg,var(--panel),var(--panel-2));
  border:1px solid var(--line);border-radius:var(--radius-md);
  padding:14px 13px;display:flex;flex-direction:column;gap:3px;min-width:0;overflow:hidden;
  box-shadow:var(--shadow-1),var(--edge-light);
  transition:transform var(--duration-fast) var(--ease-out),
             box-shadow var(--duration-fast) var(--ease-out),
             border-color var(--duration-fast) var(--ease-standard);
}
.kpi.small{padding:12px 12px}
.kpi.is-primary{padding:16px 15px;box-shadow:var(--shadow-2),var(--edge-light);border-left:2px solid var(--section-accent)}
a.kpi{cursor:pointer}
a.kpi:hover{transform:translateY(-1px);box-shadow:var(--shadow-2),var(--edge-light);border-color:var(--line-2)}
a.kpi:focus-visible{box-shadow:0 0 0 3px var(--focus-ring)}
/* semantic state on the card */
.kpi:has(.kpi-v.bad){box-shadow:inset 0 2px 0 var(--color-danger),var(--shadow-1),var(--edge-light)}
.kpi:has(.kpi-v.warn){box-shadow:inset 0 2px 0 var(--color-warning),var(--shadow-1),var(--edge-light)}
.kpi:has(.kpi-v.ok),.kpi:has(.kpi-v.good){box-shadow:inset 0 2px 0 var(--color-success),var(--shadow-1),var(--edge-light)}

.kpi-l{font-size:var(--text-2xs);color:var(--muted);text-transform:uppercase;letter-spacing:.05em;display:block;line-height:1.25;text-wrap:balance}
.kpi-v{font-size:var(--text-display-sm);font-weight:650;font-variant-numeric:tabular-nums;letter-spacing:-.01em;line-height:1.1}
.kpi.is-primary .kpi-v{font-size:var(--text-display);font-weight:680;letter-spacing:-.025em}
.kpi.small .kpi-v{font-size:var(--text-display-sm)}
@media(max-width:1100px){.kpi-row{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}}
.kpi-s{font-size:var(--text-xs);color:var(--muted-2);font-variant-numeric:tabular-nums}
.kpi-v.ok,.ok{color:var(--fg-success)}
.kpi-v.warn,.warn{color:var(--fg-warning)}
.kpi-v.bad,.bad{color:var(--fg-danger)}
.kpi-v.good,.good{color:var(--fg-success)}

/* ============================================================
   TABS / PILLS / CHIPS
   ============================================================ */
.tabs{display:flex;gap:6px;margin-bottom:16px;flex-wrap:wrap}
.tabs .tab{
  position:relative;padding:8px 16px;border-radius:var(--radius-sm);
  border:1px solid var(--line);color:var(--muted);font-weight:600;font-size:14px;
  overflow:hidden;
  transition:color var(--duration-fast) var(--ease-standard),
             border-color var(--duration-fast) var(--ease-standard),
             background-color var(--duration-fast) var(--ease-standard);
}
.tabs .tab::after{
  content:"";position:absolute;left:0;bottom:0;height:2px;width:100%;
  background:var(--grad);transform:scaleX(0);transform-origin:left;
  transition:transform var(--duration-normal) var(--ease-out);
}
.tabs .tab:hover{color:var(--text);border-color:var(--line-2)}
.tabs .tab:focus-visible{box-shadow:0 0 0 3px var(--focus-ring)}
.tabs .tab.on{background:var(--surface-2);color:var(--text);border-color:var(--line-2)}
.tabs .tab.on::after{transform:scaleX(1)}

.pill-row{display:flex;gap:6px;flex-wrap:wrap}
.pill{
  padding:6px 13px;border-radius:var(--radius-pill);border:1px solid var(--line);
  color:var(--muted);font-size:var(--text-sm);font-weight:600;cursor:pointer;
  transition:color var(--duration-fast) var(--ease-standard),
             border-color var(--duration-fast) var(--ease-standard),
             background-color var(--duration-fast) var(--ease-standard),
             transform var(--duration-fast) var(--ease-out);
}
.pill:hover{color:var(--text);border-color:var(--line-2);transform:translateY(-1px)}
.pill:focus-visible{box-shadow:0 0 0 3px var(--focus-ring)}
.pill.on{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}

.tbl-hover tr:hover td{background:var(--surface);box-shadow:inset 3px 0 0 var(--section-accent)}
.tbl-tot td{border-top:2px solid var(--line-2);background:var(--surface)}
.sla-row{margin:10px 0}
.sla-h{display:flex;justify-content:space-between;font-size:var(--text-sm);margin-bottom:3px;font-variant-numeric:tabular-nums}
.cal-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:6px 0 10px}
.cal-day{padding:16px}
.cal-today{border-color:var(--section-accent);box-shadow:inset 0 0 0 1px var(--section-accent)}
.ep-item{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;padding:10px 0;border-top:1px solid var(--line)}
.ep-item:first-of-type{border-top:none}
.ep-main{min-width:0;display:flex;flex-direction:column;gap:4px}
.ep-main strong{font-size:14.5px}
.ep-side{display:flex;align-items:center;gap:8px;flex-shrink:0}

/* ============================================================
   TABLES
   ============================================================ */
.tbl{width:100%;border-collapse:collapse;font-size:14px}
.tbl th{text-align:left;color:var(--muted);font-weight:600;font-size:var(--text-2xs);text-transform:uppercase;letter-spacing:.05em;padding:8px 10px;border-bottom:1px solid var(--line)}
.tbl td{padding:10px;border-bottom:1px solid var(--line);vertical-align:top}
.tbl tr:last-child td{border-bottom:none}
.tbl .r{text-align:right;font-variant-numeric:tabular-nums}
.tbl .strong,.tbl a.strong{font-weight:600}
.tbl tr.done td{opacity:.5}
.tbl .total-row td{font-weight:650;border-top:2px solid var(--line-2);font-variant-numeric:tabular-nums;color:var(--text)}
.tbl.inv td,.tbl.inv{font-size:14.5px}
.tbl.inv tbody tr:nth-child(even) td{background:oklch(0% 0 0 / .025)}
.tbl.inv tr.sub td{border-top:1px solid var(--line-2);font-weight:600;font-variant-numeric:tabular-nums}
.tbl.inv tr.total td{font-size:var(--text-md);font-weight:700;border-top:2px solid var(--line-2);font-variant-numeric:tabular-nums;color:var(--fg-success)}
.nowrap{white-space:nowrap}
.subrow td{padding-top:0;border-bottom:1px solid var(--line)}

/* ============================================================
   BADGES
   ============================================================ */
.badge{display:inline-block;padding:3px 9px;border-radius:var(--radius-pill);font-size:var(--text-2xs);font-weight:600;border:1px solid var(--line-2)}
.b-green{background:var(--bg-success);color:var(--fg-success);border-color:var(--border-success)}
.b-amber{background:var(--bg-warning);color:var(--fg-warning);border-color:var(--border-warning)}
.b-rose{background:var(--bg-danger);color:var(--fg-danger);border-color:var(--border-danger)}
.b-indigo{background:var(--bg-info);color:var(--fg-info);border-color:var(--border-info)}
.b-grey{background:var(--surface-2);color:var(--muted);border-color:var(--line-2)}

/* ============================================================
   BUTTONS
   ============================================================ */
.btn{
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:var(--fb);font-weight:600;font-size:14px;padding:10px 18px;
  border-radius:var(--radius-sm);border:1px solid var(--line);
  background:var(--surface);color:var(--text);cursor:pointer;
  box-shadow:var(--edge-light);
  transition:background-color var(--duration-fast) var(--ease-standard),
             border-color var(--duration-fast) var(--ease-standard),
             box-shadow var(--duration-fast) var(--ease-out),
             transform var(--duration-fast) var(--ease-out);
}
.btn:hover{background:var(--surface-2);border-color:var(--line-2);transform:translateY(-1px)}
.btn:active{transform:translateY(0) scale(.99)}
.btn:focus-visible{box-shadow:0 0 0 3px var(--focus-ring)}

.btn-primary{
  background:var(--accent);color:#fff;border-color:var(--accent);overflow:hidden;
  box-shadow:var(--edge-light),0 6px 18px -12px oklch(0% 0 0 / .8);
}
.btn-primary::after{
  content:"";position:absolute;inset:0;opacity:0;
  background:var(--grad);mix-blend-mode:overlay;
  transition:opacity var(--duration-normal) var(--ease-out);
}
.btn-primary:hover{box-shadow:0 8px 24px -10px oklch(48% 0.16 255 / .45);background:color-mix(in oklch,var(--accent) 90%,black);transform:translateY(-1px)}
.btn-primary:hover::after{opacity:.5}
.btn-primary:focus-visible{box-shadow:0 0 0 3px color-mix(in oklch,var(--color-info) 55%,transparent)}

.btn-danger{border-color:var(--border-danger);color:var(--fg-danger);background:var(--bg-danger)}
.btn-danger:hover{background:color-mix(in oklch,var(--color-danger) 20%,transparent);border-color:var(--color-danger)}
.btn-danger:focus-visible{box-shadow:0 0 0 3px color-mix(in oklch,var(--color-danger) 40%,transparent)}
.btn.full{width:100%}
.btn-stack{display:flex;flex-direction:column;gap:10px}

.link{color:var(--accent);font-weight:600;background:none;border:none;cursor:pointer;font-size:var(--text-sm);font-family:var(--fb);padding:0;transition:color var(--duration-fast) var(--ease-standard)}
.link:hover{text-decoration:underline}
.link:focus-visible{outline:1px solid var(--accent);outline-offset:2px;box-shadow:none}
.link.danger{color:var(--fg-danger)}

.x{
  background:none;border:none;color:var(--muted-2);cursor:pointer;font-size:var(--text-sm);
  padding:2px 5px;border-radius:var(--radius-xs);
  transition:color var(--duration-fast) var(--ease-standard),
             background-color var(--duration-fast) var(--ease-standard);
}
.x:hover{color:var(--color-danger);background:var(--bg-danger)}
.x:focus-visible{box-shadow:0 0 0 3px color-mix(in oklch,var(--color-danger) 40%,transparent)}
.inline{display:inline}
.form-actions{display:flex;gap:10px;margin-top:18px;flex-wrap:wrap}

/* ============================================================
   FORMS
   ============================================================ */
.form label{display:block;font-size:var(--text-sm);color:var(--muted);margin:12px 0 5px;font-weight:500}
.input{
  width:100%;background:var(--bg-2);border:1px solid var(--line);border-radius:var(--radius-sm);
  padding:10px 12px;color:var(--text);font-family:var(--fb);font-size:14.5px;
  box-shadow:var(--edge-light);
  transition:border-color var(--duration-fast) var(--ease-standard),
             box-shadow var(--duration-fast) var(--ease-out),
             background-color var(--duration-fast) var(--ease-standard);
}
.input:hover:not(:disabled){border-color:var(--line-2)}
.input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--focus-ring)}
.input:focus-visible{box-shadow:0 0 0 3px var(--focus-ring)}
.input:disabled{opacity:.55}
.input.is-error,.input[aria-invalid="true"]{border-color:var(--color-danger);box-shadow:0 0 0 3px color-mix(in oklch,var(--color-danger) 14%,transparent)}
select.input{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%238C8C98' stroke-width='2'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:32px}
select.input.is-error,select.input[aria-invalid="true"]{border-color:var(--color-danger)}
textarea.input{resize:vertical}
.mini{
  background:var(--bg-2);border:1px solid var(--line);border-radius:var(--radius-xs);
  color:var(--text);padding:5px 8px;font-size:var(--text-xs);font-family:var(--fb);
  transition:border-color var(--duration-fast) var(--ease-standard),box-shadow var(--duration-fast) var(--ease-out);
}
.mini:hover{border-color:var(--line-2)}
.mini:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--focus-ring)}
.mini:focus-visible{box-shadow:0 0 0 3px var(--focus-ring)}
.row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.checks{display:flex;flex-wrap:wrap;gap:10px 16px;padding:6px 0}
.chk{display:inline-flex;align-items:center;gap:7px;font-size:var(--text-sm);color:var(--text);cursor:pointer;margin-top:8px;transition:color var(--duration-fast) var(--ease-standard)}
.chk:focus-within{color:var(--accent)}
.chk input{accent-color:var(--accent)}
.chk input:focus-visible{outline:2px solid var(--accent);outline-offset:2px;box-shadow:none}
.mini-form{margin-top:12px;border-top:1px solid var(--line);padding-top:12px}
.inline-form{display:flex;gap:8px;align-items:flex-end;margin-top:8px}
.inline-form .input{width:auto;flex:1}
.form-card{max-width:760px}

/* details add */
.add{margin-top:14px;border-top:1px solid var(--line);padding-top:10px}
.add summary{cursor:pointer;color:var(--accent);font-weight:600;font-size:var(--text-sm);list-style:none}
.add summary::-webkit-details-marker{display:none}

/* filters / chips */
.filters{display:flex;flex-wrap:wrap;gap:8px}
.chip{
  padding:6px 13px;border-radius:var(--radius-pill);border:1px solid var(--line);
  background:transparent;font-family:var(--fb);
  color:var(--muted);font-size:var(--text-sm);font-weight:500;cursor:pointer;
  transition:color var(--duration-fast) var(--ease-standard),
             border-color var(--duration-fast) var(--ease-standard),
             background-color var(--duration-fast) var(--ease-standard),
             transform var(--duration-fast) var(--ease-out);
}
.chip:hover{border-color:var(--line-2);color:var(--text);transform:translateY(-1px)}
.chip:focus-visible{box-shadow:0 0 0 3px var(--focus-ring)}
.chip.on{background:var(--surface-2);color:var(--text);border-color:var(--line-2)}

/* chips dati social (virali + pubblicazioni 7gg): scure, bordo nella tinta piattaforma */
.ec-instagram{--pf:#e1559a}
.ec-tiktok{--pf:#4cc9f0}
.ec-facebook{--pf:#5b7bd5}
.chip-dark{
  background:oklch(0% 0 0 / .045);color:var(--text);
  border-color:color-mix(in srgb, var(--pf, var(--line-2)) 45%, transparent);
}
.chip-dark:hover{border-color:var(--pf,var(--line-2));background:oklch(0% 0 0 / .07);color:var(--text)}
.chip-dark strong{color:var(--text)}
.chip-dark .badge.b-indigo{background:color-mix(in oklch, var(--color-info) 24%, var(--bg-2));color:var(--fg-info);border-color:var(--border-info)}
span.chip-dark{cursor:default}
span.chip-dark:hover{transform:none}

/* muted helpers */
.muted{color:var(--muted)}
.small{font-size:var(--text-xs)}
.note-box{background:var(--surface);font-size:14px}

/* client head */
.client-head{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;align-items:flex-start}
.ch-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ch-actions{display:flex;gap:10px;flex-wrap:wrap}

/* notes */
.note-item{border-left:2px solid var(--section-accent);padding:6px 0 6px 14px;margin-bottom:12px}
.note-meta{font-size:var(--text-xs);color:var(--muted-2);margin-top:4px;display:flex;align-items:center;gap:8px}

/* invoice */
.invoice-doc .tbl{margin-top:10px}
.paid-note{margin-top:12px;color:var(--fg-success);font-weight:600}

/* calc preview */
.calc-box{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--radius-md);padding:16px;margin:18px 0;box-shadow:var(--edge-light)}
.cb-row{display:flex;justify-content:space-between;padding:6px 0;font-size:14px;color:var(--muted);font-variant-numeric:tabular-nums}
.cb-row b{color:var(--text)}
.cb-row.sub{border-top:1px solid var(--line);margin-top:6px;padding-top:10px;color:var(--text);font-weight:600}
.cb-row.total{border-top:2px solid var(--line-2);margin-top:6px;padding-top:10px;font-size:var(--text-display-sm);color:var(--text)}
.cb-row.total b{color:var(--accent);font-variant-numeric:tabular-nums}

/* board (editorial) */
.board{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}
.board-col{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius-md);padding:12px;min-height:120px}
.board-h{font-size:var(--text-sm);font-weight:600;color:var(--muted);margin-bottom:10px;display:flex;justify-content:space-between}
.board-h .cnt{background:var(--surface-2);border-radius:var(--radius-pill);padding:0 8px;font-size:var(--text-2xs);font-variant-numeric:tabular-nums}
.board-card{
  background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-sm);
  padding:11px;margin-bottom:9px;box-shadow:var(--shadow-1),var(--edge-light);
  transition:transform var(--duration-fast) var(--ease-out),
             border-color var(--duration-fast) var(--ease-standard),
             box-shadow var(--duration-fast) var(--ease-out);
}
.board-card:hover{transform:translateY(-1px);border-color:var(--line-2);box-shadow:var(--shadow-2),var(--edge-light)}
.board-card:focus-visible{box-shadow:0 0 0 3px var(--focus-ring)}
.bc-title{font-weight:600;font-size:13.5px}
.bc-meta{font-size:var(--text-xs);color:var(--muted-2);margin:4px 0 8px}
.bc-actions{display:flex;justify-content:space-between;align-items:center;gap:6px}

/* bars (report) */
.bars{display:flex;align-items:flex-end;gap:10px;height:170px;padding:10px 0}
.bar-wrap{flex:1;display:flex;flex-direction:column;align-items:center;height:100%;justify-content:flex-end;gap:6px}
.bar{width:100%;max-width:42px;background:var(--grad);border-radius:6px 6px 0 0;min-height:2px;transform-origin:bottom;box-shadow:var(--edge-light)}
.bar-l{font-size:var(--text-2xs);color:var(--muted-2)}

/* flash */
.flash{
  padding:11px 15px;border-radius:var(--radius-sm);margin-bottom:14px;font-size:14px;
  border:1px solid var(--line);
  animation:flash-in var(--duration-normal) var(--ease-out) both;
}
.flash.ok{background:var(--bg-success);border-color:var(--border-success);color:var(--fg-success)}
.flash.err{background:var(--bg-danger);border-color:var(--border-danger);color:var(--fg-danger)}
@keyframes flash-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}

/* ============================================================
   AUTH
   ============================================================ */
.auth-body{display:grid;place-items:center;min-height:100vh;background:
  radial-gradient(600px circle at 20% -10%,oklch(74% 0.12 248 / .16),transparent 60%),
  radial-gradient(600px circle at 90% 10%,oklch(55% 0.16 264 / .16),transparent 60%),var(--bg)}
.auth-card{width:100%;max-width:380px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-xl);padding:30px;margin:20px;box-shadow:var(--shadow-3),var(--edge-light)}
.auth-title{font-size:var(--text-h1);margin-bottom:4px;font-family:var(--fd);letter-spacing:-.02em}
.auth-sub{color:var(--muted);font-size:14px;margin-bottom:8px}
.auth-alt{margin-top:14px;text-align:center;font-size:var(--text-sm);color:var(--muted)}
.big-pin{letter-spacing:.4em;text-align:center;font-size:20px;font-variant-numeric:tabular-nums}
.welcome h2{margin-bottom:4px}

/* ============================================================
   COCKPIT DASHBOARD
   ============================================================ */
.alerts{display:flex;flex-direction:column;gap:8px}
.alert{
  display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:var(--radius-md);
  background:var(--surface);border:1px solid var(--line);border-left:3px solid var(--line);
  transition:border-color var(--duration-fast) var(--ease-standard);
  animation:flash-in var(--duration-normal) var(--ease-out) both;
}
.alert:focus-within{border-color:var(--line-2)}
.alert .al-ic{font-size:16px;flex-shrink:0}
.alert .al-txt{flex:1;font-size:14px}
.alert.al-bad{border-left-color:var(--color-danger);background:var(--bg-danger)}
.alert.al-bad .al-ic{color:var(--color-danger)}
.alert.al-warn{border-left-color:var(--color-warning);background:var(--bg-warning)}
.alert.al-warn .al-ic{color:var(--color-warning)}
.alert.al-ok{border-left-color:var(--color-success);background:var(--bg-success)}
.alert.al-ok .al-ic{color:var(--color-success)}
/* hero action band */
.alert-hero{
  border-left-width:3px;border-left-color:var(--section-accent);
  box-shadow:var(--shadow-2),var(--edge-light);padding:14px 18px;
}
.mini-btn{padding:5px 12px;font-size:var(--text-sm);flex-shrink:0}

.progress{height:10px;border-radius:6px;background:var(--surface-2);overflow:hidden;margin:6px 0;box-shadow:inset 0 1px 2px oklch(0% 0 0 / .4)}
.progress > i{display:block;height:100%;border-radius:6px;transition:width var(--duration-slow) var(--ease-out)}
.progress .pb-ok{background:linear-gradient(90deg,var(--color-success),color-mix(in oklch,var(--color-success) 60%,white))}
.progress .pb-warn{background:linear-gradient(90deg,var(--color-warning),color-mix(in oklch,var(--color-warning) 60%,white))}
.progress .pb-bad{background:linear-gradient(90deg,var(--color-danger),color-mix(in oklch,var(--color-danger) 60%,white))}

.risk-dot{display:inline-block;width:10px;height:10px;border-radius:50%}
.rd-ok{background:var(--color-success)}.rd-warn{background:var(--color-warning)}.rd-bad{background:var(--color-danger)}

.cashbars{display:flex;align-items:flex-end;gap:8px;height:150px;padding:10px 0 0}
.cb-col{flex:1;display:flex;flex-direction:column;align-items:center;gap:5px;height:100%}
.cb-bars{flex:1;display:flex;align-items:flex-end;gap:3px;width:100%;justify-content:center}
.cb-bars i{width:42%;border-radius:4px 4px 0 0;display:block;min-height:2px;transform-origin:bottom}
.cb-billed{background:var(--surface-2)}
.cb-collected{background:var(--color-success)}
.cb-lbl{font-size:10px;color:var(--muted)}
.legend{font-size:var(--text-2xs);color:var(--muted);display:flex;align-items:center;gap:6px}
.legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-left:8px}
.legend .lg-billed{background:var(--surface-2)}
.legend .lg-collected{background:var(--color-success)}

.mini-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;margin-top:14px}
.mini-grid > div{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius-sm);padding:10px 12px;display:flex;flex-direction:column;gap:3px}
.mg-l{font-size:var(--text-2xs);color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.mg-v{font-size:var(--text-md);font-weight:600;font-variant-numeric:tabular-nums}
.forf-top{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:4px}
.forf-big{font-size:var(--text-display);font-weight:680;font-variant-numeric:tabular-nums;letter-spacing:-.025em;line-height:1.05}

/* ============================================================
   ACADEMY
   ============================================================ */
.academy-bar{display:flex;align-items:center;gap:12px;margin:6px 0}
.academy-bar > span{font-size:var(--text-xs);color:var(--muted);white-space:nowrap}
.academy-bar .progress{flex:1;margin:0}
.academy-bar > b{font-size:var(--text-sm);min-width:38px;text-align:right;font-variant-numeric:tabular-nums}
.academy-intro h2{margin-bottom:4px}
.academy-mod h3{margin-bottom:8px}
.academy-lessons{display:flex;flex-direction:column;gap:5px}
.academy-lesson{
  display:flex;align-items:center;gap:10px;padding:9px 12px;border:1px solid var(--line);
  border-radius:var(--radius-sm);background:var(--surface);color:var(--text);font-size:14.5px;
  transition:background-color var(--duration-fast) var(--ease-standard),
             box-shadow var(--duration-fast) var(--ease-out),
             border-color var(--duration-fast) var(--ease-standard);
}
.academy-lesson:hover{background:var(--surface-2);box-shadow:inset 3px 0 0 var(--section-accent)}
.academy-lesson:focus-visible{box-shadow:0 0 0 3px var(--focus-ring)}
.academy-lesson .al-check{width:18px;text-align:center;color:var(--muted);flex-shrink:0}
.academy-lesson.is-done .al-check{color:var(--color-success)}
.academy-lesson.is-done .al-title{color:var(--muted)}
.lesson h2{margin-bottom:10px}
.lesson-body{line-height:1.6;font-size:15px}
.lesson-body h3{margin:14px 0 6px;font-size:16px}
.lesson-body ul,.lesson-body ol{padding-left:20px;margin:6px 0}
.lesson-body li{margin:3px 0}
.lesson-body p{margin:8px 0}
.lesson-body table{margin:10px 0}
.lesson-task{background:var(--surface);border-left:3px solid var(--section-accent);border-radius:var(--radius-xs);padding:10px 12px;margin:14px 0}
pre.tpl{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--radius-xs);padding:12px;white-space:pre-wrap;font-family:var(--fm);font-size:13px;line-height:1.5;color:var(--text);overflow-x:auto}
.academy-lesson.is-locked{opacity:.5;cursor:not-allowed}
.academy-exam .card-h{margin-bottom:8px}
.quiz-q{padding:12px 0;border-bottom:1px solid var(--line)}
.quiz-qt{margin-bottom:8px}
.quiz-opt{
  display:block;padding:9px 12px;border:1px solid var(--line);border-radius:var(--radius-sm);
  margin:5px 0;cursor:pointer;background:var(--surface);
  transition:background-color var(--duration-fast) var(--ease-standard),
             border-color var(--duration-fast) var(--ease-standard);
}
.quiz-opt:hover{background:var(--surface-2);border-color:var(--line-2)}
.quiz-opt:focus-within,.quiz-opt:focus-visible{box-shadow:0 0 0 3px var(--focus-ring)}
.quiz-opt input{margin-right:8px;accent-color:var(--accent)}
.lesson-media{display:flex;flex-direction:column;gap:14px;margin:16px 0}
.lm{margin:0}
.lm-img{max-width:100%;border-radius:var(--radius-md);border:1px solid var(--line);display:block}
.lm-vid{width:100%;border-radius:var(--radius-md);background:#000;display:block}
.lm-embed{position:relative;padding-top:56.25%;border-radius:var(--radius-md);overflow:hidden;border:1px solid var(--line)}
.lm-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.lm-cap{font-size:var(--text-xs);color:var(--muted);margin-top:5px}
.lm-file{display:inline-flex;width:fit-content}
.inline-edit{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:6px}
.inline-edit .input{flex:1;min-width:160px}
.inline-edit .mini-w{flex:0 0 72px;min-width:0;text-align:center}
textarea.mono{font-family:var(--fm);font-size:13px;line-height:1.5}
.srow{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--surface);margin-bottom:5px}
.srow .x{margin-left:6px}
.srow.dragging,.srow-card.dragging{opacity:.45}
.drag-handle{cursor:grab;color:var(--muted);user-select:none;font-size:16px}
.academy-quiz{border-style:dashed}
.opt-row{display:flex;align-items:center;gap:10px;margin:5px 0}
.opt-row .input{flex:1}
.opt-correct{white-space:nowrap;color:var(--muted);font-size:var(--text-sm)}

/* ============================================================
   EMPTY STATE
   ============================================================ */
.empty{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:8px;text-align:center;padding:40px 24px;
  border:1px dashed var(--line);border-radius:var(--radius-md);color:var(--muted);
  animation:flash-in var(--duration-normal) var(--ease-out) both;
}
.empty.is-compact{padding:24px 16px}
.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 -4px;padding:0 4px}
.table-scroll > .tbl{min-width:640px}
/* ricerca + ordinamento */
.topsearch{margin-left:auto}
.topsearch .input{height:36px;min-width:200px;font-size:13.5px}
.ch-right{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.search-form{display:flex;align-items:center;gap:6px}
.search-form .input{height:36px;min-width:200px}
th .th-sort{display:inline-flex;align-items:center;gap:4px;color:inherit;white-space:nowrap}
th .th-sort:hover{color:var(--text)}
th[aria-sort="ascending"] .th-sort,th[aria-sort="descending"] .th-sort{color:var(--accent)}
@media(max-width:700px){.topsearch{display:none}}
.pager{display:flex;gap:14px;align-items:center;justify-content:center;margin-top:16px}
.btn.is-disabled{opacity:.4;pointer-events:none}
.preview-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;background:color-mix(in oklch, var(--amber) 16%, var(--panel));border:1px solid var(--border-warning);color:var(--text);padding:10px 14px;border-radius:var(--radius-md);margin-bottom:14px;font-size:14px}
.view-as{margin-bottom:10px;border-top:1px solid var(--line);padding-top:8px}
.view-as>summary{list-style:none;cursor:pointer}
.view-as>summary::-webkit-details-marker{display:none}
.view-as .input{width:100%;font-size:13px}
/* Riga chip su una sola linea con scroll orizzontale (niente wrapping) */
.lb-chips{display:flex;gap:10px;flex-wrap:nowrap;overflow-x:auto;margin-bottom:14px;
  padding-bottom:4px;scrollbar-width:thin;scrollbar-color:var(--line-2) transparent;
  -webkit-overflow-scrolling:touch;
  -webkit-mask-image:linear-gradient(to right,#000 0,#000 calc(100% - 28px),transparent 100%);
          mask-image:linear-gradient(to right,#000 0,#000 calc(100% - 28px),transparent 100%)}
.lb-chips::-webkit-scrollbar{height:6px}
.lb-chips::-webkit-scrollbar-thumb{background:var(--line-2);border-radius:99px}
.lb-chips::-webkit-scrollbar-track{background:transparent}
.lb-chip{flex:0 0 auto;white-space:nowrap;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius-pill);padding:6px 13px;font-size:13px;color:var(--muted)}
.lb-chip:last-child{margin-right:18px}
.lb-chip b{color:var(--text)}
/* ---- Monitor "Andamento incassi": calendario giorno per giorno ---- */
.rc-controls{display:flex;gap:10px;flex-wrap:wrap;align-items:center;justify-content:flex-end}
.cal-scroll{overflow-x:auto;scrollbar-width:thin;scrollbar-color:var(--line-2) transparent;border-radius:10px}
.cal-scroll::-webkit-scrollbar{height:8px}
.cal-scroll::-webkit-scrollbar-thumb{background:var(--line-2);border-radius:99px}
.cal-scroll::-webkit-scrollbar-track{background:transparent}
.cal{min-width:max-content;border-collapse:separate;border-spacing:0}
.cal th,.cal td{white-space:nowrap;border-bottom:1px solid var(--line)}
.cal .cal-name{position:sticky;left:0;z-index:3;background:var(--panel);text-align:left;min-width:150px;max-width:190px;overflow:hidden;text-overflow:ellipsis;box-shadow:8px 0 8px -8px rgba(0,0,0,.5)}
.cal thead .cal-name,.cal thead .cal-tot{z-index:4}
.cal .cal-tot{position:sticky;right:0;z-index:3;background:var(--panel);box-shadow:-8px 0 8px -8px rgba(0,0,0,.5);text-align:right;min-width:84px}
.cal-day{text-align:center;font-size:11px;line-height:1.3;color:var(--muted);padding:6px 9px}
.cal-day .cal-wd{display:block;text-transform:uppercase;letter-spacing:.04em}
.cal-day .cal-dm{display:block;color:var(--faint);font-variant-numeric:tabular-nums}
.cal-cell{font-variant-numeric:tabular-nums;font-size:13px;min-width:66px;text-align:right;padding:7px 11px;color:var(--text)}
.cal-cell .faint{color:var(--faint)}
.cal .is-today{box-shadow:inset 2px 0 0 var(--accent)}
th.cal-day.is-today{color:var(--text)}
.cal tbody tr:hover .cal-name,.cal tbody tr:hover .cal-tot{background:var(--panel-2)}
/* ---- To-do del portafoglio ---- */
.todo-list{display:flex;flex-direction:column;gap:3px;margin:6px 0 14px}
.todo-row{display:grid;grid-template-columns:74px 160px 1fr auto;gap:14px;align-items:center;padding:9px 12px;border-radius:9px;border:1px solid transparent}
.todo-row:hover{background:var(--panel-2);border-color:var(--line)}
.todo-row .badge{justify-self:start;text-transform:uppercase;font-size:10.5px;letter-spacing:.03em}
.todo-cli{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.todo-title{font-size:14px;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.todo-due{font-size:12px;font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
@media(max-width:640px){.todo-row{grid-template-columns:64px 1fr auto;gap:10px}.todo-cli{display:none}}
.error-card{max-width:560px;margin:48px auto;text-align:center}
.error-card .empty-ic{font-size:40px;line-height:1;color:var(--faint);margin-bottom:6px}
.no-print{}
/* ===== Stampa / PDF (report, fatture) ===== */
@media print {
  body{background:#fff;color:#000;font-size:12px}
  body::before{display:none!important}
  .sidebar,.topbar,.appfoot,.skip-link,.pager,.filters,.search-form,.topsearch,.no-print,.add,.btn,button,.ch-actions,.tabs,.pill-row{display:none!important}
  .layout,.main,.content{display:block;padding:0;margin:0}
  .card{border:1px solid #ccc;box-shadow:none;background:#fff;color:#000;break-inside:avoid;margin:0 0 12px}
  .card h2,.card h3,.card h4,.rep-h{color:#000}
  .muted,.muted-2,.kpi-l,.rk-l,.rs-pf{color:#444!important}
  a{color:#000;text-decoration:none}
  .tbl th,.tbl td{border-color:#ddd}
  .progress{border:1px solid #ccc}
}
.empty .empty-ic{font-size:28px;font-weight:200;color:var(--faint);line-height:1}
.empty .empty-h{font-size:14.5px;font-weight:600;color:var(--text)}
.empty .empty-sub{font-size:var(--text-sm);color:var(--muted)}

/* ============================================================
   CRM / RELAZIONE
   ============================================================ */
.crm-stat{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:6px 0 4px}
.crm-stat > div{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius-md);padding:10px 12px;display:flex;flex-direction:column;gap:3px}
.cs-l{font-size:var(--text-2xs);color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.cs-v{font-size:var(--text-md);font-weight:600;font-variant-numeric:tabular-nums}
.lbl-inline{display:flex;align-items:center;gap:8px;font-size:var(--text-sm);color:var(--muted);margin-top:10px;flex-wrap:wrap}
.lbl-inline .input{flex:1;min-width:160px}
.crm-tl{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:2px;max-height:420px;overflow:auto}
.crm-tl li{display:flex;gap:11px;padding:11px 0;border-bottom:1px solid var(--line)}
.crm-tl li:last-child{border-bottom:none}
.crm-ic{flex-shrink:0;width:30px;height:30px;border-radius:var(--radius-sm);background:var(--panel-2);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:15px}
.crm-body{flex:1;min-width:0}
.crm-top{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.crm-top .x{margin-left:auto}
.crm-txt{margin-top:5px;font-size:14px;line-height:1.5;white-space:normal;word-break:break-word}
.crm-fu{margin-top:5px;font-size:var(--text-xs);color:var(--fg-warning)}
.crm-fu.over{color:var(--fg-danger)}

/* ===== Onboarding ===== */
.onb-grp{font-size:var(--text-2xs);color:var(--muted-2);text-transform:uppercase;letter-spacing:.06em;margin:14px 0 4px;font-weight:600}
.onb-row{display:flex;align-items:center;gap:11px;padding:6px 0}
.onb-chk{
  flex-shrink:0;width:22px;height:22px;border-radius:var(--radius-xs);border:1.5px solid var(--line-2);
  background:var(--panel-2);color:var(--on-accent);font-size:13px;font-weight:800;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:background-color var(--duration-fast) var(--ease-standard),
             border-color var(--duration-fast) var(--ease-standard);
}
.onb-chk:hover{border-color:var(--accent)}
.onb-chk:focus-visible{box-shadow:0 0 0 3px var(--focus-ring)}
.onb-chk.on{background:var(--color-success);border-color:var(--color-success)}
.onb-lbl{font-size:14px}
.onb-lbl.done{color:var(--muted-2);text-decoration:line-through}

/* ===== Report mensile ===== */
.rep-preview{margin:14px 0 6px;padding:16px;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius-md)}
.rep-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.rep-kpi{display:flex;flex-direction:column;gap:3px}
.rk-l{font-size:var(--text-2xs);color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.rk-v{font-size:var(--text-display-sm);font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.rk-v.ok{color:var(--fg-success)}.rk-v.bad{color:var(--fg-danger)}
.rk-d{font-size:var(--text-xs);font-weight:600;font-variant-numeric:tabular-nums}.rk-d.ok{color:var(--fg-success)}.rk-d.bad{color:var(--fg-danger)}
.rk-s{font-size:var(--text-2xs);color:var(--muted-2)}
.rep-h{font-size:var(--text-sm);font-weight:700;margin:18px 0 8px;color:var(--text);text-transform:uppercase;letter-spacing:.04em}
.rep-social{display:flex;gap:12px;flex-wrap:wrap}
.rep-sc{flex:1;min-width:150px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-md);padding:11px 13px;display:flex;flex-direction:column;gap:2px;box-shadow:var(--shadow-1),var(--edge-light)}
.rs-pf{font-size:var(--text-2xs);color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.rs-f{font-size:18px;font-weight:700;font-variant-numeric:tabular-nums}.rs-f small{font-size:var(--text-2xs);color:var(--muted-2);font-weight:400}
.rs-d{font-size:var(--text-xs);font-weight:600;font-variant-numeric:tabular-nums}.rs-d.ok{color:var(--fg-success)}.rs-d.bad{color:var(--fg-danger)}
.rs-p{font-size:var(--text-xs);color:var(--muted-2)}
.rep-top{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.rep-top li{padding:9px 0;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.rep-top li:last-child{border-bottom:none}
.rt-eng{font-size:var(--text-sm);color:var(--muted);font-variant-numeric:tabular-nums}
.rt-cap{flex-basis:100%}
.rep-note{margin-top:14px;padding:12px 14px;border-radius:var(--radius-md);border:1px solid var(--line)}
.rep-good{border-left:3px solid var(--color-success);background:var(--bg-success)}
.rep-next{border-left:3px solid var(--color-info);background:var(--bg-info)}
.rep-note h4{margin-top:0}
.rep-list{display:flex;flex-direction:column;gap:6px}
.rep-li{
  display:flex;justify-content:space-between;align-items:center;padding:10px 13px;
  border:1px solid var(--line);border-radius:var(--radius-sm);color:var(--text);
  transition:background-color var(--duration-fast) var(--ease-standard),
             border-color var(--duration-fast) var(--ease-standard),
             box-shadow var(--duration-fast) var(--ease-out);
}
.rep-li:hover{border-color:var(--line-2);background:var(--panel-2)}
.rep-li:focus-visible{box-shadow:0 0 0 3px var(--focus-ring)}
.rep-li.on{border-color:var(--section-accent);background:var(--panel-2);box-shadow:inset 3px 0 0 var(--section-accent)}

/* ============================================================
   AI CONTENT STUDIO
   ============================================================ */
.brief{border:1px solid var(--line);border-radius:var(--radius-md);padding:14px 15px;margin-top:12px;background:var(--panel-2)}
.brief-h{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.brief-h strong{font-size:14.5px}
.brief-act{margin-left:auto;display:flex;align-items:center;gap:10px}
.brief-req{margin:8px 0 0;white-space:normal}
.ai-out{white-space:pre-wrap;word-break:break-word;background:var(--bg-2);border:1px solid var(--line);border-radius:var(--radius-md);padding:13px 15px;margin:10px 0 6px;font-family:var(--fb);font-size:13.5px;line-height:1.6;color:var(--text);max-height:520px;overflow:auto}
.brief-imgs{display:flex;gap:14px;flex-wrap:wrap;margin:10px 0}
.brief-imgs figure{margin:0;display:flex;flex-direction:column;gap:4px}
.brief-thumb{width:160px;height:200px;object-fit:cover;border-radius:var(--radius-md);border:1px solid var(--line);background:var(--panel)}
.q-item{border-left:3px solid var(--color-warning)}
.q-grid{display:grid;grid-template-columns:1fr 180px;gap:16px;margin-top:10px}
.q-main{min-width:0}
.q-prompt{font-family:var(--fb);font-size:13px;resize:vertical}
.q-ref figcaption{margin-bottom:4px}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media(max-width:1024px){
  .bento{grid-template-columns:repeat(6,1fr)}
  .col-8,.col-12{grid-column:span 6}
  .col-6{grid-column:span 6}
  .col-4{grid-column:span 3}
}
@media(max-width:900px){
  .rep-kpis{grid-template-columns:1fr 1fr}
  .q-grid{grid-template-columns:1fr}
  .grid-2,.board{grid-template-columns:1fr}
  .bento{grid-template-columns:1fr}
  .col-12,.col-8,.col-6,.col-4{grid-column:span 1}
  .sidebar{position:fixed;left:0;top:0;transform:translateX(-100%);transition:transform var(--duration-slow) var(--ease-out);z-index:60;box-shadow:var(--shadow-3)}
  .sidebar.open{transform:none}
  .burger{display:block}
  .sb-toggle{display:none}
  .content{padding:18px 16px 50px}
  .topbar{padding:14px 16px}
  .topbar-meta{display:none}
}

/* ============================================================
   PORTALE CLIENTE — home + card-slot condivisa (prefisso .pp-)
   ============================================================ */
/* header compatto: saluto + chip Score */
.pp-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;flex-wrap:wrap}
.pp-head-tx{min-width:0}
.pp-score-chip{
  display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 16px;
  border:1px solid var(--line);border-radius:var(--radius-pill);background:var(--surface);
  color:var(--text);font-size:var(--text-sm);font-weight:600;white-space:nowrap;
  font-variant-numeric:tabular-nums;
  transition:border-color var(--duration-fast) var(--ease-standard),
             background-color var(--duration-fast) var(--ease-standard),
             transform var(--duration-fast) var(--ease-out);
}
.pp-score-chip:hover{border-color:var(--line-2);background:var(--surface-2);transform:translateY(-1px)}
.pp-score-chip b{font-size:var(--text-md)}
.pp-score-chip small{color:var(--muted)}
.pp-score-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.pp-streak{color:var(--fg-warning);font-weight:700}
/* hero «Oggi» */
.pp-prog{display:flex;align-items:center;gap:12px;margin:0 0 12px}
.pp-prog .progress{flex:1;margin:0}
.pp-prog span{font-size:var(--text-sm);color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums}
.pp-alldone{margin:0 0 10px;padding:10px 13px;border-radius:var(--radius-md);background:var(--bg-success);border:1px solid var(--border-success);color:var(--fg-success);font-weight:600;font-size:14px}
.pp-hero .pp-slot{background:var(--surface);box-shadow:none;border-radius:var(--radius-md);padding:14px;margin-bottom:10px}
.pp-hero .pp-slot .card-h{margin-bottom:8px}
/* card-slot condivisa */
.pp-slot .pp-slot-ic{font-size:1.1rem;margin-right:4px}
.pp-slot-t{margin:2px 0 8px}
.pp-pub{opacity:.85}
.pp-cap{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--radius-md);padding:10px 12px;margin:8px 0}
.pp-cap-h{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:6px;flex-wrap:wrap}
.pp-cap-tx{white-space:pre-line;font-size:14px}
.pp-clamp{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.pp-copy,.pp-done{min-height:44px}
.pp-actions{display:block;margin-top:8px}
.pp-how{background:color-mix(in oklch, var(--indigo) 8%, transparent);border:1px solid color-mix(in oklch, var(--indigo) 25%, transparent);border-radius:var(--radius-md);padding:10px 12px;margin:8px 0}
.pp-how summary{cursor:pointer;font-weight:600;font-size:var(--text-sm);color:var(--fg-info);list-style:none;min-height:24px}
.pp-how summary::-webkit-details-marker{display:none}
.pp-how-tx{margin-top:8px;white-space:pre-line;font-size:14px}
.pp-slot textarea.input{min-height:84px;resize:vertical}
/* checklist mini della hero */
.pp-chk{margin-top:4px}
.pp-task{display:flex;gap:10px;align-items:flex-start;padding:11px 12px;border:1px solid var(--line);border-radius:var(--radius-md);margin:6px 0;cursor:pointer;background:var(--surface)}
.pp-task[hidden]{display:none}
.pp-task input{margin-top:2px;width:20px;height:20px;accent-color:var(--accent);flex-shrink:0}
.pp-task .ts{display:block;font-size:.68rem;font-weight:700;text-transform:uppercase;color:var(--fg-success);letter-spacing:.04em}
.pp-task .tx{font-size:.94rem;color:var(--text)}
.pp-task.done .tx{color:var(--muted-2);text-decoration:line-through}
/* strip settimana: scroll-snap orizzontale */
.pp-week{
  display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px;
  scrollbar-width:thin;scrollbar-color:var(--line-2) transparent;-webkit-overflow-scrolling:touch;
}
.pp-week::-webkit-scrollbar{height:6px}
.pp-week::-webkit-scrollbar-thumb{background:var(--line-2);border-radius:99px}
.pp-week::-webkit-scrollbar-track{background:transparent}
.pp-day{
  flex:0 0 132px;scroll-snap-align:start;display:flex;flex-direction:column;gap:6px;
  padding:10px 11px;border:1px solid var(--line);border-radius:var(--radius-md);
  background:var(--panel-2);color:var(--text);
  transition:border-color var(--duration-fast) var(--ease-standard),
             background-color var(--duration-fast) var(--ease-standard),
             transform var(--duration-fast) var(--ease-out);
}
.pp-day:hover{border-color:var(--line-2);background:var(--surface);transform:translateY(-1px)}
.pp-day:focus-visible{box-shadow:0 0 0 3px var(--focus-ring)}
.pp-day.pp-on{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
.pp-day-n{font-weight:600;font-size:var(--text-sm)}
.pp-day-n small{color:var(--muted);font-weight:400}
.pp-day-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.pp-day-t{font-size:var(--text-xs);color:var(--muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.2em}
/* carosello settimana: card giorno ricca (slot compatti + stato) */
.pp-dayc{flex:0 0 196px;scroll-snap-align:center}
.pp-dayc .pp-day-n{display:flex;align-items:center;gap:6px}
.pp-day-c{margin-left:auto;color:var(--muted);font-weight:600;font-variant-numeric:tabular-nums}
.pp-day-slots{display:flex;flex-direction:column;gap:4px;min-height:4.6em}
.pp-day-s{display:flex;align-items:flex-start;gap:6px;font-size:var(--text-xs);color:var(--muted);line-height:1.3;overflow:hidden}
.pp-day-s .pp-sdot{flex:0 0 auto;width:7px;height:7px;border-radius:50%;margin-top:3px}
.pp-day-more{color:var(--muted-2);font-style:italic}
.pp-dayc.pp-on .pp-day-s{color:var(--text)}
/* viralità: chips top 3 */
.pp-viral{display:flex;gap:8px;flex-wrap:wrap}
.pp-vchip{display:inline-flex;gap:6px;align-items:center;max-width:100%}
.pp-vchip .pp-vcap{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:200px}
.pp-vchip .pp-vmet{color:var(--muted);font-variant-numeric:tabular-nums}
a.pp-vchip:hover{border-color:var(--pf,var(--accent))}
/* badge «pronto da pubblicare» (accent) */
.pp-b-ready{background:color-mix(in oklch, var(--accent) 14%, transparent);color:var(--accent);border-color:color-mix(in oklch, var(--accent) 30%, transparent)}
/* brief strategia collassato */
.pp-brief summary{display:flex;align-items:baseline;gap:10px;cursor:pointer;list-style:none;flex-wrap:wrap}
.pp-brief summary::-webkit-details-marker{display:none}
.pp-brief summary h3{margin:0}
.pp-brief-hl{flex:1;min-width:160px;color:var(--muted);font-size:var(--text-sm);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pp-brief[open] .pp-brief-hl{display:none}
.pp-brief-c{font-size:11px;color:var(--muted);transition:transform var(--duration-fast) var(--ease-standard)}
.pp-brief[open] .pp-brief-c{transform:rotate(90deg)}
/* riga strumenti */
.pp-tools{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:18px}
.pp-tool{
  display:flex;flex-direction:column;align-items:center;gap:4px;padding:14px 8px;min-height:44px;
  border:1px solid var(--line);border-radius:var(--radius-md);background:var(--panel);
  color:var(--text);font-size:var(--text-sm);font-weight:600;text-align:center;
  transition:border-color var(--duration-fast) var(--ease-standard),
             background-color var(--duration-fast) var(--ease-standard),
             transform var(--duration-fast) var(--ease-out);
}
.pp-tool:hover{border-color:var(--line-2);background:var(--surface);transform:translateY(-1px)}
.pp-tool:focus-visible{box-shadow:0 0 0 3px var(--focus-ring)}
.pp-tool-ic{font-size:18px;color:var(--accent)}
.pp-tool small{color:var(--muted);font-weight:400}
@media(max-width:520px){.pp-tools{grid-template-columns:repeat(2,1fr)}}
/* andamento completo collassato */
.pp-trend{margin-bottom:18px}
.pp-trend>summary{cursor:pointer;list-style:none;padding:14px 16px;border:1px dashed var(--line);border-radius:var(--radius-md);color:var(--muted);font-weight:600;font-size:var(--text-sm)}
.pp-trend>summary::-webkit-details-marker{display:none}
.pp-trend>summary:hover{color:var(--text);border-color:var(--line-2)}
.pp-trend[open]>summary{margin-bottom:14px;border-style:solid;color:var(--text)}

/* ============================================================
   ACCESSIBILITY — REDUCED MOTION
   ============================================================ */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
  }
}

/* ============================================================
   EDITORIAL CALENDAR REDESIGN (vista cal) — prefisso .ec-
   ============================================================ */
.ec-coach{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:860px){.ec-coach{grid-template-columns:1fr}}
.ec-act{display:flex;gap:8px;align-items:flex-start;padding:8px 10px;border:1px solid var(--line);border-radius:var(--radius-md);margin:0 0 7px;background:var(--surface);font-size:var(--text-sm);color:var(--text)}
.ec-act .badge{flex:0 0 auto;margin-top:1px}
.ec-wa{width:100%;min-height:150px;resize:vertical;font-size:var(--text-sm);line-height:1.45}
.ec-spark{display:flex;gap:6px;align-items:flex-end;margin:0 4px}
.ec-spark-c{display:flex;flex-direction:column;align-items:center;gap:2px}
.ec-spark-t{width:13px;height:32px;border-radius:4px;background:var(--surface-2);display:flex;align-items:flex-end;overflow:hidden}
.ec-spark-t.is-today{box-shadow:inset 0 0 0 1px var(--accent)}
.ec-spark-f{display:block;width:100%;background:var(--fg-success);border-radius:4px 4px 0 0}
.ec-spark-l{font-size:var(--text-2xs);color:var(--muted);line-height:1}
.ec-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px}
.ec-donut{width:96px;height:96px;border-radius:50%;position:relative;flex:0 0 auto}
.ec-donut::before{content:"";position:absolute;inset:26px;border-radius:50%;background:var(--panel)}
.ec-leg{display:flex;flex-direction:column;gap:4px;font-size:var(--text-xs);color:var(--muted)}
.ec-leg i{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:5px}
.ec-dotstrip{display:flex;gap:5px;flex-wrap:wrap}
.ec-dday{width:13px;height:13px;border-radius:50%;background:var(--surface-2);border:1px solid var(--line)}
.ec-dday.on{background:var(--fg-success);border-color:var(--fg-success)}
.ec-dday.is-today{box-shadow:0 0 0 2px var(--focus-ring)}
.ec-vrow{display:flex;gap:8px;align-items:flex-start;flex-wrap:wrap;padding:9px 0;border-bottom:1px solid var(--line)}
.ec-vrow:last-child{border-bottom:0}
.ec-vpf{flex:0 0 132px;font-weight:600;font-size:var(--text-sm);color:var(--text);padding-top:5px}
.ec-vwrap{position:relative;display:inline-block;max-width:100%}
.ec-vchip{display:inline-flex;gap:6px;align-items:center;max-width:340px;cursor:pointer}
.ec-vchip:hover{border-color:var(--pf,var(--line-2))}
.ec-vchip[aria-expanded="true"]{border-color:var(--accent)}
.ec-vchip .ec-vcap{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:168px}
.ec-vchip .ec-vmet{color:var(--muted);font-variant-numeric:tabular-nums}
.ec-vchip-empty{opacity:.55;cursor:default}
.ec-pop{position:absolute;z-index:40;top:calc(100% + 6px);left:0;width:min(320px,82vw);background:var(--panel);border:1px solid var(--line-2);border-radius:var(--radius-md);box-shadow:var(--shadow-2);padding:12px;font-size:var(--text-sm);display:block}
.ec-pop[hidden]{display:none}
.ec-pop-cap{display:block;color:var(--text);white-space:pre-line;margin-bottom:8px}
.ec-pop-met{display:block;color:var(--muted);margin-bottom:10px;font-variant-numeric:tabular-nums}
.ec-pubgrid{display:flex;gap:12px;align-items:flex-end;margin-bottom:14px}
.ec-pubday{display:flex;flex-direction:column;align-items:center;gap:3px}
.ec-pubstack{display:flex;flex-direction:column-reverse;gap:2px;min-height:44px;justify-content:flex-start}
.ec-seg{width:16px;height:6px;border-radius:2px;background:var(--surface-2)}
.ec-seg.ec-instagram{background:#e1559a}.ec-seg.ec-tiktok{background:#4cc9f0}.ec-seg.ec-facebook{background:#5b7bd5}
.ec-publbl{font-size:var(--text-2xs);color:var(--muted)}
.ec-day{display:flex;gap:14px}
.ec-day.ec-past{opacity:.7}
.ec-day.ec-today{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent),var(--shadow-1)}
.ec-rail{flex:0 0 56px;display:flex;flex-direction:column;align-items:center;gap:4px;padding-top:2px}
.ec-rail-d{font-size:var(--text-2xs);text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:700}
.ec-rail-n{font-size:1.55rem;font-weight:750;line-height:1;color:var(--text);font-variant-numeric:tabular-nums}
.ec-dots{display:flex;gap:3px;flex-wrap:wrap;justify-content:center;max-width:48px;margin-top:3px}
.ec-dot{width:7px;height:7px;border-radius:50%;background:var(--muted-2)}
.ec-dot.is-pub{background:var(--fg-success)}.ec-dot.is-work{background:var(--fg-warning)}
.ec-body{flex:1;min-width:0}
.ec-slot-ic{display:inline-block;width:1.2em;text-align:center}
@media(max-width:640px){.ec-day{flex-direction:column;gap:6px}.ec-rail{flex-direction:row;justify-content:flex-start;gap:8px;align-items:center}.ec-dots{max-width:none;margin-top:0}}

/* --- vista cal desktop: settimana a colonne affiancate (kanban) --- */
@media(min-width:1100px){
  .ec-week{display:grid;grid-template-columns:repeat(7,minmax(250px,1fr));gap:12px;align-items:start;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;padding-bottom:6px;margin-bottom:18px;scrollbar-width:thin;scrollbar-color:var(--line-2) transparent}
  .ec-week::-webkit-scrollbar{height:8px}
  .ec-week::-webkit-scrollbar-thumb{background:var(--line-2);border-radius:99px}
  .ec-week .ec-day{margin-bottom:0;scroll-snap-align:start;position:relative;flex-direction:column;gap:8px;padding:14px}
  /* rail laterale → header orizzontale in cima alla colonna (LUN 8 · OGGI · dots) */
  .ec-week .ec-rail{flex:0 0 auto;width:100%;flex-direction:row;align-items:center;justify-content:flex-start;gap:7px;padding:0 36px 8px 0;border-bottom:1px solid var(--line)}
  .ec-week .ec-rail-n{font-size:1.15rem}
  .ec-week .ec-dots{max-width:none;margin:0 0 0 auto;justify-content:flex-end}
  /* header card compatto: h3 solo per screen reader, bottone AI = icona ✨ in alto a destra */
  .ec-week .ec-body .card-h{margin:0}
  .ec-week .ec-body .card-h h3,.ec-week .ec-ai-txt{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
  .ec-week .ec-body .card-h form.inline{position:absolute;top:9px;right:10px}
  .ec-week .ec-body .card-h .btn{padding:4px 8px;gap:0;font-size:13px}
  /* slot impilati compatti: titoli clamp 2 righe, note/caption collassate */
  .ec-week .ep-item{flex-direction:column;align-items:stretch;gap:6px;padding:9px 0}
  .ec-week .ep-main{gap:3px}
  .ec-week .ep-main strong{font-size:var(--text-sm);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .ec-week .ep-main .small{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .ec-week .ep-side{width:100%;justify-content:flex-start;flex-wrap:wrap;gap:6px}
  .ec-week .ep-side .x{margin-left:auto}
  .ec-week .empty{padding:18px 10px}
  .ec-week .grid-2{grid-template-columns:1fr;gap:8px}
}

/* --- Pubblicazioni 7gg: fisarmonica per piattaforma --- */
.ec-acc{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface);margin:0 0 10px}
.ec-acc summary{cursor:pointer;list-style:none;display:flex;gap:8px;align-items:center;padding:10px 12px;font-weight:600;font-size:var(--text-sm);color:var(--text)}
.ec-acc summary::-webkit-details-marker{display:none}
.ec-acc summary::after{content:"▾";margin-left:auto;color:var(--muted);transition:transform .15s ease}
.ec-acc:not([open]) summary::after{transform:rotate(-90deg)}
.ec-acc summary:hover{color:var(--text)}
.ec-acc .ec-acc-n{color:var(--muted);font-weight:500;font-variant-numeric:tabular-nums}
.ec-acc .tbl{margin:0}
.ec-acc .tbl th:first-child,.ec-acc .tbl td:first-child{padding-left:12px}
.ec-acc-btn{margin:8px 12px 12px}
.ec-acc-empty{margin:0;padding:0 12px 12px}

/* --- «🧠 Brief giornata»: pannello server-side col messaggio completo per il cliente --- */
.ec-brief{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface);margin:0 0 10px}
.ec-brief summary{cursor:pointer;list-style:none;display:flex;gap:8px;align-items:center;padding:8px 12px;font-weight:600;font-size:var(--text-sm);color:var(--text)}
.ec-brief summary::-webkit-details-marker{display:none}
.ec-brief summary::after{content:"▾";margin-left:auto;color:var(--muted);transition:transform .15s ease}
.ec-brief:not([open]) summary::after{transform:rotate(-90deg)}
.ec-brief summary:hover{border-color:var(--line-2)}
.ec-brief-ts{color:var(--muted);font-weight:500;font-size:var(--text-2xs);white-space:nowrap}
.ec-brief-bd{padding:0 12px 12px}
.ec-brief-ta{min-height:210px}
.ec-brief-act{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap;align-items:center}
@media(min-width:1100px){
  /* nella vista colonne il 🧠 sta come icona accanto al bottone ✨ (che resta a right:10px) */
  .ec-week .ec-body .card-h form.ec-brief-form{right:52px}
  .ec-week .ec-brief summary{padding:7px 10px}
  .ec-week .ec-brief-bd{padding:0 10px 10px}
  .ec-week .ec-brief-ta{min-height:150px;font-size:.78rem}
}

/* ============================================================
   PRIORITÀ AI — bacheca staff (prefisso .aip-)
   ============================================================ */
.aip-list{display:flex;flex-direction:column;gap:8px}
.aip-row{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface)}
.aip-row .badge{flex:0 0 auto;margin-top:2px;text-transform:uppercase;letter-spacing:.03em}
.aip-tx{min-width:0;font-size:var(--text-sm)}
.aip-tx .strong{font-weight:700}
.aip-act{margin-top:3px;color:var(--accent);font-weight:600;font-size:var(--text-sm)}

/* ============================================================
   COSA FARE OGGI — scrivania AM: fisarmoniche per cliente
   + riepilogo AI (prefisso .td-)
   ============================================================ */
.td-ai{border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:var(--radius-md);background:var(--surface);padding:12px 14px;margin:0 0 12px}
.td-ai-s{font-size:var(--text-sm);font-weight:600;line-height:1.5}
.td-ai-f{margin:8px 0 0;padding:0 0 0 18px;font-size:var(--text-sm)}
.td-ai-f li{margin:2px 0}
.td-ai-m{margin-top:8px}
.td-sum{margin:0 0 10px}
.td-acc summary{flex-wrap:wrap}
.td-name{font-weight:700}
.td-chips{display:inline-flex;gap:6px;flex-wrap:wrap}
.td-chip{display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:600;color:var(--muted);background:var(--surface-2);border:1px solid var(--line);border-radius:999px;padding:1px 8px;font-variant-numeric:tabular-nums;cursor:help}
.td-rev{margin-left:auto;font-size:12px;font-weight:600;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.td-acc .alerts{padding:0 12px 12px}
.td-more{margin-top:2px}

/* ============================================================
   MONITOR SOCIAL — clienti × piattaforme (prefisso .sm-)
   ============================================================ */
.sm-grid{display:flex;flex-direction:column;gap:6px}
.sm-head,.sm-row{
  display:grid;gap:12px;align-items:center;
  grid-template-columns:minmax(170px,1.25fr) repeat(var(--sm-n,2),minmax(128px,1fr)) minmax(92px,.65fr);
}
.sm-head{padding:0 13px 2px;font-size:11px;font-weight:600;color:var(--muted-2);text-transform:uppercase;letter-spacing:.05em}
.sm-head-pf{display:inline-flex;align-items:center;gap:6px}
.sm-head-act{text-align:right}
.sm-row{
  padding:9px 12px;border:1px solid var(--line);border-radius:var(--radius-md);
  background:var(--surface);transition:border-color var(--duration-fast) var(--ease-out)
}
.sm-row:hover{border-color:var(--line-2)}
.sm-cli{display:flex;align-items:center;gap:10px;min-width:0}
.sm-av{flex:0 0 auto;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-size:11.5px;font-weight:700;letter-spacing:.02em}
.sm-name{font-weight:600;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sm-dot{flex:0 0 auto;width:8px;height:8px;border-radius:50%;background:var(--pf,var(--muted-2))}
.sm-grid .ec-youtube{--pf:#ef5a5a}
.sm-dot-warn{box-shadow:0 0 0 2px var(--bg-danger),0 0 0 3px var(--border-danger)}
.sm-pf{display:flex;flex-direction:column;gap:4px;min-width:0}
.sm-pf-l{display:none;font-size:10.5px;font-weight:600;color:var(--muted-2);text-transform:uppercase;letter-spacing:.05em}
.sm-top{display:flex;align-items:center;gap:6px;font-variant-numeric:tabular-nums;line-height:1.2}
.sm-fol{font-weight:700;font-size:14.5px}
.sm-d{font-size:11.5px;font-weight:700;white-space:nowrap}
.sm-d.sm-up{color:var(--fg-success)}
.sm-d.sm-down{color:var(--fg-danger)}
.sm-d.sm-flat{color:var(--muted-2)}
.sm-chips{display:flex;gap:5px;flex-wrap:wrap}
.sm-chip{
  font-size:11px;font-weight:600;color:var(--muted);background:var(--surface-2);
  border:1px solid var(--line);border-radius:999px;padding:1px 7px;
  font-variant-numeric:tabular-nums;white-space:nowrap;cursor:help
}
.sm-chip.sm-zero{color:var(--fg-danger);background:var(--bg-danger);border-color:var(--border-danger)}
.sm-off{justify-content:center}
.sm-none{color:var(--muted-2);font-weight:600}
.sm-act{display:flex;align-items:center;gap:8px;justify-content:flex-end;cursor:help}
.sm-bar{flex:0 1 64px;height:6px;border-radius:999px;background:var(--surface-2);overflow:hidden}
.sm-bar b{display:block;height:100%;border-radius:999px;background:color-mix(in oklch, var(--accent) 78%, transparent)}
.sm-act-n{font-size:12px;font-weight:700;color:var(--muted);font-variant-numeric:tabular-nums;min-width:2.2ch;text-align:right}
@media (max-width:860px){
  .sm-head{display:none}
  .sm-row{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:flex-start}
  .sm-cli{flex:1 1 100%}
  .sm-pf{flex:1 1 132px}
  .sm-pf-l{display:block}
  .sm-off{flex-direction:row;align-items:center;gap:8px;justify-content:flex-start}
  .sm-act{flex:1 1 100%;justify-content:flex-start;padding-left:40px}
  .sm-bar{flex:0 1 140px}
}

/* ============================================================
   LINGUAGGIO .sm- ESTESO — Confronto social clienti (.sm-lb)
   + monitor del portale cliente (delta, chips, mini-bar)
   ============================================================ */
/* griglia Confronto: Cliente · chips IG/TT · Interazioni · Views · Follower · Attività */
.sm-grid.sm-lb .sm-head,.sm-grid.sm-lb .sm-row{
  grid-template-columns:minmax(170px,1.3fr) minmax(118px,.95fr) minmax(84px,.75fr) minmax(84px,.75fr) minmax(124px,1fr) minmax(92px,.65fr);
}
/* header griglia ordinabile: link che ereditano lo stile colonna */
.sm-head a{color:inherit;text-decoration:none}
.sm-head a:hover,.sm-head a:focus-visible{color:var(--text)}
/* mini-chip tinta piattaforma (pallino + conteggio), spenta quando 0 */
.sm-chip.sm-tint{
  display:inline-flex;align-items:center;gap:5px;color:var(--text);
  background:oklch(0% 0 0 / .045);
  border-color:color-mix(in srgb, var(--pf, var(--line-2)) 45%, transparent);
}
.sm-chip.sm-tint .sm-dot{width:7px;height:7px}
.sm-chip.sm-dim{opacity:.55}
.sm-act-n.bad{color:var(--fg-danger)}
/* chips KPI di vetta (lb-chips): resa scura coerente con chip-dark */
.lb-chip{background:oklch(0% 0 0 / .045);border-color:color-mix(in srgb, var(--line-2) 80%, transparent)}
/* delta neutro (es. spesa ads) + delta dentro le sottorighe KPI */
.sm-d.sm-neu{color:var(--muted)}
.kpi-s .sm-d{margin-left:4px}
/* pallino tinta piattaforma dentro chips scure (monitor contenuti / viralità) */
.chip .sm-dot{display:inline-block;vertical-align:0;margin-right:2px}
/* mini-bar attività fuori dalla griglia (monitor contenuti portale) */
.sm-actline{display:flex;align-items:center;gap:8px;margin-top:12px;cursor:help}
.sm-actline .sm-bar{flex:0 1 120px}
.sm-actline .sm-act-n{text-align:left;min-width:0}

/* ---- Product Studio (.ps-) ---- */
.ps-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin-top:10px}
.ps-asset{margin:0;display:flex;flex-direction:column;gap:6px}
.ps-asset img,.ps-asset video{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:10px;border:1px solid var(--border);background:var(--panel)}
.ps-asset video{aspect-ratio:9/16}
.ps-asset figcaption{line-height:1.3}
.ps-pending .ps-ph{display:flex;align-items:center;justify-content:center;aspect-ratio:3/4;border-radius:10px;border:1px dashed var(--border);color:var(--muted);font-size:22px;background:var(--panel)}
.ps-vidopts{display:flex;flex-wrap:wrap;gap:6px 16px;margin:4px 0 8px}

/* ---- Product Studio: creazione guidata + griglie (.ps-) ---- */
.ps-hero{display:flex;gap:24px;align-items:flex-end;justify-content:space-between;flex-wrap:wrap}
.ps-hero-l{max-width:640px}
.ps-hero-steps{display:flex;gap:8px;flex-wrap:wrap;flex-basis:100%}
.ps-hero-steps span{display:inline-flex;align-items:center;gap:7px;padding:7px 12px;border:1px solid var(--border);border-radius:999px;color:var(--muted);font-size:12px;background:var(--panel)}
.ps-hero-steps b{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;background:var(--accent);color:#fff;font-size:11px}
.ps-create .ps-step{padding:18px 0;border-top:1px dashed var(--border)}
.ps-create .ps-step:first-of-type{border-top:0}
.ps-step-h{display:flex;gap:12px;align-items:flex-start;margin-bottom:12px}
.ps-n{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:var(--accent);color:#fff;font-weight:700}
.ps-drop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:26px 16px;border:2px dashed var(--border);border-radius:14px;cursor:pointer;text-align:center;transition:border-color .15s,background .15s}
.ps-drop:hover,.ps-drop.over{border-color:var(--accent);background:color-mix(in oklab,var(--accent) 6%,transparent)}
.ps-drop.has{border-style:solid}
.ps-drop-ic{font-size:26px;color:var(--accent)}
.ps-drop-t{color:var(--muted)}.ps-drop-t em{color:var(--text);font-style:normal;text-decoration:underline}
.ps-thumbs{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}
.ps-th{width:64px;height:84px;object-fit:cover;border-radius:8px;border:1px solid var(--border)}
.ps-ai-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:6px 0 10px}
.ps-chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.ps-chip{padding:4px 10px;border-radius:999px;border:1px solid var(--border);background:var(--panel);font-size:12px;color:var(--text)}
.ps-models{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px;margin-bottom:10px}
.ps-mcard{position:relative;display:flex;flex-direction:column;gap:6px;cursor:pointer}
.ps-mcard input{position:absolute;opacity:0}
.ps-mph{display:flex;align-items:center;justify-content:center;aspect-ratio:3/4;border-radius:12px;border:2px solid var(--border);overflow:hidden;background:var(--panel);color:var(--muted);font-size:24px;transition:border-color .15s,transform .15s}
.ps-mph img{width:100%;height:100%;object-fit:cover}
.ps-mcard input:checked + .ps-mph{border-color:var(--accent);transform:translateY(-2px);box-shadow:0 6px 18px rgba(0,0,0,.35)}
.ps-mname{text-align:center;font-size:12px;color:var(--text)}
.ps-mstatic{cursor:default}.ps-moff .ps-mph{opacity:.4}
.ps-mact{display:flex;gap:8px;justify-content:center;align-items:center}
.ps-vidcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px}
.ps-vcard{position:relative;display:flex;flex-direction:column;gap:3px;padding:14px;border:2px solid var(--border);border-radius:12px;cursor:pointer;background:var(--panel);transition:border-color .15s,transform .15s}
.ps-vcard input{position:absolute;opacity:0}
.ps-vcard small{color:var(--muted)}
.ps-vic{font-size:18px;color:var(--accent)}
.ps-vcard:has(input:checked){border-color:var(--accent);transform:translateY(-2px)}
.ps-submit{display:flex;gap:16px;align-items:center;justify-content:flex-end;flex-wrap:wrap;margin-top:18px;padding-top:14px;border-top:1px dashed var(--border)}
.ps-est{color:var(--muted);font-size:13px}
.ps-cta{font-size:15px;padding:12px 22px}
.ps-prodgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}
.ps-pcard{display:flex;flex-direction:column;border:1px solid var(--border);border-radius:14px;overflow:hidden;background:var(--panel);text-decoration:none;color:var(--text);transition:transform .15s,border-color .15s}
.ps-pcard:hover{transform:translateY(-3px);border-color:var(--accent)}
.ps-pimg{aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;background:color-mix(in oklab,var(--panel) 70%,black);overflow:hidden}
.ps-pimg img{width:100%;height:100%;object-fit:cover}
.ps-ph{font-size:30px;color:var(--muted)}
.ps-pbody{display:flex;flex-direction:column;gap:6px;padding:12px}
.ps-progress{display:block;height:6px;border-radius:999px;background:var(--border);overflow:hidden}
.ps-progress span{display:block;height:100%;border-radius:999px;background:var(--accent);transition:width .4s}

/* ---- Product Studio: wallet, motori AI, assegnazione modelle ---- */
.ps-wallet{display:flex;flex-direction:column;gap:2px;padding:14px 18px;border:1px solid var(--border);border-radius:14px;background:var(--panel);min-width:200px}
.ps-wallet b{font-size:26px;line-height:1.1}
.ps-wlbl{font-size:10px;letter-spacing:2px;color:var(--accent);font-weight:700}
.ps-engines{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px;margin:6px 0 4px}
.ps-ecard{position:relative;display:flex;flex-direction:column;gap:3px;padding:12px 14px;border:2px solid var(--border);border-radius:12px;cursor:pointer;background:var(--panel);transition:border-color .15s,transform .15s}
.ps-ecard input{position:absolute;opacity:0}
.ps-ecard small{color:var(--muted)}
.ps-ecard:has(input:checked){border-color:var(--accent);transform:translateY(-2px)}
.ps-eprice{margin-top:4px;font-size:12px;color:var(--text)}
.ps-eprice em{font-style:normal;color:var(--muted)}
.ps-massign{margin-top:4px}
.ps-massign .input{padding:4px 8px;font-size:11px}

/* ---- Product Studio: popup acquisti stile Higgsfield (.ps-modal) ---- */
.ps-wbtn{margin-top:8px}
.ps-modal{position:fixed;inset:0;z-index:200;background:rgba(5,5,8,.78);backdrop-filter:blur(6px);display:flex;align-items:flex-start;justify-content:center;overflow-y:auto;padding:4vh 16px}
.ps-modal-box{position:relative;width:min(980px,100%);background:var(--bg,#0b0b0e);border:1px solid var(--border);border-radius:20px;padding:34px 30px;margin-bottom:6vh}
.ps-modal-x{position:absolute;top:14px;right:14px;width:34px;height:34px;border-radius:50%;border:1px solid var(--border);background:var(--panel);color:var(--text);cursor:pointer}
.ps-modal-t{font-size:34px;letter-spacing:1px;text-align:center;margin:4px 0 6px}
.ps-modal-t span{color:var(--accent)}
.ps-modal-sub{text-align:center;max-width:560px;margin:0 auto 18px}
.ps-tabs{display:flex;gap:8px;justify-content:center;margin-bottom:20px;flex-wrap:wrap}
.ps-tab{padding:9px 18px;border-radius:999px;border:1px solid var(--border);background:var(--panel);color:var(--muted);cursor:pointer;font-weight:600}
.ps-tab.active{background:var(--accent);color:#fff;border-color:var(--accent)}
.ps-plangrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}
.ps-plan{position:relative;display:flex;flex-direction:column;gap:8px;padding:20px;border:2px solid var(--border);border-radius:16px;background:var(--panel)}
.ps-plan h4{margin:6px 0 0;font-size:20px}
.ps-plan.ps-pop{border-color:var(--accent)}
.ps-plan.ps-best{border-color:#6F9CF5}
.ps-badge{position:absolute;top:-11px;left:16px;padding:3px 10px;border-radius:999px;background:var(--accent);color:#fff;font-size:10px;font-weight:800;letter-spacing:1px}
.ps-best>.ps-badge{background:#6F9CF5}
.ps-plancr{font-size:15px}
.ps-plancr b{font-size:22px}
.ps-price{font-size:30px;font-weight:800;margin:2px 0}
.ps-price small{font-size:13px;color:var(--muted);font-weight:400}
.ps-feat{margin:0 0 10px;padding:0;list-style:none;display:flex;flex-direction:column;gap:5px;color:var(--muted);font-size:12.5px}
.ps-feat li::before{content:"✓ ";color:var(--accent)}
.ps-plan form{margin-top:auto}
.ps-plan .btn{width:100%}
.ps-topup{position:relative;display:flex;justify-content:space-between;align-items:center;gap:14px;padding:14px 18px;border:2px solid var(--border);border-radius:14px;background:var(--panel);margin-bottom:10px;flex-wrap:wrap}
.ps-topup.ps-pop{border-color:var(--accent)}
.ps-topup.ps-best{border-color:#6F9CF5}
.ps-topup .ps-badge{position:static;margin-left:6px}
.ps-tu-l{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ps-tu-l b{font-size:16px}
.ps-tu-l small{flex-basis:100%;display:block}
.ps-tu-r{display:flex;align-items:center;gap:12px}
.ps-tu-p{font-size:22px}
.ps-disc{padding:2px 8px;border-radius:999px;background:color-mix(in oklab,#FB7185 25%,transparent);color:#FB7185;font-size:11px;font-weight:700}
.ps-modal[hidden]{display:none!important}
.ps-advp{margin-top:14px;border:1px dashed var(--border);border-radius:12px;padding:12px 16px}
.ps-advp summary{cursor:pointer;color:var(--accent);font-weight:600}
.ps-advp[open] summary{margin-bottom:4px}

/* ---- Studio Semplice: selettori prodotto/modella e bundle ---- */
.ps-pickrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}
.ps-pick{display:flex;gap:14px;align-items:center;padding:16px;border:2px dashed var(--border);border-radius:14px;background:var(--panel);cursor:pointer;text-align:left;color:var(--text);transition:border-color .15s,transform .15s;font:inherit}
.ps-pick:hover{border-color:var(--accent);transform:translateY(-2px)}
.ps-pick.sel{border-style:solid;border-color:var(--accent)}
.ps-pick-ph{flex:0 0 64px;height:84px;border-radius:10px;background:color-mix(in oklab,var(--panel) 70%,black);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:24px;overflow:hidden}
.ps-pick-ph img{width:100%;height:100%;object-fit:cover}
.ps-pick-t{display:flex;flex-direction:column;gap:3px;min-width:0}
.ps-panel{margin-top:12px;padding:14px;border:1px solid var(--border);border-radius:14px;background:color-mix(in oklab,var(--panel) 60%,transparent)}
.ps-bundles .ps-vcard{padding:16px}
.ps-bundles .ps-eprice{margin-top:8px;font-weight:700}

/* ---- Product Studio: slot reference per prospettiva (fronte/retro/laterale) ---- */
.ps-slots{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:8px}
.ps-slot{display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 10px;border:2px dashed var(--border);border-radius:14px;background:var(--panel);cursor:pointer;text-align:center;transition:border-color .15s,background .15s,transform .15s}
.ps-slot:hover,.ps-slot.over{border-color:var(--accent);background:color-mix(in oklab,var(--accent) 6%,transparent)}
.ps-slot.has{border-style:solid;border-color:var(--accent)}
.ps-slot.miss{border-color:#FB7185;animation:ps-shake .3s}
.ps-slot-ph{width:84px;height:104px;border-radius:10px;background:color-mix(in oklab,var(--panel) 70%,black);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:24px;color:var(--accent);overflow:hidden}
.ps-slot-ph img{width:100%;height:100%;object-fit:cover}
.ps-slot-t{display:flex;flex-direction:column;gap:2px}
.ps-slot-t small{color:var(--muted);font-size:11px}
@keyframes ps-shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}

/* ---- Product Studio: modali Prodotto / Modella ---- */
.ps-ov{position:fixed;inset:0;z-index:1000;display:flex;align-items:flex-start;justify-content:center;padding:40px 16px;overflow-y:auto;background:color-mix(in oklab,#000 62%,transparent);backdrop-filter:blur(4px)}
.ps-ov[hidden]{display:none!important}
.ps-ov-card{position:relative;width:100%;max-width:760px;background:var(--panel);border:1px solid var(--border);border-radius:18px;padding:22px 24px;box-shadow:0 24px 60px rgba(0,0,0,.5)}
.ps-ov-x{position:absolute;top:14px;right:16px;border:0;background:transparent;color:var(--muted);font-size:18px;cursor:pointer;line-height:1}
.ps-ov-x:hover{color:var(--text)}
.ps-ov-h{margin:0 0 14px}
.ps-ovtabs{display:inline-flex;gap:4px;padding:4px;border:1px solid var(--border);border-radius:12px;margin-bottom:16px}
.ps-ovtab{border:0;background:transparent;color:var(--muted);padding:7px 18px;border-radius:9px;cursor:pointer;font:inherit;font-weight:600}
.ps-ovtab.is-on{background:var(--accent);color:#fff}
.ps-ovpane[hidden]{display:none}
.ps-ovpick{border:2px solid var(--border);background:var(--panel);cursor:pointer;font:inherit;color:var(--text);text-align:center}
.ps-ovpick:hover{border-color:var(--accent);transform:translateY(-2px)}
.ps-ov-foot{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-top:16px;flex-wrap:wrap}
.ps-ov-foot .btn-primary{margin-left:auto}
.ps-pick.miss,.input.miss,select.miss{border-color:#FB7185!important;animation:ps-shake .3s}
/* pose modella nel modale */
.ps-poses{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px;margin-top:6px}
.ps-pose{display:flex;flex-direction:column;align-items:center;gap:7px;padding:12px;border:1px solid var(--border);border-radius:14px;background:color-mix(in oklab,var(--panel) 60%,transparent);text-align:center}
.ps-pose-img{width:100%;aspect-ratio:3/4;border-radius:10px;background:color-mix(in oklab,var(--panel) 70%,black);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;overflow:hidden}
.ps-pose-img img{width:100%;height:100%;object-fit:cover}
.ps-pose-ic{font-size:26px;color:var(--accent)}
.ps-pose-act,.ps-pose-approve{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}
.ps-pose-act .btn,.ps-pose-approve .btn{padding:5px 10px;font-size:12.5px}
.ps-pose-msg{font-size:11.5px;color:var(--muted);min-height:14px}

/* ---- Product Studio: slot carrello/espositore colori (largo, orizzontale) ---- */
.ps-carrello{margin-top:12px}
.ps-slot-wide{flex-direction:row!important;align-items:center;gap:14px;text-align:left;padding:12px 14px}
.ps-slot-wide .ps-slot-ph{width:64px;height:64px;flex:0 0 64px}
.ps-slot-wide .ps-slot-t{align-items:flex-start}
.ps-slot-wide .ps-slot-t small{white-space:normal}

/* ---- Product Studio: pose approve nascoste finché non pronte ---- */
.ps-pose-approve[hidden]{display:none!important}

/* ---- Product Studio: galleria / storico generazioni ---- */
.ps-gallery{display:flex;flex-direction:column;gap:14px}
.ps-gcard{border:1px solid var(--border);border-radius:14px;padding:14px 16px;background:color-mix(in oklab,var(--panel) 60%,transparent)}
.ps-gh{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.ps-gtitle{color:var(--text);text-decoration:none}
.ps-gtitle:hover{color:var(--accent)}
.ps-gopen{margin-left:auto}
.ps-gstrip{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px}
.ps-gstrip>*{flex:0 0 auto}
.ps-gstrip img,.ps-gstrip video{height:140px;width:auto;border-radius:10px;border:1px solid var(--border);object-fit:cover;background:#000}
.ps-gph{display:flex;align-items:center;justify-content:center;height:140px;width:108px;border-radius:10px;border:1px solid var(--border);font-size:30px;text-decoration:none;background:color-mix(in oklab,var(--panel) 70%,black)}
.ps-gmore{display:flex;align-items:center;justify-content:center;height:140px;width:80px;border-radius:10px;border:1px dashed var(--border);color:var(--muted);text-decoration:none;font-weight:700}
.ps-gmore:hover{border-color:var(--accent);color:var(--accent)}

/* ---- Product Studio: controlli per-scatto (approva/rifiuta/rigenera) ---- */
.ps-asset-act{display:flex;flex-wrap:wrap;gap:8px;margin-top:2px}
.ps-asset-act form{margin:0}
.ps-asset-act .link{font-size:12px;padding:2px 0;cursor:pointer;background:none;border:0}
.ps-asset-act .ps-ok{color:#1a8a5c}
.ps-asset-act .ps-no{color:#FB7185}
.ps-asset.ps-appr-ok img{outline:2px solid #1a8a5c;outline-offset:-2px}
.ps-asset.ps-appr-no img{opacity:.5;outline:2px solid #FB7185;outline-offset:-2px}

/* ---- Product Studio: bundle selezionato in risalto + interruttori ---- */
.ps-colorfield{margin-bottom:16px}
.ps-colorfield label{display:block;margin-bottom:5px}
.ps-bundles .ps-vcard:has(input:checked){background:color-mix(in oklab,var(--accent) 15%,var(--panel));box-shadow:0 0 0 1px var(--accent) inset}
.ps-vcard-chk{position:absolute;top:8px;right:8px;width:20px;height:20px;border-radius:50%;background:var(--accent);color:#fff;font-size:12px;font-weight:800;line-height:1;display:none;align-items:center;justify-content:center}
.ps-vcard:has(input:checked) .ps-vcard-chk{display:flex}
.ps-bundles .ps-vcard:has(input:checked) b,.ps-bundles .ps-vcard:has(input:checked) .ps-eprice{color:var(--text)}
.ps-toggles{margin-top:14px;display:flex;flex-direction:column;gap:2px}
.ps-toggle{display:flex;align-items:center;gap:12px;cursor:pointer;padding:9px 0;font-size:14px;color:var(--text)}
.ps-toggle input{position:absolute;opacity:0;width:0;height:0}
.ps-sw{flex:0 0 auto;width:40px;height:23px;border-radius:999px;background:var(--border);position:relative;transition:background .15s}
.ps-sw::after{content:'';position:absolute;top:2px;left:2px;width:19px;height:19px;border-radius:50%;background:#fff;transition:transform .15s;box-shadow:0 1px 3px rgba(0,0,0,.3)}
.ps-toggle input:checked + .ps-sw{background:var(--accent)}
.ps-toggle input:checked + .ps-sw::after{transform:translateX(17px)}
.ps-toggle input:focus-visible + .ps-sw{outline:2px solid var(--accent);outline-offset:2px}

/* ---- Product Studio: pannello «Genera altri video» ---- */
.ps-vidpick{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:8px}
.ps-vidpick form{margin:0}
.ps-vidbtn{display:flex;flex-direction:column;gap:2px;width:100%;text-align:left;padding:11px 13px;border:1px solid var(--border);border-radius:11px;background:var(--panel);color:var(--text);cursor:pointer;font:inherit;transition:border-color .15s,transform .15s}
.ps-vidbtn:hover{border-color:var(--accent);transform:translateY(-2px)}
.ps-vidbtn small{color:var(--muted);font-size:11.5px}
.ps-addvid{margin-top:12px;border:1px dashed var(--border);border-radius:12px;padding:10px 14px}
.ps-addvid summary{cursor:pointer;color:var(--accent);font-weight:600}
.ps-envpick{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:4px 0 12px}
.ps-env{display:inline-flex;align-items:center;gap:7px;padding:7px 12px;border:1px solid var(--border);border-radius:999px;cursor:pointer;font-size:13px;transition:border-color .15s,background .15s}
.ps-env input{accent-color:var(--accent);margin:0}
.ps-env em{color:var(--muted);font-style:normal;font-size:11.5px}
.ps-env.on{border-color:var(--accent);background:color-mix(in oklab,var(--accent) 12%,transparent)}
.ps-env.on em{color:var(--accent)}
.ps-gate{margin:6px 0 12px;padding:10px 14px;border:1px solid var(--border);border-radius:10px;background:color-mix(in oklab,var(--accent) 7%,transparent);font-size:13px;line-height:1.5}
.ps-startvids{display:flex;flex-direction:column;gap:6px;margin:8px 0 12px}
.ps-startvid{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:9px 13px;border:1px solid var(--border);border-radius:10px;background:var(--panel)}
.btn-sm{padding:7px 14px;border:0;border-radius:8px;background:var(--accent);color:#fff;font:inherit;font-weight:600;cursor:pointer;transition:filter .15s}
.btn-sm:hover{filter:brightness(1.07)}
.link.ps-ok{color:#1a8a5c;font-weight:600}
.ps-subh{margin:14px 0 8px;font-size:13.5px;font-weight:600}
.ps-custom{margin-top:14px;border-top:1px solid var(--border);padding-top:12px}
.ps-custom > summary{cursor:pointer;color:var(--accent);font-weight:600;font-size:13px}
.ps-customf{display:grid;grid-template-columns:repeat(auto-fit,minmax(165px,1fr));gap:10px;align-items:end;margin-top:12px}
.ps-customf label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted)}
.ps-customf select{padding:8px 10px;border:1px solid var(--border);border-radius:8px;background:var(--panel);color:var(--text);font:inherit;max-width:100%}
.ps-customf .btn-sm{grid-column:1 / -1;justify-self:start}
.ps-ccost{opacity:.82;font-weight:500}
.ps-gcost{opacity:.82;font-weight:500}
.ps-beats{display:flex;flex-direction:column;gap:6px}
.ps-beatrow{display:flex;align-items:center;justify-content:space-between;gap:8px;border:1px solid var(--border);border-radius:10px;padding:6px 10px;transition:border-color .15s,background .15s}
.ps-beatrow:has(input:checked){border-color:var(--accent);background:color-mix(in oklab,var(--accent) 8%,transparent)}
.ps-beat{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:500;cursor:pointer;user-select:none;flex:1}
.ps-beat input{accent-color:var(--accent);margin:0}
.ps-ord{display:flex;flex-direction:column;gap:1px;flex:0 0 auto}
.ps-ord button{border:1px solid var(--border);background:var(--panel);color:var(--muted);border-radius:5px;cursor:pointer;font-size:9px;line-height:1;padding:2px 6px;transition:border-color .15s,color .15s}
.ps-ord button:hover{border-color:var(--accent);color:var(--accent)}
.ps-slotwrap{display:flex;flex-direction:column;gap:6px;align-self:start}
.ps-genpose{padding:6px 9px;border:1px solid var(--border);border-radius:8px;background:var(--panel);color:var(--accent);font:inherit;font-size:11.5px;font-weight:600;cursor:pointer;transition:border-color .15s}
.ps-genpose:hover{border-color:var(--accent)}
.ps-genpose:disabled{opacity:.5;cursor:wait}
.ps-genbox{border:1px dashed var(--border);border-radius:10px;padding:8px;font-size:12px;text-align:center}
.ps-gencard{display:flex;flex-direction:column;gap:7px}
.ps-gencard img{width:100%;border-radius:8px;display:block}
.ps-genact{display:flex;gap:8px;align-items:center;justify-content:center;flex-wrap:wrap}
.ps-generr{color:var(--bad)}

/* ============================================================
   ATELIER v2 — luxury polish layer (token/value only, class contract preserved)
   ============================================================ */

/* contract fix: prodstudio.php emits class="table" where the system defines .tbl */
.table{width:100%;border-collapse:collapse;font-size:14px}
.table th{text-align:left;color:var(--muted);font-weight:600;font-size:var(--text-2xs);text-transform:uppercase;letter-spacing:.05em;padding:8px 10px;border-bottom:1px solid var(--line)}
.table td{padding:10px;border-bottom:1px solid var(--line);vertical-align:top}
.table tr:last-child td{border-bottom:none}
.table .r{text-align:right;font-variant-numeric:tabular-nums}

/* brand wordmark + display numerals in Bricolage */
.brand{font-family:var(--fd);font-weight:800;letter-spacing:-.02em}
.kpi-v,.crm-stat .n,.forf-big,.big-pin,.pp-score-chip{font-family:var(--fd);font-feature-settings:'tnum' 1}

/* nav: active item gets a faint teal wash behind the inset bar + brighter icon */
.nav-link.on{background:linear-gradient(90deg, color-mix(in oklch, var(--section-accent) 12%, transparent), transparent 78%)}
.nav-link.on:hover{background:linear-gradient(90deg, color-mix(in oklch, var(--section-accent) 16%, transparent), var(--surface) 82%)}
.nav-link .ic{transition:color var(--duration-fast) var(--ease-standard), transform var(--duration-normal) var(--ease-out)}
.nav-link:hover .ic{transform:translateX(1px)}
.nav-link.on .ic{transform:scale(1.06)}

/* buttons: slow teal-glow sheen already wired; deepen the primary hover lift */
.btn-primary:hover{box-shadow:0 12px 30px -12px oklch(48% 0.16 255 / .5);transform:translateY(-2px)}

/* cards: edge-light + crisper hairline; ONE feature card per view via .is-hero */
.card{box-shadow:var(--shadow-1),var(--edge-light)}
.card.is-hero{box-shadow:var(--shadow-2),var(--edge-light);border-color:color-mix(in oklch, var(--accent) 26%, var(--line))}
.card.is-hero::before{background:var(--accent);opacity:.9}

/* modal = premium checkout moment: deeper glass + lift-in */
.ps-modal{background:oklch(8% .01 265 / .80);backdrop-filter:blur(10px) saturate(120%)}
.ps-modal-box{box-shadow:var(--shadow-3),var(--edge-light)}

/* command-center topbar strip (slots already styled, now filled by render_header) */
.topbar-pulse{display:flex;align-items:center;gap:14px;font-size:var(--text-xs);color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.topbar-pulse b{color:var(--text);font-weight:600}
.topbar-pulse .sep{width:1px;height:14px;background:var(--line-2)}
.topbar-pulse .live{display:inline-flex;align-items:center;gap:6px}
.topbar-pulse .live::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--color-success);box-shadow:0 0 0 0 color-mix(in oklch,var(--color-success) 60%,transparent);animation:ec-pulse 2.4s var(--ease-standard) infinite}
@keyframes ec-pulse{0%{box-shadow:0 0 0 0 color-mix(in oklch,var(--color-success) 55%,transparent)}70%{box-shadow:0 0 0 7px transparent}100%{box-shadow:0 0 0 0 transparent}}

/* ---- MOTION: entrance reveal + count-up (opt-in via body.ec-anim, set only when JS+IO+motion OK) ---- */
.ec-anim .ec-reveal{opacity:0;transform:translateY(16px);transition:opacity var(--duration-slow) var(--ease-out),transform var(--duration-slow) var(--ease-out)}
.ec-anim .ec-reveal.is-in{opacity:1;transform:none}
@keyframes ec-fade-up{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}

/* reward language — concentrate the brand gradient on earned moments only */
.is-celebrate{position:relative}
.is-celebrate::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;border-radius:2px;background:var(--grad);opacity:.85}

@media (prefers-reduced-motion:reduce){
  .ec-anim .ec-reveal{opacity:1;transform:none;transition:none}
  .topbar-pulse .live::before{animation:none}
  .nav-link:hover .ic,.nav-link.on .ic{transform:none}
}

/* ---- Product Studio "developing wall": shots develop in like a Polaroid + progress rail ---- */
@keyframes ps-develop{0%{opacity:0;transform:scale(.95);filter:saturate(.35) blur(7px)}55%{opacity:1;filter:saturate(.85) blur(1.5px)}100%{opacity:1;transform:none;filter:none}}
.ps-justin{animation:ps-develop .72s var(--ease-out) both}
.ps-devrail{display:flex;align-items:center;gap:9px;margin:2px 0 14px;font-size:var(--text-sm);color:var(--muted);font-variant-numeric:tabular-nums;font-family:var(--fd);font-weight:600;letter-spacing:.01em}
.ps-devrail .ps-devdot{width:9px;height:9px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 0 color-mix(in oklch,var(--accent) 60%,transparent);animation:ec-pulse 1.8s var(--ease-standard) infinite;flex:0 0 auto}
.ps-pending .ps-ph{position:relative;overflow:hidden}
.ps-pending .ps-ph::after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,color-mix(in oklch,var(--accent) 14%,transparent),transparent);animation:ps-shimmer 1.6s ease-in-out infinite}
@keyframes ps-shimmer{100%{transform:translateX(100%)}}
@media (prefers-reduced-motion:reduce){.ps-justin{animation:none}.ps-devrail .ps-devdot,.ps-pending .ps-ph::after{animation:none}.ps-pending .ps-ph::after{display:none}}

/* ---- SVG nav icons (replace the Unicode glyphs — the «internal-tool tell») ---- */
.ic{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;flex:0 0 auto}
.ic svg{width:18px;height:18px;display:block}
.nav-link.on .ic svg{stroke-width:1.95}

/* ---- Data-viz as design: charts grow-in on reveal (keyed off the .is-in the observer adds to .card) ---- */
.ec-anim .card .bar,.ec-anim .card .cb-bars i,.ec-anim .card .ec-spark-f{transform:scaleY(0);transform-origin:bottom;transition:transform .66s var(--ease-out)}
.ec-anim .card.is-in .bar,.ec-anim .card.is-in .cb-bars i,.ec-anim .card.is-in .ec-spark-f{transform:scaleY(1)}
.ec-anim .card .ec-donut{opacity:0;transform:scale(.9) rotate(-10deg);transition:opacity .55s var(--ease-out),transform .55s var(--ease-out)}
.ec-anim .card.is-in .ec-donut{opacity:1;transform:none}

/* ---- Portal habit-loop: score dot pop-in, streak glow, daily-complete celebration ---- */
.pp-score-dot{animation:ec-dotpop .7s var(--ease-out) both}
@keyframes ec-dotpop{0%{transform:scale(0)}60%{transform:scale(1.25)}100%{transform:scale(1)}}
.pp-streak{text-shadow:0 0 14px color-mix(in oklch,var(--color-warning) 55%,transparent)}
.pp-alldone{animation:ec-pop .55s var(--ease-out) both;position:relative;overflow:hidden}
@keyframes ec-pop{0%{transform:scale(.97);opacity:0}100%{transform:scale(1);opacity:1}}
.pp-alldone::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(160px circle at 14% 50%,color-mix(in oklch,var(--color-success) 24%,transparent),transparent 70%);animation:ec-celebrate 1.2s var(--ease-out) both}
@keyframes ec-celebrate{0%{opacity:0;transform:scale(.6)}40%{opacity:1}100%{opacity:0;transform:scale(1.5)}}

@media (prefers-reduced-motion:reduce){
  .ec-anim .card .bar,.ec-anim .card .cb-bars i,.ec-anim .card .ec-spark-f,.ec-anim .card .ec-donut{transform:none;opacity:1;transition:none}
  .pp-score-dot,.pp-alldone,.pp-alldone::after{animation:none}
}

/* ============================================================
   Fatture Fornitori (modulo fp_*) — editor 2 colonne, anteprima
   A4, gestione mittenti/brand. Usa i token del design system OS.
   ============================================================ */

/* dot colore mittente nella lista */
.fp-dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:7px;vertical-align:middle;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}

/* ---- editor a due colonne ---- */
.fp-editor{display:grid;grid-template-columns:minmax(440px,1fr) minmax(360px,560px);gap:var(--space-5);align-items:start}
.fp-col-form{display:flex;flex-direction:column;gap:var(--space-4);min-width:0}
.fp-col-prev{position:sticky;top:74px;min-width:0}
.fp-prev-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;gap:8px}
.fp-stage-wrap{overflow:hidden;border-radius:var(--radius-md);background:var(--bg-2);border:1px solid var(--line);padding:14px}
.fp-stage{transform-origin:top left;will-change:transform}

/* foglio A4 reale (mm), scalato via transform dal JS */
.fp-sheet{position:relative;width:210mm;height:297mm;background:#fff;margin:0 0 14px;box-shadow:var(--shadow-2);overflow:hidden}
.fp-sheet-inner{position:absolute;top:15mm;left:14mm;right:14mm;bottom:0}
.fp-sheet-foot{position:absolute;left:0;right:0;bottom:14mm;padding-top:4px;background:#fff}
.fp-foot-pg{font-size:7pt;color:#9a9aa0;margin-top:2px}

/* ---- tabella righe (lato form) ---- */
.fp-line-tbl{width:100%;border-collapse:collapse;font-size:var(--text-sm)}
.fp-line-tbl th{font-size:var(--text-2xs);text-transform:uppercase;letter-spacing:.04em;color:var(--muted);text-align:left;padding:4px 6px;border-bottom:1px solid var(--line)}
.fp-line-tbl td{padding:4px 6px;vertical-align:middle}
.fp-line-tbl .r,.fp-line-tbl td.r{text-align:right}
.fp-line-tbl input.r{text-align:right}
.fp-line-tbl .input.mini{margin:0}
.fp-line-amt{font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--muted)}

/* ---- riepilogo totali (lato form) ---- */
.fp-totbar{display:flex;flex-direction:column;gap:6px}
.fp-totline{display:flex;justify-content:space-between;align-items:center;font-variant-numeric:tabular-nums}
.fp-totline span{color:var(--muted)}
.fp-totgrand{border-top:1px solid var(--line-2);padding-top:8px;margin-top:2px;font-size:var(--text-md)}
.fp-totgrand b{font-size:var(--text-md)}

/* ---- mittenti: logo drag-drop + brand ---- */
.fp-brandgrid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4);margin-top:8px}
.fp-drop{position:relative;display:flex;align-items:center;justify-content:center;min-height:120px;border:1.5px dashed var(--line-2);border-radius:var(--radius-md);background:var(--bg-2);cursor:pointer;text-align:center;transition:border-color var(--duration-fast),background var(--duration-fast)}
.fp-drop:hover,.fp-drop:focus-visible{border-color:var(--accent);outline:none}
.fp-drop.is-over{border-color:var(--accent);background:color-mix(in oklch,var(--accent) 8%,var(--bg-2))}
.fp-drop-hint{color:var(--muted-2);font-size:var(--text-sm);line-height:1.4;padding:10px}
.fp-logo-prev{max-width:90%;max-height:104px;object-fit:contain;background:#fff;border-radius:6px}
.fp-colorrow{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.fp-colorrow input[type=color]{width:42px;height:30px;border:1px solid var(--line);border-radius:8px;background:var(--bg-2);padding:2px;cursor:pointer}
.fp-clab{font-size:var(--text-sm);color:var(--muted)}
.fp-swatch{display:flex;align-items:center;justify-content:center;min-height:46px;border-radius:var(--radius-sm);font-weight:700;font-size:var(--text-sm);letter-spacing:.04em;border:1px solid var(--line)}
.fp-sender-card{margin-top:var(--space-4)}

@media (max-width:1080px){
  .fp-editor{grid-template-columns:1fr}
  .fp-col-prev{position:static;order:-1}
  .fp-brandgrid{grid-template-columns:1fr}
}

/* ---- liste mittenti/clienti: righe espandibili (details/summary nativo) ---- */
.fp-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:16px}
.fp-count{color:var(--muted);font-size:var(--text-sm)}
.fp-add{margin-bottom:18px;max-width:none;padding:0}
.fp-add>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;padding:14px 18px;font-weight:600;color:var(--accent)}
.fp-add>summary::-webkit-details-marker{display:none}
.fp-add>summary::before{content:"+";display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:var(--accent);color:var(--on-accent);font-weight:700;line-height:1}
.fp-add[open]>summary{border-bottom:1px solid var(--line)}
.fp-add[open]>summary::before{content:"\2212"}
.fp-add .form,.fp-srow .form{padding:18px}

.fp-list{display:flex;flex-direction:column;gap:10px}
.fp-srow{padding:0;overflow:hidden;transition:box-shadow var(--duration-fast),border-color var(--duration-fast)}
.fp-srow>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:14px;padding:13px 18px}
.fp-srow>summary::-webkit-details-marker{display:none}
.fp-srow>summary:hover{background:var(--surface)}
.fp-srow[open]{box-shadow:var(--shadow-2)}
.fp-srow[open]>summary{border-bottom:1px solid var(--line);background:var(--surface)}
.fp-row-logo{width:44px;height:44px;border-radius:10px;background:var(--bg-2);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;overflow:hidden;flex:0 0 auto;font-weight:700;font-size:var(--text-sm);color:var(--muted-2)}
.fp-row-logo img{max-width:100%;max-height:100%;object-fit:contain}
.fp-row-main{flex:1 1 auto;min-width:0}
.fp-row-name{display:block;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fp-row-meta{display:block;font-size:var(--text-sm);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
.fp-row-tags{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.fp-row-sw{width:34px;height:20px;border-radius:6px;border:1px solid var(--line-2);box-shadow:var(--shadow-1)}
.fp-row-chev{flex:0 0 auto;color:var(--muted-2);font-size:14px;transition:transform var(--duration-normal) var(--ease-out)}
.fp-srow[open] .fp-row-chev{transform:rotate(90deg)}

@media (max-width:680px){
  .fp-row-tags .fp-row-sw,.fp-row-tags .badge.b-grey{display:none}
  .fp-add .grid-2,.fp-srow .grid-2{grid-template-columns:1fr}
}

/* ---- elenco fatture raggruppato per mittente ---- */
.fp-group{padding:0;overflow:hidden}
.fp-group + .fp-group{margin-top:14px}
.fp-group-head{display:flex;align-items:center;gap:12px;padding:12px 18px;background:var(--surface);border-bottom:1px solid var(--line)}
.fp-gh-name{font-weight:600;flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fp-gh-sum{color:var(--muted);font-size:var(--text-sm);font-variant-numeric:tabular-nums;flex:0 0 auto}
.fp-inv{display:grid;grid-template-columns:104px minmax(0,1fr) 92px 124px 90px 108px;align-items:center;gap:12px;padding:11px 18px}
.fp-inv + .fp-inv{border-top:1px solid var(--line)}
.fp-inv:hover{background:var(--surface)}
.fp-inv-num a{font-weight:600}
.fp-inv-rcpt{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fp-inv-date{color:var(--muted);font-size:var(--text-sm);text-align:right;font-variant-numeric:tabular-nums}
.fp-inv-tot{text-align:right;font-weight:600;font-variant-numeric:tabular-nums}
.fp-inv-act{text-align:right;font-size:var(--text-sm);white-space:nowrap}
@media (max-width:760px){
  .fp-inv{grid-template-columns:1fr auto auto;column-gap:10px;row-gap:3px}
  .fp-inv-date{display:none}
  .fp-inv-rcpt{grid-column:1/-1;order:6;color:var(--muted);font-size:var(--text-sm)}
}
