/* HERMES | Châtel-Saint-Denis — feuille de style principale
   Couleurs de marque relevées sur https://www.chatel-st-denis.ch/ (CSS/branding du site, 2026-11-06) :
   jaune #FFDA00, brun #382F2D, taupe #C5BBB6, police « Source Sans Pro ».
   Les autres teintes (états, surfaces, thème sombre) sont des choix de l'application, non des codes officiels. */
/* Source Sans 3 (successeur de Source Sans Pro), Adobe, licence SIL OFL 1.1 — hébergée localement (voir fonts/OFL.txt) */
@font-face { font-family: "Source Sans Pro"; src: url("../fonts/SourceSans3VF-Upright.otf.woff2") format("woff2"); font-weight: 200 900; font-style: normal; font-display: swap; }
:root {
  --csd-yellow: #FFDA00;      /* relevé sur le site */
  --csd-brown: #382F2D;       /* relevé sur le site */
  --csd-taupe: #C5BBB6;       /* relevé sur le site */
  --bg: #F6F4F2; --surface: #FFFFFF; --surface-2: #FBFAF9; --text: #2A2321; --muted: #6B615D; --border: #E3DEDA;
  --accent: var(--csd-yellow); --accent-ink: var(--csd-brown); --line: var(--csd-brown); --primary: var(--csd-brown); --primary-ink: #FFFFFF;
  --ok: #1F7A4D; --ok-bg: #E4F4EA; --warn: #8A5A00; --warn-bg: #FFF1CC; --bad: #B3261E; --bad-solid: #B3261E; --ok-solid: #1F7A4D; --bad-bg: #FBE4E2; --info: #1D5F8A; --info-bg: #E2F0F9;
  --radius: 10px; --radius-sm: 6px; --shadow: 0 1px 2px rgba(56,47,45,.06), 0 4px 14px rgba(56,47,45,.06);
  --font: "Source Sans Pro", "Source Sans 3", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --ease: cubic-bezier(.22,1,.36,1); --sp: 4px; --sidebar-w: 248px; --focus: 0 0 0 3px rgba(255,218,0,.65), 0 0 0 5px var(--csd-brown);
}
@media (prefers-color-scheme: dark) { :root[data-theme="auto"] { --bg:#1B1716; --surface:#262120; --surface-2:#2D2726; --text:#F2EDEA; --muted:#B5ABA6; --border:#413936; --primary:var(--csd-yellow); --line:var(--csd-yellow); --primary-ink:var(--csd-brown); --ok-bg:#16301f; --warn-bg:#3a2e08; --bad-bg:#3d1a17; --info-bg:#14293a; --ok:#6fd49b; --warn:#f0c04a; --bad:#ff8f87; --info:#7cc0ea; --focus:0 0 0 3px rgba(255,218,0,.7); } }
:root[data-theme="sombre"] { --bg:#1B1716; --surface:#262120; --surface-2:#2D2726; --text:#F2EDEA; --muted:#B5ABA6; --border:#413936; --primary:var(--csd-yellow); --line:var(--csd-yellow); --primary-ink:var(--csd-brown); --ok-bg:#16301f; --warn-bg:#3a2e08; --bad-bg:#3d1a17; --info-bg:#14293a; --ok:#6fd49b; --warn:#f0c04a; --bad:#ff8f87; --info:#7cc0ea; --focus:0 0 0 3px rgba(255,218,0,.7); }

*,*::before,*::after { box-sizing: border-box; }
html { font-size: 16px; -webkit-text-size-adjust: 100%; }
body { margin:0; font-family: var(--font); font-size: 1.0625rem; line-height: 1.5; color: var(--text); background: var(--bg); -webkit-font-smoothing: antialiased; }
h1,h2,h3 { line-height: 1.2; margin: 0 0 .6em; letter-spacing: -.01em; }
h1 { font-size: 1.75rem; } h2 { font-size: 1.25rem; } h3 { font-size: 1.05rem; }
a { color: inherit; text-decoration-color: var(--csd-taupe); text-underline-offset: 3px; }
a:hover { text-decoration-color: currentColor; }
:focus-visible { outline: none; box-shadow: var(--focus); border-radius: var(--radius-sm); }
.sr-only, .skip:not(:focus) { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.skip:focus { position:fixed; top:8px; left:8px; z-index:100; background:var(--csd-yellow); color:var(--csd-brown); padding:8px 12px; border-radius:6px; }
.muted { color: var(--muted); } .small { font-size: .875rem; } .right { text-align:right; } .center { text-align:center; }
code { background: var(--surface-2); border:1px solid var(--border); padding: 0 .3em; border-radius: 4px; font-size: .9em; }

/* ---- Structure ---- */
.shell { display:flex; min-height:100vh; }
.sidebar { width: var(--sidebar-w); flex: none; background: var(--csd-brown); color: #F6F1EE; padding: 16px 12px; position: sticky; top:0; height:100vh; overflow:auto; display:flex; flex-direction:column; }
.brand { display:flex; gap:10px; align-items:center; text-decoration:none; padding: 6px 8px 18px; }
.brand strong { display:block; font-size:1.2rem; letter-spacing:.02em; } .brand small { color: var(--csd-taupe); }
.brandmark { width: 34px; height: 34px; border-radius: 8px; background: var(--csd-yellow); position:relative; flex:none; }
.brandmark::after { content:""; position:absolute; inset:9px; border:3px solid var(--csd-brown); border-radius:3px; transform: rotate(45deg); }
.brandmark.big { width:56px; height:56px; margin: 0 auto 12px; } .brandmark.big::after { inset:15px; }
.sidebar ul { list-style:none; margin:0; padding:0; display:grid; gap:2px; }
.sidebar nav a { display:flex; align-items:center; gap:12px; padding: 9px 10px; border-radius: 8px; text-decoration:none; color:#EDE6E2; transition: background .15s var(--ease), color .15s; }
.sidebar nav a:hover { background: rgba(255,255,255,.08); }
.sidebar nav a[aria-current="page"] { background: var(--csd-yellow); color: var(--csd-brown); font-weight:600; }
.sidebar svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.sidebar-foot { margin-top:auto; padding: 12px 8px 0; font-size:.85rem; color: var(--csd-taupe); }
.main-col { flex:1; min-width:0; display:flex; flex-direction:column; }
.topbar { display:flex; align-items:center; gap:12px; padding: 10px 24px; background: var(--surface); border-bottom:1px solid var(--border); position:sticky; top:0; z-index:20; }
.search { flex:1; max-width: 560px; } .search input { width:100%; }
.topbar-right { margin-left:auto; display:flex; align-items:center; gap:8px; }
.user { display:flex; align-items:center; gap:8px; text-decoration:none; padding:2px 6px; border-radius:8px; } .user:hover { background: var(--surface-2); }
.uname { display:flex; flex-direction:column; line-height:1.15; font-weight:600; } .uname small { font-weight:400; color:var(--muted); font-size:.78rem; }
.avatar { width:32px; height:32px; border-radius:50%; background: var(--csd-yellow); color: var(--csd-brown); display:grid; place-items:center; font-weight:700; }
.icon-btn { position:relative; width:38px; height:38px; display:grid; place-items:center; border:1px solid transparent; background:transparent; border-radius:8px; color:var(--text); cursor:pointer; }
.icon-btn:hover { background: var(--surface-2); border-color: var(--border); }
.icon-btn svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.dot { position:absolute; top:2px; right:2px; background: var(--bad-solid); color:#fff; font-size:.7rem; min-width:16px; height:16px; border-radius:8px; display:grid; place-items:center; padding:0 4px; }
.menu-toggle { display:none; }
main { padding: 24px; flex:1; max-width: 1400px; width:100%; margin: 0 auto; animation: fadeUp .28s var(--ease) both; }
.site-foot { padding: 14px 24px; font-size:.85rem; color: var(--muted); display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; border-top:1px solid var(--border); }
.site-foot.center { justify-content:center; border:0; }
.signature a { font-weight:600; text-decoration-color: var(--csd-yellow); text-decoration-thickness: 2px; }

/* ---- Composants ---- */
.card { background: var(--surface); border:1px solid var(--border); border-radius: var(--radius); padding: 20px; box-shadow: var(--shadow); margin-bottom: 16px; }
.card h2:first-child { margin-top:0; }
.grid-2 { display:grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap:16px; }
.grid-3 { display:grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap:16px; }
.kpis { display:grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap:12px; margin-bottom:16px; }
.kpi { min-width:0; background: var(--surface); border:1px solid var(--border); border-radius: var(--radius); padding: 14px 16px; }
.kpi .v { overflow-wrap:anywhere; font-size:1.9rem; font-weight:700; line-height:1.1; font-variant-numeric: tabular-nums; } .kpi .l { color:var(--muted); font-size:.9rem; }
.kpi.bad .v { color: var(--bad); } .kpi.warn .v { color: var(--warn); } .kpi.ok .v { color: var(--ok); }
.page-head { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:16px; }
.page-head h1 { margin:0; } .crumbs { font-size:.9rem; color: var(--muted); margin-bottom:4px; }
.tabs { display:flex; gap:2px; overflow-x:auto; border-bottom:1px solid var(--border); margin: 0 0 18px; scrollbar-width:thin; }
.tabs a { padding: 9px 14px; text-decoration:none; color: var(--muted); border-bottom:3px solid transparent; white-space:nowrap; transition: color .15s, border-color .15s; }
.tabs a:hover { color: var(--text); } .tabs a[aria-current="page"] { color: var(--text); border-color: var(--csd-yellow); font-weight:600; }

.btn { display:inline-flex; align-items:center; justify-content:center; gap:6px; padding: 8px 16px; border-radius: 8px; border:1px solid var(--border); background: var(--surface); color: var(--text); font: inherit; font-weight:600; cursor:pointer; text-decoration:none; transition: transform .12s var(--ease), background .15s, box-shadow .15s; }
.btn:hover { background: var(--surface-2); } .btn:active { transform: scale(.97); }
.btn-primary { background: var(--primary); border-color: var(--primary); color: var(--primary-ink); } .btn-primary:hover { background: var(--primary); filter: brightness(1.12); }
.btn-accent { background: var(--csd-yellow); border-color: var(--csd-yellow); color: var(--csd-brown); }
.btn-danger { background: var(--bad-solid); border-color: var(--bad-solid); color:#fff; } .btn-ghost { background: transparent; border-color: transparent; }
.btn-sm { padding: 4px 10px; font-size: .9rem; } .btn-block { width:100%; }
.btn[disabled], .btn[aria-disabled="true"] { opacity:.5; cursor:not-allowed; }
.stack { display:grid; gap:12px; } .row { display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
label { display:grid; gap:4px; font-weight:600; font-size:.95rem; }
label > input, label > select, label > textarea { font-weight:400; }
input, select, textarea { font: inherit; color: var(--text); background: var(--surface); border:1px solid #B8ADA8; border-radius: 8px; padding: 8px 10px; min-height: 40px; width:100%; transition: border-color .15s, box-shadow .15s; }
input[type=checkbox], input[type=radio] { width:1.5rem; height:1.5rem; min-height:0; flex:none; accent-color: var(--csd-brown); }   /* cible tactile ≥ 24 px (WCAG 2.2, critère 2.5.8) */
summary { min-height:24px; padding-block:2px; }
input:focus, select:focus, textarea:focus { border-color: var(--csd-brown); outline:none; box-shadow: var(--focus); }
textarea { min-height: 90px; resize: vertical; }
fieldset { border:1px solid var(--border); border-radius: var(--radius-sm); padding: 10px 12px; } legend { font-weight:600; padding: 0 6px; }
.hint { font-weight:400; color: var(--muted); font-size:.85rem; }

.table { width:100%; border-collapse: collapse; } .table th, .table td { text-align:left; padding: 9px 10px; border-bottom:1px solid var(--border); vertical-align: top; }
.table th { font-size:.82rem; text-transform: uppercase; letter-spacing:.04em; color: var(--muted); white-space:nowrap; }
.table tbody tr:hover { background: var(--surface-2); } .table-wrap { overflow-x:auto; }
.badge { display:inline-block; padding: 1px 9px; border-radius: 999px; font-size:.8rem; font-weight:600; background: var(--surface-2); border:1px solid var(--border); white-space:nowrap; }
.badge-ok { background: var(--ok-bg); color: var(--ok); border-color: transparent; } .badge-warn { background: var(--warn-bg); color: var(--warn); border-color: transparent; }
.badge-bad { background: var(--bad-bg); color: var(--bad); border-color: transparent; } .badge-info { background: var(--info-bg); color: var(--info); border-color: transparent; }
.badge-hermes { background: var(--csd-yellow); color: var(--csd-brown); border-color: transparent; }
.alert { padding: 10px 14px; border-radius: var(--radius-sm); border:1px solid; margin: 0 0 12px; }
.alert-ok { background: var(--ok-bg); color: var(--ok); border-color: transparent; } .alert-error { background: var(--bad-bg); color: var(--bad); border-color: transparent; }
.alert-warn { background: var(--warn-bg); color: var(--warn); border-color: transparent; } .alert-info { background: var(--info-bg); color: var(--info); border-color: transparent; }
.empty { text-align:center; padding: 36px 20px; color: var(--muted); }
.progress { height: 8px; background: var(--border); border-radius: 99px; overflow:hidden; } .progress > span { display:block; height:100%; background: var(--line); border-radius:99px; transition: width .5s var(--ease); }
[data-theme="sombre"] .progress > span { background: var(--csd-yellow); }
.progress.ok > span { background: var(--ok); }
.toasts { position:fixed; right:16px; bottom:16px; display:grid; gap:8px; z-index:50; }
.toast { padding:10px 14px; border-radius:8px; background: var(--csd-brown); color:#fff; box-shadow: var(--shadow); animation: slideIn .3s var(--ease) both; margin-bottom:12px; }
.toast-ok { background: var(--ok-solid); } .toast-error { background: var(--bad-solid); }
.help-box { border-left: 4px solid var(--csd-yellow); background: var(--surface-2); padding: 10px 14px; border-radius: 0 var(--radius-sm) var(--radius-sm) 0; margin-bottom: 14px; }
.help-box summary { cursor:pointer; font-weight:600; }
.tip { border-bottom: 1px dotted var(--muted); cursor: help; }

/* ---- Frise des phases ---- */
.timeline { display:flex; gap:0; list-style:none; padding:0; margin: 0 0 18px; overflow-x:auto; }
.timeline li { flex:1; min-width: 130px; position:relative; padding: 10px 10px 10px 18px; background: var(--surface-2); border:1px solid var(--border); margin-right:-1px; clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 50%, calc(100% - 14px) 100%, 0 100%, 14px 50%); }
.timeline li.done { background: var(--ok-bg); } .timeline li.now { background: var(--csd-yellow); color: var(--csd-brown); font-weight:700; }
.timeline small { display:block; font-weight:400; opacity:.8; }
/* ---- Contrôle préparation ---- */
.checks { list-style:none; padding:0; margin:0; display:grid; gap:6px; }
.checks li { display:grid; grid-template-columns: 24px 1fr auto; gap:10px; align-items:start; padding:8px 10px; border:1px solid var(--border); border-radius:8px; background: var(--surface); }
.checks .ic { width:22px; height:22px; border-radius:50%; display:grid; place-items:center; font-size:.8rem; font-weight:700; color:#fff; }
.checks .s-ok .ic { background: var(--ok); } .checks .s-incomplet .ic { background: var(--warn); } .checks .s-bloquant .ic { background: var(--bad); } .checks .s-exception .ic { background: var(--info); }
.gauge { display:flex; align-items:center; gap:12px; } .gauge .progress { flex:1; }
/* ---- Kanban / Gantt / matrice ---- */
.kanban { display:grid; grid-template-columns: repeat(4, minmax(220px,1fr)); gap:12px; overflow-x:auto; }
.kcol { background: var(--surface-2); border:1px solid var(--border); border-radius: var(--radius); padding:10px; min-height: 120px; }
.kcol h3 { font-size:.9rem; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); } .kcard { background: var(--surface); border:1px solid var(--border); border-radius:8px; padding:8px 10px; margin-bottom:8px; box-shadow: var(--shadow); }
.gantt { overflow:auto; border:1px solid var(--border); border-radius:var(--radius); background:var(--surface); } .gantt svg { display:block; } .gantt text { fill: var(--text); font-size: 12px; font-family: var(--font); }
.matrix { border-collapse: collapse; } .matrix td { width:52px; height:44px; text-align:center; border:2px solid var(--surface); font-size:.8rem; font-weight:600; }
.m-low { background:#BFE3CC; color:#14452c; } .m-mid { background:#FFE69A; color:#5b3d00; } .m-high { background:#F7B38B; color:#5b2100; } .m-crit { background:#E8837C; color:#4a0b07; }
.chart { width:100%; max-height: 260px; } .chart .bar { fill: var(--line); } [data-theme="sombre"] .chart .bar { fill: var(--csd-yellow); }
.health { display:inline-block; width:10px; height:10px; border-radius:50%; margin-right:6px; } .health-vert { background: var(--ok); } .health-orange { background:#E0A100; } .health-rouge { background: var(--bad); }
.doc-section { border:1px solid var(--border); border-radius: var(--radius); padding: 14px; margin-bottom: 12px; background: var(--surface); }
.linked { background: var(--info-bg); color: var(--info); border-radius: 4px; padding: 0 4px; font-size:.9em; }
.installer { max-width: 760px; margin: 32px auto; } .installer .steps { display:flex; flex-wrap:wrap; gap:6px; list-style:none; padding:0; margin:12px 0 20px; counter-reset: s; }
.installer .steps li { counter-increment: s; font-size:.85rem; padding: 2px 10px; border-radius: 99px; background: var(--surface-2); border:1px solid var(--border); } .installer .steps li::before { content: counter(s) ". "; }
.installer .steps li.on { background: var(--csd-yellow); color: var(--csd-brown); font-weight:700; } .installer .steps li.done { background: var(--ok-bg); color: var(--ok); }
body.bare { display:flex; flex-direction:column; min-height:100vh; padding: 12px; } body.bare > main, body.bare > .card { margin: auto; }
.login { width:100%; max-width: 400px; text-align:center; margin: auto; align-self:center; } .login .stack { text-align:left; }
.secret { letter-spacing:.1em; font-size:1.1rem; }

@keyframes fadeUp { from { opacity:0; transform: translateY(6px);} to { opacity:1; transform:none;} }
@keyframes slideIn { from { opacity:0; transform: translateX(16px);} to { opacity:1; transform:none;} }
@media (max-width: 900px) {
  .sidebar { position: fixed; left:0; top:0; z-index:40; transform: translateX(-100%); transition: transform .25s var(--ease); width: 270px; }
  .sidebar.open { transform:none; box-shadow: 0 0 0 100vmax rgba(0,0,0,.4); }
  .menu-toggle { display:grid; } .uname { display:none; } main { padding: 16px; } .topbar { padding: 8px 12px; }
  .kanban { grid-template-columns: repeat(4, 80%); }
  .topbar-right { flex-wrap: wrap; justify-content: flex-end; min-width: 0; gap: 6px; flex: 1 1 auto; }
  .topbar { flex-wrap: wrap; } .search { order: 3; flex: 1 1 100%; max-width: none; min-width: 0; }   /* la recherche passe sur sa propre ligne : elle ne doit jamais être réduite à quelques pixels */
}
@media print { .sidebar, .topbar, .site-foot, .btn { display:none !important; } body { background:#fff; } }
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; } }

/* ---- Calendrier ---- */
.cal { display:grid; grid-template-columns: repeat(7, minmax(0,1fr)); gap:1px; background: var(--border); border:1px solid var(--border); border-radius: var(--radius); overflow:hidden; }
.cal-h { background: var(--surface-2); padding:6px; font-weight:600; font-size:.85rem; text-align:center; }
.cal-c { background: var(--surface); min-height: 96px; padding:4px; display:flex; flex-direction:column; gap:2px; }
.cal-c.off { background: var(--surface-2); } .cal-c.today { outline:2px solid var(--csd-yellow); outline-offset:-2px; }
.cal-d { font-size:.8rem; color: var(--muted); } .cal-e { display:block; font-size:.75rem; padding:1px 5px; border-radius:4px; text-decoration:none; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; background: var(--surface-2); border:1px solid var(--border); }
@media (max-width: 700px) { .cal { display:none; } }
/* ---- Tableau de bord personnalisable ---- */
.widgets { display:grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap:16px; align-items:start; } .widgets .card { margin:0; }
.customize summary { cursor:pointer; font-weight:600; } .customize li { display:flex; gap:8px; align-items:center; padding:4px 0; }

/* ---- Planning : vue simplifiée pour mobile (le Gantt SVG reste sur grand écran) ---- */
.gantt-mobile { display:none; }
.gm-item { background: var(--surface); border:1px solid var(--border); border-radius: var(--radius); padding:10px 12px; margin-bottom:8px; }
.gm-top a { font-weight:600; } .gm-track { position:relative; height:10px; background: var(--border); border-radius:99px; margin-top:8px; overflow:hidden; }
.gm-bar { position:absolute; top:0; bottom:0; background: var(--line); border-radius:99px; } .gm-bar.crit { background: var(--bad); }
[data-theme="sombre"] .gm-bar:not(.crit) { background: var(--csd-yellow); }
@media (max-width: 700px) { .gantt-wide { display:none; } .gantt-mobile { display:block; } .gantt-mobile + .table-wrap { display:none; } .kpis { grid-template-columns: repeat(2, 1fr); } .page-head { flex-direction:column; } .btn { min-height:44px; } }

/* ---- Infobulles de glossaire ---- */
.tip { border-bottom:1px dotted var(--muted); cursor:help; position:relative; }
.tip::after { content: attr(data-tip); position:absolute; left:0; top:calc(100% + 6px); z-index:60; width:max-content; max-width:min(320px, 80vw); background: var(--csd-brown); color:#fff; font-size:.85rem; font-weight:400; line-height:1.35; padding:8px 10px; border-radius:8px; box-shadow: var(--shadow); opacity:0; pointer-events:none; transform: translateY(-2px); transition: opacity .15s, transform .15s; }
.tip:hover::after, .tip:focus-visible::after { opacity:1; transform:none; }
[data-theme="sombre"] .tip::after { background: var(--csd-yellow); color: var(--csd-brown); }
/* ---- Visite guidée ---- */
.tour-hl { outline: 3px solid var(--csd-yellow) !important; outline-offset: 3px; border-radius: 8px; position:relative; z-index:45; box-shadow: 0 0 0 100vmax rgba(0,0,0,.35); }
.tour-pop { position:fixed; z-index:70; width: min(360px, calc(100vw - 24px)); background: var(--surface); color: var(--text); border:2px solid var(--csd-yellow); border-radius: var(--radius); padding:14px 16px; box-shadow: 0 8px 30px rgba(0,0,0,.35); animation: fadeUp .25s var(--ease) both; }
.tour-pop h3 { margin:0 0 6px; } .tour-pop .tour-meta { font-size:.8rem; color: var(--muted); margin-bottom:4px; } .tour-pop .row { margin-top:10px; justify-content:space-between; }

/* ---- Burndown / burnup ---- */
.bd { color: var(--text); max-height: 280px; } .bd polyline { stroke-width: 2.4; stroke-linejoin: round; stroke-linecap: round; }
.bd-actual { stroke: var(--line); } .bd-dot { fill: var(--line); } [data-theme="sombre"] .bd-actual { stroke: var(--csd-yellow); } [data-theme="sombre"] .bd-dot { fill: var(--csd-yellow); }
.bd-ideal { stroke: var(--muted); stroke-dasharray: 6 5; stroke-width: 1.8 !important; } .bd-scope { stroke: var(--csd-taupe); }
/* Glisser-déposer agile */
.dnd-handle { cursor: grab; touch-action: none; border: 1px solid var(--border); background: var(--surface-2); color: inherit; border-radius: 6px; padding: 0 .4rem; line-height: 1.6; font-size: 1rem; user-select: none; }
.dnd-handle:focus-visible { outline: 3px solid var(--csd-yellow); outline-offset: 2px; }
.kcard .dnd-handle { float: right; margin-left: 6px; }
.dragging { opacity: .55; outline: 2px dashed var(--csd-brown); } .saving { opacity: .6; }
.kcol.drop-hover { outline: 3px dashed var(--csd-brown); background: var(--surface); }
body.dnd-active { user-select: none; cursor: grabbing; } body.dnd-active .dnd-handle { cursor: grabbing; }
[data-drop] { min-height: 60px; }