/* Sandclaw CRM — shared components: buttons, cards, kpis, tables, badges,
   drawers, kanban, calendar, filters, forms, modals, chips, timeline, etc.
   Also carries the mode simple/complet display rules (per page, scoped
   [data-mode="simple"] selectors) per crm-architecture.md. */

.btn{font-family:var(--font); font-weight:var(--fw-semibold); font-size:12.5px; border-radius:var(--r-full); padding:10px 18px; cursor:pointer; border:1px solid transparent; display:inline-flex; align-items:center; gap:6px; transition:transform 100ms var(--ease-out), box-shadow 160ms var(--ease-out), background 160ms var(--ease-out), filter 160ms var(--ease-out);}
.btn:active{transform:scale(.96);}
.btn-primary{background:var(--accent); color:var(--accent-fg); box-shadow:0 1px 2px rgba(0,0,0,.08), 0 6px 16px -6px color-mix(in srgb, var(--accent) 55%, transparent);}
.btn-primary:hover{filter:brightness(1.06);}
.btn-secondary{background:var(--bg-surface); color:var(--text-primary); border-color:var(--border-strong);}
.btn-secondary:hover{background:var(--bg-surface-hover);}

.card{background:var(--bg-surface); border:1px solid var(--border-subtle); border-radius:var(--r-lg); transition:transform 220ms var(--ease-out), box-shadow 220ms var(--ease-out), border-color 220ms var(--ease-out);}
.card.hoverable:hover, .card.kpi:hover{transform:translateY(-2px); box-shadow:var(--shadow-card); border-color:var(--border-strong);}

/* ---- customizable widgets ---- */
.widget-grid{position:relative;}
.widget{position:relative; cursor:grab;}
.widget-grid .widget{min-height:134px; display:flex; flex-direction:column;}
.widget-grid .widget .k-sub{margin-top:auto; padding-top:6px;}
.widget:active{cursor:grabbing;}
.widget .grip{position:absolute; top:10px; right:10px; width:22px; height:22px; border-radius:var(--r-full); display:flex; align-items:center; justify-content:center; background:var(--bg-surface-raised); border:1px solid var(--border-subtle); opacity:0; transform:scale(.85); transition:opacity 140ms var(--ease-out), transform 140ms var(--ease-out); pointer-events:none;}
.widget .grip svg{width:12px;height:12px; stroke:var(--text-muted); fill:none; stroke-width:1.8;}
.widget:hover .grip{opacity:1; transform:scale(1);}
.widget.dragging{opacity:.45; box-shadow:none !important; transform:none !important;}
.widget.drop-target{outline:2px dashed var(--accent); outline-offset:3px;}
.widget-hint{display:flex; align-items:center; gap:6px; font-size:11px; color:var(--text-muted); margin:-6px 0 12px;}
.widget-hint svg{width:12px;height:12px; stroke:currentColor; fill:none; stroke-width:1.8;}

/* ---- widget remove / add-widget tile / picker ---- */
.widget-remove{position:absolute; top:10px; right:38px; width:22px; height:22px; border-radius:var(--r-full); display:flex; align-items:center; justify-content:center; background:var(--bg-surface-raised); border:1px solid var(--border-subtle); opacity:0; transform:scale(.85); transition:opacity 140ms var(--ease-out), transform 140ms var(--ease-out), background 140ms var(--ease-out), color 140ms var(--ease-out); cursor:pointer; color:var(--text-muted);}
.widget:hover .widget-remove{opacity:1; transform:scale(1);}
.widget-remove:hover{background:var(--danger-bg); color:var(--danger);}
.widget-remove svg{width:11px;height:11px; stroke:currentColor; fill:none; stroke-width:2.2;}
.widget-resize{position:absolute; top:10px; right:66px; width:22px; height:22px; border-radius:var(--r-full); display:flex; align-items:center; justify-content:center; background:var(--bg-surface-raised); border:1px solid var(--border-subtle); opacity:0; transform:scale(.85); transition:opacity 140ms var(--ease-out), transform 140ms var(--ease-out), background 140ms var(--ease-out), color 140ms var(--ease-out); cursor:pointer; color:var(--text-muted);}
.widget:hover .widget-resize{opacity:1; transform:scale(1);}
.widget-resize:hover{background:var(--accent-bg); color:var(--accent-t);}
.widget-resize svg{width:11px;height:11px; stroke:currentColor; fill:none; stroke-width:2.2;}
.widget.widget-lg{grid-column:span 2;}
.section-widget{position:relative;}
.section-remove{position:absolute; top:-9px; right:-9px; width:24px; height:24px; border-radius:var(--r-full); display:flex; align-items:center; justify-content:center; background:var(--bg-surface-raised); border:1px solid var(--border-subtle); opacity:0; transform:scale(.85); transition:opacity 140ms var(--ease-out), transform 140ms var(--ease-out), background 140ms var(--ease-out), color 140ms var(--ease-out), border-color 140ms var(--ease-out); cursor:pointer; color:var(--text-muted); z-index:3;}
.section-widget:hover .section-remove{opacity:1; transform:scale(1);}
.section-remove:hover{background:var(--danger-bg); color:var(--danger); border-color:var(--danger);}
.section-remove svg{width:11px;height:11px; stroke:currentColor; fill:none; stroke-width:2.2;}
.widget-add{border:1.5px dashed var(--border-strong); border-radius:var(--r-lg); background:transparent; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:6px; min-height:134px; cursor:pointer; color:var(--text-muted); transition:border-color 160ms var(--ease-out), color 160ms var(--ease-out), background 160ms var(--ease-out);}
.widget-add:hover{border-color:var(--accent); color:var(--accent-t); background:var(--accent-bg);}
.widget-add svg{width:20px;height:20px; stroke:currentColor; fill:none; stroke-width:1.8;}
.widget-add span{font-size:12px; font-weight:var(--fw-semibold);}
.widget-entering{animation:widgetIn 320ms var(--ease-spring);}
@keyframes widgetIn{from{opacity:0; transform:scale(.92) translateY(6px);} to{opacity:1; transform:scale(1) translateY(0);}}

.wp-scrim{position:fixed; inset:0; background:rgba(0,0,0,.42); z-index:88; opacity:0; pointer-events:none; transition:opacity 200ms var(--ease-out);}
.wp-scrim.open{opacity:1; pointer-events:auto;}
.wp-box{position:fixed; top:50%; left:50%; transform:translate(-50%,-48%) scale(.97); width:400px; max-width:92vw; max-height:74vh; overflow-y:auto; background:var(--bg-surface); border:1px solid var(--border-strong); border-radius:var(--r-xl); box-shadow:var(--shadow-modal); z-index:89; opacity:0; pointer-events:none; transition:opacity 180ms var(--ease-out), transform 180ms var(--ease-spring);}
.wp-box.open{opacity:1; transform:translate(-50%,-50%) scale(1); pointer-events:auto;}
.wp-head{display:flex; align-items:center; justify-content:space-between; padding:16px 18px; border-bottom:1px solid var(--border-subtle); position:sticky; top:0; background:var(--bg-surface);}
.wp-head b{font-size:14px; font-weight:var(--fw-semibold);}
.wp-list{padding:8px;}
.wp-item{display:flex; align-items:center; gap:12px; padding:10px 10px; border-radius:var(--r-s); cursor:pointer;}
.wp-item:hover{background:var(--bg-surface-hover);}
.wp-item .wp-icon{width:36px; height:36px; border-radius:var(--r-s); background:var(--bg-surface-raised); border:1px solid var(--border-subtle); display:flex; align-items:center; justify-content:center; flex:none;}
.wp-item .wp-icon svg{width:17px;height:17px; stroke:var(--text-secondary); fill:none; stroke-width:1.7;}
.wp-item .wp-title{font-size:13px; font-weight:var(--fw-medium);}
.wp-item .wp-desc{font-size:11.5px; color:var(--text-muted); margin-top:1px;}
.wp-item .wp-plus{margin-left:auto; width:24px; height:24px; border-radius:var(--r-full); background:var(--accent-bg); color:var(--accent-t); display:flex; align-items:center; justify-content:center; flex:none;}
.wp-item .wp-plus svg{width:12px;height:12px; stroke:currentColor; fill:none; stroke-width:2.4;}
.wp-empty{padding:32px 20px; text-align:center; font-size:12.5px; color:var(--text-muted);}

/* ---- onboarding wizard ---- */
.ob-scrim{position:fixed; inset:0; background:rgba(0,0,0,.55); backdrop-filter:blur(3px); z-index:95; display:flex; align-items:center; justify-content:center; opacity:0; pointer-events:none; transition:opacity 200ms var(--ease-out);}
.ob-scrim.open{opacity:1; pointer-events:auto;}
.ob-box{width:460px; max-width:92vw; background:var(--bg-surface); border:1px solid var(--border-strong); border-radius:var(--r-xl); box-shadow:var(--shadow-modal-lg); overflow:hidden; transform:translateY(14px) scale(.97); transition:transform 220ms var(--ease-spring);}
.ob-scrim.open .ob-box{transform:translateY(0) scale(1);}
.ob-progress-track{height:4px; background:var(--bg-surface-raised);}
.ob-progress-fill{height:100%; background:var(--accent); transition:width 320ms var(--ease-out);}
.ob-head{display:flex; align-items:center; justify-content:space-between; padding:18px 24px 0;}
.ob-step-count{font-size:11px; font-weight:var(--fw-semibold); color:var(--text-muted); text-transform:uppercase; letter-spacing:.05em;}
.ob-skip{background:none; border:none; font-size:12px; color:var(--text-muted); cursor:pointer; padding:0;}
.ob-skip:hover{color:var(--text-primary); text-decoration:underline;}
.ob-body{padding:22px 28px 26px; text-align:center;}
.ob-icon{width:64px; height:64px; border-radius:var(--r-lg); background:var(--accent-bg); display:flex; align-items:center; justify-content:center; margin:6px auto 18px;}
.ob-icon svg{width:28px; height:28px; stroke:var(--accent-t); fill:none; stroke-width:1.6;}
.ob-icon.done{background:var(--success-bg);}
.ob-icon.done svg{stroke:var(--success);}
.ob-title{font-family:var(--font-display); font-size:19px; font-weight:var(--fw-bold); letter-spacing:-.01em; margin-bottom:8px;}
.ob-desc{font-size:13px; color:var(--text-secondary); line-height:1.55; max-width:340px; margin:0 auto 20px;}
.ob-status{display:inline-flex; align-items:center; gap:6px; font-size:11.5px; font-weight:var(--fw-semibold); color:var(--success); background:var(--success-bg); padding:5px 12px; border-radius:999px; margin-bottom:18px;}
.ob-status svg{width:12px; height:12px; stroke:currentColor; fill:none; stroke-width:2.4;}
.ob-dots{display:flex; align-items:center; justify-content:center; gap:6px; margin-top:20px;}
.ob-dot{width:6px; height:6px; border-radius:50%; background:var(--border-strong); transition:background 200ms var(--ease-out), width 200ms var(--ease-out);}
.ob-dot.done{background:var(--success);}
.ob-dot.current{background:var(--accent); width:16px; border-radius:3px;}
.ob-footer{display:flex; align-items:center; gap:10px; padding:16px 24px; border-top:1px solid var(--border-subtle);}
.ob-footer .btn{flex:1; justify-content:center;}
.donut-row{display:flex; align-items:center; gap:12px;}
.donut-legend{display:flex; flex-direction:column; gap:5px; flex:1; min-width:0;}
.donut-legend div{display:flex; align-items:center; gap:6px; font-size:11px; color:var(--text-secondary);}
.donut-legend i{width:7px; height:7px; border-radius:2px; flex:none;}
.donut-legend b{margin-left:auto; font-family:var(--mono); color:var(--text-primary); font-weight:var(--fw-semibold);}
.top-list{display:flex; flex-direction:column; gap:8px; margin-top:2px;}
.top-list div{display:flex; align-items:center; gap:8px; font-size:12px;}
.top-rank{width:16px; height:16px; border-radius:50%; background:var(--bg-surface-raised); border:1px solid var(--border-subtle); font-family:var(--mono); font-size:9.5px; display:flex; align-items:center; justify-content:center; flex:none; color:var(--text-muted);}
.top-list .tu{flex:1; color:var(--text-secondary); font-family:var(--mono);}
.top-list .tv{font-family:var(--mono); font-weight:var(--fw-semibold);}

/* ---- score history sparkline ---- */
.score-hist-head{display:flex; align-items:baseline; justify-content:space-between; margin-bottom:8px;}
.score-hist-delta{font-size:11.5px; font-weight:var(--fw-semibold); display:inline-flex; align-items:center; gap:3px;}
.score-hist-delta svg{width:11px; height:11px; stroke:currentColor; fill:none; stroke-width:2.6;}
.score-hist-delta.up{color:var(--success);}
.score-hist-delta.down{color:var(--danger);}
.score-hist-delta.flat{color:var(--text-muted);}
.score-hist-labels{display:flex; justify-content:space-between; font-size:9.5px; color:var(--text-muted); margin-top:2px;}

/* ---- predictive ban-risk score ---- */
.risk-meter{display:flex; align-items:center; gap:12px; margin-bottom:10px;}
.risk-gauge-track{flex:1; height:9px; border-radius:999px; background:var(--bg-surface-raised); overflow:hidden;}
.risk-gauge-fill{height:100%; border-radius:999px; transition:width 320ms var(--ease-out), background 320ms var(--ease-out);}
.risk-pct{font-family:var(--mono); font-size:19px; font-weight:var(--fw-bold); flex:none; min-width:48px; text-align:right; color:var(--text-primary);}
.risk-tier-badge{display:inline-flex; align-items:center; gap:5px; font-size:10px; font-weight:var(--fw-semibold); text-transform:uppercase; letter-spacing:.04em; padding:3px 9px; border-radius:999px; margin-bottom:12px;}
.risk-factors{display:flex; flex-direction:column; gap:7px;}
.risk-factor{display:flex; align-items:center; gap:8px; font-size:12px; color:var(--text-secondary);}
.risk-factor svg{width:12px; height:12px; stroke:currentColor; fill:none; stroke-width:2.4; flex:none;}
.risk-banned-note{display:flex; align-items:center; gap:10px; padding:11px 12px; background:var(--bg-surface-raised); border-radius:var(--r-s); font-size:12px; color:var(--text-muted);}
.risk-banned-note svg{flex:none; color:var(--text-muted);}

/* ---- post-ban incident report ---- */
.incident-card{background:var(--danger-bg); border:1px solid rgba(190,67,56,.25); border-radius:var(--r-lg); padding:14px 16px;}
.incident-row{display:flex; justify-content:space-between; align-items:baseline; gap:12px; padding:7px 0; font-size:12px; border-bottom:1px solid var(--border-subtle);}
.incident-row:last-of-type{border-bottom:none;}
.incident-row span{color:var(--text-muted); flex:none;}
.incident-row b{color:var(--text-primary); font-weight:var(--fw-semibold); text-align:right;}
.incident-actions{margin-top:10px; padding-top:10px; border-top:1px solid var(--border-subtle);}
.incident-actions-label{font-size:10px; text-transform:uppercase; letter-spacing:.04em; font-weight:var(--fw-semibold); color:var(--text-muted); margin-bottom:8px;}
.incident-action{display:flex; align-items:flex-start; gap:8px; font-size:12px; color:var(--text-secondary); padding:4px 0;}
.incident-action svg{width:13px; height:13px; stroke:var(--success); fill:none; stroke-width:2.4; flex:none; margin-top:1px;}

/* ---- account comparator ---- */
.compare-scrim{position:fixed; inset:0; background:rgba(0,0,0,.55); backdrop-filter:blur(3px); z-index:96; display:flex; align-items:center; justify-content:center; opacity:0; pointer-events:none; transition:opacity 200ms var(--ease-out);}
.compare-scrim.open{opacity:1; pointer-events:auto;}
.compare-box{width:820px; max-width:94vw; max-height:88vh; overflow:auto; background:var(--bg-surface); border:1px solid var(--border-strong); border-radius:var(--r-xl); box-shadow:var(--shadow-modal-lg); transform:translateY(14px) scale(.97); transition:transform 220ms var(--ease-spring);}
.compare-scrim.open .compare-box{transform:translateY(0) scale(1);}
.compare-head{display:flex; align-items:center; justify-content:space-between; padding:18px 22px; border-bottom:1px solid var(--border-subtle); position:sticky; top:0; background:var(--bg-surface); z-index:1;}
.compare-head h3{font-family:var(--font-display); font-size:16.5px; font-weight:var(--fw-bold);}
.compare-body{padding:20px 22px 26px;}
.compare-picker{display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:20px;}
.compare-select{width:100%; font:inherit; font-size:12.5px; color:var(--text-primary); background:var(--field-bg); border:1px solid var(--border-strong); border-radius:var(--r-s); padding:9px 12px; outline:none; transition:border-color 140ms var(--ease-out), box-shadow 140ms var(--ease-out); appearance:none;}
.compare-select:focus{border-color:var(--accent); box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 20%, transparent);}
.compare-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:14px;}
.compare-card{border:1px solid var(--border-subtle); border-radius:var(--r-lg); padding:18px; background:var(--bg-surface-raised); position:relative; animation:widgetIn 260ms var(--ease-spring);}
.compare-card.best{border-color:var(--success);}
.compare-best-badge{position:absolute; top:-9px; left:14px; font-size:9px; font-weight:var(--fw-semibold); text-transform:uppercase; letter-spacing:.04em; color:#fff; background:var(--success); padding:2px 8px; border-radius:999px;}
.compare-remove{position:absolute; top:10px; right:10px; width:22px; height:22px; border-radius:50%; border:none; background:var(--bg-surface); color:var(--text-muted); display:flex; align-items:center; justify-content:center; cursor:pointer; padding:0;}
.compare-remove:hover{color:var(--danger); background:var(--danger-bg);}
.compare-remove svg{width:11px; height:11px; stroke:currentColor; fill:none; stroke-width:2.4;}
.compare-card-head{display:flex; align-items:center; gap:10px; margin-bottom:14px;}
.compare-av{width:36px; height:36px; border-radius:50%; background:var(--accent-bg); color:var(--accent-t); display:flex; align-items:center; justify-content:center; font-weight:var(--fw-bold); font-size:14px; flex:none;}
.compare-name{font-weight:var(--fw-semibold); font-size:13px; font-family:var(--mono);}
.compare-meta{font-size:11px; color:var(--text-muted); margin-top:2px;}
.compare-ring-row{display:flex; justify-content:center; margin-bottom:14px;}
.compare-stats{display:flex; flex-direction:column; gap:8px;}
.compare-stat-row{display:flex; align-items:center; justify-content:space-between; font-size:12px; color:var(--text-secondary);}
.compare-stat-row b{font-family:var(--mono); color:var(--text-primary); font-weight:var(--fw-semibold);}
.compare-empty{text-align:center; padding:40px 20px; color:var(--text-muted); font-size:12.5px;}

/* ---- forecast report cards ---- */
.forecast-card{border:1.5px dashed var(--border-strong); border-radius:var(--r-lg); padding:16px 18px; background:var(--bg-surface-raised);}
.fc-month{font-family:var(--font-display); font-size:14px; font-weight:var(--fw-bold); margin-bottom:12px; display:flex; align-items:center; gap:7px;}
.fc-tag{font-size:9.5px; font-weight:var(--fw-semibold); text-transform:uppercase; letter-spacing:.05em; color:var(--accent-t); background:var(--accent-bg); border-radius:var(--r-full); padding:2px 7px;}
.fc-row{display:flex; align-items:baseline; gap:8px; padding:6px 0; font-size:11.5px; color:var(--text-secondary);}
.fc-row b{margin-left:auto; font-size:14px; color:var(--text-primary); font-weight:var(--fw-semibold);}
.fc-delta{font-size:10.5px; font-weight:var(--fw-semibold); width:36px; text-align:right; flex:none;}
.fc-delta.up{color:var(--success);}

/* ---- ideas & suggestions box ---- */
.idea-textarea{width:100%; resize:vertical; min-height:76px; font:inherit; font-size:13px; color:var(--text-primary); background:var(--field-bg); border:1px solid var(--border-strong); border-radius:var(--r-s); padding:12px 14px; outline:none; transition:border-color 140ms var(--ease-out), box-shadow 140ms var(--ease-out); font-family:var(--font);}
.idea-textarea::placeholder{color:var(--text-muted);}
.idea-textarea:focus{border-color:var(--accent); box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 20%, transparent);}
.idea-footer{display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:10px;}
.idea-contact{font-size:12px; color:var(--text-secondary); text-decoration:none; font-family:var(--mono); display:flex; align-items:center; gap:6px;}
.idea-contact:hover{color:var(--accent-t); text-decoration:underline;}
.idea-list{display:flex; flex-direction:column; gap:8px; margin-top:16px;}
.idea-item{display:flex; align-items:flex-start; gap:9px; padding:10px 12px; background:var(--bg-surface-raised); border:1px solid var(--border-subtle); border-radius:var(--r-s); font-size:12.5px; color:var(--text-secondary); animation:widgetIn 260ms var(--ease-spring);}
.idea-item svg{width:14px;height:14px; stroke:var(--success); fill:none; stroke-width:2.2; flex:none; margin-top:1px;}

/* ---- account tags ---- */
.row-tags{display:flex; gap:4px; margin-top:4px; flex-wrap:wrap;}
.tag-chip{display:inline-flex; align-items:center; gap:4px; font-family:var(--font); font-size:10px; font-weight:var(--fw-semibold); padding:2px 7px 2px 6px; border-radius:999px; line-height:1.5; white-space:nowrap;}
.tag-chip.tc-success{background:var(--success-bg); color:var(--success);}
.tag-chip.tc-info{background:var(--info-bg); color:var(--info);}
.tag-chip.tc-warning{background:var(--warning-bg); color:var(--warning);}
.tag-chip.tc-danger{background:var(--danger-bg); color:var(--danger);}
.tag-chip.tc-accent{background:var(--accent-bg); color:var(--accent-t);}
.tag-dot{width:6px; height:6px; border-radius:50%; flex:none;}
.kc-tags{display:flex; gap:4px; margin-top:6px; flex-wrap:wrap;}
.drawer-tags{display:flex; flex-wrap:wrap; gap:6px; align-items:center;}
.drawer-tag{display:inline-flex; align-items:center; gap:5px; font-size:11.5px; font-weight:var(--fw-semibold); padding:5px 8px 5px 10px; border-radius:999px;}
.drawer-tag button{background:rgba(0,0,0,.12); border:none; width:14px; height:14px; border-radius:50%; display:flex; align-items:center; justify-content:center; cursor:pointer; color:inherit; padding:0;}
.drawer-tag button svg{width:8px; height:8px; stroke:currentColor; fill:none; stroke-width:3;}
.tag-add-btn{display:inline-flex; align-items:center; gap:4px; font-size:11.5px; font-weight:var(--fw-semibold); color:var(--text-muted); background:var(--bg-surface-raised); border:1px dashed var(--border-strong); padding:5px 10px; border-radius:999px; cursor:pointer;}
.tag-add-btn:hover{color:var(--text-primary); border-color:var(--text-muted);}
.tag-add-form{display:none; align-items:center; gap:6px; margin-top:10px;}
.tag-add-form.open{display:flex;}
.tag-add-form input{flex:1; font:inherit; font-size:12px; background:var(--field-bg); border:1px solid var(--border-strong); border-radius:var(--r-s); padding:6px 10px; color:var(--text-primary); outline:none;}
.tag-add-form input:focus{border-color:var(--accent);}

/* ---- saved views (Le parc) ---- */
.saved-views{display:flex; align-items:center; gap:8px; margin-bottom:12px; flex-wrap:wrap;}
.view-chip{display:flex; align-items:center; gap:7px; font-size:12px; font-weight:var(--fw-medium); color:var(--text-secondary); background:var(--bg-surface-raised); border:1px solid var(--border-subtle); border-radius:999px; padding:6px 12px; cursor:pointer; transition:background 140ms var(--ease-out), border-color 140ms var(--ease-out), color 140ms var(--ease-out);}
.view-chip:hover{background:var(--bg-surface-hover);}
.view-chip.active{background:var(--accent-bg); border-color:var(--accent); color:var(--accent-t); font-weight:var(--fw-semibold);}
.view-chip .vc-remove{display:flex; align-items:center; justify-content:center; width:14px; height:14px; border-radius:50%; opacity:.55; flex:none;}
.view-chip .vc-remove svg{width:9px; height:9px; stroke:currentColor; fill:none; stroke-width:3;}
.view-chip .vc-remove:hover{opacity:1; background:var(--danger-bg); color:var(--danger);}
.view-chip-add{display:flex; align-items:center; gap:5px; font-size:12px; font-weight:var(--fw-medium); color:var(--text-muted); background:none; border:1px dashed var(--border-strong); border-radius:999px; padding:6px 12px; cursor:pointer; transition:color 140ms var(--ease-out), border-color 140ms var(--ease-out);}
.view-chip-add:hover{color:var(--accent-t); border-color:var(--accent);}

/* ---- custom threshold alerts (Paramètres) ---- */
.alert-rules{display:flex; flex-direction:column; gap:8px; margin-top:4px;}
.alert-rule{display:flex; align-items:center; gap:10px; padding:11px 12px; background:var(--bg-surface-raised); border:1px solid var(--border-subtle); border-radius:var(--r-s); transition:opacity 140ms var(--ease-out);}
.alert-rule.off{opacity:.5;}
.ar-sentence{font-size:12.5px; color:var(--text-secondary); line-height:1.5;}
.ar-prefix{color:var(--accent-t); font-weight:var(--fw-semibold);}
.ar-inline-value{width:46px; text-align:center; font:inherit; font-size:12.5px; font-weight:var(--fw-semibold); color:var(--accent-t); background:transparent; border:none; border-bottom:1.5px dashed var(--accent); border-radius:0; padding:1px 2px; outline:none; margin:0 1px; transition:border-color 140ms var(--ease-out);}
.ar-inline-value:focus{border-bottom-style:solid;}

/* ---- weekly digest (Accueil) ---- */
.weekly-digest{padding:16px 18px; animation:widgetIn 260ms var(--ease-spring);}
.wd-head{display:flex; align-items:center; gap:12px; margin-bottom:12px;}
.wd-icon{width:36px; height:36px; border-radius:var(--r-s); background:var(--accent-bg); color:var(--accent-t); display:flex; align-items:center; justify-content:center; flex:none;}
.wd-icon svg{width:17px; height:17px; stroke:currentColor; fill:none; stroke-width:1.8;}
.wd-title-wrap{flex:1; min-width:0;}
.wd-title{font-family:var(--font-display); font-size:14.5px; font-weight:var(--fw-bold);}
.wd-sub{font-size:11.5px; color:var(--text-muted); margin-top:1px;}
.wd-close{width:26px; height:26px; border-radius:50%; border:none; background:none; color:var(--text-muted); display:flex; align-items:center; justify-content:center; cursor:pointer; flex:none;}
.wd-close:hover{color:var(--text-primary); background:var(--bg-surface-hover);}
.wd-close svg{width:12px; height:12px; stroke:currentColor; fill:none; stroke-width:2.2;}
.wd-list{display:flex; flex-direction:column;}
.wd-compare{color:var(--text-muted);}

/* ---- integrations page ---- */
.conn-list{background:var(--bg-surface); border:1px solid var(--border-subtle); border-radius:var(--r-lg); overflow:hidden;}
.conn-card{display:flex; align-items:center; gap:16px; padding:18px 22px; border-bottom:1px solid var(--border-subtle); position:relative;}
.conn-card:last-child{border-bottom:none;}
.conn-card::before{content:''; position:absolute; left:0; top:14px; bottom:14px; width:3px; border-radius:0 3px 3px 0; background:var(--border-strong);}
.conn-card[data-status="connected"]::before{background:var(--success);}
.conn-card[data-status="error"]::before{background:var(--danger);}
.conn-card[data-status="pending"][data-tier="secondary"]::before{background:var(--warning);}
.conn-icon{width:38px; height:38px; border-radius:var(--r-s); background:var(--bg-surface-raised); border:1px solid var(--border-subtle); display:flex; align-items:center; justify-content:center; flex:none; color:var(--text-secondary);}
.conn-icon svg{width:17px; height:17px; stroke:currentColor; fill:none; stroke-width:1.7;}
.conn-body{flex:1; min-width:0;}
.conn-title{display:flex; align-items:center; gap:8px; font-size:13.5px; font-weight:var(--fw-semibold); flex-wrap:wrap;}
.conn-dot{width:6px; height:6px; border-radius:50%; flex:none; background:var(--border-strong);}
.conn-card[data-status="connected"] .conn-dot{background:var(--success);}
.conn-card[data-status="error"] .conn-dot{background:var(--danger);}
.conn-card[data-status="pending"][data-tier="secondary"] .conn-dot{background:var(--warning);}
.conn-state{font-style:italic; font-weight:var(--fw-regular); color:var(--text-muted); font-size:12px;}
.conn-desc{font-size:12px; color:var(--text-muted); margin-top:3px;}
.conn-uptime{font-size:11px; color:var(--text-muted); margin-top:4px;}
.conn-uptime b{color:var(--text-secondary); font-weight:var(--fw-semibold);}
.conn-actions{display:flex; gap:8px; flex:none; flex-wrap:wrap; justify-content:flex-end;}
@media (max-width:640px){ .conn-card{flex-wrap:wrap;} .conn-actions{width:100%; justify-content:flex-start; margin-left:54px;} }
.sim-layout{display:grid; grid-template-columns:340px minmax(0,1fr); gap:16px; align-items:start;}
@media (max-width:1200px){ .sim-layout{grid-template-columns:1fr;} }
.sim-field{margin-bottom:20px;}
.sim-field:last-child{margin-bottom:0;}
.sim-field-head{display:flex; align-items:baseline; justify-content:space-between; margin-bottom:8px;}
.sim-field-head .sf-label{font-size:12.5px; font-weight:var(--fw-medium); color:var(--text-secondary);}
.sim-field-head .sf-val{font-family:var(--font-display); font-size:15px; font-weight:700; color:var(--text-primary);}
.sim-field input[type="range"]{width:100%; -webkit-appearance:none; appearance:none; height:5px; border-radius:999px; background:var(--bg-surface-raised); outline:none; cursor:pointer;}
.sim-field input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none; appearance:none; width:17px; height:17px; border-radius:50%; background:var(--accent); border:3px solid var(--accent-fg); box-shadow:0 1px 4px rgba(0,0,0,.3); cursor:pointer;}
.sim-field input[type="range"]::-moz-range-thumb{width:17px; height:17px; border-radius:50%; background:var(--accent); border:3px solid var(--accent-fg); box-shadow:0 1px 4px rgba(0,0,0,.3); cursor:pointer; border-style:solid;}
.sim-field input[type="number"]{width:100%; font:inherit; font-size:13px; color:var(--text-primary); background:var(--field-bg); border:1px solid var(--border-strong); border-radius:var(--r-s); padding:9px 12px; outline:none;}
.sim-field input[type="number"]:focus{border-color:var(--accent);}
.sim-breakeven{padding:18px; border-radius:var(--r-lg); background:var(--bg-surface-raised); border:1px solid var(--border-subtle); margin-top:16px;}
.sim-breakeven .sb-label{font-size:12px; color:var(--text-muted); margin-bottom:6px;}
.sim-breakeven .sb-val{font-family:var(--font-display); font-size:24px; font-weight:800;}

/* ---- internal notes (fiche compte) ---- */
.note-add-form{display:flex; flex-direction:column; gap:8px; margin-bottom:12px;}
.note-textarea{width:100%; resize:vertical; min-height:48px; font:inherit; font-size:12.5px; color:var(--text-primary); background:var(--field-bg); border:1px solid var(--border-strong); border-radius:var(--r-s); padding:9px 11px; outline:none; transition:border-color 140ms var(--ease-out);}
.note-textarea::placeholder{color:var(--text-muted);}
.note-textarea:focus{border-color:var(--accent);}
.note-list{display:flex; flex-direction:column; gap:8px;}
.note-item{position:relative; padding:10px 30px 10px 12px; background:var(--bg-surface-raised); border:1px solid var(--border-subtle); border-radius:var(--r-s); animation:widgetIn 220ms var(--ease-spring);}
.note-text{font-size:12.5px; color:var(--text-secondary); line-height:1.5; white-space:pre-wrap;}
.note-meta{font-size:10.5px; color:var(--text-muted); margin-top:7px;}
.note-meta b{color:var(--text-secondary); font-weight:var(--fw-medium);}
.note-remove{position:absolute; top:8px; right:8px; width:20px; height:20px; border-radius:50%; border:none; background:none; color:var(--text-muted); display:flex; align-items:center; justify-content:center; cursor:pointer; padding:0;}
.note-remove:hover{color:var(--danger); background:var(--danger-bg);}
.note-remove svg{width:10px; height:10px; stroke:currentColor; fill:none; stroke-width:2.4;}
.note-empty{font-size:12px; color:var(--text-muted); padding:4px 0;}

/* ---- new model setup modal ---- */
.model-scrim{position:fixed; inset:0; background:rgba(0,0,0,.55); backdrop-filter:blur(3px); z-index:96; display:flex; align-items:center; justify-content:center; opacity:0; pointer-events:none; transition:opacity 200ms var(--ease-out);}
.model-scrim.open{opacity:1; pointer-events:auto;}
.model-box{width:460px; max-width:92vw; max-height:88vh; overflow:auto; background:var(--bg-surface); border:1px solid var(--border-strong); border-radius:var(--r-xl); box-shadow:var(--shadow-modal-lg); transform:translateY(14px) scale(.97); transition:transform 220ms var(--ease-spring);}
.model-scrim.open .model-box{transform:translateY(0) scale(1);}
.model-head{display:flex; align-items:center; justify-content:space-between; padding:18px 22px; border-bottom:1px solid var(--border-subtle);}
.model-head h3{font-family:var(--font-display); font-size:16.5px; font-weight:var(--fw-bold);}
.model-body{padding:20px 22px; display:flex; flex-direction:column; gap:16px;}
.model-field{display:flex; flex-direction:column; gap:6px;}
.model-field input[type="text"], .model-field input[type="number"], .model-field input[type="password"], .model-field textarea{font:inherit; font-size:13px; color:var(--text-primary); background:var(--field-bg); border:1px solid var(--border-strong); border-radius:var(--r-s); padding:9px 12px; outline:none; transition:border-color 140ms var(--ease-out);}
.model-field input:focus, .model-field textarea:focus{border-color:var(--accent);}
.model-field.field-error input, .model-field.field-error textarea, .model-field.field-error .niche-input-wrap{border-color:var(--danger);}
.mf-label{font-size:12.5px; font-weight:var(--fw-semibold); color:var(--text-primary);}
.mf-hint{font-size:11px; color:var(--text-muted); margin-top:-3px;}
.model-field-row{display:flex; gap:14px;}
.model-field-row .model-field{flex:1;}
.niche-input-wrap{display:flex; flex-wrap:wrap; align-items:center; gap:6px; border:1px solid var(--border-strong); border-radius:var(--r-s); padding:7px 9px; background:var(--field-bg); transition:border-color 140ms var(--ease-out);}
.niche-input-wrap:focus-within{border-color:var(--accent);}
.niche-tags{display:flex; flex-wrap:wrap; gap:6px;}
.niche-tag{display:inline-flex; align-items:center; gap:5px; font-size:11.5px; font-weight:var(--fw-medium); color:var(--accent-t); background:var(--accent-bg); padding:3px 8px; border-radius:999px; animation:widgetIn 180ms var(--ease-spring);}
.niche-tag button{display:flex; color:currentColor; opacity:.7; padding:0; background:none; border:none; cursor:pointer;}
.niche-tag button:hover{opacity:1;}
.niche-tag button svg{width:9px; height:9px; stroke:currentColor; fill:none; stroke-width:3;}
#nicheInput{flex:1; min-width:120px; border:none; background:none; font:inherit; font-size:12.5px; color:var(--text-primary); outline:none; padding:3px 2px;}
.model-footer{display:flex; align-items:center; gap:10px; padding:16px 22px; border-top:1px solid var(--border-subtle);}
.model-footer .btn{flex:1; justify-content:center;}

/* ---- model radar comparator ---- */
.model-radar-toggles{display:flex; gap:10px; justify-content:center; margin-bottom:4px; flex-wrap:wrap;}
.mr-toggle{display:flex; align-items:center; gap:7px; font-size:12.5px; font-weight:var(--fw-medium); color:var(--text-secondary); background:var(--bg-surface-raised); border:1px solid var(--border-subtle); border-radius:999px; padding:6px 12px; cursor:pointer; transition:opacity 140ms var(--ease-out), background 140ms var(--ease-out);}
.mr-toggle:hover{background:var(--bg-surface-hover);}
.mr-toggle.off{opacity:.4;}
.mr-dot{width:9px; height:9px; border-radius:50%; flex:none;}
.model-radar-stats{display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:8px;}
.mr-stat-card{background:var(--bg-surface-raised); border:1px solid var(--border-subtle); border-radius:var(--r-s); padding:12px 14px; transition:opacity 140ms var(--ease-out);}
.mr-stat-head{display:flex; align-items:center; gap:7px; margin-bottom:8px; font-size:12.5px; font-weight:var(--fw-semibold);}
.mr-stat-row{display:flex; justify-content:space-between; font-size:11.5px; color:var(--text-secondary); padding:3px 0;}
.mr-stat-row b{color:var(--text-primary); font-family:var(--mono); font-weight:var(--fw-semibold);}

/* ---- bulk CSV import (Le parc) ---- */
.btn:disabled{opacity:.45; cursor:not-allowed; pointer-events:none;}
.import-hint{font-size:12px; color:var(--text-secondary); margin-bottom:10px;}
.import-hint code{font-family:var(--mono); font-size:11px; background:var(--bg-surface-raised); padding:1px 5px; border-radius:4px; color:var(--accent-t);}
.import-textarea{font-family:var(--mono); min-height:110px;}
.import-preview-head{display:flex; align-items:center; margin:14px 0 8px; font-size:11.5px; font-weight:var(--fw-semibold); color:var(--text-muted); text-transform:uppercase; letter-spacing:.04em;}
.import-preview-list{display:flex; flex-direction:column; gap:1px; max-height:200px; overflow:auto; border:1px solid var(--border-subtle); border-radius:var(--r-s);}
.import-preview-row{display:flex; align-items:center; gap:10px; padding:8px 12px; font-size:12.5px; border-bottom:1px solid var(--border-subtle);}
.import-preview-row:last-child{border-bottom:none;}
.import-preview-row.invalid{opacity:.55;}
.import-preview-row svg{width:13px; height:13px; stroke:currentColor; fill:none; stroke-width:2.4; flex:none;}
.import-preview-row.valid svg{color:var(--success);}
.import-preview-row.invalid svg{color:var(--danger);}
.import-preview-user{font-family:var(--mono); color:var(--text-primary);}
.import-preview-model{margin-left:auto; color:var(--text-muted);}

/* ---- pre-publish readiness checklist ---- */
.checklist-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:8px;}
.checklist-progress{font-family:var(--mono); font-size:11.5px; font-weight:var(--fw-semibold); color:var(--text-muted);}
.checklist-bar-track{height:6px; border-radius:999px; background:var(--bg-surface-raised); overflow:hidden; margin-bottom:10px;}
.checklist-bar-fill{height:100%; border-radius:999px; background:var(--accent); transition:width 280ms var(--ease-out), background 280ms var(--ease-out);}
.checklist-items{display:flex; flex-direction:column; gap:1px;}
.checklist-item{display:flex; align-items:center; gap:10px; padding:7px 4px; cursor:pointer; border-radius:var(--r-s); transition:background 120ms var(--ease-out);}
.checklist-item:hover{background:var(--bg-surface-hover);}
.checklist-check{width:19px; height:19px; border-radius:6px; border:1.5px solid var(--border-strong); background:var(--bg-surface); display:flex; align-items:center; justify-content:center; flex:none; transition:background 140ms var(--ease-out), border-color 140ms var(--ease-out);}
.checklist-check svg{width:11px; height:11px; stroke:#fff; fill:none; stroke-width:3; opacity:0; transform:scale(.5); transition:opacity 140ms var(--ease-spring), transform 140ms var(--ease-spring);}
.checklist-item.done .checklist-check{background:var(--success); border-color:var(--success);}
.checklist-item.done .checklist-check svg{opacity:1; transform:scale(1);}
.checklist-item.done .checklist-label{color:var(--text-muted); text-decoration:line-through;}
.checklist-label{font-size:12.5px; color:var(--text-secondary);}
.checklist-ready{display:flex; align-items:center; gap:8px; margin-top:10px; padding:10px 12px; background:var(--success-bg); border-radius:var(--r-s); font-size:12px; color:var(--success); font-weight:var(--fw-medium); animation:widgetIn 260ms var(--ease-spring);}
.checklist-ready svg{width:14px; height:14px; stroke:currentColor; fill:none; stroke-width:2.4; flex:none;}
.tag-color-dot{width:16px; height:16px; border-radius:50%; cursor:pointer; border:2px solid transparent; flex:none;}
.tag-color-dot.selected{border-color:var(--text-primary);}

.grid{display:grid; gap:var(--sp-4);}
.g4{grid-template-columns:repeat(4,1fr);}
.g3{grid-template-columns:2fr 1fr;}
.g3.g3-equal{grid-template-columns:repeat(3,minmax(0,1fr));}
.g23{grid-template-columns:1.4fr 1fr;}
.g2{grid-template-columns:repeat(2,1fr);}
.mobile-menu-btn{display:none; width:36px; height:36px; border-radius:var(--r-full); border:1px solid var(--border-subtle); background:var(--bg-surface-raised); align-items:center; justify-content:center; cursor:pointer; flex:none;}
.mobile-menu-btn svg{width:17px;height:17px; stroke:var(--text-secondary); fill:none; stroke-width:2;}
.side-scrim{position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:84; opacity:0; pointer-events:none; transition:opacity 220ms var(--ease-out);}
.side-scrim.open{opacity:1; pointer-events:auto;}
@media (max-width:1000px){
  .g4{grid-template-columns:repeat(2,1fr);} .g3,.g3.g3-equal,.g23,.g2{grid-template-columns:1fr;}
  .app{grid-template-columns:minmax(0,1fr);}
  .mobile-menu-btn{display:flex;}
  .side{
    position:fixed; top:0; left:0; height:100vh; width:272px; max-width:82vw; z-index:85;
    transform:translateX(-100%); transition:transform 280ms var(--ease-spring);
    box-shadow:24px 0 60px rgba(0,0,0,.28);
  }
  .side.open{transform:translateX(0);}
}
@media (max-width:640px){
  .crumb{display:none;}
  .cmdk-trigger{padding:8px; width:36px; overflow:hidden;}
  .cmdk-trigger kbd, .cmdk-trigger{white-space:nowrap;}
}

.kpi{padding:var(--sp-4) var(--sp-5);}
.kpi .k-top{display:flex; align-items:flex-start; justify-content:space-between; gap:10px;}
.kpi .k-label{font-size:11px; color:var(--text-secondary); font-weight:var(--fw-medium);}
.k-val{font-family:var(--font-display); font-size:26px; font-weight:var(--fw-heavy); letter-spacing:-.01em;}
.kpi .k-val{margin-top:8px;}
.kpi .k-sub{font-size:11.5px; color:var(--text-muted); margin-top:6px;}
.kpi .k-sub b{color:var(--success); font-weight:var(--fw-semibold);}
.kpi .k-sub b.warn{color:var(--warning);}
.kpi .k-sub b.bad{color:var(--danger);}
.mini-bars{display:flex; align-items:flex-end; gap:2.5px; height:26px; flex:none;}
.mini-bars i{display:block; width:4px; border-radius:2px; background:var(--accent); opacity:.35;}
.mini-bars i:last-child{opacity:1;}

/* ---- hero strip (gauge + sparkline + callouts) ---- */
.hero-strip{display:flex; align-items:center; gap:8px; padding:22px 8px; overflow-x:auto;}
.hero-cell{flex:1; min-width:170px; padding:0 24px; display:flex; flex-direction:column; gap:10px;}
.hero-cell + .hero-cell{border-left:1px solid var(--border-subtle);}
.hero-cell .hl{font-size:11.5px; font-weight:var(--fw-semibold); color:var(--text-secondary);}
.hero-bars{display:flex; align-items:flex-end; gap:7px; height:90px;}
.hero-bars i{flex:1; border-radius:5px 5px 2px 2px; background:var(--border-strong); cursor:pointer; transition:background 120ms var(--ease-out), transform 120ms var(--ease-out); transform-origin:bottom;}
.hero-bars i.on{background:var(--text-primary);}
.hero-bars i:hover{background:var(--accent); transform:scaleY(1.02);}
.hero-bars i.on:hover{background:var(--accent);}

/* ---- chart hover tooltip (floating, like a live data readout) ---- */
.chart-tip{position:fixed; z-index:60; background:var(--text-primary); color:var(--bg-app); border-radius:10px; padding:8px 12px; box-shadow:var(--shadow-tip); opacity:0; transform:translate(-50%,-6px) scale(.96); transition:opacity 120ms var(--ease-out), transform 120ms var(--ease-out); pointer-events:none; white-space:nowrap;}
.chart-tip.show{opacity:1; transform:translate(-50%,-10px) scale(1);}
.chart-tip .tt-label{font-size:10.5px; font-weight:var(--fw-medium); opacity:.72;}
.chart-tip .tt-value{font-family:var(--font-display); font-size:14px; font-weight:var(--fw-bold); margin-top:1px; letter-spacing:-.01em;}
[data-tip-value]{cursor:pointer;}

/* ---- command palette (Cmd+K) ---- */
.cmdk-trigger{display:flex; align-items:center; gap:8px; background:var(--field-bg); border:1px solid var(--border-strong); border-radius:var(--r-full); padding:8px 12px; font-size:12px; color:var(--text-muted); cursor:pointer; transition:border-color 140ms var(--ease-out), background 140ms var(--ease-out);}
.cmdk-trigger:hover{background:var(--bg-surface-hover);}
.cmdk-trigger svg{width:14px;height:14px; stroke:currentColor; fill:none; stroke-width:1.8;}
.cmdk-trigger kbd{margin-left:6px; font-family:var(--mono); font-size:10px; background:var(--bg-surface-raised); border:1px solid var(--border-subtle); border-radius:5px; padding:1px 5px; color:var(--text-muted);}
.cmdk-overlay{position:fixed; inset:0; background:rgba(0,0,0,.5); backdrop-filter:blur(2px); z-index:90; display:flex; align-items:flex-start; justify-content:center; padding-top:14vh; opacity:0; pointer-events:none; transition:opacity 160ms var(--ease-out);}
.cmdk-overlay.open{opacity:1; pointer-events:auto;}
.cmdk-box{width:560px; max-width:92vw; background:var(--bg-surface); border:1px solid var(--border-strong); border-radius:var(--r-xl); box-shadow:var(--shadow-modal); overflow:hidden; transform:translateY(-10px) scale(.97); transition:transform 180ms var(--ease-spring);}
.cmdk-overlay.open .cmdk-box{transform:translateY(0) scale(1);}
.cmdk-input-row{display:flex; align-items:center; gap:10px; padding:14px 18px; border-bottom:1px solid var(--border-subtle);}
.cmdk-input-row svg{width:16px;height:16px; stroke:var(--text-muted); fill:none; stroke-width:1.8; flex:none;}
.cmdk-input-row input{flex:1; border:none; outline:none; background:transparent; font:inherit; font-size:15px; color:var(--text-primary);}
.cmdk-input-row input::placeholder{color:var(--text-muted);}
.cmdk-input-row kbd{font-family:var(--mono); font-size:10.5px; color:var(--text-muted); background:var(--bg-surface-raised); border:1px solid var(--border-subtle); border-radius:5px; padding:2px 6px;}
.cmdk-list{max-height:360px; overflow-y:auto; padding:8px;}
.cmdk-group-label{font-size:10.5px; text-transform:uppercase; letter-spacing:.06em; font-weight:var(--fw-semibold); color:var(--text-muted); padding:10px 10px 4px;}
.cmdk-item{display:flex; align-items:center; gap:11px; padding:9px 10px; border-radius:var(--r-s); cursor:pointer;}
.cmdk-item svg{width:15px;height:15px; stroke:var(--text-secondary); fill:none; stroke-width:1.7; flex:none;}
.cmdk-item .ci-title{font-size:13px; font-weight:var(--fw-medium); flex:1;}
.cmdk-item .ci-meta{font-size:11px; color:var(--text-muted);}
.cmdk-item.active{background:var(--accent-bg);}
.cmdk-item.active svg{stroke:var(--accent-t);}
.cmdk-item.active .ci-title{color:var(--accent-t);}
.cmdk-empty{padding:32px 0; text-align:center; font-size:12.5px; color:var(--text-muted);}

/* ---- row detail drawer ---- */
.row-clickable{cursor:pointer;}
.drawer-scrim{position:fixed; inset:0; background:rgba(0,0,0,.42); backdrop-filter:blur(1px); z-index:80; opacity:0; pointer-events:none; transition:opacity 200ms var(--ease-out);}
.drawer-scrim.open{opacity:1; pointer-events:auto;}
.drawer{position:fixed; top:0; right:0; height:100vh; width:400px; max-width:92vw; background:var(--bg-surface); border-left:1px solid var(--border-strong); box-shadow:-24px 0 60px rgba(0,0,0,.28); z-index:81; transform:translateX(100%); transition:transform 280ms var(--ease-spring); display:flex; flex-direction:column;}
.drawer.open{transform:translateX(0);}
.drawer-head{display:flex; align-items:flex-start; gap:12px; padding:20px 20px 16px; border-bottom:1px solid var(--border-subtle);}
.drawer-av{width:44px;height:44px;border-radius:var(--r-lg); background:linear-gradient(155deg,var(--accent),color-mix(in srgb, var(--accent) 60%, black)); flex:none; display:flex; align-items:center; justify-content:center; color:var(--accent-fg); font-family:var(--font-display); font-weight:700; font-size:16px;}
.drawer-head h3{font-size:15px; font-weight:var(--fw-semibold); font-family:var(--mono);}
.drawer-head .dh-meta{font-size:12px; color:var(--text-muted); margin-top:2px;}
.drawer-close{margin-left:auto; width:28px; height:28px; border-radius:var(--r-full); border:1px solid var(--border-subtle); background:var(--bg-surface-raised); display:flex; align-items:center; justify-content:center; cursor:pointer; flex:none;}
.drawer-close svg{width:13px;height:13px; stroke:var(--text-secondary); fill:none; stroke-width:2;}
.drawer-body{flex:1; overflow-y:auto; padding:18px 20px 28px;}
.drawer-section{margin-bottom:22px;}
.drawer-section .ds-label{font-size:10.5px; text-transform:uppercase; letter-spacing:.06em; font-weight:var(--fw-semibold); color:var(--text-muted); margin-bottom:10px;}
.drawer-stats{display:grid; grid-template-columns:repeat(3,1fr); gap:10px;}
.drawer-stats > div{background:var(--bg-surface-raised); border:1px solid var(--border-subtle); border-radius:var(--r-s); padding:10px 12px;}
.drawer-stats .dv{font-family:var(--font-display); font-size:17px; font-weight:700;}
.drawer-stats .dl{font-size:10.5px; color:var(--text-muted); margin-top:2px;}
.secret-row{display:flex; align-items:center; justify-content:space-between; padding:9px 12px; background:var(--bg-surface-raised); border:1px solid var(--border-subtle); border-radius:var(--r-s); margin-bottom:8px;}
.secret-row .sl{font-size:11px; color:var(--text-muted); font-weight:var(--fw-medium);}
.secret-row .sv{font-family:var(--mono); font-size:13px; letter-spacing:.04em;}
.secret-reveal{font-size:11px; font-weight:var(--fw-semibold); color:var(--accent); cursor:pointer; background:none; border:none; padding:0;}
.drawer-actions{display:flex; gap:8px; padding:16px 20px; border-top:1px solid var(--border-subtle);}
.drawer-actions .btn{flex:1; justify-content:center;}

/* ---- row select + bulk actions ---- */
.tbl .chk-col{width:34px;}
.row-chk{width:15px; height:15px; border-radius:5px; border:1.5px solid var(--border-strong); background:var(--bg-surface); appearance:none; cursor:pointer; position:relative; flex:none; transition:background 120ms var(--ease-out), border-color 120ms var(--ease-out);}
.row-chk:checked{background:var(--accent); border-color:var(--accent);}
.row-chk:checked::after{content:''; position:absolute; left:4px; top:1px; width:4px; height:8px; border:solid var(--accent-fg); border-width:0 2px 2px 0; transform:rotate(45deg);}
.tbl tr.row-selected td{background:var(--accent-bg);}
.bulk-bar{position:fixed; left:50%; bottom:24px; transform:translate(-50%,16px); display:flex; align-items:center; gap:14px; background:var(--text-primary); color:var(--bg-app); border-radius:var(--r-full); padding:10px 10px 10px 18px; box-shadow:var(--shadow-popover); z-index:55; opacity:0; pointer-events:none; transition:opacity 200ms var(--ease-out), transform 200ms var(--ease-spring);}
.bulk-bar.show{opacity:1; transform:translate(-50%,0); pointer-events:auto;}
.bulk-bar .bb-count{font-size:12.5px; font-weight:var(--fw-semibold); white-space:nowrap;}
.bulk-bar .bb-actions{display:flex; gap:6px;}
.bulk-bar .bb-btn{font-family:var(--font); font-size:12px; font-weight:var(--fw-semibold); border-radius:var(--r-full); padding:8px 14px; cursor:pointer; border:none; background:color-mix(in srgb, var(--bg-app) 16%, transparent); color:inherit; white-space:nowrap; transition:background 140ms var(--ease-out), transform 100ms var(--ease-out);}
.bulk-bar .bb-btn:hover{background:color-mix(in srgb, var(--bg-app) 26%, transparent);}
.bulk-bar .bb-btn:active{transform:scale(.95);}
.bulk-bar .bb-btn.danger{color:color-mix(in srgb, var(--danger) 60%, var(--bg-app) 40%);}
.bulk-bar .bb-close{width:26px; height:26px; border-radius:50%; background:color-mix(in srgb, var(--bg-app) 16%, transparent); border:none; display:flex; align-items:center; justify-content:center; cursor:pointer; flex:none;}
.bulk-bar .bb-close svg{width:12px;height:12px; stroke:currentColor; fill:none; stroke-width:2.2;}
.bb-popover-wrap{position:relative;}
.bb-popover{position:absolute; bottom:calc(100% + 10px); left:50%; transform:translateX(-50%) translateY(6px); background:var(--bg-surface); color:var(--text-primary); border:1px solid var(--border-subtle); border-radius:var(--r-lg); box-shadow:var(--shadow-popover); padding:12px; width:200px; opacity:0; pointer-events:none; transition:opacity 160ms var(--ease-out), transform 160ms var(--ease-out); z-index:60;}
.bb-popover.open{opacity:1; pointer-events:auto; transform:translateX(-50%) translateY(0);}
.bb-popover input[type="text"]{width:100%; font:inherit; font-size:12.5px; color:var(--text-primary); background:var(--field-bg); border:1px solid var(--border-strong); border-radius:var(--r-s); padding:7px 10px; outline:none; margin-bottom:9px; box-sizing:border-box;}
.bb-popover input:focus{border-color:var(--accent);}
.bb-popover-colors{display:flex; gap:7px; margin-bottom:10px; justify-content:center;}
.bb-popover-item{display:block; width:100%; text-align:left; font:inherit; font-size:12.5px; font-weight:var(--fw-medium); color:var(--text-primary); background:none; border:none; border-radius:var(--r-s); padding:8px 10px; cursor:pointer; transition:background 120ms var(--ease-out); box-sizing:border-box;}
.bb-popover-item:hover{background:var(--bg-surface-hover);}
.bulk-tag-color-dot{width:20px; height:20px; border-radius:50%; cursor:pointer; border:2px solid transparent; transition:border-color 120ms var(--ease-out); flex:none;}
.bulk-tag-color-dot.selected{border-color:var(--text-primary);}

/* ---- credentials popover (Équipe) ---- */
.cred-popover-wrap{position:relative; display:inline-block;}
.cred-popover{position:absolute; top:calc(100% + 8px); right:0; background:var(--bg-surface); color:var(--text-primary); border:1px solid var(--border-subtle); border-radius:var(--r-lg); box-shadow:var(--shadow-popover); padding:12px; width:230px; opacity:0; pointer-events:none; transform:translateY(-4px); transition:opacity 160ms var(--ease-out), transform 160ms var(--ease-out); z-index:40; text-align:left;}
.cred-popover.open{opacity:1; pointer-events:auto; transform:translateY(0);}
.cred-row{display:flex; align-items:center; justify-content:space-between; gap:8px; padding:6px 0; font-size:11.5px; border-bottom:1px solid var(--border-subtle);}
.cred-row:last-of-type{border-bottom:none;}
.cred-label{color:var(--text-muted); flex:none;}
.cred-val{font-family:var(--mono); color:var(--text-primary); font-weight:var(--fw-medium); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0;}
.cred-toggle{background:none; border:none; padding:0; margin-left:6px; cursor:pointer; color:var(--text-muted); display:flex; flex:none;}
.cred-toggle:hover{color:var(--text-primary);}
.cred-toggle svg{width:13px; height:13px; stroke:currentColor; fill:none; stroke-width:1.8;}
.cred-copy-btn{width:100%; justify-content:center; margin-top:10px; padding:7px 10px; font-size:11.5px;}

.hero-bars-axis{display:flex; gap:7px; font-size:10px; color:var(--text-muted);}
.hero-bars-axis span{flex:1; text-align:center;}
.gauge-cell{flex:none; display:flex; align-items:center; gap:16px; padding:0 28px;}
.health-score-card{display:flex; flex-wrap:wrap; align-items:center; gap:24px;}
.hsc-main{display:flex; align-items:center; gap:16px; flex:none;}
.hsc-score{font-family:var(--font-display); font-size:34px; font-weight:800; line-height:1;}
.hsc-score span{font-size:15px; color:var(--text-muted); font-weight:var(--fw-medium);}
.hsc-status{margin-top:6px;}
.hsc-breakdown{flex:1; min-width:220px; display:flex; flex-direction:column; gap:10px;}
.hsc-row{display:flex; align-items:center; gap:10px;}
.hsc-row .hsc-label{font-size:11.5px; color:var(--text-secondary); width:58px; flex:none;}
.hsc-row .progress{flex:1;}
.hsc-row .hsc-val{font-family:var(--mono); font-size:12px; color:var(--text-muted); width:22px; text-align:right; flex:none;}
.hsc-note{width:100%; font-size:11.5px; color:var(--text-muted); padding-top:14px; border-top:1px solid var(--border-subtle); margin-top:4px;}
.hsc-note a{color:var(--accent); cursor:pointer;}
.gauge-num{font-family:var(--font-display); font-size:26px; font-weight:var(--fw-heavy); letter-spacing:-.01em;}
.gauge-sub{font-size:11px; color:var(--text-muted); margin-top:2px;}
.stat-cell{flex:none; padding:0 24px; display:flex; flex-direction:column; gap:6px;}
.stat-cell .sn{font-family:var(--font-display); font-size:28px; font-weight:var(--fw-heavy); letter-spacing:-.01em;}
.stat-cell a{font-size:11.5px; color:var(--text-secondary); text-decoration:none; display:flex; align-items:center; gap:4px;}
.stat-cell a svg{width:12px;height:12px; stroke:currentColor; fill:none; stroke-width:2;}
@media (max-width:1000px){ .hero-cell + .hero-cell{border-left:none;} .hero-strip{flex-wrap:wrap;} }

.panel{padding:var(--sp-5);}
.panel-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:var(--sp-4); gap:10px; flex-wrap:wrap;}
.panel-head h3{font-size:15px; font-weight:var(--fw-semibold); margin:0;}
.panel-head .meta{font-size:11.5px; color:var(--text-muted);}
.legend{display:flex; gap:14px;}
.legend span{display:flex; align-items:center; gap:6px; font-size:11px; color:var(--text-secondary); font-weight:var(--fw-medium);}
.legend i{width:8px;height:8px;border-radius:2px;}

.views-kpi-row{display:flex; align-items:baseline; gap:10px; margin-top:4px; flex-wrap:wrap;}
.views-kpi-num{font-family:var(--font-display); font-size:32px; font-weight:var(--fw-heavy); letter-spacing:-.01em; color:var(--text-primary);}
.views-kpi-sub{font-size:12px; color:var(--text-muted);}
.views-chart-wrap{position:relative; margin-top:10px;}
.views-peak-flag{position:absolute; top:0; transform:translate(-50%,-100%); background:var(--text-primary); color:var(--bg-app); font-family:var(--font-display); font-size:11.5px; font-weight:var(--fw-bold); padding:4px 9px; border-radius:8px; white-space:nowrap; pointer-events:none; transition:left 220ms var(--ease-out);}
.views-peak-flag:after{content:''; position:absolute; left:50%; bottom:-4px; transform:translateX(-50%); border:4px solid transparent; border-top-color:var(--text-primary);}
.views-peak-row{display:flex; align-items:center; gap:12px; margin-top:16px; padding-top:14px; border-top:1px solid var(--border-subtle); flex-wrap:wrap;}
.views-peak-icon{width:34px; height:34px; border-radius:10px; background:var(--accent-bg); color:var(--accent-t); display:flex; align-items:center; justify-content:center; flex:none;}
.views-peak-icon svg{width:17px; height:17px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round;}
.views-peak-body{flex:1; min-width:200px; font-size:12.5px; color:var(--text-secondary);}
.views-peak-body b{color:var(--text-primary); font-weight:var(--fw-semibold);}
.views-peak-body .vp-compare{color:var(--text-muted);}

/* ---- calendrier éditorial ---- */
.cal-toolbar{display:flex; align-items:center; justify-content:space-between; margin-bottom:16px;}
.cal-nav{display:flex; align-items:center; gap:12px;}
.cal-nav-btn{width:28px; height:28px; border-radius:50%; border:1px solid var(--border-strong); background:var(--bg-surface); color:var(--text-secondary); display:flex; align-items:center; justify-content:center; cursor:pointer;}
.cal-nav-btn:hover{background:var(--bg-surface-hover);}
.cal-nav-btn svg{width:13px; height:13px; stroke:currentColor; fill:none; stroke-width:2.2;}
.cal-month{font-family:var(--font-display); font-size:15px; font-weight:var(--fw-bold); min-width:110px; text-align:center;}
.cal-card{padding:16px 16px 6px;}
.cal-grid{display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:1px; background:var(--border-subtle);}
.cal-head-row{margin-bottom:1px; background:transparent;}
.cal-head-row div{text-align:center; font-size:10.5px; font-weight:var(--fw-semibold); color:var(--text-muted); text-transform:uppercase; letter-spacing:.05em; padding-bottom:8px;}
.cal-day{min-width:0; background:var(--bg-surface); min-height:78px; padding:6px 6px; display:flex; flex-direction:column; gap:3px;}
.cal-day.other-month{background:var(--bg-app); opacity:.5;}
.cal-day.today{background:var(--accent-bg);}
.cal-day-num{font-size:11.5px; font-weight:var(--fw-medium); color:var(--text-secondary);}
.cal-day.today .cal-day-num{color:var(--accent-t); font-weight:var(--fw-bold);}
.cal-event{font-size:9.5px; font-weight:var(--fw-semibold); padding:2px 6px; border-radius:5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.cal-sync-row{display:flex; align-items:center; gap:10px; margin-bottom:16px; flex-wrap:wrap;}
.cal-sync-btn{display:flex; align-items:center; gap:7px; font-size:12.5px; font-weight:var(--fw-medium); color:var(--text-secondary); background:var(--bg-surface-raised); border:1px solid var(--border-subtle); border-radius:999px; padding:7px 14px; cursor:pointer; transition:background 140ms var(--ease-out), border-color 140ms var(--ease-out), color 140ms var(--ease-out);}
.cal-sync-btn:hover{background:var(--bg-surface-hover);}
.cal-sync-btn svg{width:14px; height:14px; stroke:currentColor; fill:none; stroke-width:1.8; flex:none;}
.cal-sync-btn.connected{background:var(--success-bg); border-color:var(--success); color:var(--success);}
.cal-sync-hint{font-size:11px; color:var(--text-muted);}

.group-row{display:flex; align-items:center; gap:var(--sp-3); padding:10px 0; border-bottom:1px solid var(--border-subtle);}
.group-row:last-child{border-bottom:none;}
.group-dot{width:9px;height:9px;border-radius:50%; flex:none;}
.group-name{font-size:13px; font-weight:var(--fw-semibold); flex:1;}
.group-meta{font-size:11px; color:var(--text-muted);}
.group-val{font-family:var(--mono); font-size:13px; font-weight:var(--fw-semibold);}

.alert-item{display:flex; gap:10px; padding:10px 0; border-bottom:1px solid var(--border-subtle);}
.alert-item:last-child{border-bottom:none;}
.alert-dot{width:26px;height:26px;border-radius:var(--r-s); flex:none; display:flex; align-items:center; justify-content:center;}
.alert-dot svg{width:13px;height:13px; stroke:currentColor; fill:none; stroke-width:2;}
.alert-body b{font-size:12.5px; font-weight:var(--fw-semibold); display:block;}
.alert-body span{font-size:11.5px; color:var(--text-muted);}
.alert-time{margin-left:auto; font-size:10.5px; color:var(--text-muted); font-family:var(--mono); flex:none; white-space:nowrap;}

.timeline{display:flex; flex-direction:column;}
.tl-item{display:flex; gap:10px; position:relative; padding-bottom:16px;}
.tl-item:last-child{padding-bottom:0;}
.tl-line{position:absolute; left:12px; top:26px; bottom:-2px; width:1.5px; background:var(--border-subtle);}
.tl-dot{width:25px; height:25px; border-radius:50%; flex:none; display:flex; align-items:center; justify-content:center; z-index:1;}
.tl-dot svg{width:12px; height:12px; stroke:currentColor; fill:none; stroke-width:2.2;}
.tl-body{flex:1; padding-top:2px;}
.tl-label{font-size:12.5px; font-weight:var(--fw-medium); color:var(--text-primary);}
.tl-time{font-size:11px; color:var(--text-muted); margin-top:1px; font-family:var(--mono);}
.tl-empty{font-size:12px; color:var(--text-muted); padding:6px 0;}

.tbl{width:100%; border-collapse:collapse; font-size:12.5px;}
.card:has(> .tbl), .card:has(> table){overflow-x:auto;}
@media (max-width:1000px){ .tbl{min-width:640px;} }
.tbl th{text-align:left; font-size:10.5px; text-transform:uppercase; letter-spacing:.05em; color:var(--text-muted); font-weight:var(--fw-semibold); padding:0 12px 10px; border-bottom:1px solid var(--border-subtle);}
.tbl td{padding:11px 12px; border-bottom:1px solid var(--border-subtle); color:var(--text-primary); vertical-align:middle; transition:background 140ms var(--ease-out);}
.tbl tr:last-child td{border-bottom:none;}
.tbl tr:hover td{background:var(--bg-surface-hover);}
.tbl tr:hover td:first-child{border-radius:var(--r-s) 0 0 var(--r-s);}
.tbl tr:hover td:last-child{border-radius:0 var(--r-s) var(--r-s) 0;}

.bd{display:inline-flex; align-items:center; gap:5px; font-size:10.5px; font-weight:var(--fw-semibold); padding:3px 8px; border-radius:var(--r-s);}
.bd .d{width:5px;height:5px;border-radius:50%;}
.bd-success{background:var(--success-bg); color:var(--success);}
.bd-warning{background:var(--warning-bg); color:var(--warning);}
.bd-info{background:var(--info-bg); color:var(--info);}
.bd-danger{background:var(--danger-bg); color:var(--danger);}
.bd-muted{background:var(--bg-surface-raised); color:var(--text-muted); border:1px solid var(--border-subtle);}
#compareSeries{opacity:0; pointer-events:none; transition:opacity 220ms var(--ease-out);}
#compareSeries.on{opacity:1; pointer-events:auto;}

/* ---- kanban board (Le parc) ---- */
.kanban-board{display:grid; grid-template-columns:repeat(4,1fr); gap:14px; align-items:start; margin-bottom:16px;}
@media (max-width:1000px){ .kanban-board{grid-template-columns:repeat(2,1fr);} }
.kanban-col{background:var(--bg-surface-raised); border:1px solid var(--border-subtle); border-radius:var(--r-lg); padding:12px; min-height:80px; transition:outline-color 140ms var(--ease-out);}
.kanban-col.drop-hint{outline:2px dashed var(--accent); outline-offset:-2px;}
.kanban-col-head{display:flex; align-items:center; gap:7px; margin-bottom:10px; padding:0 4px;}
.kanban-col-head i{width:7px; height:7px; border-radius:50%; flex:none;}
.kanban-col-head b{font-size:12px; font-weight:var(--fw-semibold); flex:1;}
.kanban-col-head span{font-size:10px; color:var(--text-muted); font-family:var(--mono); background:var(--bg-surface); border:1px solid var(--border-subtle); border-radius:999px; padding:1px 7px;}
.kanban-card{position:relative; background:var(--bg-surface); border:1px solid var(--border-subtle); border-radius:var(--r-s); padding:10px 12px; margin-bottom:8px; cursor:grab; transition:box-shadow 140ms var(--ease-out), transform 140ms var(--ease-out), opacity 140ms var(--ease-out); animation:widgetIn 240ms var(--ease-spring);}
.kanban-card:hover{box-shadow:var(--shadow-card); transform:translateY(-1px);}
.kanban-card:active{cursor:grabbing;}
.kanban-card.dragging{opacity:.4;}
.kanban-card .kc-user{font-family:var(--mono); font-size:12px; font-weight:var(--fw-semibold);}
.kanban-card .kc-model{font-size:10.5px; color:var(--text-muted); margin-top:3px;}
.kanban-card .kc-cost{font-family:var(--mono); font-size:11px; color:var(--text-secondary); margin-top:7px; display:flex; justify-content:space-between;}
.kanban-empty{font-size:11px; color:var(--text-muted); text-align:center; padding:14px 0;}

/* ---- account health score ---- */
.score-ring{width:28px; height:28px; border-radius:50%; background:conic-gradient(var(--ring-color) calc(var(--pct) * 3.6deg), var(--border-subtle) 0deg); display:flex; align-items:center; justify-content:center; flex:none;}
.score-ring-inner{width:20px; height:20px; border-radius:50%; background:var(--bg-surface); display:flex; align-items:center; justify-content:center; font-family:var(--mono); font-size:9px; font-weight:var(--fw-bold); color:var(--text-primary);}
.score-ring.lg{width:92px; height:92px;}
.score-ring.lg .score-ring-inner{width:74px; height:74px; font-size:24px; background:var(--bg-surface-raised); flex-direction:column;}
.score-ring.lg .score-ring-inner span{font-size:9px; font-weight:var(--fw-medium); color:var(--text-muted); font-family:var(--font); margin-top:1px;}
.score-ring.lg .score-ring-inner span:first-child{font-family:var(--font-display); font-size:26px; font-weight:var(--fw-heavy); letter-spacing:normal; line-height:1; color:var(--text-primary); margin-top:0;}
.kanban-card .score-ring{position:absolute; top:10px; right:10px;}
.score-bars{display:flex; flex-direction:column; gap:11px; margin-top:4px;}
.score-bar-row .sbr-top{display:flex; justify-content:space-between; font-size:11.5px; margin-bottom:5px;}
.score-bar-row .sbr-top span:first-child{color:var(--text-secondary);}
.score-bar-row .sbr-top b{font-family:var(--mono); font-weight:var(--fw-semibold);}
.score-bar-track{height:6px; background:var(--bg-surface-raised); border-radius:999px; overflow:hidden;}
.score-bar-fill{height:100%; border-radius:999px;}
.th-sortable{cursor:pointer; user-select:none; transition:color 140ms var(--ease-out);}
.th-sortable:hover{color:var(--text-primary);}
.sort-arrow{display:inline-block; font-size:8px; margin-left:1px; opacity:.5; transition:opacity 140ms var(--ease-out);}
.th-sortable.sorted .sort-arrow{opacity:1; color:var(--accent);}

/* ---- filter panel (Le parc) ---- */
.filter-wrap{position:relative;}
.filter-badge{margin-left:6px; background:var(--accent); color:var(--accent-fg); border-radius:999px; font-size:10px; font-weight:var(--fw-bold); padding:1px 6px; font-family:var(--mono);}
.filter-panel{position:absolute; top:calc(100% + 8px); left:0; width:250px; background:var(--bg-surface); border:1px solid var(--border-strong); border-radius:var(--r-lg); box-shadow:var(--shadow-popover); padding:14px; z-index:20; opacity:0; transform:translateY(-6px) scale(.98); pointer-events:none; transition:opacity 160ms var(--ease-out), transform 160ms var(--ease-out); transform-origin:top left;}
.filter-panel.open{opacity:1; transform:translateY(0) scale(1); pointer-events:auto;}
.fp-group{margin-bottom:14px;}
.fp-group:last-of-type{margin-bottom:0;}
.fp-label{font-size:10.5px; text-transform:uppercase; letter-spacing:.05em; font-weight:var(--fw-semibold); color:var(--text-muted); margin-bottom:8px;}
.fp-check{display:flex; align-items:center; gap:8px; padding:5px 2px; cursor:pointer; font-size:12.5px; color:var(--text-secondary);}
.fp-check input{width:15px; height:15px; border-radius:4px; border:1.5px solid var(--border-strong); background:var(--bg-surface); appearance:none; cursor:pointer; position:relative; flex:none;}
.fp-check input:checked{background:var(--accent); border-color:var(--accent);}
.fp-check input:checked::after{content:''; position:absolute; left:4px; top:1px; width:4px; height:8px; border:solid var(--accent-fg); border-width:0 2px 2px 0; transform:rotate(45deg);}
.fp-actions{display:flex; align-items:center; justify-content:space-between; margin-top:14px; padding-top:14px; border-top:1px solid var(--border-subtle);}
.fp-reset{background:none; border:none; font-size:12px; color:var(--text-muted); cursor:pointer; padding:0;}
.fp-reset:hover{color:var(--text-primary); text-decoration:underline;}
.parc-more-wrap{position:relative;}
.parc-more-menu{position:absolute; top:calc(100% + 8px); right:0; min-width:200px; background:var(--bg-surface); border:1px solid var(--border-strong); border-radius:var(--r-lg); box-shadow:var(--shadow-popover); padding:6px; z-index:20; opacity:0; transform:translateY(-6px) scale(.98); pointer-events:none; transition:opacity 160ms var(--ease-out), transform 160ms var(--ease-out); transform-origin:top right;}
.parc-more-menu.open{opacity:1; transform:translateY(0) scale(1); pointer-events:auto;}
.parc-more-menu button{display:block; width:100%; text-align:left; background:none; border:none; font:inherit; font-size:12.5px; color:var(--text-secondary); padding:9px 10px; border-radius:var(--r-s); cursor:pointer;}
.parc-more-menu button:hover{background:var(--bg-surface-hover); color:var(--text-primary);}
.parc-more-menu .divider{height:1px; background:var(--border-subtle); margin:4px 2px;}
.parc-more-menu button.demo-action{color:var(--text-muted); font-style:italic;}
.row-highlight{animation:rowFlash 1600ms ease-out;}
@keyframes rowFlash{
  0%{background:var(--accent-bg);}
  70%{background:var(--accent-bg);}
  100%{background:transparent;}
}

.chip{font-size:12px; font-weight:var(--fw-medium); padding:7px 14px; border-radius:var(--r-full); border:1px solid var(--border-strong); background:var(--bg-surface); color:var(--text-secondary); cursor:pointer; transition:transform 100ms var(--ease-out), background 160ms var(--ease-out), color 160ms var(--ease-out), border-color 160ms var(--ease-out);}
.tpl-chip-row{display:flex; gap:8px; flex-wrap:wrap; margin-top:8px;}
.tpl-chip-row .chip{padding:6px 12px; font-size:11.5px;}
.tpl-chip-row .chip.tpl-save{border-style:dashed; background:transparent;}
.chip:active{transform:scale(.95);}
.chip.active{background:var(--accent-bg); color:var(--accent-t); border-color:transparent;}
.search{display:flex; align-items:center; gap:8px; background:var(--field-bg); border:1px solid var(--border-strong); border-radius:var(--r-full); padding:9px 14px; font-size:12.5px; color:var(--text-muted); flex:1; max-width:260px; transition:border-color 160ms var(--ease-out), box-shadow 160ms var(--ease-out);}
.search:focus-within{border-color:var(--accent); box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent);}
.search svg{width:14px;height:14px; stroke:currentColor; fill:none; stroke-width:1.8;}

.tabs{display:flex; gap:2px; margin-bottom:var(--sp-5); background:var(--bg-surface-raised); border:1px solid var(--border-subtle); border-radius:var(--r-full); padding:3px; width:fit-content;}
.tabbtn{font-family:var(--font); font-size:12.5px; font-weight:var(--fw-semibold); color:var(--text-muted); background:none; border:none; padding:7px 16px; border-radius:var(--r-full); cursor:pointer; transition:background 160ms var(--ease-out), color 160ms var(--ease-out), transform 100ms var(--ease-out);}
.tabbtn:active{transform:scale(.96);}
.tabbtn.active{color:var(--text-primary); background:var(--bg-surface); box-shadow:var(--shadow-pill);}

.progress{height:8px; background:var(--bg-surface-raised); border-radius:999px; overflow:hidden;}
.progress > div{height:100%; background:var(--accent); border-radius:999px;}

.task-row{display:flex; align-items:center; gap:12px; padding:12px 0; border-bottom:1px solid var(--border-subtle);}
.task-row:last-child{border-bottom:none;}
.task-dot{width:18px;height:18px;border-radius:50%; flex:none; display:flex; align-items:center; justify-content:center; border:1.5px solid var(--border-strong);}
.task-dot.done{background:var(--success); border-color:var(--success);}
.task-dot.done svg{width:10px;height:10px; stroke:var(--bg-surface); fill:none; stroke-width:3;}
.task-dot.progress{border-color:var(--accent); background:var(--accent-bg);}
.task-title{font-size:13px; font-weight:var(--fw-medium);}
.task-title.strike{color:var(--text-muted); text-decoration:line-through;}
.task-meta{font-size:11px; color:var(--text-muted); margin-top:2px;}
.task-time{margin-left:auto; font-size:11px; color:var(--text-muted); font-family:var(--mono); white-space:nowrap;}

.log-row{display:flex; gap:10px; padding:8px 0; border-bottom:1px solid var(--border-subtle); font-size:12px;}
.log-row:last-child{border-bottom:none;}
.log-ts{font-family:var(--mono); color:var(--text-muted); font-size:11px; flex:none; width:64px;}
.log-src{font-size:10px; text-transform:uppercase; letter-spacing:.04em; font-weight:var(--fw-semibold); color:var(--text-muted); flex:none; width:56px;}
.log-msg{flex:1;}
.log-row.warn .log-msg{color:var(--warning);}
.log-row.error .log-msg{color:var(--danger);}

.stat-strip{display:flex; gap:0; border:1px solid var(--border-subtle); border-radius:var(--r-xs); overflow:hidden; background:var(--bg-surface);}
.stat-cell{flex:1; padding:14px 18px; border-right:1px solid var(--border-subtle);}
.stat-cell:last-child{border-right:none;}
.stat-cell .sl{font-size:10.5px; text-transform:uppercase; letter-spacing:.05em; color:var(--text-muted); font-weight:var(--fw-semibold);}
.stat-cell .sv{font-family:var(--mono); font-size:19px; font-weight:var(--fw-semibold); margin-top:5px;}

footer.credits{margin-top:var(--sp-8); padding:var(--sp-5) var(--sp-6); font-size:11.5px; color:var(--text-muted); display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px;}

section[data-page]{display:none;}
section[data-page].active{display:block;}

/* ---- mode simple/complet overrides ---- */
/* ---- Mode simple : memes donnees, meme code, on masque juste ce qui n'est pas vital pour un debutant ---- */
html[data-mode="simple"] .txt-pro{ display:none; }
html:not([data-mode="simple"]) .txt-simple{ display:none; }

html[data-mode="simple"] .nav-item[data-target="journee"],
html[data-mode="simple"] .nav-item[data-target="calendrier"],
html[data-mode="simple"] .nav-section[data-section-id="performance"],
html[data-mode="simple"] .nav-section[data-section-id="agence"],
html[data-mode="simple"] .nav-section[data-section-id="securite"],
html[data-mode="simple"] section[data-page="journee"],
html[data-mode="simple"] section[data-page="calendrier"],
html[data-mode="simple"] section[data-page="rendement"],
html[data-mode="simple"] section[data-page="agent"],
html[data-mode="simple"] section[data-page="integrations"],
html[data-mode="simple"] section[data-page="equipe"],
html[data-mode="simple"] section[data-page="facturation"],
html[data-mode="simple"] section[data-page="simulateur"],
html[data-mode="simple"] section[data-page="rapports"],
html[data-mode="simple"] section[data-page="audit"],
html[data-mode="simple"] section[data-page="alertes"],
html[data-mode="simple"] .bell-wrap,
html[data-mode="simple"] #cmdkTrigger,
html[data-mode="simple"] #roadmapBanner,
html[data-mode="simple"] #weeklyDigest,
html[data-mode="simple"] #heroStrip,
html[data-mode="simple"] #viewsPanelCard,
html[data-mode="simple"] #atraiterRow .card.panel[style*="grid-column"],
html[data-mode="simple"] .widget-hint,
html[data-mode="simple"] #widgets-accueil,
html[data-mode="simple"] #modelesCard,
html[data-mode="simple"] .section-remove,
html[data-mode="simple"] .widget-remove,
html[data-mode="simple"] .widget-resize,
html[data-mode="simple"] .widget .grip,
html[data-mode="simple"] [data-page="parc"] #parcViewToggle,
html[data-mode="simple"] [data-page="parc"] #kanbanGroupToggle,
html[data-mode="simple"] [data-page="parc"] #importOpenBtn,
html[data-mode="simple"] [data-page="parc"] .parc-more-wrap,
html[data-mode="simple"] [data-page="parc"] .filter-wrap,
html[data-mode="simple"] [data-page="parc"] .tbl th:first-child,
html[data-mode="simple"] [data-page="parc"] .tbl td:first-child,
html[data-mode="simple"] [data-page="parc"] .tbl th:nth-child(5),
html[data-mode="simple"] [data-page="parc"] .tbl td:nth-child(5),
html[data-mode="simple"] [data-page="parc"] .tbl th:nth-child(6),
html[data-mode="simple"] [data-page="parc"] .tbl td:nth-child(6),
html[data-mode="simple"] [data-page="parc"] .tbl th:nth-child(8),
html[data-mode="simple"] [data-page="parc"] .tbl td:nth-child(8),
html[data-mode="simple"] #bulkBar,
html[data-mode="simple"] #incidentSection,
html[data-mode="simple"] #drawerSecretsSection,
html[data-mode="simple"] #riskSimBlock,
html[data-mode="simple"] #scoreHistoryCard,
html[data-mode="simple"] #checklistSection,
html[data-mode="simple"] #drawerHistorySection,
html[data-mode="simple"] #drawerTagsSection,
html[data-mode="simple"] #drawerNotesSection,
html[data-mode="simple"] [data-page="creation"] .grid.g4 > .card.kpi:nth-child(2),
html[data-mode="simple"] [data-page="creation"] .grid.g4 > .card.kpi:nth-child(3),
html[data-mode="simple"] [data-page="creation"] .grid.g4 > .card.kpi:nth-child(4),
html[data-mode="simple"] #cc-moteur,
html[data-mode="simple"] #cc-sms,
html[data-mode="simple"] #cc-proxy,
html[data-mode="simple"] #obScrim,
html[data-mode="simple"] .settings-row:has(#obReplay)
{ display:none !important; }

html:not([data-mode="simple"]) #cc-simple{ display:none !important; }

html[data-mode="simple"] #atraiterRow{ grid-template-columns:1fr !important; }
html[data-mode="simple"] .drawer-stats{ grid-template-columns:repeat(2,1fr) !important; }
html[data-mode="simple"] .drawer-stats > div:nth-child(3){ display:none !important; }

/* rubrique "Parc & contenu" a plat en mode simple, elle ne contient plus que 2 liens */
html[data-mode="simple"] .nav-section[data-section-id="parc"] .nav-section-head{ display:none; }
html[data-mode="simple"] .nav-section[data-section-id="parc"] .nav-section-body{ display:flex !important; }
html[data-mode="simple"] .nav-section[data-section-id="parc"]{ margin-top:0; }