:root{
  --bg:#0E0E0E; --panel:#151515; --panel2:#181818; --border:#262626;
  --text:#EDEDED; --text-dim:#A0A0A0; --text-mute:#707070;
  --accent:#C6FF00; --amber:#EF9F27;
}
*{box-sizing:border-box;}
body{margin:0; background:var(--bg); font-family:'Inter',sans-serif; color:var(--text); padding:0;}
.app-shell{display:flex; min-height:100vh;}
.project-rail{width:60px; flex-shrink:0; background:var(--panel); border-right:0.5px solid var(--border); display:flex; flex-direction:column; align-items:center; padding:16px 0; gap:8px; transition:width .15s;}
.project-rail.expanded{width:190px; align-items:stretch; padding:16px 10px;}
.rail-icon{width:38px; height:38px; border-radius:9px; display:flex; align-items:center; justify-content:center; color:#fff; background:var(--panel2); border:0.5px solid var(--border); cursor:pointer; font-size:15px; flex-shrink:0;}
.rail-icon:hover{filter:brightness(1.15);}
.rail-icon.active{box-shadow:0 0 0 2px var(--accent); border-color:transparent;}
.rail-icon.rail-add{color:var(--text-mute); background:var(--panel2); border-style:dashed;}
.rail-icon.rail-add:hover{color:var(--accent); border-color:var(--accent); filter:none;}
.rail-item{display:flex; align-items:center; gap:10px; width:100%;}
.project-rail.expanded .rail-icon{width:38px;}
.rail-name{color:var(--text-dim); font-size:12.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.rail-item.active .rail-name{color:var(--text); font-weight:500;}
.app-main{flex:1; padding:24px; min-width:0;}
.mono{font-family:'IBM Plex Mono',monospace;}
.card{max-width:1080px; margin:0 auto; background:#0E0E0E; border:0.5px solid var(--border); border-radius:10px; overflow:hidden;}
header{padding:18px 24px; border-bottom:0.5px solid var(--border); display:flex; justify-content:space-between; align-items:baseline; flex-wrap:wrap; gap:10px;}
.proj-name{color:var(--accent); font-size:16px; font-weight:600; cursor:pointer;}
.proj-meta{color:var(--text-mute); font-size:11.5px; margin-top:3px;}
.tabs{display:flex; gap:6px;}
.tab{color:var(--text-dim); background:var(--panel2); border:0.5px solid var(--border); font-size:12px; padding:6px 13px; border-radius:6px; cursor:pointer;}
.tab.active{color:var(--bg); background:var(--accent); border-color:var(--accent);}
main{padding:22px 24px;}
.view{display:none;}
.view.active{display:block;}
.kpi-grid{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-bottom:22px;}
.kpi-card{background:var(--panel); border:0.5px solid var(--border); border-radius:8px; padding:12px 14px;}
.kpi-label{color:var(--text-mute); font-size:11px; margin-bottom:6px;}
.kpi-value{font-size:18px;}
.section-label{color:var(--text-dim); font-size:12px; margin-bottom:10px;}
select, input{background:var(--panel2); color:var(--text); border:0.5px solid var(--border); border-radius:6px; padding:6px 10px; font-size:12px; cursor:pointer; font-family:inherit;}
input[type=color]{padding:3px; width:52px; height:32px; cursor:pointer;}
input{cursor:text;}
table{width:100%; border-collapse:collapse; font-size:12px;}
th{text-align:left; color:var(--text-mute); font-weight:400; padding:8px 12px; background:var(--panel2); font-size:11px;}
td{padding:8px 12px; border-top:0.5px solid var(--border);}
.r{text-align:right;}
.card-table{border:0.5px solid var(--border); border-radius:8px; overflow-x:auto;}
tfoot td{border-top:1px solid var(--border); background:var(--panel2); font-weight:500; color:var(--text);}
.cell-input{width:60px; background:transparent; border:0.5px solid transparent; border-radius:4px; padding:4px 6px; text-align:right; font-size:12px; color:var(--text); font-family:'IBM Plex Mono',monospace;}
.cell-input:hover{border-color:var(--border);}
.cell-input:focus{border-color:var(--accent); outline:none; background:var(--panel2);}
.comment-input{width:100%; min-width:140px; background:transparent; border:0.5px solid transparent; border-radius:4px; padding:4px 8px; font-size:12px; color:var(--text-dim); font-family:'Inter',sans-serif;}
.comment-input:hover{border-color:var(--border);}
.comment-input:focus{border-color:var(--accent); outline:none; background:var(--panel2); color:var(--text);}
.row-ecart{background:rgba(239,159,39,0.08);}
.comments-footer{margin-top:12px; display:flex; align-items:center; gap:10px; flex-wrap:wrap;}
.comments-note{font-size:11.5px; color:var(--text-mute);}
.comments-preview{display:none; width:100%; margin-top:10px; background:var(--panel2); color:var(--text-dim); border:0.5px solid var(--border); border-radius:6px; padding:10px 12px; font-size:12px; font-family:'IBM Plex Mono',monospace; white-space:pre-wrap; min-height:100px;}
.row-flex{display:flex; justify-content:space-between; align-items:center; margin-bottom:8px; gap:10px; flex-wrap:wrap;}
.progress-track{background:var(--panel2); height:8px; border-radius:4px;}
.progress-fill{background:var(--accent); height:8px; border-radius:4px;}
.year-line{display:flex; justify-content:space-between; font-size:12px; padding:9px 0; border-top:0.5px solid var(--border);}
.year-line:first-child{border-top:none;}
.muted{color:var(--text-mute);}
.btn-add{background:var(--panel2); color:var(--text-dim); border:0.5px solid var(--border); border-radius:6px; padding:7px 14px; font-size:12px; cursor:pointer; font-family:inherit; white-space:nowrap;}
.btn-add:hover{border-color:var(--accent); color:var(--accent);}
.btn-primary{background:var(--accent); color:var(--bg); border:0.5px solid var(--accent); border-radius:6px; padding:7px 14px; font-size:12px; cursor:pointer; font-family:inherit; font-weight:500; white-space:nowrap;}
.consult-name{color:var(--text); cursor:pointer; text-decoration:underline; text-decoration-color:transparent; transition:text-decoration-color .15s;}
.consult-name:hover{text-decoration-color:var(--accent); color:var(--accent);}
.alert-x{color:var(--amber); font-weight:600;}
.alert-card{background:var(--panel); border:0.5px solid var(--border); border-left:2px solid var(--amber); border-radius:0 8px 8px 0; padding:9px 14px; margin-bottom:7px; font-size:12px;}
.alert-card.critical{border-left-color:#D85A30;}
.alert-card .alert-consult{color:var(--text); font-weight:500; margin-right:6px;}
.grat-card{background:var(--panel); border:0.5px solid var(--border); border-radius:8px; padding:9px 14px; margin-bottom:7px; display:flex; justify-content:space-between; align-items:center; font-size:12px;}
.expand-row{cursor:pointer;}
.expand-row:hover{background:var(--panel2);}
.chevron{display:inline-block; transition:transform .15s; margin-right:6px; font-size:10px; color:var(--text-mute);}
.chevron.open{transform:rotate(90deg);}
.cmd-sub-row td{background:var(--panel2);}
.cmd-progress{display:flex; align-items:center; gap:8px; min-width:140px;}
.cmd-progress-track{flex:1; background:var(--panel2); border-radius:4px; height:14px; overflow:hidden;}
.cmd-progress-fill{height:14px; border-radius:4px;}
.cmd-progress-pct{font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--text-dim); width:40px; text-align:right;}
.cmd-consult-chip{display:inline-block; background:var(--panel); border:0.5px solid var(--border); border-radius:10px; padding:4px 10px; margin:0 6px 6px 0; font-size:11.5px; color:var(--text-dim);}
.field-row{display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:10px;}
.field label{display:block; color:var(--text-mute); font-size:11px; margin-bottom:5px;}
.field input, .field select{width:100%;}
.fiche-block{margin-bottom:20px;}
.tag{display:inline-flex; align-items:center; gap:7px; background:var(--panel2); border:0.5px solid var(--border); color:var(--text-dim); font-size:11.5px; padding:4px 8px 4px 10px; border-radius:10px; margin:0 6px 6px 0;}
.tag .x{cursor:pointer; color:var(--text-mute); font-weight:600; font-size:13px; line-height:1;}
.tag .x:hover{color:var(--amber);}
.tag-add{display:flex; gap:8px; margin-top:6px;}
.tag-add input{flex:1;}
.inline-form{display:flex; gap:8px; align-items:flex-end; margin-top:10px; flex-wrap:wrap;}
.inline-form .field{flex:1; min-width:110px;}
.jours-preview{font-size:11.5px; color:var(--text-mute); padding:7px 0;}
.overlay{display:none; position:fixed; inset:0; background:rgba(0,0,0,0.6); align-items:center; justify-content:center; z-index:10; padding:24px;}
.overlay.open{display:flex;}
.modal{background:#0E0E0E; border:0.5px solid var(--border); border-radius:10px; width:100%; max-width:640px; max-height:88vh; overflow-y:auto; padding:22px 26px;}
.modal-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:18px;}
.modal-head .name{font-size:15px; font-weight:500; color:var(--accent);}
.modal-close{cursor:pointer; color:var(--text-mute); font-size:20px; line-height:1;}
.modal-close:hover{color:var(--text);}
.search-input{min-width:180px;}
.pill-row{display:flex; gap:6px; flex-wrap:wrap;}
.pill{background:var(--panel2); color:var(--text-dim); border:0.5px solid var(--border); font-size:11.5px; padding:5px 12px; border-radius:10px; cursor:pointer;}
.pill.active{background:var(--accent); color:var(--bg); border-color:var(--accent);}
th.sortable{cursor:pointer; user-select:none;}
th.sortable:hover{color:var(--text-dim);}
.sort-arrow{margin-left:4px; color:var(--accent);}
.col-picker-wrap{position:relative;}
.col-picker-panel{display:none; position:absolute; top:calc(100% + 4px); right:0; background:#0E0E0E; border:0.5px solid var(--border); border-radius:8px; padding:10px 12px; min-width:200px; z-index:5; max-height:260px; overflow-y:auto;}
.col-picker-panel.open{display:block;}
.col-picker-panel label{display:flex; align-items:center; gap:8px; font-size:12px; color:var(--text-dim); padding:5px 2px; cursor:pointer;}
.col-picker-panel input[type=checkbox]{cursor:pointer;}
.btn-locked{background:var(--panel2); color:var(--text-mute); border:0.5px solid var(--border);}
.meteo-row{display:flex; justify-content:space-between; align-items:flex-start; gap:10px; padding:9px 0; border-top:0.5px solid var(--border);}
.meteo-row:first-child{border-top:none;}
.meteo-emoji{font-size:15px; margin-right:6px;}
.meteo-date{color:var(--text-mute); font-size:11px;}
.meteo-modif{color:var(--text-mute); font-size:10.5px; font-style:italic; margin-left:6px;}
.icon-picker{display:grid; grid-template-columns:repeat(8,1fr); gap:6px; margin-top:6px;}
.icon-picker .icon-opt{width:32px; height:32px; border-radius:7px; display:flex; align-items:center; justify-content:center; background:var(--panel2); border:0.5px solid var(--border); color:var(--text-dim); cursor:pointer; font-size:13px;}
.icon-picker .icon-opt.selected{background:var(--accent); color:var(--bg); border-color:var(--accent);}
.input-forecast{color:var(--text-mute); font-style:italic; border-color:var(--border); border-style:dashed;}
.radio-row{display:flex; gap:18px; margin-bottom:10px;}
.radio-row label{display:flex; align-items:center; gap:6px; font-size:12.5px; color:var(--text-dim); cursor:pointer;}
.radio-row input{cursor:pointer;}
.forecast-note{font-size:11.5px; color:var(--text-mute); margin-top:4px;}
.reporting-grid{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:18px;}
.chart-card{background:var(--panel); border:0.5px solid var(--border); border-radius:8px; padding:14px 16px;}
.chart-card h4{margin:0 0 10px; font-size:12px; font-weight:500; color:var(--text-dim);}
.chart-card .chart-wrap-inner{position:relative; height:210px;}
.chart-note{color:var(--text-mute); font-size:10.5px; margin-top:8px;}
.chart-card.full{grid-column:1 / -1;}
.avancement-grid{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-top:16px;}
.avancement-card{background:var(--panel); border:0.5px solid var(--border); border-radius:8px; padding:12px 14px;}
.avancement-card .av-label{color:var(--text-mute); font-size:11px; margin-bottom:6px;}
.avancement-card .av-value{font-size:16px; font-family:'IBM Plex Mono',monospace; color:var(--text);}
.avancement-card .av-target{color:var(--text-mute); font-size:11px; margin-top:3px;}
.avancement-card .av-status{display:flex; align-items:center; gap:6px; margin-top:9px; font-size:11.5px; font-weight:500;}
.satisfaction-row{display:flex; justify-content:space-between; align-items:center; padding:7px 0; border-top:0.5px solid var(--border); font-size:12.5px;}
.satisfaction-row:first-child{border-top:none;}
.satisfaction-comment{color:var(--text-mute); font-size:11.5px; margin-top:8px; font-style:italic;}
.toast{position:fixed; bottom:20px; right:20px; background:var(--panel2); border:0.5px solid var(--border); border-left:3px solid var(--amber); color:var(--text); padding:10px 16px; border-radius:8px; font-size:12.5px; z-index:50; max-width:360px;}
