:root{
 --bg:#f6f1ea;--panel:#fff;--text:#24333d;--muted:#718089;--line:#e7ddd2;
 --dark:#203742;--dark2:#345563;--accent:#6d91a2;--green:#dff2e4;--yellow:#fff1c4;
 --red:#f5d7da;--purple:#eee7f7;--blue:#e3edf5;--peach:#f4e5dc;--shadow:0 10px 30px rgba(32,55,66,.09)
}
*{box-sizing:border-box} body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial;background:var(--bg);color:var(--text)}
button,input,select,textarea{font:inherit} button{cursor:pointer}
#app{display:grid;grid-template-columns:290px 1fr;min-height:100vh}
.sidebar{background:var(--dark);color:#fff;padding:22px 14px;position:sticky;top:0;height:100vh;overflow:auto}
.brand{font-weight:900;font-size:21px;padding:5px 8px 18px}.brand span{display:block;color:#b8c8cf;font-size:11px;margin-top:5px;font-weight:600}
.nav{width:100%;border:0;background:transparent;color:#e5edf0;text-align:left;padding:12px 13px;border-radius:10px;margin:3px 0;font-weight:750}
.nav.active,.nav:hover{background:var(--dark2)} .navTitle{font-size:10px;color:#9eb3bd;letter-spacing:1px;padding:20px 10px 8px}
main{padding:28px;min-width:0}.top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:20px}
h1,h2,h3{margin:0}.muted{color:var(--muted)}.small{font-size:12px}
.actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.btn{border:1px solid var(--line);background:#fff;color:var(--text);padding:10px 13px;border-radius:10px;font-weight:750}
.btn.primary{background:var(--dark);color:#fff;border-color:var(--dark)}.btn.danger{background:#923e47;color:#fff;border-color:#923e47}
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:16px 0}.card{background:var(--panel);border:1px solid #eee5dc;border-radius:16px;padding:16px;box-shadow:var(--shadow)}
.kpi b{font-size:27px;display:block;margin-top:5px}.progress{height:10px;background:#ede7df;border-radius:999px;overflow:hidden;margin-top:8px}.bar{height:100%;background:var(--accent)}
.projectGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.projectCard{border:0;text-align:left;padding:17px;border-radius:16px;color:var(--text);min-height:138px;box-shadow:var(--shadow)}
.projectCard:hover{transform:translateY(-1px)}.projectTop{display:flex;justify-content:space-between;gap:8px}.badge{font-size:11px;font-weight:800;background:rgba(255,255,255,.7);padding:4px 7px;border-radius:999px}
.section{margin-top:26px}.sectionHead{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.tabs{display:flex;gap:7px;flex-wrap:wrap}.tab{border:1px solid var(--line);background:#fff;padding:8px 11px;border-radius:9px;font-weight:700}.tab.active{background:var(--dark);color:white}
.task{display:grid;grid-template-columns:1.7fr .7fr .7fr .6fr auto;gap:10px;align-items:center;background:#fff;border:1px solid #eee4da;border-radius:12px;padding:11px;margin:7px 0}
.task.done{background:#f1fbf3}.task.doing{background:#fffaf0}.task.blocked{background:#fff1f2}.pill{display:inline-block;padding:4px 7px;border-radius:999px;background:#edf1f3;font-size:11px;font-weight:800}
.links a{display:inline-block;background:#e9f0f4;color:#315a6d;padding:5px 8px;border-radius:999px;text-decoration:none;font-size:11px;margin:2px}
.result{background:#fff;border-left:4px solid var(--accent);padding:11px;border-radius:10px;margin:7px 0}.result strong{display:block}
.formGrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.full{grid-column:1/-1}input,select,textarea{border:1px solid #dcd1c6;border-radius:9px;padding:10px;background:#fff;color:var(--text)}textarea{min-height:90px;width:100%}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.45);display:flex;align-items:center;justify-content:center;padding:18px;z-index:50}.modal.hidden{display:none}.modalCard{background:#fff;border-radius:18px;max-width:820px;width:100%;max-height:92vh;overflow:auto;padding:20px;box-shadow:var(--shadow)}
.calendar{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}.dayName{text-align:center;font-size:12px;font-weight:800;color:var(--muted);padding:5px}.day{border:1px solid #e7ddd4;background:#fff;border-radius:12px;min-height:120px;padding:8px;text-align:left}.day.other{opacity:.42}.day:hover{border-color:#91aab6}.dayNum{font-size:12px;font-weight:900}.event{background:#e8f0f5;border-radius:7px;padding:5px;margin-top:5px;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.todayGrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.todayCol{background:#fff;border-radius:16px;padding:16px;box-shadow:var(--shadow)}.todayItem{padding:9px 0;border-bottom:1px solid #eee}
.mediaGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.mediaItem{background:#f8f5f1;border:1px solid #e8ded5;border-radius:10px;padding:8px;font-size:12px}.mediaItem a{color:#315a6d}
@media(max-width:1000px){#app{grid-template-columns:1fr}.sidebar{position:relative;height:auto}.kpis{grid-template-columns:repeat(2,1fr)}.projectGrid{grid-template-columns:1fr 1fr}.task{grid-template-columns:1fr 1fr}.mediaGrid{grid-template-columns:1fr 1fr}}
@media(max-width:650px){main{padding:15px}.sidebar{display:none}.kpis,.projectGrid,.todayGrid{grid-template-columns:1fr}.formGrid{grid-template-columns:1fr}.task{grid-template-columns:1fr}.calendar{gap:3px}.day{min-height:85px;padding:5px}}

.todayCol:first-child{border-top:5px solid #6b8aa0}.todayCol:last-child{border-top:5px solid #b1849b}
.todayItem{border-radius:10px;padding:10px;margin-top:7px;background:#faf7f3}
.todayCol:first-child .todayItem{background:#edf4f8}.todayCol:last-child .todayItem{background:#f7eef4}

/* ===== COLOR & CLICKABILITY PATCH ===== */
:root{
  --zone-blue:#e8f1f6;--zone-purple:#f0e9f7;--zone-pink:#f7e9ef;--zone-green:#e9f4ea;
  --zone-yellow:#fff5d9;--zone-orange:#f8eadf;--zone-slate:#e9eef1;--zone-teal:#e3f2f0;
}
main{
  background:
    radial-gradient(circle at 8% 0%, rgba(109,145,162,.12), transparent 26%),
    radial-gradient(circle at 90% 8%, rgba(177,132,155,.10), transparent 24%),
    var(--bg);
}
.top{
  background:linear-gradient(135deg,#ffffff 0%,#f4f8fa 100%);
  border:1px solid #e6ddd4;padding:16px;border-radius:16px;box-shadow:var(--shadow);
}
.kpis .card:nth-child(1){background:linear-gradient(135deg,var(--zone-blue),#fff)}
.kpis .card:nth-child(2){background:linear-gradient(135deg,var(--zone-purple),#fff)}
.kpis .card:nth-child(3){background:linear-gradient(135deg,var(--zone-green),#fff)}
.kpis .card:nth-child(4){background:linear-gradient(135deg,var(--zone-yellow),#fff)}
.section{
  border-radius:18px;padding:15px;border:1px solid #e6ddd5;
  background:linear-gradient(135deg,rgba(255,255,255,.96),rgba(248,245,240,.96));
  box-shadow:0 7px 22px rgba(32,55,66,.06)
}
.section:nth-of-type(2n){background:linear-gradient(135deg,var(--zone-blue),#fff)}
.section:nth-of-type(3n){background:linear-gradient(135deg,var(--zone-purple),#fff)}
.section:nth-of-type(4n){background:linear-gradient(135deg,var(--zone-green),#fff)}
.task{border-left:5px solid #9babb4;transition:.15s ease}
.task:hover{transform:translateY(-1px);border-color:#b8c7ce;box-shadow:0 6px 16px rgba(32,55,66,.08)}
.task.done{background:linear-gradient(90deg,var(--green),#fff);border-left-color:#6d9d76}
.task.doing{background:linear-gradient(90deg,var(--yellow),#fff);border-left-color:#c89e40}
.task.blocked{background:linear-gradient(90deg,var(--red),#fff);border-left-color:#a94f58}
.projectCard{border:1px solid rgba(36,51,61,.08)!important;transition:.15s ease}
.projectCard:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(32,55,66,.13)}
.todayCol:first-child{background:linear-gradient(160deg,#eaf2f8,#fff);border-top:6px solid #668ba0}
.todayCol:last-child{background:linear-gradient(160deg,#f7eaf1,#fff);border-top:6px solid #b67f9a}
.todayItem{border:1px solid rgba(36,51,61,.06)}
.calendar{
  background:linear-gradient(135deg,#e7f0f5,#f5ecf3);
  padding:12px;border-radius:18px;border:1px solid #ded4ca
}
.dayName{background:#29424e;color:#fff;border-radius:9px;padding:8px 5px}
.day{transition:.12s ease;position:relative}
.day:nth-child(7n+1){background:#f8e9ed}
.day:nth-child(7n+2){background:#edf4f7}
.day:nth-child(7n+3){background:#f3edf8}
.day:nth-child(7n+4){background:#edf6ee}
.day:nth-child(7n+5){background:#fff7df}
.day:nth-child(7n+6){background:#f9ece4}
.day:nth-child(7n){background:#e9f3f1}
.day:hover{transform:translateY(-1px);box-shadow:0 8px 16px rgba(32,55,66,.11);border-color:#7e9aaa}
.day.other{opacity:.45}
.dayNum{display:inline-flex;width:26px;height:26px;align-items:center;justify-content:center;border-radius:50%;background:rgba(255,255,255,.8)}
.event{border-left:4px solid #6d91a2;background:#fff;box-shadow:0 2px 7px rgba(32,55,66,.07)}
.event.owner-yassine{background:#e3eef8;border-left-color:#597d9a}
.event.owner-jaouaher{background:#f5e7ef;border-left-color:#ae718f}
.event.owner-ensemble{background:#e8f3e5;border-left-color:#6e9568}
.btn,.nav,.projectCard,.day,[data-task],[data-date],[data-view],[data-project],[data-open-project]{
  pointer-events:auto!important;position:relative;z-index:2
}
.btn:disabled{opacity:.45;cursor:not-allowed}
.modal{z-index:9999}
.modalCard{border:2px solid #d8cfc6}
.links a:nth-child(4n+1){background:#e3edf5}
.links a:nth-child(4n+2){background:#eee7f7}
.links a:nth-child(4n+3){background:#f7e9ef}
.links a:nth-child(4n+4){background:#e9f4ea}

.weekPlanner .card:nth-child(7n+1){border-left:6px solid #6f91a2}
.weekPlanner .card:nth-child(7n+2){border-left:6px solid #a47ba0}
.weekPlanner .card:nth-child(7n+3){border-left:6px solid #7da579}
.weekPlanner .card:nth-child(7n+4){border-left:6px solid #d0a049}
.weekPlanner .card:nth-child(7n+5){border-left:6px solid #c98375}
.weekPlanner .card:nth-child(7n+6){border-left:6px solid #6e9a9a}
.weekPlanner .card:nth-child(7n){border-left:6px solid #8b7cab}