
:root{
  --bg:#080809;
  --panel:#101012;
  --panel-2:#171719;
  --panel-3:#202023;
  --text:#ffffff;
  --muted:#a8a8b0;
  --line:#2b2b30;
  --primary:#be0e2f;
  --primary-2:#f23b5c;
  --success:#39cf94;
  --warning:#f5b544;
  --danger:#ff5c72;
  --violet:#a9a9b4;
  --shadow:0 18px 45px rgba(0,0,0,.28);
  --radius:18px;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--text)}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
a{text-decoration:none;color:inherit}
.app{min-height:100vh;display:grid;grid-template-columns:260px minmax(0,1fr)}
.sidebar{
  position:sticky;top:0;height:100vh;padding:22px 16px;background:linear-gradient(180deg,#121214 0%,#09090a 100%);
  border-right:1px solid var(--line);display:flex;flex-direction:column;z-index:20
}
.brand{display:flex;align-items:center;gap:12px;padding:4px 8px 20px}
.brand-mark{
  width:48px;height:48px;border-radius:14px;background:#fff;
  display:grid;place-items:center;box-shadow:0 10px 30px rgba(190,14,47,.22);overflow:hidden;padding:3px
}
.brand-mark img{width:100%;height:100%;object-fit:contain}

.brand h1{font-size:15px;line-height:1.15;margin:0;letter-spacing:.05em;text-transform:uppercase}
.brand small{color:var(--muted);font-size:11px}
.nav{display:flex;flex-direction:column;gap:7px;margin-top:6px}
.nav button{
  width:100%;border:0;background:transparent;color:var(--muted);padding:12px 13px;border-radius:12px;
  display:flex;align-items:center;gap:11px;text-align:left;transition:.18s
}
.nav button:hover{background:rgba(255,255,255,.045);color:#fff}
.nav button.active{background:linear-gradient(90deg,rgba(190,14,47,.20),rgba(190,14,47,.06));color:#fff;border:1px solid rgba(190,14,47,.24)}
.nav .ico{width:22px;text-align:center;font-size:17px}
.sidebar-bottom{margin-top:auto;padding:12px 8px 0;border-top:1px solid var(--line)}
.user-card{display:flex;gap:10px;align-items:center}
.avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#293b59,#4370a8);display:grid;place-items:center;font-weight:800}
.user-card b{font-size:13px}
.user-card span{display:block;color:var(--muted);font-size:11px}
.main{min-width:0}
.topbar{
  height:74px;padding:0 30px;border-bottom:1px solid rgba(190,14,47,.35);display:flex;align-items:center;justify-content:space-between;
  background:rgba(8,8,9,.92);backdrop-filter:blur(14px);position:sticky;top:0;z-index:15
}
.top-title strong{display:block;font-size:17px}
.top-title span{font-size:12px;color:var(--muted)}
.top-actions{display:flex;gap:10px;align-items:center}
.btn{
  border:1px solid var(--line);background:var(--panel-2);color:#fff;border-radius:11px;padding:10px 14px;font-weight:700;
  transition:.18s;box-shadow:none
}
.btn:hover{transform:translateY(-1px);border-color:#6b2435}
.btn.primary{background:linear-gradient(135deg,#d2143a,#9d0a29);border-color:transparent;color:#fff}
.btn.ghost{background:transparent}
.btn.sm{padding:8px 10px;font-size:12px}
.icon-btn{width:40px;height:40px;border-radius:11px;border:1px solid var(--line);background:var(--panel-2);color:#fff}
.content{padding:28px 30px 48px}
.page{display:none}
.page.active{display:block}
.page-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:22px}
.page-head h2{font-size:28px;margin:0 0 4px}
.page-head p{margin:0;color:var(--muted);font-size:13px}
.grid{display:grid;gap:16px}
.stats{grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:18px}
.card{background:linear-gradient(180deg,var(--panel) 0%,#0c0c0e 100%);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.stat-card{padding:19px}
.stat-top{display:flex;justify-content:space-between;align-items:center}
.stat-icon{width:40px;height:40px;border-radius:12px;background:rgba(190,14,47,.12);display:grid;place-items:center}
.stat-value{font-size:27px;font-weight:900;margin-top:10px}
.stat-label{font-size:12px;color:var(--muted)}
.stat-trend{font-size:11px;color:var(--success)}
.two-col{grid-template-columns:minmax(0,1.45fr) minmax(310px,.75fr)}
.panel{padding:20px}
.panel-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.panel-title h3{font-size:15px;margin:0}
.panel-title span{font-size:11px;color:var(--muted)}
.project-row{
  padding:15px 0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:minmax(0,1fr) 115px 125px 46px;
  gap:12px;align-items:center
}
.project-row:last-child{border-bottom:0}
.project-name{font-weight:800;font-size:14px}
.meta{font-size:11px;color:var(--muted);margin-top:4px}
.badge{display:inline-flex;align-items:center;gap:6px;padding:6px 9px;border-radius:999px;font-size:11px;font-weight:800;white-space:nowrap}
.badge.success{background:rgba(58,210,159,.12);color:#7cecc8}
.badge.warning{background:rgba(255,184,77,.12);color:#ffd087}
.badge.danger{background:rgba(255,99,118,.12);color:#ff9dab}
.badge.info{background:rgba(190,14,47,.14);color:#8ce9ff}
.progress{height:7px;background:#17263c;border-radius:999px;overflow:hidden}
.progress > span{display:block;height:100%;background:linear-gradient(90deg,#d81740,#8f0b28);border-radius:999px}
.progress-label{font-size:11px;color:var(--muted);margin-top:5px}
.arrow-btn{width:34px;height:34px;border-radius:10px;background:var(--panel-3);border:1px solid var(--line);color:white}
.todo{display:flex;gap:11px;padding:12px 0;border-bottom:1px solid var(--line);align-items:flex-start}
.todo:last-child{border-bottom:0}
.dot{width:9px;height:9px;border-radius:50%;margin-top:5px;flex:0 0 auto}
.dot.red{background:var(--danger)} .dot.orange{background:var(--warning)} .dot.green{background:var(--success)} .dot.blue{background:var(--primary)}
.todo b{font-size:13px;display:block}
.todo span{font-size:11px;color:var(--muted)}
.section-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.idea-card,.project-card{padding:19px}
.idea-card h3,.project-card h3{margin:0 0 7px;font-size:16px}
.idea-card p,.project-card p{margin:0;color:var(--muted);font-size:12px;line-height:1.55}
.score{display:flex;justify-content:space-between;align-items:center;margin:18px 0 12px}
.score strong{font-size:26px}
.mini-metrics{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin-top:15px}
.metric{background:var(--panel-2);border:1px solid var(--line);padding:10px;border-radius:12px}
.metric b{font-size:12px;display:block}
.metric span{font-size:11px;color:var(--muted)}
.actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:15px}
.filterbar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.filterbar button{border:1px solid var(--line);background:var(--panel);color:var(--muted);padding:8px 12px;border-radius:999px;font-size:12px}
.filterbar button.active{background:rgba(190,14,47,.14);border-color:rgba(190,14,47,.42);color:#fff}
.project-card .progress{margin-top:14px}
.project-top{display:flex;justify-content:space-between;gap:12px}
.health{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:15px}
.health div{background:var(--panel-2);padding:9px 10px;border-radius:11px;font-size:11px;color:var(--muted)}
.health b{display:block;color:#fff;margin-bottom:3px}
.detail-shell{display:none}
.detail-shell.active{display:block}
.list-shell.hidden{display:none}
.detail-hero{padding:22px;margin-bottom:16px}
.detail-title{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}
.detail-title h2{font-size:26px;margin:0 0 6px}
.detail-title p{margin:0;color:var(--muted);font-size:12px}
.detail-progress{max-width:400px;margin-top:18px}
.tabs{display:flex;gap:7px;flex-wrap:wrap;border-bottom:1px solid var(--line);padding:0 2px 12px;margin-bottom:18px}
.tabs button{border:0;background:transparent;color:var(--muted);padding:8px 10px;border-radius:9px;font-size:12px;font-weight:800}
.tabs button.active{background:rgba(190,14,47,.14);color:#fff}
.tab-content{display:none}
.tab-content.active{display:block}
.objective-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.objective{padding:16px}
.objective .big{font-size:22px;font-weight:900;margin:7px 0 2px}
.objective small{color:var(--muted)}
.health-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.health-line{background:var(--panel-2);border:1px solid var(--line);padding:12px;border-radius:12px;display:flex;justify-content:space-between;align-items:center}
.health-line span{font-size:12px}
.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:15px}
table{width:100%;border-collapse:collapse;min-width:650px;background:var(--panel)}
th,td{padding:13px 14px;text-align:left;border-bottom:1px solid var(--line);font-size:12px}
th{color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.06em;background:#141416}
tr:last-child td{border-bottom:0}
.check{width:18px;height:18px;accent-color:var(--primary)}
.kanban{display:grid;grid-template-columns:repeat(4,minmax(210px,1fr));gap:12px;overflow:auto;padding-bottom:5px}
.kan-col{background:#0d0d0f;border:1px solid var(--line);border-radius:15px;padding:12px;min-height:280px}
.kan-col h4{font-size:11px;color:var(--muted);margin:0 0 10px;text-transform:uppercase}
.kan-card{background:var(--panel-2);border:1px solid var(--line);border-radius:12px;padding:11px;margin-bottom:9px}
.kan-card b{font-size:12px;display:block}
.kan-card span{font-size:10px;color:var(--muted)}
.timeline{padding:10px 0}
.milestone{display:grid;grid-template-columns:90px 20px 1fr;gap:10px;align-items:start;min-height:52px}
.milestone .date{font-size:11px;color:var(--muted);text-align:right;padding-top:3px}
.milestone .node{width:12px;height:12px;border-radius:50%;background:#23344d;border:3px solid var(--panel);box-shadow:0 0 0 1px #415875;margin-top:2px;position:relative}
.milestone.done .node{background:var(--success)}
.milestone.current .node{background:var(--warning)}
.milestone .node:after{content:"";position:absolute;top:11px;left:50%;width:1px;height:41px;background:#31445f}
.milestone:last-child .node:after{display:none}
.milestone b{font-size:12px}
.milestone span{font-size:11px;color:var(--muted)}
.kpi-bar{display:flex;align-items:end;gap:8px;height:170px;padding:16px 12px 0;border-bottom:1px solid var(--line)}
.bar{flex:1;min-width:28px;background:linear-gradient(180deg,#d81740,#850a24);border-radius:8px 8px 0 0;position:relative}
.bar label{position:absolute;bottom:-24px;left:50%;transform:translateX(-50%);font-size:10px;color:var(--muted)}
.bar i{position:absolute;top:-20px;left:50%;transform:translateX(-50%);font-size:9px;color:#fff;font-style:normal}
.empty{padding:30px;text-align:center;color:var(--muted)}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}
.field{display:flex;flex-direction:column;gap:6px}
.field.full{grid-column:1/-1}
.field label{font-size:11px;color:#c4c8d0;font-weight:800;letter-spacing:.01em}
.field label .req{color:#ff6b87;margin-left:3px}
.field .hint{font-size:10px;color:var(--muted);line-height:1.4}
.field input,.field select,.field textarea{
  width:100%;border:1px solid var(--line);background:#0b0b0d;color:#fff;border-radius:11px;padding:11px 12px;outline:none
}
.field input:focus,.field select:focus,.field textarea:focus{border-color:#a80d2b;box-shadow:0 0 0 3px rgba(190,14,47,.09)}
.field textarea{min-height:90px;resize:vertical}
.modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.66);display:flex;align-items:center;justify-content:center;padding:20px;z-index:100;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s ease,visibility .18s ease;backdrop-filter:blur(5px)}
.modal-backdrop.open{opacity:1;visibility:visible;pointer-events:auto}
.modal{width:min(760px,100%);max-height:min(88vh,820px);overflow:auto;background:linear-gradient(180deg,#151519,#0e0e11);border:1px solid #4d2832;border-radius:22px;box-shadow:0 32px 90px rgba(0,0,0,.58);transform:translateY(14px) scale(.985);opacity:.7;transition:transform .2s ease,opacity .2s ease}
.modal-backdrop.open .modal{transform:translateY(0) scale(1);opacity:1}
.modal-head{position:sticky;top:0;z-index:3;display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding:20px 22px 16px;margin:0;background:linear-gradient(180deg,rgba(21,21,25,.98),rgba(21,21,25,.94));border-bottom:1px solid var(--line);backdrop-filter:blur(10px)}
.modal-head h3{margin:3px 0 3px;font-size:21px;letter-spacing:-.01em}
.modal-head p{margin:0;color:var(--muted);font-size:11px;line-height:1.45}
.modal-kicker{font-size:9px;text-transform:uppercase;letter-spacing:.12em;color:#ff738e;font-weight:900}
#dynamicForm{padding:20px 22px 0}
.modal-error{display:none;margin:0 0 14px;border:1px solid rgba(255,99,118,.35);background:rgba(255,99,118,.08);color:#fecaca;border-radius:12px;padding:10px 12px;font-size:12px}
.modal-error.show{display:block}
.modal-actions{position:sticky;bottom:0;z-index:3;display:flex;justify-content:flex-end;gap:8px;margin:20px -22px 0;padding:14px 22px 18px;background:linear-gradient(180deg,rgba(14,14,17,.88),#0e0e11 32%);border-top:1px solid var(--line);backdrop-filter:blur(10px)}
body.modal-open{overflow:hidden}
.toast{position:fixed;right:22px;bottom:22px;background:#111f32;border:1px solid #5a2533;color:#fff;padding:12px 15px;border-radius:12px;box-shadow:var(--shadow);opacity:0;transform:translateY(12px);pointer-events:none;transition:.22s;z-index:200;font-size:12px}
.toast.show{opacity:1;transform:translateY(0)}
.floating-add{display:none}
.mobile-menu{display:none}
.retex-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.retex-box{padding:18px}
.retex-box h4{margin:0 0 10px}
.retex-box textarea{width:100%;min-height:130px;border:1px solid var(--line);background:#0b0b0d;color:#fff;border-radius:12px;padding:12px}
.event-mode{
  background:radial-gradient(circle at top right,rgba(255,99,118,.08),transparent 30%),linear-gradient(180deg,var(--panel),#0b1525);
  border-color:rgba(255,99,118,.25)
}
.event-clock{font-size:42px;font-weight:900;letter-spacing:.02em}
.run-row{display:grid;grid-template-columns:80px 1fr 80px;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}
.run-row:last-child{border-bottom:0}
.run-row time{font-weight:900}
.run-row .done{color:var(--success)}
.small-note{font-size:11px;color:var(--muted);line-height:1.5}
.quick-actions{display:flex;gap:8px;flex-wrap:wrap}

.brief-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.brief-card{padding:17px}
.brief-card h4{margin:0 0 10px;font-size:13px}
.brief-card p{font-size:11px;color:var(--muted);line-height:1.55;margin:0}
.detail-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.detail-form .field.full{grid-column:1/-1}
.detail-form input,.detail-form select,.detail-form textarea{
  width:100%;border:1px solid var(--line);background:#0b0b0d;color:#fff;border-radius:11px;padding:10px 11px;outline:none
}
.detail-form textarea{min-height:92px;resize:vertical}
.detail-form label{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.project-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-top:15px}
.project-kpi{background:var(--panel-2);border:1px solid var(--line);border-radius:13px;padding:12px}
.project-kpi small{display:block;color:var(--muted);font-size:9px;text-transform:uppercase}
.project-kpi strong{display:block;font-size:17px;margin-top:5px}
.section-label{font-size:11px;color:var(--primary-2);font-weight:900;text-transform:uppercase;letter-spacing:.08em;margin:4px 0 10px}
.gate-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.gate{padding:13px;border-radius:13px;background:var(--panel-2);border:1px solid var(--line)}
.gate strong{font-size:12px;display:block;margin-bottom:6px}
.gate small{font-size:10px;color:var(--muted)}
.gate.ok{border-color:rgba(58,210,159,.28)}
.gate.warn{border-color:rgba(255,184,77,.28)}
.gate.bad{border-color:rgba(255,99,118,.28)}
.site-zones{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.zone-card{padding:14px;border:1px solid var(--line);border-radius:13px;background:var(--panel-2)}
.zone-card b{font-size:12px;display:block;margin-bottom:5px}
.zone-card span{font-size:10px;color:var(--muted)}
.checklist-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.checkline{display:flex;gap:10px;align-items:flex-start;padding:11px;border:1px solid var(--line);border-radius:12px;background:var(--panel-2)}
.checkline input{margin-top:2px;accent-color:var(--primary)}
.checkline b{display:block;font-size:11px}
.checkline span{display:block;color:var(--muted);font-size:10px;margin-top:3px;line-height:1.4}
.risk-matrix{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.risk-card{padding:13px;border-radius:13px;background:var(--panel-2);border:1px solid var(--line)}
.risk-card .risk-head{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:6px}
.risk-card b{font-size:12px}
.risk-card p{margin:0;color:var(--muted);font-size:10px;line-height:1.45}
.stakeholder-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.stakeholder{padding:13px;border:1px solid var(--line);border-radius:13px;background:var(--panel-2)}
.stakeholder b{display:block;font-size:12px}
.stakeholder span{font-size:10px;color:var(--muted)}
.big-event-banner{
  padding:15px 17px;border-radius:15px;margin-bottom:16px;
  background:linear-gradient(90deg,rgba(190,14,47,.18),rgba(190,14,47,.09));
  border:1px solid rgba(190,14,47,.30)
}
.big-event-banner b{display:block;font-size:13px}
.big-event-banner span{font-size:11px;color:var(--muted)}
@media (max-width:1050px){
  .brief-grid,.project-kpis{grid-template-columns:repeat(2,1fr)}
  .gate-grid,.site-zones{grid-template-columns:repeat(2,1fr)}
  .stakeholder-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:780px){
  .detail-form,.checklist-grid,.risk-matrix{grid-template-columns:1fr}
  .project-kpis,.brief-grid,.gate-grid,.site-zones,.stakeholder-grid{grid-template-columns:1fr}
}

@media (max-width:1050px){
  .stats{grid-template-columns:repeat(2,1fr)}
  .two-col{grid-template-columns:1fr}
  .section-grid{grid-template-columns:repeat(2,1fr)}
  .objective-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:780px){
  .app{grid-template-columns:1fr}
  .sidebar{position:fixed;left:-280px;width:260px;transition:.22s;box-shadow:var(--shadow)}
  .sidebar.open{left:0}
  .mobile-menu{display:inline-grid;place-items:center}
  .topbar{padding:0 16px}
  .content{padding:20px 15px 88px}
  .page-head{align-items:flex-start;flex-direction:column}
  .stats{grid-template-columns:1fr 1fr}
  .section-grid{grid-template-columns:1fr}
  .project-row{grid-template-columns:1fr 90px 36px}
  .project-row .badge{display:none}
  .form-grid{grid-template-columns:1fr}
  .field.full{grid-column:auto}
  .objective-grid{grid-template-columns:1fr 1fr}
  .health-grid{grid-template-columns:1fr}
  .retex-grid{grid-template-columns:1fr}
  .floating-add{display:block;position:fixed;right:18px;bottom:18px;width:55px;height:55px;border-radius:50%;border:0;background:linear-gradient(135deg,#d81740,#920a27);font-size:26px;font-weight:700;z-index:12}
}
@media (max-width:470px){
  .stats,.objective-grid{grid-template-columns:1fr}
  .top-title span{display:none}
  .btn.primary.top-new{display:none}
}

.mobile-bottom-nav,.mobile-backdrop{display:none}
@media (max-width:780px){
  body{padding-bottom:74px}
  .app{display:block}
  .sidebar{width:min(86vw,320px);left:calc(-1 * min(86vw,320px));padding-bottom:92px;z-index:120}
  .sidebar.open{left:0}
  .topbar{height:62px;padding:0 12px;position:sticky;top:0;z-index:60}
  .top-title strong{font-size:15px}
  .content{padding:16px 12px 24px}
  .page-head{gap:12px;margin-bottom:16px}
  .page-head h2{font-size:23px}
  .page-head p{font-size:12px;line-height:1.45}
  .quick-actions{width:100%}
  .quick-actions .btn{flex:1}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .stat-card{padding:14px}
  .stat-value{font-size:22px}
  .two-col,.section-grid,.objective-grid,.brief-grid,.project-kpis,.gate-grid,.stakeholder-grid{grid-template-columns:1fr!important}
  .project-row{grid-template-columns:minmax(0,1fr) 72px 36px;padding:13px 0}
  .project-row .badge{display:none}
  .project-card{padding:16px}
  .project-card .actions .btn{width:100%}
  .health{grid-template-columns:1fr}
  .detail-hero{padding:16px;margin-bottom:12px}
  .detail-title{flex-direction:column;gap:14px}
  .detail-title h2{font-size:22px}
  .detail-title .quick-actions{display:grid;grid-template-columns:1fr 1fr;width:100%}
  .tabs{flex-wrap:nowrap;overflow-x:auto;padding:0 0 10px;margin:0 -2px 14px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .tabs::-webkit-scrollbar{display:none}
  .tabs button{flex:0 0 auto;white-space:nowrap;padding:9px 11px;background:var(--panel);border:1px solid var(--line)}
  .detail-form,.checklist-grid,.risk-matrix,.retex-grid{grid-template-columns:1fr}
  .detail-form .field.full{grid-column:auto}
  .detail-form input,.detail-form select,.detail-form textarea,.field input,.field select,.field textarea{min-height:44px;font-size:16px}
  .detail-form textarea,.field textarea{min-height:105px}
  .site-zones{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .kanban{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:10px;margin-right:-12px;padding-right:12px}
  .kan-col{min-width:84vw;scroll-snap-align:start}
  .table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:13px}
  table{min-width:620px}
  .event-clock{font-size:30px}
  .run-row{grid-template-columns:58px minmax(0,1fr);gap:8px}
  .run-row > :last-child{grid-column:2;justify-self:start}
  .modal-backdrop{padding:0;align-items:flex-end}
  .modal{width:100%;max-height:94dvh;border-radius:24px 24px 0 0}
  .modal-head{padding:15px 14px 12px}
  .modal-head h3{font-size:19px}
  #dynamicForm{padding:14px 14px 0}
  .form-grid{grid-template-columns:1fr;gap:12px}
  .field.full{grid-column:auto}
  .field input,.field select,.field textarea{font-size:16px;min-height:48px}
  .modal-actions{margin:16px -14px 0;padding:12px 14px calc(14px + env(safe-area-inset-bottom))}
  .modal-actions .btn{flex:1;min-height:46px}
  .mobile-bottom-nav{
    position:fixed;left:0;right:0;bottom:0;height:70px;display:grid;grid-template-columns:repeat(5,1fr);
    background:rgba(8,8,9,.97);backdrop-filter:blur(18px);border-top:1px solid var(--line);z-index:110;
    padding:6px 6px max(6px,env(safe-area-inset-bottom))
  }
  .mobile-bottom-nav button{
    border:0;background:transparent;color:var(--muted);display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:3px;border-radius:11px;min-width:0
  }
  .mobile-bottom-nav button .m-ico{font-size:18px}
  .mobile-bottom-nav button .m-label{font-size:9px;white-space:nowrap}
  .mobile-bottom-nav button.active{color:#fff;background:rgba(190,14,47,.14)}
  .mobile-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.58);z-index:115}
  .sidebar.open ~ .mobile-backdrop{display:block}
  .floating-add{right:14px;bottom:84px;width:52px;height:52px}
}
@media (max-width:430px){
  .stats{grid-template-columns:1fr 1fr}
  .stat-value{font-size:19px}
  .stat-label{font-size:10px}
  .site-zones{grid-template-columns:1fr!important}
  .detail-title .quick-actions{grid-template-columns:1fr}
}


button,a,.btn,.arrow-btn,.icon-btn{
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
}
button{user-select:none;-webkit-user-select:none}
@media (hover:none) and (pointer:coarse){
  .btn,.icon-btn,.arrow-btn,.nav button,.mobile-bottom-nav button{min-height:44px}
}


.storage-notice{
  position:fixed;left:50%;transform:translateX(-50%);bottom:82px;z-index:150;
  background:#221116;border:1px solid rgba(190,14,47,.45);color:#fff;
  border-radius:999px;padding:8px 12px;font-size:10px;box-shadow:var(--shadow)
}


/* Hocklines Manager V2 additions */
.btn.delete{background:rgba(255,92,114,.10);border-color:rgba(255,92,114,.30);color:#ff8fa0}.btn.delete:hover{background:rgba(255,92,114,.18)}
.row-actions{display:flex;gap:6px;flex-wrap:wrap;min-width:145px}.muted{color:var(--muted)}
.compact-stats{grid-template-columns:repeat(4,minmax(0,1fr))}.budget-stats{grid-template-columns:repeat(5,minmax(0,1fr))}
.gantt-wrap{overflow:auto;min-height:90px}.gantt-empty{padding:26px;text-align:center;color:var(--muted);border:1px dashed var(--line);border-radius:14px}
.gantt-scale{min-width:900px;display:flex;justify-content:space-between;color:var(--muted);font-size:10px;margin:0 0 10px 235px;padding-right:4px}
.gantt-grid{min-width:900px;display:grid;gap:7px}.gantt-row2{display:grid;grid-template-columns:220px 1fr;gap:14px;align-items:center}.gantt-name{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.gantt-name b{display:block;color:#fff}.gantt-name span{color:var(--muted)}
.gantt-track2{height:30px;position:relative;border:1px solid var(--line);border-radius:9px;background:repeating-linear-gradient(90deg,#0c0c0e 0,#0c0c0e calc(10% - 1px),#232327 calc(10% - 1px),#232327 10%)}
.gantt-bar2{position:absolute;top:5px;height:18px;border-radius:999px;background:linear-gradient(90deg,#d81740,#8f0b28);box-shadow:0 4px 14px rgba(190,14,47,.22);min-width:5px}.gantt-bar2.done{background:linear-gradient(90deg,#287b61,#39cf94)}.gantt-bar2.blocked{background:linear-gradient(90deg,#9f5a15,#f5b544)}
.load-pill{display:inline-flex;padding:5px 8px;border-radius:999px;background:rgba(190,14,47,.12);font-size:10px;font-weight:800}.retex-card .retex-block{margin-top:11px;padding-top:11px;border-top:1px solid var(--line)}.retex-card .retex-block b{font-size:11px}.retex-card .retex-block p{margin:4px 0 0;color:var(--muted);font-size:11px;line-height:1.5}
@media(max-width:1150px){.budget-stats{grid-template-columns:repeat(3,1fr)}}
@media(max-width:780px){.compact-stats,.budget-stats{grid-template-columns:repeat(2,1fr)}.gantt-scale{margin-left:185px}.gantt-row2{grid-template-columns:170px 1fr}}



/* === Hocklines bénévoles / Jour J === */
.volunteer-shell{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:16px;margin-top:16px}
.volunteer-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:14px 0 16px}
.volunteer-kpi{background:var(--panel-2);border:1px solid var(--line);border-radius:13px;padding:13px}
.volunteer-kpi small{display:block;color:var(--muted);font-size:9px;text-transform:uppercase;letter-spacing:.07em}
.volunteer-kpi strong{display:block;font-size:20px;margin-top:5px}
.volunteer-table td{vertical-align:middle}
.volunteer-status{display:inline-flex;align-items:center;gap:6px}
.volunteer-status::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;opacity:.9}
.volunteer-view{background:linear-gradient(180deg,rgba(190,14,47,.09),rgba(255,255,255,.015));border:1px solid rgba(190,14,47,.28)}
.volunteer-view-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:14px}
.volunteer-view-head h3{margin:0 0 4px}
.volunteer-view-head p{margin:0;color:var(--muted);font-size:11px}
.volunteer-profile{display:grid;grid-template-columns:46px minmax(0,1fr);gap:11px;align-items:center;padding:12px;background:var(--panel-2);border:1px solid var(--line);border-radius:13px;margin-bottom:12px}
.volunteer-profile .avatar{width:46px;height:46px;font-size:14px}
.volunteer-profile b{display:block;font-size:14px}.volunteer-profile span{display:block;color:var(--muted);font-size:10px;margin-top:3px}
.volunteer-mission{border:1px solid var(--line);background:rgba(255,255,255,.025);border-radius:13px;padding:12px;margin-top:9px}
.volunteer-mission-top{display:flex;justify-content:space-between;gap:10px;align-items:center}
.volunteer-mission h4{margin:0;font-size:13px}.volunteer-mission p{margin:6px 0 0;color:var(--muted);font-size:10px;line-height:1.45}
.volunteer-mission-time{font-size:10px;font-weight:800;white-space:nowrap}
.volunteer-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:11px}.volunteer-actions .btn{flex:1}
.volunteer-empty{padding:18px;text-align:center;color:var(--muted);border:1px dashed var(--line);border-radius:13px;font-size:11px}
.day-alerts{display:grid;gap:8px;margin:12px 0}.day-alert{display:flex;gap:9px;align-items:flex-start;border:1px solid var(--line);border-radius:12px;padding:10px 11px;background:var(--panel-2)}
.day-alert strong{display:block;font-size:11px}.day-alert span{display:block;font-size:9px;color:var(--muted);margin-top:2px;line-height:1.4}
.day-alert.danger{border-color:rgba(255,92,114,.32);background:rgba(255,92,114,.055)}.day-alert.warning{border-color:rgba(255,190,70,.28);background:rgba(255,190,70,.045)}
.run-actions{display:flex;gap:6px;justify-content:flex-end;flex-wrap:wrap}.run-actions .btn{padding:6px 8px;font-size:9px}
.volunteer-selector{min-width:180px;max-width:260px}
.volunteer-brief{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:12px}.volunteer-brief .card{padding:12px}.volunteer-brief small{display:block;color:var(--muted);font-size:9px;text-transform:uppercase}.volunteer-brief b{display:block;margin-top:4px;font-size:12px}
@media(max-width:900px){.volunteer-shell{grid-template-columns:1fr}.volunteer-kpis{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.volunteer-kpis,.volunteer-brief{grid-template-columns:1fr 1fr}.volunteer-view-head{flex-direction:column}.volunteer-selector{width:100%;max-width:none}.volunteer-actions{display:grid;grid-template-columns:1fr 1fr}.volunteer-actions .btn{width:100%}}



/* === Centre bénévoles partagé === */
.vol-admin-toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.vol-admin-toolbar select{min-width:220px}
.vol-admin-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr);gap:16px;margin-top:16px}
.vol-admin-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:14px 0 16px}
.vol-admin-kpi{padding:13px;border:1px solid var(--line);background:var(--panel-2);border-radius:13px}.vol-admin-kpi small{display:block;color:var(--muted);font-size:9px;text-transform:uppercase;letter-spacing:.07em}.vol-admin-kpi strong{display:block;font-size:20px;margin-top:5px}
.vol-feed{display:flex;flex-direction:column;gap:9px;max-height:430px;overflow:auto;padding-right:4px}.vol-msg{border:1px solid var(--line);border-radius:12px;padding:10px 11px;background:rgba(255,255,255,.025)}.vol-msg-top{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:5px}.vol-msg-top b{font-size:11px}.vol-msg-top span{font-size:9px;color:var(--muted)}.vol-msg p{margin:0;font-size:11px;line-height:1.45;white-space:pre-wrap}.vol-msg.aide{border-color:rgba(255,92,114,.35);background:rgba(255,92,114,.05)}.vol-msg.info{border-color:rgba(77,163,255,.35);background:rgba(77,163,255,.05)}
.vol-compose{display:grid;grid-template-columns:160px 1fr auto;gap:8px;margin-top:12px}.vol-compose textarea{min-height:42px;resize:vertical}
.coverage-badge{display:inline-flex;align-items:center;gap:5px;font-size:10px;font-weight:800}.coverage-badge.ok{color:#8ee7ae}.coverage-badge.warn{color:#ffd166}.coverage-badge.full{color:#7fc3ff}
.vol-access-note{font-size:10px;color:var(--muted);line-height:1.5;margin:0 0 10px}.vol-portal-link{display:inline-flex;align-items:center;gap:7px;text-decoration:none}
@media(max-width:1050px){.vol-admin-grid{grid-template-columns:1fr}.vol-admin-kpis{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.vol-admin-kpis{grid-template-columns:1fr 1fr}.vol-compose{grid-template-columns:1fr}.vol-admin-toolbar select{min-width:0;width:100%}}



/* === Compatibility layer: Clean V1 logic rendered with the original HOCKLINES Manager UI === */
.main{min-width:0;padding:0}.content{padding:28px 30px 48px}.status{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--muted);padding:7px 10px;border:1px solid var(--line);border-radius:999px;background:var(--panel)}
.status .dot{width:8px;height:8px;border-radius:50%;background:#777;margin:0;flex:0 0 auto}.status .dot.ok{background:var(--success);box-shadow:0 0 0 3px rgba(57,207,148,.10)}.status .dot.bad{background:var(--danger)}
#globalNotice{margin-bottom:14px}.notice{padding:11px 13px;border-radius:11px;border:1px solid rgba(255,92,114,.35);background:rgba(255,92,114,.08);color:#ff9dab;font-size:12px;font-weight:700}.notice.ok{border-color:rgba(57,207,148,.30);background:rgba(57,207,148,.08);color:#7cecc8}.notice.bad{border-color:rgba(255,92,114,.35);background:rgba(255,92,114,.08);color:#ff9dab}
.page-head .actions,.quick-actions{display:flex;gap:8px;flex-wrap:wrap}.toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.toolbar select,.toolbar input{min-width:220px;border:1px solid var(--line);background:#0b0b0d;color:#fff;border-radius:11px;padding:10px 12px;outline:none}.toolbar select:focus,.toolbar input:focus{border-color:#a80d2b;box-shadow:0 0 0 3px rgba(190,14,47,.09)}
.kpi{padding:19px}.kpi small{display:block;color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.07em;font-weight:800}.kpi strong{display:block;font-size:27px;font-weight:900;margin-top:10px}.stats .kpi{min-height:120px}
.section-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 0 14px}.section-head h3{font-size:15px;margin:0}.section-head + .table-wrap{margin-top:0}
.btn.danger{background:rgba(255,92,114,.08);border-color:rgba(255,92,114,.28);color:#ff9dab}.btn.danger:hover{border-color:rgba(255,92,114,.55)}
.badge.ok{background:rgba(58,210,159,.12);color:#7cecc8}.badge.warn{background:rgba(255,184,77,.12);color:#ffd087}.muted{color:var(--muted);font-size:11px}
.settings{max-width:820px}.settings .field{margin-bottom:13px}.settings p{line-height:1.55}.footer{color:#68707f;font-size:10px;margin:26px 2px 0}
.vol-admin-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:14px 0 16px}.vol-admin-kpis .kpi{padding:13px;border:1px solid var(--line);background:var(--panel-2);border-radius:13px}.vol-admin-kpis .kpi small{font-size:9px}.vol-admin-kpis .kpi strong{font-size:20px;margin-top:5px}
.vol-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr);gap:16px;margin-top:16px}.vol-column>.card+.card{margin-top:16px}.message{border:1px solid var(--line);background:var(--panel-2);border-radius:12px;padding:11px;margin:8px 0;font-size:12px}.message small{color:var(--muted)}.linkbox{word-break:break-all;background:#0b0b0d;border:1px dashed var(--line);padding:10px;border-radius:10px;font-size:11px;color:#cbd4e4}
.mobile-toggle{display:none}.portal-card{padding:20px}.topbar .btn.primary{white-space:nowrap}
@media(max-width:1050px){.vol-grid{grid-template-columns:1fr}.vol-admin-kpis{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){.topbar{padding:0 18px}.content{padding:22px 18px 42px}}
@media(max-width:760px){.mobile-toggle{display:inline-grid}.top-actions .status{display:none}.content{padding:18px 14px 38px}.page-head{align-items:flex-start;flex-direction:column}.vol-admin-kpis{grid-template-columns:1fr 1fr}.toolbar select{min-width:0;width:100%}}

/* V6 — messagerie administrateur alignée sur l'expérience bénévole */
.admin-chat-card{display:flex;flex-direction:column;min-height:520px;max-height:720px}
.admin-chat-card .panel-title{flex:0 0 auto}
.admin-chat-head{display:flex;align-items:center;gap:10px;padding:10px 12px;margin:-2px 0 12px;border:1px solid var(--line);border-radius:14px;background:#121216}
.admin-chat-avatar{width:36px;height:36px;flex:0 0 36px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#d2143a,#8f0b28);font-weight:1000;color:#fff}
.admin-chat-head b{display:block;font-size:13px}.admin-chat-head small{display:block;color:var(--muted);font-size:10px;margin-top:2px}
.admin-messages{display:flex;flex-direction:column;gap:9px;min-height:260px;max-height:470px;overflow:auto;overscroll-behavior:contain;padding:4px 2px 8px;scrollbar-width:thin}
.chat-row{display:flex;align-items:flex-end;gap:7px}.chat-row.admin{justify-content:flex-end}.chat-row.volunteer{justify-content:flex-start}
.chat-bubble{max-width:min(82%,560px);padding:10px 12px;border-radius:15px;border:1px solid var(--line);background:#151519;box-shadow:0 6px 18px rgba(0,0,0,.14)}
.chat-row.admin .chat-bubble{background:linear-gradient(135deg,#8f0b28,#c81438);border-color:rgba(255,255,255,.08);border-bottom-right-radius:5px}
.chat-row.volunteer .chat-bubble{border-bottom-left-radius:5px}
.chat-meta{display:flex;align-items:center;gap:7px;margin-bottom:4px;font-size:10px;color:var(--muted)}
.chat-row.admin .chat-meta{color:#ffd8df}.chat-author{font-weight:900;color:#fff}.chat-text{font-size:13px;line-height:1.45;white-space:pre-wrap;overflow-wrap:anywhere}
.chat-tools{display:flex;justify-content:flex-end;margin-top:6px}.chat-delete{border:0;background:transparent;color:rgba(255,255,255,.68);font-size:10px;padding:2px 0}.chat-row.volunteer .chat-delete{color:var(--muted)}.chat-delete:hover{color:#fff;text-decoration:underline}
.admin-compose{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:end;padding-top:10px;border-top:1px solid var(--line)}
.admin-compose textarea{resize:none;min-height:46px;max-height:128px;background:#0b0b0d;border:1px solid var(--line);color:#fff;border-radius:14px;padding:12px 13px;font-size:14px;line-height:1.4;outline:none;overflow:auto}
.admin-compose textarea:focus{border-color:#773043;box-shadow:0 0 0 3px rgba(190,14,47,.10)}
.admin-compose .btn{min-height:46px}.admin-chat-hint{font-size:10px;color:var(--muted);margin-top:6px;text-align:right}
@media(max-width:900px){.admin-chat-card{min-height:470px;max-height:none}.admin-messages{max-height:50vh}.admin-chat-head small{display:none}}
@media(max-width:560px){.admin-compose{grid-template-columns:1fr}.admin-compose .btn{width:100%}.chat-bubble{max-width:92%}.admin-chat-hint{display:none}}

/* === V7 Saison & fiches contacts === */
.season-list{display:grid;gap:16px}.season-card{background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.018));border:1px solid var(--line);border-radius:20px;padding:18px;box-shadow:0 14px 36px rgba(0,0,0,.14)}.season-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.season-tags{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:7px}.season-card h3{margin:0;font-size:20px}.season-meta{margin-top:6px;color:var(--muted);font-size:12px;line-height:1.45}.season-cover{min-width:86px;text-align:center;border:1px solid var(--line);border-radius:15px;padding:9px 12px;background:rgba(255,255,255,.025)}.season-cover strong{display:block;font-size:24px;line-height:1}.season-cover span{display:block;margin-top:4px;font-size:10px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:900}.season-cover.warn strong{color:#fbbf24}.season-cover.ok strong{color:#4ade80}.coverage-line{display:grid;grid-template-columns:1fr auto;align-items:center;gap:10px;margin:14px 0}.coverage-line>div{height:8px;border-radius:999px;background:#25262d;overflow:hidden}.coverage-line>div>span{display:block;height:100%;background:linear-gradient(90deg,#d7193f,#ff4d6d);border-radius:inherit}.coverage-line small{color:var(--muted);font-size:11px;font-weight:800}.season-needs{display:grid;gap:8px}.season-need{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid rgba(255,255,255,.06);border-radius:14px;padding:11px 12px;background:rgba(0,0,0,.12)}.season-need>div{display:grid;gap:2px}.season-need b{font-size:12px;color:#fff}.season-need span{font-size:13px}.season-need small{color:var(--muted);font-size:10px}.season-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.empty.compact{padding:12px}
.contact-grid{display:grid;gap:12px}.contact-card{border:1px solid var(--line);border-radius:18px;padding:14px;background:linear-gradient(180deg,#17171b,#121216)}.contact-card-top{display:grid;grid-template-columns:auto 1fr auto;gap:11px;align-items:start}.contact-avatar{width:42px;height:42px;border-radius:14px;background:#24242a;color:#fff;display:grid;place-items:center;font-weight:1000;border:1px solid #34353c}.contact-main h4{margin:0 0 3px;font-size:15px}.contact-main small{color:var(--muted);font-size:10px}.contact-lines{display:grid;gap:4px;margin-top:8px}.contact-lines a{color:#e5e7eb;text-decoration:none;font-size:12px;word-break:break-word}.contact-lines a:hover{text-decoration:underline}.missing-contact{color:#fca5a5;font-size:11px}.contact-assignments{display:grid;gap:7px;margin-top:12px;padding-top:11px;border-top:1px solid rgba(255,255,255,.06)}.contact-assignment{display:grid;gap:2px}.contact-assignment b{font-size:12px}.contact-assignment span{font-size:10px;color:var(--muted);line-height:1.45}.contact-actions{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}.contact-actions .btn[disabled]{opacity:.4;pointer-events:none}.row-actions{display:flex;gap:6px;flex-wrap:wrap}
@media(max-width:760px){.season-card{padding:14px;border-radius:16px}.season-card-head{display:block}.season-cover{margin-top:11px;width:max-content;display:flex;gap:7px;align-items:baseline}.season-cover strong,.season-cover span{display:inline}.coverage-line{grid-template-columns:1fr}.season-actions .btn{flex:1 1 45%}.contact-card-top{grid-template-columns:auto 1fr}.contact-card-top>.btn{grid-column:1/-1;width:100%}.contact-actions .btn{flex:1 1 42%}}
