/* MyCompta — habillage repris de MyInvest et MyPharma (variables, coque, composants), couleur principale indigo ; styles propres à MyCompta en fin de fichier. */

/* ===== 1. Variables ============================================================================== */
:root{
  color-scheme:light;
  --font:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --radius:10px;--radius-sm:8px;--radius-lg:18px;
  --bg:#f7f7f8;--surface:#fff;--surface-2:#f6f6f7;--surface-3:#ececef;
  --ink:#18181b;--muted:#6b7280;--faint:#9ca3af;
  --border:#e6e6e9;--border-strong:#d4d4d9;
  --primary:#4f46e5;--primary-hover:#4338ca;--on-primary:#fff;--primary-soft:#eef2ff;--primary-ink:#4338ca;
  --nav-bg:#fff;--nav-ink:#52525b;--nav-strong:#18181b;--nav-muted:#9ca3af;--nav-hover:#f4f4f5;--nav-active:#f0f0f2;--nav-border:#e6e6e9;
  --focus:#f59e0b;
  --ok:#15803d;--ok-bg:#f0fdf4;--ok-border:#bbf7d0;--solid-ok:#16a34a;
  --warn:#b45309;--warn-bg:#fffbeb;--warn-border:#fde68a;--solid-warn:#f59e0b;
  --bad:#b91c1c;--bad-ink:#991b1b;--bad-bg:#fef2f2;--bad-border:#fecaca;--solid-bad:#dc2626;
  --info-bg:#eff6ff;
  --shadow-sm:0 1px 2px rgba(24,24,27,.04);--shadow-md:0 10px 28px rgba(24,24,27,.08);
  --chart-n:var(--primary);--chart-n1:#9aa3b2;
  --donut-0:#2f7de1;--donut-1:#1fa971;--donut-2:#ef8a1f;--donut-3:#7c4dd6;--donut-4:#16a5b8;--donut-5:#d6528a;--donut-6:#a5773f;--donut-7:#8593a3;
  --dot:#fff;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --bg:#0a0a0c;--surface:#141417;--surface-2:#1a1a1e;--surface-3:#222226;
    --ink:#f2f2f3;--muted:#a3a3ab;--faint:#71717a;
    --border:#27272b;--border-strong:#3a3a40;
    --primary:#818cf8;--primary-hover:#a5b4fc;--on-primary:#11112b;--primary-soft:#1e1b4b;--primary-ink:#a5b4fc;
    --nav-bg:#141417;--nav-ink:#c2c2c9;--nav-strong:#f7f7f8;--nav-muted:#84848c;--nav-hover:#1d1d22;--nav-active:#232328;--nav-border:#27272b;
    --focus:#f5b400;
    --ok:#4ade80;--ok-bg:#102417;--ok-border:#1e4a2c;--solid-ok:#22c55e;
    --warn:#fbbf24;--warn-bg:#2c2208;--warn-border:#55430f;--solid-warn:#f59e0b;
    --bad:#f87171;--bad-ink:#fca5a5;--bad-bg:#2b1313;--bad-border:#5c2020;--solid-bad:#ef4444;
    --info-bg:#101d33;
    --shadow-sm:0 1px 2px rgba(0,0,0,.5);--shadow-md:0 14px 34px rgba(0,0,0,.5);
    --chart-n1:#82899a;
    --donut-0:#5aa5ee;--donut-1:#3cc593;--donut-2:#f4a54d;--donut-3:#a284ea;--donut-4:#3dc3d4;--donut-5:#e786b1;--donut-6:#cf9e63;--donut-7:#a1b0c0;
    --dot:#141417;
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --bg:#0a0a0c;--surface:#141417;--surface-2:#1a1a1e;--surface-3:#222226;
  --ink:#f2f2f3;--muted:#a3a3ab;--faint:#71717a;
  --border:#27272b;--border-strong:#3a3a40;
  --primary:#818cf8;--primary-hover:#a5b4fc;--on-primary:#11112b;--primary-soft:#1e1b4b;--primary-ink:#a5b4fc;
  --nav-bg:#141417;--nav-ink:#c2c2c9;--nav-strong:#f7f7f8;--nav-muted:#84848c;--nav-hover:#1d1d22;--nav-active:#232328;--nav-border:#27272b;
  --focus:#f5b400;
  --ok:#4ade80;--ok-bg:#102417;--ok-border:#1e4a2c;--solid-ok:#22c55e;
  --warn:#fbbf24;--warn-bg:#2c2208;--warn-border:#55430f;--solid-warn:#f59e0b;
  --bad:#f87171;--bad-ink:#fca5a5;--bad-bg:#2b1313;--bad-border:#5c2020;--solid-bad:#ef4444;
  --info-bg:#101d33;
  --shadow-sm:0 1px 2px rgba(0,0,0,.5);--shadow-md:0 14px 34px rgba(0,0,0,.5);
  --chart-n1:#82899a;
  --donut-0:#5aa5ee;--donut-1:#3cc593;--donut-2:#f4a54d;--donut-3:#a284ea;--donut-4:#3dc3d4;--donut-5:#e786b1;--donut-6:#cf9e63;--donut-7:#a1b0c0;
  --dot:#141417;
}

/* ===== 2. Base =================================================================================== */
*{box-sizing:border-box}
html,body{max-width:100%;overflow-x:clip}
body{margin:0;background:var(--bg);color:var(--ink);font:0.9375rem/1.55 var(--font);-webkit-font-smoothing:antialiased;transition:background-color .18s ease,color .18s ease}
h1,h2,h3,h4{line-height:1.25;letter-spacing:-.01em}
a{color:var(--primary);text-underline-offset:2px}
a:hover{color:var(--primary-hover)}
a,button,input,select,textarea,summary{font:inherit}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
small{color:var(--muted)}
hr{border:0;border-top:1px solid var(--border)}
.skip-link{position:absolute;left:1rem;top:-5rem;z-index:100;background:var(--surface);color:var(--ink);padding:.75rem 1rem;border-radius:var(--radius-sm);box-shadow:var(--shadow-md)}
.skip-link:focus{top:1rem}
.visually-hidden,.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.icon{width:1.2em;height:1.2em;flex:none;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.eyebrow{color:var(--muted);font-size:.75rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.narrow{max-width:48rem}
.num{text-align:right;font-variant-numeric:tabular-nums}

/* ===== 3. Coque : menu latéral, barre du haut ==================================================== */
.app-shell{display:grid;grid-template-columns:16rem minmax(0,1fr);min-height:100vh}
.app-anon{grid-template-columns:minmax(0,1fr)}
.app-main{min-width:0;display:flex;flex-direction:column}
main{flex:1;min-width:0}
main:focus{outline:none}

.sidebar{position:sticky;top:0;height:100vh;overflow-y:auto;display:flex;flex-direction:column;gap:.5rem;padding:1rem .75rem;background:var(--nav-bg);color:var(--nav-ink);border-right:1px solid var(--nav-border);transition:background-color .18s ease,border-color .18s ease}
.sidebar a{color:inherit;text-decoration:none}
.sidebar-head{display:flex;align-items:center;justify-content:space-between;padding:.25rem .5rem .5rem}
.brand{display:inline-flex;align-items:center;gap:.6rem;font-weight:650;font-size:1.05rem;letter-spacing:-.01em;color:var(--ink);text-decoration:none}
.sidebar .brand{color:var(--nav-strong)}
.brand-mark{display:inline-grid;place-items:center;width:2rem;height:2rem;border-radius:9px;background:var(--primary);color:var(--on-primary)}
.brand-mark .icon{width:1.2rem;height:1.2rem}
.sidebar .sidebar-close{display:none}


.nav{display:grid;gap:.9rem;margin-top:.25rem}
.nav-heading{margin:0 0 .25rem;padding:0 .6rem;font-size:.6875rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--nav-muted)}
.nav-list{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.nav-link{display:flex;align-items:center;gap:.65rem;min-height:2.4rem;padding:.4rem .6rem;border-radius:var(--radius-sm);color:var(--nav-ink);font-weight:500;box-shadow:inset 3px 0 0 transparent;transition:background-color .12s ease,color .12s ease,box-shadow .12s ease}
.nav-link .icon{font-size:1.1rem;color:var(--nav-muted)}
a.nav-link:hover{background:var(--nav-hover);color:var(--nav-strong)}
a.nav-link:hover .icon{color:var(--nav-strong)}
.nav-link[aria-current="page"]{background:var(--nav-active);color:var(--nav-strong);font-weight:650;box-shadow:inset 3px 0 0 var(--primary)}
.nav-link[aria-current="page"] .icon{color:var(--primary)}
.nav-locked{opacity:.65;cursor:not-allowed;justify-content:flex-start}
.nav-locked small{display:block;color:var(--nav-muted);font-size:.6875rem;line-height:1.2}
.nav-locked .nav-lock{margin-left:auto;font-size:.95rem}
.sidebar-backdrop{display:none}
/* Validation du mois écoulé (cabinet, 2026-09-28), sous le choix de la pharmacie. */
/* Menu réduit à ses icônes (écran large) : bouton en bas à droite du menu, choix gardé d'une page à l'autre (shell.js). */
.sidebar-toggle{position:sticky;bottom:0;z-index:1;margin-top:auto;align-self:flex-end;flex:none;color:var(--nav-muted);background:var(--nav-bg)}
.sidebar-toggle:hover{background:var(--nav-hover);color:var(--nav-strong)}
.sidebar-toggle .when-collapsed,:root[data-sidebar="collapsed"] .sidebar-toggle .when-expanded{display:none}
:root[data-sidebar="collapsed"] .sidebar-toggle .when-collapsed{display:inline}
@media (min-width:64em){
  .app-shell{transition:grid-template-columns .18s ease}
  :root[data-sidebar="collapsed"] .app-shell:not(.app-anon){grid-template-columns:4.25rem minmax(0,1fr)}
  :root[data-sidebar="collapsed"] .sidebar{padding:1rem .5rem;overflow-x:hidden}
  :root[data-sidebar="collapsed"] .sidebar-head{justify-content:center;padding:.25rem 0 .5rem}
  :root[data-sidebar="collapsed"] .brand>span:not(.brand-mark),
  :root[data-sidebar="collapsed"] .nav-heading,
  :root[data-sidebar="collapsed"] .nav-link>span,
  :root[data-sidebar="collapsed"] .nav-lock{display:none}
  :root[data-sidebar="collapsed"] .nav{gap:.5rem}
  :root[data-sidebar="collapsed"] .nav-group+.nav-group{padding-top:.5rem;border-top:1px solid var(--nav-border)}
  :root[data-sidebar="collapsed"] .nav-link{justify-content:center;padding:.4rem 0}
  :root[data-sidebar="collapsed"] .sidebar-toggle{align-self:center}
}
@media (max-width:63.999em){.sidebar-toggle{display:none}}

.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:.75rem;min-height:3.5rem;padding:.5rem 1.5rem;background:var(--surface);border-bottom:1px solid var(--border);transition:background-color .18s ease,border-color .18s ease}
.topbar .nav-toggle{display:none}
.breadcrumb{min-width:0;flex:1}
.breadcrumb ol{display:flex;flex-wrap:wrap;align-items:center;gap:.15rem .1rem;margin:0;padding:0;list-style:none;font-size:.875rem;color:var(--muted)}
.breadcrumb li{display:inline-flex;align-items:center;min-width:0}
.breadcrumb li+li::before{content:"/";margin:0 .45rem;color:var(--faint)}
.breadcrumb a{color:var(--muted);text-decoration:none;max-width:16rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.breadcrumb a:hover{color:var(--primary);text-decoration:underline}
.breadcrumb [aria-current="page"]{color:var(--ink);font-weight:600}
.topbar-tools{display:flex;align-items:center;gap:.5rem}
.topbar-tools form{margin:0}
.pilot-pill{display:inline-flex;align-items:center;padding:.2rem .6rem;border-radius:999px;border:1px solid var(--warn-border);background:var(--warn-bg);color:var(--warn);font-size:.75rem;font-weight:600;white-space:nowrap}
/* « Profil testé » (administrateurs) : menu à côté de la pastille pilote. */
.icon-button{display:inline-grid;place-items:center;width:2.4rem;height:2.4rem;padding:0;border:1px solid transparent;border-radius:var(--radius-sm);background:transparent;color:var(--muted);cursor:pointer;transition:background-color .12s ease,color .12s ease}
.icon-button:hover{background:var(--surface-3);color:var(--ink)}
.icon-button .icon{font-size:1.25rem}
.theme-toggle .theme-sun{display:none}
:root[data-theme="dark"] .theme-toggle .theme-sun{display:block}
:root[data-theme="dark"] .theme-toggle .theme-moon{display:none}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .theme-toggle .theme-sun{display:block}:root:not([data-theme="light"]) .theme-toggle .theme-moon{display:none}}
.user-chip{display:flex;align-items:center;gap:.55rem;padding:.2rem .6rem .2rem .25rem;border-radius:999px;background:var(--surface-3)}
.avatar{display:inline-grid;place-items:center;width:1.9rem;height:1.9rem;border-radius:50%;background:var(--primary);color:var(--on-primary);font-weight:600;font-size:.85rem}
.user-meta{display:grid;line-height:1.2;min-width:0}
.user-email{max-width:13rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.8125rem;font-weight:500}
.user-meta small{font-size:.6875rem}
.anon-top{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.5rem}

@media (max-width:63.999em){
  .app-shell{grid-template-columns:minmax(0,1fr)}
  .sidebar{position:fixed;z-index:60;inset:0 auto 0 0;width:min(18rem,86vw);transform:translateX(-102%);transition:transform .2s ease;box-shadow:var(--shadow-md)}
  .app-shell[data-nav="open"] .sidebar{transform:none}
  .sidebar .sidebar-close{display:inline-grid;color:var(--nav-ink)}
  .sidebar .sidebar-close:hover{background:var(--nav-hover);color:#fff}
  .sidebar-backdrop{position:fixed;inset:0;z-index:50;background:rgba(6,16,26,.55)}
  .app-shell[data-nav="open"] .sidebar-backdrop{display:block}
  .topbar .nav-toggle{display:inline-grid}
  .topbar{padding:.5rem 1rem}
  .user-meta{display:none}
}
@media (max-width:41.999em){
  .pilot-pill{display:none}
  .breadcrumb li:not(:last-child){display:none}
  .breadcrumb li+li::before{content:none}
}
@media (prefers-reduced-motion:reduce){
  .app-shell,.sidebar,.topbar,body,.card,.empty,.form-card,.confirm-card,.kpi-card,.kpi-tile,.chart-card,.comment-block,.nav-link,.icon-button,.pill,.badge,.exercise-tabs a,table td{transition:none}
  .kpi-card:hover,.kpi-tile:hover,.chart-card:hover,.comment-block:hover{transform:none}
  .workspace,.page,.auth-panel{animation:none}
}

/* ===== 4. Composants ============================================================================= */
/* Boutons */
.button{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;min-height:44px;padding:.5rem 1rem;border-radius:var(--radius-sm);border:1px solid var(--primary);text-decoration:none;font-weight:600;cursor:pointer;transition:background .12s,border-color .12s}
.button.primary,.primary{background:var(--primary);color:var(--on-primary)}
.button.primary:hover{background:var(--primary-hover);border-color:var(--primary-hover);color:var(--on-primary)}
.button.secondary,.secondary{background:var(--surface);color:var(--ink);border-color:var(--border-strong)}
.button.secondary:hover{background:var(--surface-3);color:var(--ink)}
.button.danger,.danger{background:var(--solid-bad);border-color:var(--solid-bad);color:#fff}
.button.danger:hover{filter:brightness(1.08);color:#fff}
.button.danger-outline,.danger-outline{background:var(--surface);color:var(--bad-ink);border-color:var(--bad-border)}
.button.danger-outline:hover{background:var(--bad-bg);color:var(--bad-ink)}
.button[disabled]{opacity:.55;cursor:not-allowed}
.actions,.page-head{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.card-actions,.confirm-actions{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}
.confirm-actions{margin-top:1.25rem;justify-content:flex-end}

/* Formulaires */
input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]),select,textarea{min-height:44px;padding:.45rem .7rem;border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--surface);color:var(--ink)}
input[type="file"]{max-width:100%;padding:.35rem;border:1px dashed var(--border-strong);border-radius:var(--radius-sm);background:var(--surface-2);color:var(--ink)}
input[type="checkbox"],input[type="radio"]{accent-color:var(--primary)}
input::placeholder{color:var(--faint)}
label{color:var(--ink)}
.field{display:grid;gap:.3rem}
.field[hidden]{display:none}
.field-check label{display:flex;align-items:center;gap:.5rem;font-weight:600}
.field-check input{width:auto;margin:0}
.field-error,.errorlist{color:var(--bad-ink)}
.field-error{margin:.25rem 0 0;font-size:.875rem}
.auth-panel input,.form-card input:not([type="checkbox"]):not([type="hidden"]),.form-card select{width:100%}

/* Cartes, alertes, états vides */
.card,.empty,.form-card,.confirm-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:1.1rem 1.25rem;box-shadow:var(--shadow-sm);transition:background-color .18s ease,border-color .18s ease,box-shadow .15s ease}
.form-card,.confirm-card{display:grid;gap:1rem;padding:1.5rem}
.confirm-card{margin-top:1rem}
.card h2,.card h3{margin-top:0}
.alert{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:.75rem 1rem;margin:.75rem 0}
.alert.success,.success{background:var(--ok-bg);border-color:var(--ok-border);color:var(--ok)}
.alert.error,.error{background:var(--bad-bg);border-color:var(--bad-border);color:var(--bad-ink)}
.alert.warning,.warning{background:var(--warn-bg);border-color:var(--warn-border);color:var(--warn)}
.alert.info,.info{background:var(--info-bg);border-color:var(--border)}
.alert a{color:inherit;font-weight:600}
.cards{display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(17rem,1fr))}
.page,.auth-panel{max-width:75rem;margin:0 auto;padding:1.75rem 1.5rem}
.auth-panel{max-width:28rem;margin-top:1.5rem;display:grid;gap:.75rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:1.75rem;box-shadow:var(--shadow-md)}
.auth-panel h1{margin:.1rem 0 0;font-size:1.5rem}
.auth-panel p{margin:.15rem 0}
.auth-panel form{display:grid;gap:1rem;background:none;border:0;padding:0}
.page-head h1{margin:.1rem 0 .15rem;font-size:1.6rem}
.page-head p{margin:0;color:var(--muted)}
.archived-section{margin-top:2.5rem;padding-top:1.5rem;border-top:1px solid var(--border)}
.archived-card{background:var(--surface-2)}
.badge{display:inline-block;background:var(--primary-soft);color:var(--primary-ink);padding:.15rem .6rem;border-radius:999px;font-size:.8125rem;font-weight:600;transition:background-color .12s ease,color .12s ease}
.badge-to-map{background:var(--solid-bad);color:#fff}
.badge-suggested{background:var(--solid-warn);color:#1a1200}
.badge-confirmed{background:var(--solid-ok);color:#fff}
.badge-to-map,.badge-suggested,.badge-confirmed{font-weight:700}

/* Onglets et exercices */
.workspace .tabs{display:flex;flex-wrap:wrap;gap:.25rem;margin:.75rem 0 1rem;border-bottom:1px solid var(--border)}
.workspace .tabs>*{display:inline-flex;align-items:center;min-height:2.6rem;padding:.4rem 1rem;margin-bottom:-1px;border-bottom:2px solid transparent;color:var(--muted);text-decoration:none;font-weight:600}
.workspace .tabs a[href]:hover{color:var(--ink);background:var(--surface-3);border-radius:var(--radius-sm) var(--radius-sm) 0 0}
.workspace .tabs a[aria-current="page"]{color:var(--primary-ink);border-bottom-color:var(--primary)}
.exercise-bar{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem 1.25rem;margin:.75rem 0}
.exercise-bar h2{margin:0;font-size:1.1rem}
.exercise-summary{margin:0;color:var(--muted)}
.workspace .exercise-tabs{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;margin:0}
.exercise-tabs-label{color:var(--muted);font-size:.8125rem;font-weight:600}
.exercise-tabs a{display:inline-flex;align-items:center;min-height:2.3rem;padding:.25rem 1rem;border:1px solid var(--border-strong);border-radius:999px;background:var(--surface);color:var(--ink);font-weight:600;text-decoration:none;font-variant-numeric:tabular-nums;transition:background-color .12s ease,border-color .12s ease,color .12s ease}
.exercise-tabs a:hover{background:var(--surface-3)}
.exercise-tabs a[aria-current="page"]{background:var(--primary);border-color:var(--primary);color:var(--on-primary)}

/* Pastilles d'état */
.pill{display:inline-flex;align-items:center;justify-content:center;gap:.3rem;min-width:4.9rem;min-height:2.1rem;padding:.15rem .6rem;border-radius:999px;border:1.5px solid var(--border-strong);font-weight:600;font-size:.8125rem;text-decoration:none;cursor:pointer;background:var(--surface);transition:background-color .12s ease,filter .12s ease}
.pill-ok{color:var(--ok);border-color:var(--solid-ok);background:var(--ok-bg)}
.pill-ok:hover{filter:brightness(.96);color:var(--ok)}
.pill-missing{color:var(--bad-ink);border-color:var(--bad-border);background:var(--bad-bg);cursor:default}
a.pill-missing{cursor:pointer}
a.pill-missing:hover{filter:brightness(.97);color:var(--bad-ink)}
.pill-error{color:var(--bad-ink);border-color:var(--solid-bad);background:var(--bad-bg)}
.pill-neutral{color:var(--muted);border-color:var(--border-strong);background:var(--surface-3)}
.pill-attention{color:var(--warn);border-color:var(--warn-border);background:var(--warn-bg)}
a.pill-neutral{cursor:pointer}
a.pill-neutral:hover{background:var(--border);color:var(--ink)}
.pill-mini{min-width:0;min-height:0;padding:0 .5rem;cursor:default;font-size:.75rem}
.status-ok{color:var(--ok)}
.status-ko{color:var(--bad-ink)}

/* Tableaux */
.table-wrap{max-width:100%;overflow-x:auto;margin:1rem 0;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface)}
table{width:100%;border-collapse:collapse;background:var(--surface)}
th,td{text-align:left;vertical-align:top;padding:.6rem .75rem;border-bottom:1px solid var(--border)}
th{background:var(--surface-3);color:var(--muted);font-size:.8125rem;font-weight:600}
th[scope="row"]{color:var(--ink);font-size:inherit}
tbody tr:last-child>*{border-bottom:0}
table tbody tr:hover td{background:var(--surface-2)}
table td{transition:background-color .12s ease}
td:first-child{font-variant-numeric:tabular-nums}
.simple-table th,.simple-table td{padding:.5rem .7rem}
.simple-table .total-row th,.simple-table .total-row td{background:var(--surface-3);font-weight:700;color:var(--ink)}
.table-note{margin:.25rem 0 1rem;color:var(--muted);font-size:.875rem}
.row-warning td{background:var(--warn-bg)}
/* ===== 5. Pages ================================================================================== */
@media (prefers-reduced-motion:no-preference){
  .workspace,.page,.auth-panel{animation:mi-rise .32s ease both}
  @keyframes mi-rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
}
.workspace{width:100%;max-width:120rem;margin:0 auto;padding:1.5rem}
.workspace>section{min-width:0}
.ws-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:.1rem 1rem;margin-bottom:.25rem}
.ws-head h1{margin:0;font-size:1.6rem}
.ws-head .eyebrow{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.ws-note{margin:0;color:var(--muted)}
.ws-badges{display:flex;flex-wrap:wrap;gap:.35rem;margin:.35rem 0 0}
.ws-hint{margin:.5rem 0;color:var(--muted);font-size:.9rem}
.workspace h2{font-size:1.15rem}
@media (max-width:41.999em){.workspace,.page,.auth-panel{padding:1rem}.button{width:100%}.topbar-tools .button{width:auto}.actions,.page-head{align-items:stretch;flex-direction:column}}
/* Reporting : tuiles compactes, courbe + anneau par taux, filtre */
.kpi-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(10.5rem,1fr));gap:.75rem;margin:.75rem 0}
/* Tuile : quatre rangées (titre + période, valeur, écart, comparaison) alignées d'une tuile à l'autre grâce à subgrid. */
.kpi-tile{position:relative;display:grid;grid-row:span 4;grid-template-rows:subgrid;row-gap:.45rem;min-width:0;padding:.85rem 1rem .9rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);container-type:inline-size;transition:background-color .18s ease,border-color .18s ease,box-shadow .15s ease,transform .15s ease}
@supports not (grid-template-rows:subgrid){.kpi-tile{grid-row:auto;grid-template-rows:auto 1fr auto auto}}
.kpi-tile:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}
/* En-tête : titre (et icône d'avertissement à droite) sur la première ligne, période analysée toujours dessous. */
.tile-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:.35rem .5rem}
.kpi-tile h2{grid-column:1;grid-row:1;min-width:0;margin:0;font-size:.85rem;font-weight:600;color:var(--ink);line-height:1.3}
.tile-period{grid-column:1 / -1;grid-row:2;justify-self:start;margin:0;padding:.1rem .5rem;font-size:.7rem;font-weight:550;line-height:1.45;color:var(--muted);background:var(--surface-2);border:1px solid var(--border);border-radius:999px;white-space:nowrap;font-variant-numeric:tabular-nums}
.tile-head .tile-alert{grid-column:2;grid-row:1}
.kpi-tile .kpi-value{align-self:center;padding:.3rem 0 .1rem;text-align:center;font-size:clamp(1.3rem,12cqi,1.9rem);white-space:nowrap}
/* Tuiles sur une seule ligne quand elles tiennent ; sinon réparties à parts égales sur deux lignes (6 tuiles : 3 + 3, 7 : 4 + 3),
   puis en grille libre si même deux lignes sont trop larges. `data-n` = nombre de tuiles ; 10,5 rem = largeur minimale d'une tuile. */
.kpi-tiles-wrap{container-type:inline-size}
.kpi-tiles{grid-template-columns:repeat(var(--n,5),minmax(0,1fr))}
.kpi-tiles[data-n="2"]{--n:2}
@container (max-width:21.75rem){.kpi-tiles[data-n="2"]{--n:1}}
.kpi-tiles[data-n="3"]{--n:3}
@container (max-width:33rem){.kpi-tiles[data-n="3"]{--n:2}}
@container (max-width:21.75rem){.kpi-tiles[data-n="3"]{grid-template-columns:repeat(auto-fit,minmax(10.5rem,1fr))}}
.kpi-tiles[data-n="4"]{--n:4}
@container (max-width:44.25rem){.kpi-tiles[data-n="4"]{--n:2}}
@container (max-width:21.75rem){.kpi-tiles[data-n="4"]{grid-template-columns:repeat(auto-fit,minmax(10.5rem,1fr))}}
.kpi-tiles[data-n="5"]{--n:5}
@container (max-width:55.5rem){.kpi-tiles[data-n="5"]{--n:3}}
@container (max-width:33rem){.kpi-tiles[data-n="5"]{grid-template-columns:repeat(auto-fit,minmax(10.5rem,1fr))}}
.kpi-tiles[data-n="6"]{--n:6}
@container (max-width:66.75rem){.kpi-tiles[data-n="6"]{--n:3}}
@container (max-width:33rem){.kpi-tiles[data-n="6"]{grid-template-columns:repeat(auto-fit,minmax(10.5rem,1fr))}}
.kpi-tiles[data-n="7"]{--n:7}
@container (max-width:78rem){.kpi-tiles[data-n="7"]{--n:4}}
@container (max-width:44.25rem){.kpi-tiles[data-n="7"]{grid-template-columns:repeat(auto-fit,minmax(10.5rem,1fr))}}
.kpi-tiles[data-n="8"]{--n:8}
@container (max-width:89.25rem){.kpi-tiles[data-n="8"]{--n:4}}
@container (max-width:44.25rem){.kpi-tiles[data-n="8"]{grid-template-columns:repeat(auto-fit,minmax(10.5rem,1fr))}}
.tile-delta{margin:0;font-size:.8125rem;font-variant-numeric:tabular-nums;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:0 .4rem}
.delta-value{display:inline-flex;align-items:center;gap:.2rem;font-weight:650;padding:.1rem .55rem;border-radius:999px;transition:background-color .12s ease,color .12s ease}
.delta-versus{color:var(--muted);font-weight:400}
.tone-good .delta-value{color:var(--ok);background:var(--ok-bg)}
.tone-bad .delta-value{color:var(--bad);background:var(--bad-bg)}
.tone-neutral .delta-value{color:var(--muted);background:var(--surface-3)}
.tile-foot{padding-top:.5rem;border-top:1px solid var(--border);text-align:center}
.tile-versus{margin:0;font-size:.75rem;color:var(--muted);font-variant-numeric:tabular-nums}
.tile-note{margin:.15rem 0 0;font-size:.75rem;color:var(--faint)}
.tile-alert summary{list-style:none;cursor:pointer;display:inline-grid;place-items:center;width:1.75rem;height:1.75rem;margin:-.25rem -.4rem 0 0;border-radius:var(--radius-sm);color:var(--warn)}

/* ===== 6. Repris de MyInvest =============================================================================== */
.button.small{min-height:2.25rem;padding:.3rem .8rem;font-size:.875rem;width:auto}
.ws-head{align-items:center;justify-content:space-between;margin-bottom:.75rem}
.ws-head form{margin:0}
.workspace>section,.workspace section+section{margin-top:1.5rem}
.section-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.5rem 1rem;margin:0 0 .5rem}
.section-head h2{margin:0}
.section-head .num{display:flex;flex-direction:column;align-items:flex-end;line-height:1.3}
.muted{color:var(--muted)}
.small{font-size:.8125rem}
.hausse{color:var(--ok)}
.baisse{color:var(--bad)}
.num{white-space:nowrap}
.note{margin:.6rem .1rem 0;color:var(--muted);font-size:.875rem}

/* Tuiles : pas de pastille de période, pied en texte simple */
.kpi-tile .tile-head h2{color:var(--muted)}
.tile-foot p{margin:0;font-size:.75rem;color:var(--muted);font-variant-numeric:tabular-nums}

/* Bandeau des cours */
.quotes-bar{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin:.75rem 0 0}
.quotes-bar span{color:var(--muted);font-size:.875rem}

/* Tableaux : colonnes secondaires masquées sur téléphone, détail sous le nom à la place */
.table-wrap{margin:.5rem 0}
table tfoot th,table tfoot td{background:var(--surface-3);font-weight:700;color:var(--ink);font-size:inherit;border-bottom:0;border-top:1px solid var(--border-strong)}
table .num{text-align:right}
table .sec{display:none}
table .detail{display:block}
@media (min-width:48em){table .sec{display:table-cell}table .detail{display:none}}
.row-link{color:var(--ink);font-weight:600;text-decoration:none}
.row-link:hover{color:var(--primary);text-decoration:underline}
.row-warn{color:var(--warn);font-weight:600;font-size:.8125rem}
.share{min-width:8rem;white-space:nowrap}
.gauge{display:inline-block;vertical-align:middle;width:4.5rem;height:.5rem;margin-right:.4rem;border-radius:4px;background:var(--surface-3);overflow:hidden}
.gauge span{display:block;height:100%;border-radius:4px;background:var(--primary)}
.pill-mini.achat{color:var(--primary-ink);border-color:var(--primary);background:var(--primary-soft)}
.pill-mini.vente{color:var(--warn);border-color:var(--warn-border);background:var(--warn-bg)}

/* Chiffres clés dans une carte, décomposition, listes */
.figures{display:grid;grid-template-columns:repeat(auto-fit,minmax(9rem,1fr));gap:.75rem 1.25rem;margin:0}
.figures dt{color:var(--muted);font-size:.8125rem}
.figures dd{margin:0;font-weight:600;font-size:1.05rem;font-variant-numeric:tabular-nums}
.breakdown{margin:0}
.breakdown>div{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;padding:.55rem 0;border-bottom:1px solid var(--border)}
.breakdown>div:last-child{border-bottom:0}
.breakdown dt small{display:block}
.breakdown dd{margin:0;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.breakdown .total{font-weight:700;border-top:1px solid var(--border-strong)}
.rows{list-style:none;margin:0;padding:0}
.rows li{border-bottom:1px solid var(--border)}
.rows li:last-child{border-bottom:0}
.rows li>a,.rows li>div{display:flex;justify-content:space-between;align-items:center;gap:1rem;min-height:2.75rem;padding:.35rem 0;color:var(--ink);text-decoration:none}
.rows li>a:hover{color:var(--primary)}
.rows li.muted{padding:.6rem 0}
.rows .action{color:var(--primary);font-weight:600;font-size:.8125rem;margin-left:.5rem}
.card details>summary{cursor:pointer;color:var(--primary);font-size:.875rem;padding:.6rem 0 .25rem}
.card>.figures+details,.card>.note+details{margin-top:.6rem;border-top:1px solid var(--border)}
.month-head{display:flex;justify-content:space-between;padding-bottom:.4rem;border-bottom:1px solid var(--border-strong)}
.card+.card{margin-top:.75rem}
.day{display:inline-block;min-width:3.1em;font-weight:650;font-variant-numeric:tabular-nums}

/* Formulaires */
.form-card{max-width:36rem}
.field>label,.field>.label{font-weight:600}
.choices{display:flex;flex-wrap:wrap;gap:.4rem}
.choice{position:relative;display:inline-flex;align-items:center;min-height:2.3rem;padding:.25rem 1rem;border:1px solid var(--border-strong);border-radius:999px;background:var(--surface);font-weight:600;cursor:pointer}
.choice input{position:absolute;opacity:0;pointer-events:none}
.choice:has(input:checked){background:var(--primary);border-color:var(--primary);color:var(--on-primary)}
.choice:has(input:focus-visible){outline:3px solid var(--focus);outline-offset:2px}
.total-preview{margin:0;padding:.6rem .8rem;border-radius:var(--radius-sm);background:var(--primary-soft);color:var(--primary-ink);font-weight:600}
.delete-zone{max-width:36rem;margin-top:1rem;text-align:right}
.filter-bar{margin:0 0 .5rem}
.kpi-value{margin:0;font-size:2rem;font-weight:650;line-height:1.15;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
@media (max-width:41.999em){.kpi-tiles[data-n]{grid-template-columns:repeat(2,minmax(0,1fr))}.kpi-tiles[data-n="3"]>:last-child,.kpi-tiles[data-n="5"]>:first-child{grid-column:1 / -1}}
@media (max-width:63.999em){.sidebar .sidebar-toggle{display:none}}

/* ===== 7. Repris de MyInvest V2 : cartes, fenêtres, calendrier, cascade ==================================== */
/* Menu et barre du haut toujours visibles */
@media (min-width:64em){.sidebar{position:sticky;top:0;height:100vh;height:100dvh;align-self:start}}
.topbar{position:sticky;top:0}
.two-cols{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,22rem),1fr));align-items:start}
.two-cols>.card,.pf-cards>.card{margin:0}
.kpi-value.hausse{color:var(--ok)}
.kpi-value.baisse{color:var(--bad)}
.link-button{display:inline-flex;align-items:center;min-height:2.25rem;padding:0 .25rem;border:0;background:none;color:var(--muted);font-size:.875rem;text-decoration:underline;cursor:pointer}
.link-button:hover{color:var(--ink)}

/* Cartes de portefeuille */
.pf-cards{display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(min(100%,17.5rem),1fr));align-items:stretch}
.pf-card{display:flex;flex-direction:column;gap:.5rem;padding:1rem 1.15rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);color:var(--ink);text-decoration:none;transition:background-color .18s ease,border-color .18s ease,box-shadow .15s ease,transform .15s ease}
.pf-card:hover{color:var(--ink);border-color:var(--primary);box-shadow:var(--shadow-md);transform:translateY(-2px)}
.pf-card-head{display:flex;align-items:center;justify-content:space-between;gap:.5rem}
.pf-card-head h3{margin:0;font-size:1rem}
.pf-card-value{margin:0;font-size:1.6rem;font-weight:650;letter-spacing:-.02em;line-height:1.15;font-variant-numeric:tabular-nums}
.pf-card-lines{margin:.25rem 0 0;padding-top:.5rem;border-top:1px solid var(--border);display:grid;gap:.3rem}
.pf-card-lines>div{display:flex;justify-content:space-between;align-items:baseline;gap:.75rem}
.pf-card-lines dt{color:var(--muted);font-size:.8125rem}
.pf-card-lines dd{margin:0;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.pf-card-foot{display:flex;align-items:center;flex-wrap:wrap;gap:.25rem .5rem;margin-top:auto;padding-top:.35rem}
.pf-card-foot .gauge{flex:1;min-width:4rem;margin:0}
@media (prefers-reduced-motion:reduce){.pf-card,.cal-month{transition:none}.pf-card:hover,.cal-month:hover{transform:none}}

/* Fenêtres : détail de portefeuille, détail de mois, dividendes à confirmer */
dialog.modal{width:min(34rem,calc(100vw - 1.5rem));max-height:calc(100dvh - 2rem);padding:0;border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface);color:var(--ink);box-shadow:var(--shadow-md);overflow:hidden}
dialog.modal[open]{display:flex;flex-direction:column}
dialog.modal-wide{width:min(64rem,calc(100vw - 1.5rem))}
dialog.modal::backdrop{background:rgba(6,16,26,.55)}
.modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding:1rem 1.25rem .75rem;border-bottom:1px solid var(--border)}
.modal-head h2{margin:0;font-size:1.15rem}
.modal-body{padding:.75rem 1.25rem;overflow-y:auto;overscroll-behavior:contain}
.modal-body .table-wrap{margin:0}
.modal-foot{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.5rem 1rem;padding:.75rem 1.25rem;border-top:1px solid var(--border);background:var(--surface-2)}
.row-actions{display:flex;gap:.9rem;margin-top:.15rem}
.row-actions a{font-weight:600;text-decoration:none}
.row-actions a:hover{text-decoration:underline}

/* Dividendes à confirmer */
.confirm-banner{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.5rem 1rem}
.confirm-banner .icon{vertical-align:-.2em}
.confirm-item{display:grid;gap:.6rem;padding:.9rem 0;border-bottom:1px solid var(--border)}
.confirm-item:last-child{border-bottom:0}
.confirm-item-head{display:grid;gap:.1rem}
.confirm-item-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(9rem,1fr));gap:.6rem}
.confirm-item-fields label{display:grid;gap:.25rem;font-size:.8125rem;font-weight:600;color:var(--muted)}
.confirm-item-fields input{width:100%}

/* Contributions par portefeuille : barres de part et autre de zéro */
.contrib{list-style:none;margin:0;padding:0;display:grid;gap:.45rem}
.contrib li{display:grid;grid-template-columns:minmax(5.5rem,9rem) minmax(4rem,1fr) auto;align-items:center;gap:.6rem}
.contrib-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.contrib-bar{display:grid;grid-template-columns:1fr 1fr;height:.75rem}
.contrib-neg,.contrib-pos{display:flex;height:100%}
.contrib-neg{justify-content:flex-end;border-right:1px solid var(--border-strong)}
.contrib-neg span{background:var(--solid-bad);border-radius:4px 0 0 4px}
.contrib-pos span{background:var(--solid-ok);border-radius:0 4px 4px 0}
.contrib-value{font-weight:600;min-width:6.5rem}

/* Répartition par classe */
.alloc{display:flex;gap:2px;height:.9rem;margin:.5rem 0 .75rem}
.alloc-seg{flex-basis:0;min-width:4px;border-radius:4px}
.alloc-0{background:var(--donut-0)}.alloc-1{background:var(--donut-1)}.alloc-2{background:var(--donut-2)}
.alloc-legend{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.4rem 1.5rem}
.alloc-legend li{display:flex;align-items:baseline;gap:.4rem}
.alloc-dot{display:inline-block;width:.65rem;height:.65rem;border-radius:3px;align-self:center}

/* Cascade : versé, retiré, net investi, valeur, gain */
.cascade{margin:0;display:grid}
.cascade>div{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;padding:.45rem 0}
.cascade dt{color:var(--muted)}
.cascade dd{margin:0;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.cascade-op{display:inline-block;width:1.1rem;color:var(--faint);font-weight:700}
.cascade-sub{border-top:1px solid var(--border-strong);border-bottom:1px solid var(--border)}
.cascade-sub dt,.cascade-result dt{color:var(--ink);font-weight:600}
.cascade-result{margin-top:.35rem;padding:.6rem .75rem!important;border-radius:var(--radius);background:var(--surface-3)}
.cascade-result.tone-good{background:var(--ok-bg)}
.cascade-result.tone-bad{background:var(--bad-bg)}
.cascade-result dd{display:grid;justify-items:end;font-size:1.15rem}
.cascade-result dd small{font-weight:400}
.cascade-total{border-color:var(--border-strong)}
.cascade-card details{margin-top:.5rem;border-top:1px solid var(--border)}

/* Calendrier des dividendes : 12 mois par année */
.cal{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.6rem}
@media (max-width:63.999em){.cal{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:41.999em){.cal{grid-template-columns:repeat(3,minmax(0,1fr));gap:.45rem}}
.cal-month{display:grid;justify-items:center;gap:.2rem;min-width:0;padding:.65rem .4rem .6rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);color:var(--ink);cursor:pointer;box-shadow:var(--shadow-sm);transition:border-color .12s ease,box-shadow .15s ease,transform .15s ease}
.cal-month:not(:disabled):hover{border-color:var(--primary);box-shadow:var(--shadow-md);transform:translateY(-2px)}
.cal-month:disabled{cursor:default;box-shadow:none;background:var(--surface-2);color:var(--faint)}
.cal-month.is-current{border-color:var(--primary);box-shadow:inset 0 0 0 1px var(--primary)}
.cal-name{font-size:.8125rem;font-weight:600;color:var(--muted)}
.cal-bar{display:flex;align-items:flex-end;justify-content:center;width:100%;height:2.4rem}
.cal-bar span{display:block;width:44%;min-height:2px;border-radius:4px 4px 0 0;background:var(--primary)}
.cal-month.is-past .cal-bar span{background:var(--chart-n1)}
.cal-month.is-empty .cal-bar span{background:var(--border-strong);height:2px!important}
.cal-amount{font-weight:650;font-variant-numeric:tabular-nums;white-space:nowrap}
.cal-count{font-size:.6875rem;color:var(--muted)}

/* Classements top et flop */
.rank{list-style:none;margin:0;padding:0}
.rank li{display:flex;align-items:center;gap:.75rem;padding:.5rem 0;border-bottom:1px solid var(--border)}
.rank li:last-child{border-bottom:0}
.rank-n{display:inline-grid;place-items:center;width:1.6rem;height:1.6rem;flex:none;border-radius:50%;background:var(--surface-3);color:var(--muted);font-size:.8125rem;font-weight:650}
.rank-name{flex:1;min-width:0;display:grid}
.detail-block>summary{cursor:pointer;color:var(--primary);font-weight:600;padding:.25rem 0}

/* Saisie : formulaire à gauche, journal à droite */
.entry-layout{display:grid;gap:1.5rem;grid-template-columns:minmax(0,1fr);align-items:start}
@media (min-width:72em){.entry-layout{grid-template-columns:minmax(0,30rem) minmax(0,1fr)}.entry-form{position:sticky;top:4.5rem}}
.entry-layout>section{margin:0}
.segmented{display:flex;flex-wrap:wrap;gap:.25rem;padding:.25rem;border-radius:var(--radius);background:var(--surface-3)}
.segmented a{flex:1 1 auto;display:inline-flex;align-items:center;justify-content:center;min-height:2.4rem;padding:.25rem .8rem;border-radius:var(--radius-sm);color:var(--muted);font-weight:600;text-decoration:none;white-space:nowrap}
.segmented a:hover{color:var(--ink)}
.segmented a[aria-current="true"]{background:var(--surface);color:var(--ink);box-shadow:var(--shadow-sm)}
.entry-form .form-card{max-width:none}
.form-grid{display:grid;gap:1rem;grid-template-columns:repeat(2,minmax(0,1fr))}
.form-grid .field-portefeuille,.form-grid .field-valeur,.form-grid .field-note,.form-grid .field-montant{grid-column:1 / -1}
form[data-saisie="versement"] .field-montant,form[data-saisie="retrait"] .field-montant,form[data-saisie="dividende"] .field-montant{grid-column:auto}
@media (max-width:30em){.form-grid{grid-template-columns:minmax(0,1fr)}}
[data-aide-valeur]:empty,[data-aide-portefeuille]:empty{display:none}
.journal .journal-main{display:flex;align-items:flex-start;gap:.6rem;min-width:0}
.journal .journal-main>span:last-child{display:grid;min-width:0}
.journal .pill-mini{flex:none;min-width:5.2rem;margin-top:.1rem}
.genre-achat{color:var(--primary-ink);border-color:var(--primary);background:var(--primary-soft)}
.genre-vente{color:var(--warn);border-color:var(--warn-border);background:var(--warn-bg)}
.genre-versement,.genre-dividende{color:var(--ok);border-color:var(--ok-border);background:var(--ok-bg)}
.genre-retrait{color:var(--muted);border-color:var(--border-strong);background:var(--surface-3)}
.section-head .filter-bar{margin:0}
@media (max-width:41.999em){dialog.modal{width:calc(100vw - .75rem);max-height:calc(100dvh - 1rem)}.modal-head,.modal-foot{padding-left:.85rem;padding-right:.85rem}.modal-body{padding:.5rem}.modal th,.modal td{padding:.5rem .4rem}.modal td.num{font-size:.875rem}}


/* ===== 8. Repris de MyInvest ===================================================================== */
.rank-title{margin:0 0 .25rem;font-size:.8125rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.card .two-cols{gap:.5rem 2rem}
.workspace>.card{margin-top:1.5rem}
.section-head .tile-delta{justify-content:flex-end}

/* ===== 10. MyCompta ============================================================================== */
.ws-tools{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}
.ws-tools select{min-height:2.4rem!important;padding:.2rem .6rem!important}
.ws-tools .segmented{flex-wrap:nowrap}
.ws-tools .segmented a{min-height:2rem;padding:.15rem .75rem;font-size:.875rem}
.recette{color:var(--ok)}
.depense{color:var(--bad)}

/* Graphique mois par mois : recettes (vert) et dépenses (rouge) côte à côte */
.bars{display:grid;grid-template-columns:repeat(var(--n,12),minmax(0,1fr));gap:.35rem;height:13rem;margin-top:.5rem}
.bar-col{border:0;background:none;font:inherit;cursor:pointer;display:grid;grid-template-rows:minmax(0,1fr) auto auto;min-width:0;color:var(--ink);text-decoration:none;border-radius:var(--radius-sm);padding:.25rem 0 .2rem}
.bar-col:hover{background:var(--surface-2);color:var(--ink)}
.bar-col.is-current .bar-label{color:var(--primary-ink);font-weight:700}
.bar-pair{display:flex;align-items:flex-end;justify-content:center;gap:3px;min-height:0}
.bar{display:block;width:38%;max-width:1.5rem;min-height:2px;border-radius:4px 4px 0 0}
.bar-in{background:var(--solid-ok)}
.bar-out{background:var(--solid-bad)}
.bar-label{padding-top:.3rem;font-size:.75rem;font-weight:600;color:var(--muted);text-align:center}
.bar-net{font-size:.6875rem;text-align:center;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.legend{list-style:none;margin:.25rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.25rem 1.25rem;color:var(--muted);font-size:.8125rem}
.legend li{display:flex;align-items:center;gap:.4rem}
.legend-key{display:inline-block;width:.75rem;height:.75rem;border-radius:3px}
@media (max-width:41.999em){.bars{height:10rem;gap:.15rem}.bar-net{display:none}.bar{width:42%}}

/* Liste « montant cliquable » (catégories, établissements récurrents) */
.amount-list{list-style:none;margin:0;padding:0}
.amount-list li{border-bottom:1px solid var(--border)}
.amount-list li:last-child{border-bottom:0}
.amount-list button{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.15rem 1rem;width:100%;min-height:2.9rem;padding:.4rem .25rem;border:0;background:none;color:var(--ink);text-align:left;cursor:pointer;border-radius:var(--radius-sm)}
.amount-list button:hover{background:var(--surface-2)}
.amount-list .name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
.amount-list .amount{font-weight:650;font-variant-numeric:tabular-nums;white-space:nowrap}
.amount-list .sub{grid-column:1 / -1;display:flex;align-items:center;gap:.5rem;font-size:.75rem;color:var(--muted)}
.amount-list .gauge{flex:1;max-width:12rem;margin:0}

/* Tableau de suivi : mois en colonnes, catégories → sous-catégories → établissements en lignes */
.matrix-wrap{position:relative;max-height:calc(100dvh - 12rem);overflow:auto;margin:.5rem 0;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface)}
.matrix{border-collapse:separate;border-spacing:0;min-width:100%;font-size:.875rem}
.matrix th,.matrix td{padding:0;border-bottom:1px solid var(--border);white-space:nowrap;vertical-align:middle}
.matrix thead th{position:sticky;top:0;z-index:3;padding:.55rem .6rem;text-align:right}
.matrix thead th:first-child{text-align:left}
.matrix th:first-child,.matrix td:first-child{position:sticky;left:0;z-index:2;background:var(--surface);border-right:1px solid var(--border)}
.matrix thead th:first-child{z-index:4;background:var(--surface-3)}
.matrix tbody tr:hover>*{background:var(--surface-2)}
.matrix .label{display:flex;align-items:center;gap:.35rem;min-width:13rem;max-width:22rem;padding:.35rem .6rem}
.matrix .label-text{display:grid;min-width:0}
.matrix .label-text>span{overflow:hidden;text-overflow:ellipsis}
.matrix .label-text small{font-size:.6875rem;overflow:hidden;text-overflow:ellipsis}
.matrix .niv-0 td,.matrix .niv-0 th{font-weight:650}
.matrix tr.niv-0>*{border-top:1px solid var(--border-strong)}
.matrix .niv-1 .label{padding-left:1.6rem}
.matrix .niv-2 .label{padding-left:3rem;font-weight:400}
.matrix .niv-2 td{color:var(--muted)}
.matrix .niv-2 td:first-child{color:var(--ink)}
.matrix .flat .label{padding-left:.6rem}
.toggle{display:inline-grid;place-items:center;width:1.6rem;height:1.6rem;flex:none;margin-left:-.25rem;padding:0;border:0;border-radius:6px;background:none;color:var(--muted);cursor:pointer}
.toggle:hover{background:var(--surface-3);color:var(--ink)}
.toggle .icon{transition:transform .15s ease}
.toggle[aria-expanded="true"] .icon{transform:rotate(90deg)}
.toggle-spacer{display:inline-block;width:1.35rem;flex:none}
.cell{display:block;width:100%;min-width:5.6rem;padding:.45rem .6rem;border:0;background:none;color:inherit;font:inherit;font-variant-numeric:tabular-nums;text-align:right;cursor:pointer}
.cell:hover{color:var(--primary-ink);text-decoration:underline;text-underline-offset:2px}
.cell-empty{display:block;padding:.45rem .6rem;text-align:right;color:var(--faint)}
.matrix .col-total{background:var(--surface-2);font-weight:650}
.matrix .col-nb{padding:.45rem .6rem;text-align:right;color:var(--muted);font-variant-numeric:tabular-nums}
.matrix tfoot td,.matrix tfoot th{position:sticky;bottom:0;z-index:2;background:var(--surface-3);font-weight:700;border-top:1px solid var(--border-strong);border-bottom:0}
.matrix tfoot th:first-child{z-index:4}
.matrix tr[hidden]{display:none}
@media (prefers-reduced-motion:reduce){.toggle .icon{transition:none}}
@media (max-width:41.999em){.matrix .label{min-width:9.5rem;max-width:11rem}.matrix-wrap{max-height:none}.ws-tools{width:100%}.ws-tools .segmented{flex:1}}

/* Fenêtre de détail */
.detail-total{font-size:1.15rem;font-weight:700;font-variant-numeric:tabular-nums}
.modal .simple-table td{vertical-align:top}
.modal .op-sub{display:block;font-size:.75rem;color:var(--muted)}
.modal-loading{padding:2rem 1.25rem;color:var(--muted)}
@media (min-width:48em){.modal .op-sub.detail{display:none}}

/* Opérations */
.filters{display:flex;flex-wrap:wrap;align-items:flex-end;gap:.5rem .75rem;margin:.5rem 0}
.filters .field{gap:.15rem}
.filters label{font-size:.75rem;font-weight:600;color:var(--muted)}
.filters input[type="search"]{min-width:14rem}
.filters .field-check{align-self:center;padding-top:1rem}
.pager{display:flex;align-items:center;justify-content:center;gap:1rem;margin:1rem 0}
.pill-mini.neutre{color:var(--muted);border-color:var(--border-strong);background:var(--surface-3)}
.op-main{display:grid;min-width:0}
.op-main small{color:var(--muted)}

/* Réglages */
.check-list{list-style:none;margin:0;padding:0;columns:2 22rem;column-gap:2rem}
.check-list li{break-inside:avoid;padding:.2rem 0}
.check-list label{display:flex;align-items:baseline;gap:.5rem;cursor:pointer}
.check-list .cat{display:block;margin-top:.6rem;font-size:.75rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.check-list small{margin-left:auto;white-space:nowrap;font-variant-numeric:tabular-nums}
.steps{margin:0;padding-left:1.25rem;display:grid;gap:.35rem}
.solde-form{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:auto;padding-top:.6rem;border-top:1px solid var(--border)}
.solde-form input[type="date"]{flex:1 1 9rem;min-width:0}
.solde-form input[inputmode="decimal"]{flex:1 1 7rem;min-width:0;text-align:right}
.pf-card .rows form{margin:0}
.soldes-option{margin-top:1.5rem}
.soldes-option>summary{font-size:1rem}
.soldes-option .pf-cards{margin-top:.75rem}
.pf-card .rows .icon-button{width:2rem;height:2rem}
.cell.hausse{color:var(--ok)}
.cell.baisse{color:var(--bad)}