/* ProjectTracker SaaS — styles */
:root{
  color-scheme:light;
  --bg:#f6f7fb; --surface:#fff; --border:#e4e7ef; --border2:#d4d8e3;
  --text:#1f2430; --muted:#676e7f; --faint:#9aa0ad;
  --accent:#5b5bf0; --accent-soft:#ececfe;
  --done:#00c875; --progress:#fdab3d; --stuck:#e2445c; --review:#a25ddc;
  --p-high:#ff642e;
  --shadow:0 1px 3px rgba(20,24,40,.07),0 6px 18px rgba(20,24,40,.05);
  --r:10px;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Inter,Arial,sans-serif;background:var(--bg);color:var(--text);font-size:14px;overflow:hidden}

.logo{display:flex;align-items:center;gap:9px;font-weight:700;font-size:17px}
.logo .dot{width:26px;height:26px;border-radius:8px;background:linear-gradient(135deg,#5b5bf0,#a25ddc);display:flex;align-items:center;justify-content:center;color:#fff;font-size:13px;font-weight:800;flex:0 0 26px}
.spacer{flex:1}

/* ===== auth ===== */
#auth{display:none;height:100vh;align-items:center;justify-content:center;background:linear-gradient(160deg,#f6f7fb 60%,#ececfe)}
.acard{background:#fff;border-radius:16px;box-shadow:var(--shadow);padding:34px;width:380px;max-width:92vw;display:flex;flex-direction:column;gap:11px}
.asub{text-align:center;color:var(--muted);font-size:13px;margin-bottom:8px}
.atabs{display:flex;border-bottom:1.5px solid var(--border);margin-bottom:6px}
.atabs span{flex:1;text-align:center;padding:9px;font-weight:700;font-size:13px;color:var(--muted);cursor:pointer;border-bottom:2.5px solid transparent}
.atabs span.on{color:var(--accent);border-bottom-color:var(--accent)}
.acard input{padding:10px 12px;border:1px solid var(--border2);border-radius:9px;font-size:14px;outline:none}
.acard input:focus{border-color:var(--accent)}
.aerr{font-size:12.5px;min-height:16px;color:var(--stuck)}
.ahint{text-align:center;color:var(--faint);font-size:11.5px}

/* ===== app layout ===== */
#app{display:none;height:100vh;position:relative}
#sidebar{width:248px;flex:0 0 248px;background:#23253a;color:#d8daea;display:flex;flex-direction:column;transition:width .18s ease,flex-basis .18s ease;overflow:hidden}
.sb-toggle{position:absolute;top:14px;left:208px;width:30px;height:30px;border-radius:8px;
  border:1px solid transparent;background:transparent;color:#aeb1cc;
  cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:50;
  transition:left .18s ease,background .14s ease,color .14s ease;padding:0}
.sb-toggle:hover{color:#fff;background:rgba(255,255,255,.08)}
body.sb-collapsed #sidebar{width:60px;flex-basis:60px;min-width:60px}
body.sb-collapsed .sb-toggle{left:15px}
body.sb-collapsed .sb-label{display:none}
body.sb-collapsed .sb-ws{padding:14px 8px 10px;display:flex;flex-direction:column;align-items:center}
body.sb-collapsed .sb-ws .logo{justify-content:center;margin-bottom:6px}
body.sb-collapsed .modebadge,body.sb-collapsed .wssel{display:none}
body.sb-collapsed .sb-scroll{padding:10px 6px}
body.sb-collapsed .sb-link{justify-content:center;padding:9px 4px}
body.sb-collapsed .sb-proj-head{justify-content:center;padding:8px 4px;gap:0}
body.sb-collapsed .sb-proj-head .chev,body.sb-collapsed .sb-proj-head .sbcnt,body.sb-collapsed .sb-proj-head .sbhealth{display:none}
body.sb-collapsed .sb-trk{justify-content:center;padding:8px 4px;margin-left:0}
body.sb-collapsed .sb-trk .ico{font-size:15px}
body.sb-collapsed .sb-add{display:none}
body.sb-collapsed .sb-foot{display:flex;flex-direction:column;align-items:center}
.sb-ws{padding:14px 14px 10px;border-bottom:1px solid #34365230}
.sb-ws .logo{color:#fff;margin-bottom:10px}
.wssel{width:100%;padding:7px 9px;border-radius:8px;border:1px solid #3a3d5c;background:#2c2e48;color:#fff;font-size:13px;font-weight:600;outline:none;cursor:pointer}
.modebadge{margin-top:8px;font-size:10.5px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;color:#9fa3c8}
.modebadge.cloud{color:#7ee2b8}
.sb-scroll{flex:1;overflow-y:auto;padding:10px 8px}
.sb-proj{margin-bottom:10px}
.sb-proj-head{display:flex;align-items:center;gap:7px;padding:7px 8px;font-weight:700;font-size:12.5px;color:#fff;text-transform:uppercase;letter-spacing:.4px}
.pdot{width:9px;height:9px;border-radius:3px;flex:0 0 9px}
.pn{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pact{opacity:0;cursor:pointer;font-size:11px;color:#9fa3c8;padding:2px}
.sb-proj-head:hover .pact{opacity:1}
.pact:hover{color:#fff}
.sb-trk{padding:7px 10px 7px 22px;border-radius:7px;cursor:pointer;font-size:13px;display:flex;gap:7px;align-items:center;color:#c3c6df;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sb-trk:hover{background:#2c2e48;color:#fff}
.sb-trk.on{background:var(--accent);color:#fff;font-weight:600}
.sb-add{padding:6px 10px 6px 22px;font-size:12px;color:#8a8eb5;cursor:pointer;border-radius:7px}
.sb-add:hover{color:#fff;background:#2c2e48}
.sb-add.big{margin-top:6px;padding:8px 12px;border:1.5px dashed #3a3d5c;text-align:center;border-radius:9px}
.sb-foot{border-top:1px solid #34365230;padding:10px 8px}
.sb-link{padding:8px 12px;border-radius:7px;cursor:pointer;font-size:13px;color:#c3c6df;display:flex;align-items:center;gap:8px}
.sb-link:hover{background:#2c2e48;color:#fff}
.sb-bell-cnt{margin-left:auto;background:var(--stuck);color:#fff;font-size:9.5px;font-weight:800;border-radius:9px;padding:1px 6px;min-width:16px;text-align:center}
.cnt2{margin-left:auto;background:#3a3d5c;border-radius:10px;padding:0 8px;font-size:11px}

#content{flex:1;display:flex;flex-direction:column;min-width:0}
#header{background:var(--surface);border-bottom:1px solid var(--border)}
.hrow{display:flex;align-items:center;gap:12px;padding:12px 18px 6px;flex-wrap:wrap}
.hrow h2{font-size:18px;display:flex;align-items:center;gap:8px}
.editable{cursor:pointer;border-bottom:1.5px dashed transparent}
.editable:hover{border-bottom-color:var(--accent)}
.search{position:relative}
.search input{width:210px;padding:7px 12px 7px 32px;border:1px solid var(--border2);border-radius:8px;font-size:13px;background:var(--bg);outline:none}
.search input:focus{border-color:var(--accent);background:#fff}
.search svg{position:absolute;left:9px;top:8px;opacity:.45}

.btn{border:1px solid var(--border2);background:var(--surface);color:var(--text);padding:7px 13px;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:.15s}
.btn:hover{border-color:var(--accent);color:var(--accent)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.btn.primary:hover{filter:brightness(1.08);color:#fff}
.btn.ai{background:linear-gradient(135deg,#5b5bf0,#a25ddc);border:none;color:#fff}
.btn.ai:hover{filter:brightness(1.1)}
.btn.ghost{border:none;background:transparent;color:var(--muted);padding:7px 8px}
.btn.ghost:hover{color:var(--accent)}
.btn.danger{color:var(--stuck);border-color:#f3c2cb}
.btn.danger:hover{background:var(--stuck);border-color:var(--stuck);color:#fff}
.btn.sm{padding:5px 10px;font-size:12px}
.btn.addrow{margin-top:10px}

.tabs{display:flex;gap:2px;padding:0 18px}
.tab{padding:9px 15px;font-size:13.5px;font-weight:600;color:var(--muted);cursor:pointer;border-bottom:2.5px solid transparent;user-select:none}
.tab:hover{color:var(--text)}
.tab.active{color:var(--accent);border-bottom-color:var(--accent)}
.toolbar{display:flex;align-items:center;gap:10px;padding:9px 18px;border-top:1px solid var(--border);flex-wrap:wrap}
.ctl{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--muted);font-weight:600}
.ctl select{padding:6px 8px;border:1px solid var(--border2);border-radius:7px;font-size:12.5px;background:#fff;color:var(--text);outline:none;cursor:pointer;font-weight:600;max-width:150px}
.chip{display:inline-flex;align-items:center;gap:6px;background:var(--accent-soft);color:var(--accent);border-radius:20px;padding:4px 11px;font-size:12px;font-weight:700}
.chip b{cursor:pointer;opacity:.65}
.chip b:hover{opacity:1}
.qchip{padding:5px 12px;border-radius:20px;font-size:12px;font-weight:700;cursor:pointer;border:1.5px solid var(--border2);color:var(--muted);background:#fff;transition:.15s;user-select:none}
.qchip:hover{border-color:var(--accent);color:var(--accent)}
.qchip.on{background:var(--accent);border-color:var(--accent);color:#fff}
.qchip.red.on{background:var(--stuck);border-color:var(--stuck)}
.qchip.orange.on{background:var(--p-high);border-color:var(--p-high)}
.vsep{width:1px;height:22px;background:var(--border)}

.stats{display:flex;gap:18px;align-items:center;padding:8px 18px;font-size:12.5px;color:var(--muted);background:var(--surface);border-bottom:1px solid var(--border)}
.stat b{color:var(--text);font-size:13.5px}
.stat .sw{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:5px}
.donebar{flex:1;max-width:240px;height:8px;border-radius:6px;background:var(--border);overflow:hidden}
.donebar i{display:block;height:100%;background:var(--done);border-radius:6px;transition:width .4s}

#main{flex:1;overflow:auto;padding:16px 18px}
.empty{padding:60px;text-align:center;color:var(--faint);font-size:14px}
.dim{color:var(--faint)}
.num{font-variant-numeric:tabular-nums;text-align:right;display:block}
.num-cell{text-align:right}
.num-cell .pbar{display:inline-flex;justify-content:flex-end;width:100%}
.pname{font-size:12.5px;font-weight:600}

.pill{display:inline-flex;align-items:center;justify-content:center;padding:4px 12px;border-radius:6px;font-size:11.5px;font-weight:700;color:#fff;min-width:86px;letter-spacing:.2px;cursor:pointer;white-space:nowrap}
.pill.sm{min-width:0;padding:3px 9px;font-size:11px}
.avatar{width:26px;height:26px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;color:#fff;font-size:10.5px;font-weight:800;flex:0 0 26px;vertical-align:middle}
.tag{background:#eef1f8;color:#525a6e;border-radius:5px;padding:2px 8px;font-size:11px;font-weight:600}
.pbar{width:70px;height:7px;border-radius:5px;background:var(--border);overflow:hidden;display:inline-block;vertical-align:middle}
.pbar i{display:block;height:100%;background:var(--done);border-radius:5px}
.due{font-size:12px;color:var(--muted);font-weight:600;white-space:nowrap}
.due.over{color:var(--stuck);font-weight:800}
.due.soon{color:var(--p-high)}

/* list */
.grp{margin-bottom:22px;background:var(--surface);border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden}
.grp-head{display:flex;align-items:center;gap:10px;padding:11px 16px;font-weight:800;font-size:14px;border-left:5px solid;background:#dce3f8}
.grp-head .cnt{background:rgba(0,0,0,.1);border-radius:10px;padding:1px 8px;font-weight:700;font-size:11px;color:inherit;margin-left:2px}
.lrow{display:flex;align-items:center;gap:14px;padding:9px 16px 9px 21px;border-top:1px solid var(--border);cursor:pointer}
.lrow:hover{background:#f8f9fe}
.lrow .t{flex:1;font-weight:600;min-width:160px}
.lrow .meta{display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:flex-end}
.mcell{display:inline-flex;align-items:center;gap:5px}

/* table */
table.tbl{width:100%;border-collapse:separate;border-spacing:0;background:var(--surface);border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden;font-size:13px}
.tbl th{position:sticky;top:0;background:#fafbfe;text-align:left;padding:10px 12px;font-size:11.5px;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);border-bottom:1.5px solid var(--border);cursor:pointer;user-select:none;white-space:normal;word-break:break-word;z-index:2}
.tbl th:hover{color:var(--accent)}
.tbl td{padding:8px 12px;border-bottom:1px solid var(--border);vertical-align:middle}
.tbl tr:hover td{background:#f8f9fe}
.tbl td.edit{cursor:pointer}
.tbl td.edit:hover{outline:1.5px solid var(--accent);outline-offset:-1.5px;border-radius:5px}
.tbl .title-cell{font-weight:600;cursor:pointer}
.tbl input{width:100%;padding:5px;border:1.5px solid var(--accent);border-radius:5px;font-size:13px;outline:none}
.tbl-grp td{background:#dce3f8!important;font-size:12.5px}
.rowx{color:var(--faint);cursor:pointer;font-size:12px;width:30px;text-align:center}
.rowx:hover{color:var(--stuck)}

/* board */
.board{display:flex;gap:14px;align-items:flex-start;min-height:70vh}
.col{background:#eef0f7;border-radius:12px;min-width:272px;width:272px;flex:0 0 272px;display:flex;flex-direction:column;max-height:calc(100vh - 250px)}
.col-head{padding:11px 14px;font-weight:800;font-size:13px;display:flex;align-items:center;gap:8px;border-radius:12px 12px 0 0;color:#fff}
.col-head .cnt{margin-left:auto;background:rgba(255,255,255,.3);border-radius:10px;padding:1px 9px;font-size:11.5px}
.col-body{padding:10px;display:flex;flex-direction:column;gap:9px;overflow-y:auto;flex:1;min-height:60px}
.col.dragover{outline:2.5px dashed var(--accent);outline-offset:-3px}
.card{background:#fff;border-radius:9px;padding:11px 12px;box-shadow:0 1px 2px rgba(20,24,40,.1);cursor:grab;border:1px solid transparent;transition:.13s}
.card:hover{border-color:var(--accent);box-shadow:0 4px 12px rgba(91,91,240,.15);transform:translateY(-1px)}
.card.dragging{opacity:.45}
.card .ct{font-weight:700;font-size:13px;margin-bottom:8px;line-height:1.35}
.card .crow{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.coladd{padding:7px;text-align:center;font-size:12px;color:var(--faint);cursor:pointer;border-radius:7px;border:1.5px dashed var(--border2)}
.coladd:hover{color:var(--accent);border-color:var(--accent)}

/* card / gallery view */
.cv-wrap{padding:4px 0 24px}
.cv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.cv-card{background:#fff;border-radius:12px;border:1px solid var(--border);box-shadow:var(--shadow);overflow:hidden;cursor:pointer;transition:.13s;display:flex;flex-direction:column}
.cv-card:hover{border-color:var(--accent);box-shadow:0 4px 16px rgba(91,91,240,.15);transform:translateY(-2px)}
.cv-photo{width:100%;height:120px;object-fit:cover;display:block;background:#eef0f7}
.cv-body{padding:10px 12px 12px;flex:1;display:flex;flex-direction:column;gap:6px}
.cv-title{font-weight:700;font-size:13.5px;line-height:1.35;color:var(--text)}
.cv-pills{display:flex;flex-wrap:wrap;gap:5px;align-items:center}
.cv-fields{display:flex;flex-direction:column;gap:5px;margin-top:2px}
.cv-field{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted)}
.cv-field b{color:var(--text);font-weight:500}
.cv-prog{height:5px;border-radius:3px;background:var(--border);margin-top:4px}
.cv-prog-bar{height:100%;border-radius:3px;background:var(--done)}
.cv-grp-head{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);padding:14px 0 6px;border-bottom:1.5px solid var(--border);margin-bottom:4px;cursor:pointer;user-select:none;display:flex;align-items:center;gap:6px}
.cv-grp-cnt{font-size:11px;font-weight:700;color:#fff;background:var(--accent);border-radius:8px;padding:1px 7px}

/* timeline */
.tl-wrap{background:var(--surface);border-radius:var(--r);box-shadow:var(--shadow);overflow:auto;position:relative}
.tl-inner{position:relative;min-width:100%}
.tl-months{display:flex;border-bottom:1px solid var(--border);position:sticky;top:0;background:#fafbfe;z-index:3}
.tl-month{font-size:11.5px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;padding:7px 0 7px 8px;border-right:1px solid var(--border);white-space:nowrap;overflow:hidden}
.tl-grid{position:absolute;top:0;bottom:0;border-right:1px solid #eef0f6}
.tl-today{position:absolute;top:0;bottom:0;width:2px;background:var(--stuck);z-index:2}
.tl-grp-label{font-size:12px;font-weight:800;padding:10px 12px 4px;border-left:4px solid;background:#fff;position:sticky;left:0;z-index:1;width:fit-content}
.tl-row{position:relative;height:34px}
.tl-bar{position:absolute;top:4px;height:26px;border-radius:7px;color:#fff;font-size:11.5px;font-weight:700;display:flex;align-items:center;padding:0 10px;white-space:nowrap;overflow:hidden;cursor:pointer;box-shadow:0 1px 3px rgba(20,24,40,.18)}
.tl-bar:hover{filter:brightness(1.06);z-index:2}
.tl-unsched{padding:10px 14px;color:var(--faint);font-size:12px;border-top:1px solid var(--border)}

/* modal */
.overlay{position:fixed;inset:0;background:rgba(20,24,40,.45);display:flex;align-items:center;justify-content:center;z-index:50}
.modal{background:#fff;border-radius:14px;width:560px;max-width:94vw;max-height:90vh;overflow:auto;padding:24px;box-shadow:0 24px 60px rgba(20,24,40,.3)}
.modal h3{font-size:17px;margin-bottom:18px}
.frow{display:flex;gap:12px;margin-bottom:13px}
.fcol{flex:1;display:flex;flex-direction:column;gap:5px;min-width:0}
.fcol label{font-size:11.5px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}
.fcol input,.fcol select,.fcol textarea{padding:8px 10px;border:1px solid var(--border2);border-radius:8px;font-size:13.5px;outline:none;font-family:inherit;background:#fff;color:var(--text);width:100%}
.fcol input:focus,.fcol select:focus{border-color:var(--accent)}
.macts{display:flex;gap:10px;margin-top:18px;justify-content:flex-end}
.macts .danger{margin-right:auto}
.blab{font-size:11.5px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;display:block;margin:6px 0}
.menu .mitem{padding:11px 13px;border-radius:9px;cursor:pointer;font-weight:600;font-size:13.5px}
.menu .mitem:hover{background:var(--accent-soft);color:var(--accent)}
.menu .mitem.danger:hover{background:#fdecef;color:var(--stuck)}

/* tracker settings panel */
.ts-head{display:flex;align-items:flex-start;gap:12px;margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid var(--border)}
.ts-icon-btn{font-size:28px;width:52px;height:52px;border:1.5px solid var(--border2);border-radius:12px;background:var(--bg);cursor:pointer;display:flex;align-items:center;justify-content:center;flex:0 0 52px;transition:.13s}
.ts-icon-btn:hover{border-color:var(--accent);background:var(--accent-soft)}
.ts-title-wrap{flex:1;min-width:0}
.ts-name-inp{width:100%;font-size:18px;font-weight:800;border:none;outline:none;background:transparent;color:var(--text);padding:2px 0;border-bottom:2px solid transparent;font-family:inherit}
.ts-name-inp:focus{border-bottom-color:var(--accent)}
.ts-meta{display:flex;align-items:center;gap:10px;margin-top:6px}
.ts-sel{padding:4px 8px;border:1px solid var(--border2);border-radius:7px;font-size:12px;font-weight:600;background:var(--bg);cursor:pointer}
.ts-cat{font-size:12px}
.ts-icon-grid{flex-wrap:wrap;gap:6px;padding:10px;background:var(--bg);border-radius:9px;margin-bottom:12px;border:1px solid var(--border)}
.ts-ic-opt{font-size:22px;cursor:pointer;width:38px;height:38px;display:flex;align-items:center;justify-content:center;border-radius:8px;border:1.5px solid transparent}
.ts-ic-opt:hover{background:var(--accent-soft);border-color:var(--accent)}
.ts-section{margin-bottom:14px}
.ts-label{font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.6px;color:var(--faint);margin-bottom:5px;padding:0 2px}
.ts-row{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:9px;cursor:pointer;font-size:13.5px;font-weight:500;transition:.12s}
.ts-row:hover{background:var(--accent-soft);color:var(--accent)}
.ts-row.danger:hover{background:#fdecef;color:var(--stuck)}
.ts-row-ic{font-size:16px;width:22px;text-align:center;flex:0 0 22px}
.ts-arr{margin-left:auto;color:var(--faint);font-size:16px}

/* tracker builder */
.brow{display:flex;align-items:flex-start;gap:8px;padding:8px;border:1px solid var(--border);border-radius:9px;margin-bottom:7px;flex-wrap:wrap;background:#fafbfe}
.bdrag{cursor:grab;color:#c0c4cf;font-size:18px;padding:6px 4px;line-height:1;user-select:none;touch-action:none}
.bdrag:hover{color:var(--accent);background:rgba(91,91,240,.08);border-radius:5px}
.brow>.bdrag{align-self:center}
.bdup{cursor:pointer;color:var(--faint);padding:6px;font-size:15px}
.bdup:hover{color:var(--accent)}
.brow.drag-src{opacity:.4}
.brow.drag-over{border-color:var(--accent);background:#f0f0ff}
.blabel{flex:1;min-width:120px;padding:6px 9px;border:1px solid var(--border2);border-radius:7px;font-size:13px;outline:none}
.brow select{padding:6px;border:1px solid var(--border2);border-radius:7px;font-size:12.5px}
.bdel{cursor:pointer;color:var(--faint);padding:6px}
.bdel:hover{color:var(--stuck)}
.bopts{flex-basis:100%;display:flex;gap:6px;flex-wrap:wrap;padding-left:20px}
.bopt{display:inline-flex;align-items:center;gap:4px;border:1px solid var(--border);border-radius:7px;padding:3px 6px;background:#fff}
.bopt.drag-src{opacity:.4}
.bopt.drag-over{border-color:var(--accent);background:#f0f0ff}
.bopt .bdrag{font-size:12px;padding:2px 1px}
.bopt input[type=color]{width:22px;height:22px;border:none;padding:0;background:none;cursor:pointer}
.bopt input:not([type=color]){border:none;outline:none;font-size:12px;width:90px}
.bopt b{cursor:pointer;color:var(--faint);font-size:11px}
.bopt b:hover{color:var(--stuck)}
.baddopt{font-size:12px;color:var(--accent);cursor:pointer;align-self:center;font-weight:700}

/* template gallery */
.tgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.tcard{border:1.5px solid var(--border);border-radius:11px;padding:13px;display:flex;flex-direction:column;gap:6px;transition:.15s}
.tcard:hover{border-color:var(--accent);box-shadow:var(--shadow)}
.temoji{font-size:22px}
.tcard b{font-size:13px}
.tcard p{font-size:11px;color:var(--muted);line-height:1.4;flex:1}
.tfields{display:flex;flex-wrap:wrap;gap:4px}
.tfields span{font-size:10px;background:#eef1f8;border-radius:4px;padding:1px 6px;color:#525a6e}
.tacts{display:flex;gap:5px;margin-top:4px}

/* members */
.mlist{display:flex;flex-direction:column;gap:4px;margin-bottom:10px}
.mrow{display:flex;align-items:center;gap:10px;padding:8px;border-radius:9px}
.mrow:hover{background:#f8f9fe}
.mn{flex:1;font-weight:600;font-size:13px}
.mn small{display:block;color:var(--faint);font-weight:500;font-size:11px}
.mrow select{padding:5px 8px;border:1px solid var(--border2);border-radius:7px;font-size:12px}
.rolebadge{font-size:11px;font-weight:800;text-transform:uppercase;color:var(--accent);background:var(--accent-soft);padding:3px 9px;border-radius:10px}

/* AI drawer */
.drawer{position:fixed;top:0;right:-400px;width:390px;max-width:95vw;height:100%;background:#fff;box-shadow:-8px 0 30px rgba(20,24,40,.14);z-index:60;display:flex;flex-direction:column;transition:right .25s ease}
.drawer.open{right:0}
.d-head{padding:15px 18px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px}
.d-head .ai-ic{width:30px;height:30px;border-radius:9px;background:linear-gradient(135deg,#5b5bf0,#a25ddc);display:flex;align-items:center;justify-content:center;color:#fff;font-size:15px}
.d-head b{font-size:14.5px}
.d-head small{display:block;color:var(--faint);font-size:11.5px}
.d-head .x{margin-left:auto;cursor:pointer;color:var(--faint);font-size:20px;border:none;background:none;padding:4px}
.d-msgs{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:11px}
.msg{max-width:88%;padding:9px 13px;border-radius:13px;font-size:13px;line-height:1.5;white-space:pre-wrap}
.msg.user{align-self:flex-end;background:var(--accent);color:#fff;border-bottom-right-radius:4px}
.msg.bot{align-self:flex-start;background:#f1f2f8;border-bottom-left-radius:4px}
.msg.bot.think{color:var(--faint);font-style:italic}
.d-sugg{display:flex;flex-wrap:wrap;gap:6px;padding:0 16px 8px}
.d-sugg span{font-size:11.5px;background:var(--accent-soft);color:var(--accent);padding:4px 10px;border-radius:14px;cursor:pointer;font-weight:600}
.d-sugg span:hover{background:var(--accent);color:#fff}
.d-in{display:flex;gap:8px;padding:13px 16px;border-top:1px solid var(--border)}
.d-in textarea{flex:1;border:1px solid var(--border2);border-radius:10px;padding:9px 12px;font-size:13px;font-family:inherit;resize:none;height:42px;outline:none}
.d-in textarea:focus{border-color:var(--accent)}
.d-in button{background:var(--accent);color:#fff;border:none;border-radius:10px;width:42px;cursor:pointer;font-size:16px}

.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(80px);background:#1f2430;color:#fff;padding:10px 20px;border-radius:10px;font-size:13px;font-weight:600;z-index:80;transition:.3s;opacity:0;max-width:90vw}
.toast.show{transform:translateX(-50%);opacity:1}
.toast-act{margin-left:10px;background:rgba(255,255,255,.16);color:#fff;border:none;border-radius:6px;padding:4px 10px;font-size:12px;font-weight:800;cursor:pointer}
.toast-act:hover{background:rgba(255,255,255,.28)}

@media (max-width:820px){
  #sidebar{width:200px;flex-basis:200px}
  .search input{width:130px}
  .col{min-width:240px;width:240px;flex-basis:240px}
}


/* ===== v2: pages ===== */
.crumb{font-size:12.5px;font-weight:700;color:var(--muted);cursor:pointer;white-space:nowrap}
.crumb:hover{color:var(--accent)}
.rb2{margin-left:auto;font-size:9.5px;font-weight:800;text-transform:uppercase;color:#9fa3c8;letter-spacing:.3px}
.sb-link.on{background:#2c2e48;color:#fff}
.sb-projlink{cursor:pointer;border-radius:7px}
.sb-projlink:hover{background:#2c2e48}
.danger2{color:var(--stuck)}

/* home */
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px;margin-top:6px}
.pcard{background:var(--surface);border-radius:12px;box-shadow:var(--shadow);cursor:pointer;overflow:hidden;border:1.5px solid transparent;transition:.15s}
.pcard:hover{border-color:var(--accent);transform:translateY(-2px)}
.pbar2{height:6px}
.pcard-body{padding:14px}
.pcard-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.pcard-top b{font-size:15px}
.pcard-body p{font-size:12.5px;color:var(--muted);line-height:1.5;margin:8px 0 12px;min-height:36px}
.pcard-foot{display:flex;align-items:center;justify-content:space-between}
.avatars{display:flex}
.avatars .avatar{margin-right:-7px;border:2px solid #fff}
.favrow{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px;margin-top:6px}
.favchip{background:var(--surface);border:1.5px solid var(--border2);border-radius:20px;padding:6px 14px;font-size:13px;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:7px;box-shadow:var(--shadow)}
.favchip:hover{border-color:var(--accent);color:var(--accent)}
.tpdot{width:9px;height:9px;border-radius:50%;display:inline-block}

/* project page */
.prow{display:flex;gap:16px;flex-wrap:wrap;align-items:flex-start}
.panel{background:var(--surface);border-radius:12px;box-shadow:var(--shadow);padding:16px}
.pdesc{font-size:13.5px;color:var(--muted);line-height:1.6}
.tkgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:11px;margin-top:6px}
.tkcard{border:1.5px solid var(--border);border-radius:11px;padding:12px;display:flex;flex-direction:column;gap:9px;transition:.15s}
.tkcard:hover{border-color:var(--accent);box-shadow:var(--shadow)}
.tkrow1{display:flex;align-items:center;gap:8px}
.tkicon{font-size:18px}
.tkname{font-size:13.5px;cursor:pointer;flex:1}
.tkname:hover{color:var(--accent)}
.tkrow2{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.tkrow3{display:flex;gap:6px}
.fav{cursor:pointer;color:#d4d8e3;font-size:17px;user-select:none;transition:.15s}
.fav:hover{color:#fdab3d;transform:scale(1.15)}
.fav.on{color:#fdab3d}
.fav.big{font-size:21px}
.pill.static{cursor:default}

/* ===== v3 UX polish ===== */
.tblwrap{overflow:auto;max-height:calc(100vh - 205px);border-radius:var(--r);box-shadow:var(--shadow);background:var(--surface)}
.tbl.fixed{table-layout:fixed;box-shadow:none;border-radius:0;width:100%}
.tbl.fixed td{overflow:hidden;white-space:nowrap;height:42px}
.tbl.fixed td b.num{white-space:normal;word-break:break-all}
/* wrap-text mode */
.tbl.wrap-text td{white-space:normal!important;word-break:break-word;height:auto;min-height:42px}
.tbl.wrap-text .title-cell{white-space:normal!important}
/* frozen first column */
.tbl.fixed th:first-child{position:sticky;left:0;z-index:4;background:#fafbfe;border-right:1px solid var(--border)}
.tbl.fixed td.title-cell{position:sticky;left:0;z-index:1;background:var(--surface);border-right:1px solid var(--border2,#e8ebf4)}
.tbl.fixed tr:hover td.title-cell{background:#f8f9fe}
.tbl.fixed tr.row-selected td.title-cell{background:#eef0fb}
.tbl td.editing{padding:5px 7px}
.tbl td.editing:hover{outline:none}
.tbl .edit{position:relative}
.tbl .edit::after{content:"✎";position:absolute;right:7px;top:50%;transform:translateY(-50%);font-size:10px;color:var(--faint);opacity:0;transition:.12s;pointer-events:none}
.tbl .edit:hover::after{opacity:.75}
.tbl input{height:30px;padding:4px 8px;border-width:1.5px;border-radius:6px}
.pill{user-select:none}
.pill.dd{cursor:pointer}
.pill .caret{font-style:normal;font-size:8.5px;opacity:.85;margin-left:5px}
/* fullscreen mode */
body.fs-mode #sidebar,body.fs-mode .sb-toggle{display:none!important}
body.fs-mode #app{grid-template-columns:1fr}
body.fs-mode .tblwrap{max-height:calc(100vh - 205px)}
.ddpop{position:fixed;z-index:90;background:#fff;border-radius:11px;box-shadow:0 10px 34px rgba(20,24,40,.22);border:1px solid var(--border);padding:6px;min-width:170px;max-height:320px;overflow:auto;animation:ddin .13s ease}
@keyframes ddin{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:none}}
.ddopt{display:flex;align-items:center;gap:9px;padding:8px 11px;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap}
.ddopt:hover{background:var(--accent-soft)}
.ddopt.sel{background:#f4f5fb}
.ddopt b{margin-left:auto;color:var(--accent)}
.ddopt.clear{color:var(--faint);justify-content:center}
.ddsw{width:13px;height:13px;border-radius:4px;flex:0 0 13px}
.ddlab{flex:1}
/* list view aligned columns */
.lrow .mcell{justify-content:flex-start}
.mc-select{width:122px}
.mc-person{width:132px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mc-date{width:86px}
.mc-number{width:64px}
.mc-progress{width:122px;white-space:nowrap}
.mc-tags{width:140px;overflow:hidden;white-space:nowrap}
@media (max-width:980px){.mc-tags,.mc-number{display:none}}

/* ===== R1: photos ===== */
.phwrap{display:inline-flex;align-items:center;gap:3px;cursor:pointer}
.phthumb{width:30px;height:30px;border-radius:6px;object-fit:cover;border:1.5px solid var(--border);vertical-align:middle}
.phmore{font-size:11px;font-weight:800;color:var(--muted);background:#eef1f8;border-radius:6px;padding:6px 6px}
.phadd{cursor:pointer;color:var(--faint);font-size:12px;font-weight:700;border:1.5px dashed var(--border2);border-radius:6px;padding:3px 8px}
.phadd:hover{color:var(--accent);border-color:var(--accent)}
.phinline{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.lbgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;margin-bottom:12px}
.lbitem{position:relative;border-radius:10px;overflow:hidden;border:1px solid var(--border)}
.lbitem img{width:100%;height:130px;object-fit:cover;display:block}
.lbitem b{position:absolute;top:5px;right:5px;background:rgba(20,24,40,.65);color:#fff;border-radius:6px;padding:2px 7px;cursor:pointer;font-size:11px}
.lbitem b:hover{background:var(--stuck)}
.phdrop{border:2px dashed var(--border2);border-radius:10px;padding:16px;text-align:center;color:var(--muted);font-size:13px;font-weight:600;cursor:pointer;transition:.15s}
.phdrop:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-soft)}

/* ===== R1: comments & activity ===== */
.cmt-tabs{display:flex;gap:2px;border-bottom:1.5px solid var(--border);margin-top:16px}
.cmt-tabs span{padding:8px 14px;font-size:12.5px;font-weight:700;color:var(--muted);cursor:pointer;border-bottom:2.5px solid transparent}
.cmt-tabs span.on{color:var(--accent);border-bottom-color:var(--accent)}
.cmtlist{max-height:220px;overflow-y:auto;padding:10px 2px;display:flex;flex-direction:column;gap:10px}
.cmt{display:flex;gap:9px;align-items:flex-start}
.cmtb{flex:1;min-width:0}
.cmtb b{font-size:12.5px}
.cmtb small{color:var(--faint);margin-left:6px;font-size:11px}
.cmtb p{font-size:13px;margin-top:2px;line-height:1.45;word-break:break-word}
.cmtb .actline{color:var(--muted);font-size:12.5px}
.mention{background:var(--accent-soft);color:var(--accent);font-weight:700;border-radius:4px;padding:0 3px}
.cmtin{display:flex;gap:8px;margin-top:4px}
.cmtin input{flex:1;padding:8px 11px;border:1px solid var(--border2);border-radius:9px;font-size:13px;outline:none}
.cmtin input:focus{border-color:var(--accent)}

/* ===== R1: access modal ===== */
.extbadge{font-size:9.5px;font-weight:800;text-transform:uppercase;background:#fff3e0;color:#b26a00;border-radius:8px;padding:2px 7px;letter-spacing:.4px}
.colpick{flex-basis:100%;display:flex;flex-wrap:wrap;gap:4px 12px;padding:7px 0 2px 36px}
.colpick label{font-size:12px;color:var(--muted);display:inline-flex;align-items:center;gap:5px;cursor:pointer}
.colpick input{accent-color:var(--accent)}

/* ===== R1: dual timeline ===== */
.tl-row.dual{height:66px;border-bottom:1px dashed #f0f1f7}
.tl-bar.plan{top:6px;height:22px;background:#b9bdcf;color:#fff;font-weight:600}
.tl-bar.actual{top:34px;height:22px;font-weight:800}
.tl-noactual{position:absolute;top:36px;font-size:10.5px;color:var(--faint);font-style:italic;padding-left:4px}
.tl-legend{display:flex;gap:16px;padding:9px 14px;font-size:11.5px;font-weight:700;color:var(--muted);border-bottom:1px solid var(--border);background:#fafbfe;position:sticky;left:0}
.tl-legend .lg{display:inline-block;width:14px;height:9px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.tl-legend .lg.plan{background:#b9bdcf}

/* ===== R1: category headers ===== */
.blab.cat{color:var(--text);font-size:12.5px;display:flex;align-items:center;gap:8px}
.blab.cat .cnt{color:var(--faint);font-weight:600}

/* ===== v4 UX redesign (per design doc) ===== */
/* collapsed toolbar */
.toolbar.t2{gap:8px}
.tseg{display:flex;gap:0;border:1.5px solid var(--border2);border-radius:9px;overflow:hidden;background:#fff}
.tbtn{border:none;background:#fff;padding:7px 13px;font-size:12.5px;font-weight:700;color:var(--muted);cursor:pointer;display:inline-flex;align-items:center;gap:6px;border-right:1.5px solid var(--border);transition:.13s;white-space:nowrap}
.tbtn:last-child{border-right:none}
.tbtn:hover{color:var(--accent);background:var(--accent-soft)}
.tbtn.on{background:var(--accent-soft);color:var(--accent)}
.tcount{background:var(--accent);color:#fff;border-radius:9px;padding:0 7px;font-size:10.5px;line-height:16px}
.statlink{cursor:pointer;font-weight:700}
.statlink:hover{text-decoration:underline}

/* home cards v2 */
.pprog{display:flex;align-items:center;gap:8px;margin:2px 0 10px}
.pbarw{flex:1;height:7px;border-radius:5px;background:var(--border);overflow:hidden}
.pbarw i{display:block;height:100%;background:linear-gradient(90deg,var(--accent),#a25ddc);border-radius:5px}
.pprog b{font-size:12px}
.povr{font-size:11.5px;font-weight:800;color:var(--stuck);background:#fdecef;border-radius:8px;padding:2px 8px}
.pstrip{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:7px 10px;border:1px solid var(--border);border-radius:8px;margin-bottom:6px;font-size:12.5px;font-weight:600;cursor:pointer;transition:.12s}
.pstrip:hover{border-color:var(--accent);background:var(--accent-soft)}
.pstrip b{font-size:11px;font-weight:800}
.pstrip b.bad{color:var(--stuck)}
.pstrip b.okk{color:var(--done)}
.pstrip.more{color:var(--muted);justify-content:flex-start}
.pcard-foot{margin-top:4px}

/* sidebar density */
.chev{font-size:9px;color:#8a8eb5;width:11px;flex:0 0 11px}
.sbcnt{font-size:10px;font-weight:800;background:#3a3d5c;color:#c3c6df;border-radius:8px;padding:1px 7px;margin-left:auto}
.sbhealth{font-size:9.5px;font-weight:800;border-radius:7px;padding:1px 6px;letter-spacing:.3px}
.sbhealth.bad{background:#3d1f2b;color:#ff8fa0}
.sbhealth.ok{background:#1d3a2f;color:#7ee2b8}
.sb-proj-head .pn{cursor:pointer}
.sb-proj-head .pn:hover{color:var(--accent);color:#a9b4ff}

/* item detail side sheet */
.overlay.sheetov{justify-content:flex-end;align-items:stretch;padding:0}
.modal.sheet{width:720px;max-width:96vw;height:100vh;max-height:100vh;border-radius:16px 0 0 16px;animation:sheetin .22s ease;display:flex;flex-direction:column;padding:20px 24px}
@keyframes sheetin{from{transform:translateX(40px);opacity:0}to{transform:none;opacity:1}}
.shead{display:flex;align-items:flex-start;gap:10px;margin-bottom:14px}
.stitle{flex:1;border:none;outline:none;font-size:19px;font-weight:800;color:var(--text);font-family:inherit;padding:4px 2px;border-bottom:1.5px solid transparent}
.stitle:focus{border-bottom-color:var(--accent)}
.stitle:disabled{background:none;color:var(--text)}
.shead .x{border:none;background:none;font-size:18px;color:var(--faint);cursor:pointer;padding:4px 8px}
.shead .x:hover{color:var(--text)}
.sheetgrid{display:flex;gap:22px;flex:1;min-height:0;overflow:auto}
.smain{flex:1.5;min-width:0;display:flex;flex-direction:column}
.sside{flex:1;min-width:200px;max-width:250px;border-left:1px solid var(--border);padding-left:18px;display:flex;flex-direction:column;gap:2px}
.srow{margin-bottom:11px}
.srow label{display:block;font-size:10.5px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.6px;margin-bottom:4px}
.srow input,.srow select,.srow textarea{width:100%;padding:7px 9px;border:1px solid var(--border2);border-radius:8px;font-size:13px;outline:none;font-family:inherit;background:#fff;color:var(--text)}
.srow input:focus,.srow select:focus{border-color:var(--accent)}
.srow input[type=range]{padding:0}
.sacts{margin-top:auto;padding-top:14px;display:flex;flex-direction:column;gap:8px}
.smain .cmt-tabs{margin-top:auto}
.smain .cmtlist{max-height:none;flex:0 1 auto}
@media (max-width:760px){.sheetgrid{flex-direction:column}.sside{border-left:none;padding-left:0;max-width:none}}

/* ════════════════════════════════════════════════
   v5 — Enterprise theme (Inter, refined neutrals)
   ════════════════════════════════════════════════ */
:root{
  --bg:#f7f8fb; --surface:#ffffff; --border:#e6e8ee; --border2:#d3d7e0;
  --text:#171a21; --muted:#5d6470; --faint:#9aa1ae;
  --accent:#4f5bf0; --accent-soft:#eef0fe;
  --shadow:0 1px 2px rgba(23,26,33,.05),0 4px 14px rgba(23,26,33,.04);
  --r:10px;
  --sb-bg:#15172a; --sb-line:#23263e; --sb-hover:#1e2138; --sb-text:#aab0c8; --sb-text2:#7e85a3;
}
body{font-family:'Inter',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
h2{letter-spacing:-.02em}
.hrow h2{font-size:17px;font-weight:700}
.btn{border-radius:7px;padding:6px 12px;box-shadow:0 1px 1px rgba(23,26,33,.04)}
.btn.ghost,.btn.ai{box-shadow:none}
.btn.ai{background:var(--accent);border:none}
.btn.iconb{padding:6px 9px}
.btn.iconb svg{display:block}
.tab{padding:8px 14px;font-size:13px}
.tabs{gap:6px}
.tab.active{font-weight:700}
.toolbar{padding:8px 18px}
.stats{padding:7px 18px;font-size:12px}
.pill{border-radius:5px;font-size:11px;min-width:80px;padding:3.5px 11px}
.pill.sm{font-size:10.5px}
.tag{border-radius:4px}
.tbl th{background:#f9fafc;font-size:11px;letter-spacing:.45px;color:#6b7280;padding:9px 12px}
.tbl.fixed td{height:40px;font-size:13px}
.tbl.density-compact td{height:28px;font-size:12px;padding:0 8px}
.tbl.density-comfortable td{height:52px;font-size:13.5px}
.tbl-grp td{font-size:12px}
.grp-head{font-size:13.5px;padding:10px 16px}
.lrow{padding:8px 16px 8px 21px}
.modal{border-radius:12px}
.acard{border:1px solid var(--border)}
.avatar{width:24px;height:24px;font-size:10px;flex-basis:24px}
.donebar{height:6px}
.pbar,.pbarw{height:6px}

/* sidebar — deep neutral, refined */
#sidebar{background:var(--sb-bg);width:240px;flex-basis:240px;color:var(--sb-text)}
.sb-ws{border-bottom:1px solid var(--sb-line);padding:16px 14px 12px}
.wssel{background:#1e2138;border-color:#2b2f4d}
.modebadge{color:var(--sb-text2)}
.sb-link{color:var(--sb-text);font-size:13px;display:flex;gap:9px}
.sb-link svg{flex:0 0 14px;opacity:.85}
.sb-link:hover,.sb-link.on{background:var(--sb-hover);color:#fff}
.sb-proj-head{color:#d7dbef;font-size:11.5px;letter-spacing:.5px;border-radius:7px}
.sb-projlink:hover{background:var(--sb-hover)}
.sb-trk{color:var(--sb-text);font-size:12.5px;border-left:2px solid transparent;border-radius:0 7px 7px 0;margin-left:10px;padding-left:14px}
.sb-trk:hover{background:var(--sb-hover);color:#fff}
.sb-trk.on{background:var(--sb-hover);color:#fff;border-left-color:var(--accent);font-weight:600}
.sb-add{color:var(--sb-text2)}
.sb-add:hover{background:var(--sb-hover)}
.sbcnt{background:#262a47;color:var(--sb-text)}
.cnt2{background:#262a47}

/* dropdown & sheet refinement */
.ddpop{border-radius:10px;box-shadow:0 10px 38px rgba(23,26,33,.18);border-color:var(--border)}
.ddopt{font-weight:600;font-size:12.5px}
.modal.sheet{box-shadow:-12px 0 44px rgba(23,26,33,.16)}
.stitle{font-size:18px}
.toast{border-radius:9px;left:auto;right:24px;transform:translateY(80px)}
.toast.show{transform:none}

/* ════ mobile (≤768px) ════ */
#mtop,#mnav,#sbback{display:none}
@media (max-width:768px){
  .sb-toggle{display:none}
  .bellbtn-fixed{top:7px;right:54px;width:30px;height:30px;background:transparent;border-color:transparent;color:#fff;z-index:46}
  #mtop{display:flex;align-items:center;gap:10px;position:fixed;top:0;left:0;right:0;height:50px;background:var(--sb-bg);color:#fff;z-index:45;padding:0 12px}
  #mtop .logo{color:#fff}
  #mtop .dot{width:24px;height:24px;border-radius:7px;background:linear-gradient(135deg,#4f5bf0,#a25ddc);display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;margin-right:7px}
  #mHam{background:none;border:none;color:#fff;padding:8px;cursor:pointer}
  #app{padding-top:50px;height:100vh}
  #sidebar{position:fixed;top:50px;bottom:0;left:0;z-index:44;transform:translateX(-103%);transition:transform .22s ease;width:264px;box-shadow:8px 0 30px rgba(0,0,0,.25)}
  body.sbopen #sidebar{transform:none}
  #sbback{position:fixed;inset:50px 0 0 0;background:rgba(10,12,24,.45);z-index:43}
  body.sbopen #sbback{display:block}
  #mnav{display:flex;position:fixed;bottom:0;left:0;right:0;height:60px;background:#fff;border-top:1px solid var(--border);z-index:42;padding-bottom:env(safe-area-inset-bottom)}
  #mnav button{flex:1;border:none;background:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:10px;font-weight:700;color:var(--faint);cursor:pointer;font-family:inherit}
  #mnav button.on{color:var(--accent)}
  #mnav button.mn-ai svg{color:var(--accent)}
  #content{padding-bottom:60px}
  #main{padding:12px;padding-bottom:74px}
  .hrow{padding:10px 12px 6px;gap:8px}
  .hrow h2{font-size:15px}
  .search input{width:110px}
  .tabs{padding:0 12px;overflow-x:auto;scrollbar-width:none}
  .toolbar{padding:8px 12px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
  .toolbar .spacer{display:none}
  .stats{overflow-x:auto;white-space:nowrap;gap:14px;scrollbar-width:none}
  .pgrid{grid-template-columns:1fr}
  .prow{flex-direction:column}
  .panel{width:100%}
  .favrow{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:4px}
  .favchip{flex:0 0 auto}
  .tblwrap{max-height:none}
  /* table → horizontal scroll, hide checkbox col */
  .sel-col{display:none}
  .tbl.fixed th:first-child:not(.sel-col){left:0}
  /* board */
  .board .col{min-width:240px;width:240px;flex-basis:240px}
  /* item sheet → full screen */
  .modal.sheet{width:100vw;max-width:100vw;border-radius:0;padding:14px}
  .sheetgrid{flex-direction:column}
  .sside{border-left:none;padding-left:0;max-width:none}
  /* dropdowns → bottom half-sheet with 52px targets */
  .ddpop{position:fixed!important;left:0!important;right:0!important;top:auto!important;bottom:0!important;width:100%;min-width:0;max-height:60vh;border-radius:16px 16px 0 0;padding:10px 14px calc(14px + env(safe-area-inset-bottom));box-shadow:0 -10px 40px rgba(10,12,24,.3);animation:halfup .2s ease}
  .ddopt{padding:15px 12px;font-size:14.5px;border-bottom:1px solid var(--border)}
  .ddopt:last-child{border-bottom:none}
  /* FAB — floating + button */
  .mob-fab{display:flex!important}
  /* hide desktop-only chrome */
  .drawer{width:100vw;max-width:100vw;right:-110vw}
  .drawer.open{right:0}
  .overlay .modal:not(.sheet){width:94vw;max-height:84vh}
  /* tracker toolbar: hide less-used buttons on mobile */
  #tGroup2,#tCollapseAll,#tExpandAll,#tHighlight,#tTwoRow,#tFullscreen,#tWrapText{display:none}
  /* empty state compact on mobile */
  .empty-state{padding:40px 16px}
}
/* ── Mobile card layout for table view (≤600px) ── */
@media (max-width:600px){
  .tblwrap{max-height:none!important;overflow:visible!important}
  .tbl.fixed,.tbl.fixed thead,.tbl.fixed tbody,.tbl.fixed tr,.tbl.fixed td{display:block!important;width:100%!important;min-width:0!important;max-width:none!important}
  .tbl.fixed{min-width:0!important}
  .tbl.fixed thead,.tbl.fixed colgroup,.tbl.fixed .tbl-grp,.tbl.fixed .tbl-grp2,.tbl.fixed .drow-actual,.tbl.fixed .tbl-total,.tbl.fixed td.rowx{display:none!important}
  .tbl.fixed tr.drow{border:1px solid var(--border);border-radius:10px;margin-bottom:10px;padding:8px 12px!important;background:var(--surface);box-shadow:0 1px 4px rgba(0,0,0,.05);position:relative}
  .tbl.fixed tr.drow.row-selected{border-color:var(--accent);background:var(--accent-soft)!important}
  .tbl.fixed td.title-cell{font-weight:700;font-size:14px;padding:4px 0 10px!important;position:static!important;background:transparent!important;border-bottom:1px solid var(--border);margin-bottom:2px;cursor:pointer}
  .tbl.fixed td[data-label]:not(.title-cell):not(:empty){padding:4px 0!important;min-height:0!important;border:none!important;display:flex!important;gap:8px;align-items:baseline}
  .tbl.fixed td[data-label]:not(.title-cell):empty{display:none!important}
  .tbl.fixed td[data-label]:not(.title-cell)::before{content:attr(data-label);font-size:10px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;white-space:nowrap;flex:0 0 90px}
  .tbl.fixed td.sel-col{display:none!important}
}
/* FAB: hidden on desktop, shown on mobile via @media above */
.mob-fab{display:none;position:fixed;bottom:72px;right:18px;z-index:48;
  width:52px;height:52px;border-radius:50%;background:var(--accent);color:#fff;
  align-items:center;justify-content:center;font-size:26px;font-weight:300;
  box-shadow:0 4px 18px rgba(91,91,240,.45);border:none;cursor:pointer;
  line-height:1;transition:transform .15s,box-shadow .15s}
.mob-fab:active{transform:scale(.93);box-shadow:0 2px 8px rgba(91,91,240,.3)}
@keyframes halfup{from{transform:translateY(40px);opacity:.5}to{transform:none;opacity:1}}
@media (min-width:769px){
  body.sbopen #sidebar{transform:none}
}

/* ════════════════════════════════════════════════
   v6 — Bold Procore/Monday language + full-screen
   flows + readable photos
   ════════════════════════════════════════════════ */
/* bolder hierarchy */
.hrow{padding:14px 22px 8px}
.hrow h2{font-size:20px;font-weight:800}
.crumb{font-size:13px}
#main{padding:18px 22px}
.btn{font-size:13px;padding:8px 14px;font-weight:700}
.btn.sm{padding:6px 11px;font-size:12px}
.btn.primary{box-shadow:0 2px 6px rgba(79,91,240,.28)}
.btn.big{padding:11px 16px;font-size:14px}
.tab{padding:10px 18px;font-size:13.5px;font-weight:700}
.tab.active{background:var(--accent-soft);border-radius:8px 8px 0 0}
.pill{font-size:12px;padding:5px 14px;min-width:96px;border-radius:6px;font-weight:800;letter-spacing:.1px;box-shadow:inset 0 -1.5px 0 rgba(0,0,0,.12)}
.pill.sm{font-size:11px;padding:4px 10px;min-width:0}
.blab{font-size:12px;color:var(--text);font-weight:800}
/* stats as bold tiles */
.stats{padding:10px 22px;gap:10px;background:var(--bg);border-bottom:1px solid var(--border)}
.stats .stat{background:var(--surface);border:1px solid var(--border);border-radius:9px;padding:7px 13px;font-size:12px;font-weight:600;display:inline-flex;align-items:center;gap:6px;box-shadow:var(--shadow)}
.stats .stat b{font-size:15px;font-weight:800}
.stats .donebar{max-width:170px;align-self:center}
/* bolder group headers + table */
.grp-head{font-size:14.5px;padding:12px 18px;border-left-width:6px;background:#dce3f8}
.grp-head .cnt{border-radius:10px;padding:1px 9px;font-weight:800}
.tbl th{font-size:11px;font-weight:800;color:#4b5263;background:#f3f5f9}
.tbl-grp td{font-size:13px}
.tbl.fixed td{font-size:13.5px}
/* bolder cards */
.pcard-top b{font-size:16px}
.pbar2{height:8px}
.tkcard{border-width:2px;border-radius:13px}
.tkname{font-size:14px;font-weight:800}
.tkicon{font-size:22px;background:var(--accent-soft);border-radius:9px;padding:5px 8px}
.tcard{border-width:2px}
.tcard b{font-size:13.5px}
.temoji{font-size:26px}
/* READABLE photos */
.phthumb{width:52px;height:52px;border-radius:8px;border-width:2px}
.phwrap .phthumb+.phthumb{margin-left:-8px}
.phmore{font-size:12px;padding:8px 8px;border-radius:8px}
.phadd{padding:8px 12px;font-size:12.5px}
.phinline .phthumb{width:84px;height:84px}
.lbgrid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}
.lbitem img{height:200px}
.lbitem b{font-size:13px;padding:4px 10px}
/* full-screen creation flows */
.modal.full{width:min(1180px,97vw);height:94vh;max-height:94vh;display:flex;flex-direction:column;padding:28px 34px}
.modal.full h3{font-size:20px;margin-bottom:20px}
.modal.full .tgrid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}
.modal.full .macts{margin-top:auto;padding-top:16px}
@media (max-width:768px){.modal.full{width:100vw;height:100vh;max-height:100vh;border-radius:0;padding:16px}}
/* dropdown bolder */
.ddopt{font-size:13px;font-weight:700;padding:9px 12px}
.ddsw{width:15px;height:15px;border-radius:5px}
.roleline{display:block;color:var(--accent);font-weight:700;font-size:10.5px;margin-top:2px}
/* ═�
/* ═══════════ R2 additions: bell, dashboard, wizard, details, archive, shortcuts ═══════════ */

/* notification bell (sidebar) */
.bellbtn{position:relative;background:transparent;border:1px solid #3a3d58;color:#c9cbe0;border-radius:8px;width:30px;height:30px;display:flex;align-items:center;justify-content:center;cursor:pointer;flex:0 0 30px}
.bellbtn:hover{border-color:var(--accent);color:#fff}
.bellbtn b{position:absolute;top:-6px;right:-6px;background:var(--stuck);color:#fff;font-size:9.5px;font-weight:800;border-radius:9px;padding:1px 4.5px;min-width:10px;text-align:center;border:2px solid #23253a}
.bellbtn-fixed{position:fixed;top:14px;right:16px;z-index:60;background:var(--surface);border:1px solid var(--border2);color:var(--muted);border-radius:9px;width:32px;height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 1px 4px rgba(20,24,40,.1)}
.bellbtn-fixed:hover{color:var(--accent);border-color:var(--accent)}
.bellbtn-fixed b{position:absolute;top:-5px;right:-5px;background:var(--stuck);color:#fff;font-size:9.5px;font-weight:800;border-radius:9px;padding:1px 4.5px;min-width:10px;text-align:center;border:2px solid var(--surface)}
.ntflist{max-height:62vh;overflow:auto;display:flex;flex-direction:column;gap:4px}
.ntfrow{display:flex;gap:10px;padding:10px;border:1px solid var(--line,#e6e8f0);border-radius:10px;cursor:pointer;background:#fff}
.ntfrow:hover{border-color:var(--accent)}
.ntfrow.unread{background:#f4f4ff;border-color:#d6d6f8}
.ntfic{font-size:16px;flex:0 0 22px;text-align:center}
.ntfb{min-width:0}
.ntfb p{margin:2px 0;font-size:12.5px;color:#3a3f50;word-break:break-word}
.ntfb b{font-size:12.5px}

/* project details grid */
.detgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px;margin-top:10px}
.detcell{background:#f7f8fc;border:1px solid #e9ebf3;border-radius:9px;padding:7px 10px;display:flex;flex-direction:column;gap:1px}
.detcell small{font-size:10px;text-transform:uppercase;letter-spacing:.4px;color:#8a8fa3;font-weight:700}
.detcell b{font-size:12.5px;color:#23253a;word-break:break-word}

/* archived trackers */
.archlist{display:flex;flex-direction:column;gap:5px}
.archrow{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:7px 10px;border:1px dashed #d4d7e2;border-radius:9px;color:#7c8094;background:#fafbfd}
.archname{cursor:pointer;font-weight:600;font-size:12.5px}
.archname:hover{color:var(--accent)}

/* dashboard */
.dashtiles{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.dtile{flex:1;min-width:110px;background:#fff;border:1px solid #e6e8f0;border-radius:12px;padding:14px 16px;display:flex;flex-direction:column;gap:2px}
.dtile b{font-size:26px;font-weight:800;color:#23253a;line-height:1.1}
.dtile span{font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:#8a8fa3;font-weight:700}
.dtile.bad b{color:var(--stuck)}
.dtile.good b{color:var(--done)}
.dtrow{display:flex;align-items:center;gap:10px;padding:7px 4px;border-bottom:1px solid #f0f1f6;cursor:pointer;font-size:12.5px}
.dtrow:hover .dtname{color:var(--accent)}
.dtname{font-weight:700;flex:0 0 180px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pbarw.big{flex:1;height:9px;background:#eceef5;border-radius:5px;overflow:hidden;display:inline-block}
.pbarw.big i{display:block;height:100%;background:var(--done);border-radius:5px}
.dsrow{display:flex;align-items:center;gap:10px;padding:7px 4px;border-bottom:1px solid #f0f1f6;font-size:12px;flex-wrap:wrap}
.stack{flex:1;min-width:140px;height:14px;border-radius:7px;overflow:hidden;display:flex}
.stack i{display:block;height:100%}
.legend{display:flex;gap:8px;flex-wrap:wrap}
.legend small{display:flex;align-items:center;gap:4px;color:#6a6f84;font-weight:600}
.legend i{width:9px;height:9px;border-radius:3px;display:inline-block}
.dorow{display:flex;align-items:center;gap:8px;padding:7px 4px;border-bottom:1px solid #f0f1f6;cursor:pointer;font-size:12.5px}
.dorow .t{flex:1;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dorow:hover .t{color:var(--accent)}
.dwrow{display:flex;align-items:center;gap:8px;padding:6px 4px;font-size:12.5px}
.dwrow .dtname{flex:0 0 110px}
.dwrow b{width:22px;text-align:right}
.dactrow{display:flex;gap:8px;padding:7px 0;border-bottom:1px solid #f0f1f6;font-size:12.5px}
.dactrow p{margin:1px 0;color:#4a4f63;font-size:12px}

/* setup wizard */
.wsteps{display:flex;align-items:center;gap:6px;margin:4px 0 16px}
.wdot{width:26px;height:26px;border-radius:50%;background:#eceef5;color:#8a8fa3;font-weight:800;font-size:12.5px;display:flex;align-items:center;justify-content:center}
.wdot.on{background:var(--accent);color:#fff}
.wdot.done{background:var(--done);color:#fff}
.wline{flex:1;height:2px;background:#e6e8f0;max-width:70px}
.wzgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px 12px;margin-bottom:6px}
.wzgrid .fcol label{font-size:11px}

/* keyboard help */
.kbrow{display:flex;align-items:center;gap:12px;padding:6px 0;font-size:13px}
.kbd{background:#f0f1f6;border:1px solid #d9dce6;border-bottom-width:2.5px;border-radius:6px;padding:2px 9px;font-weight:800;font-size:12px;min-width:54px;text-align:center;color:#3a3f50}

/* column visibility popover */
.ddopt.colvis{display:flex;align-items:center;gap:8px;cursor:pointer}
.ddopt.colvis input{width:auto;accent-color:var(--accent)}

/* users & access page */
.usrtbl td{vertical-align:middle}
.ucell{display:flex;align-items:center;gap:9px;cursor:pointer;min-width:180px}
.ucell:hover .un b{color:var(--accent)}
.un{display:flex;flex-direction:column;line-height:1.25}
.un small{color:#8a8fa3;font-size:11px}
.uacts{white-space:nowrap}
.accchip{display:inline-block;background:#ececfe;color:#4343c9;border-radius:6px;padding:2px 7px;font-size:10.5px;font-weight:700;margin:1.5px 3px 1.5px 0}
.accchip.trk{background:#e6f7f1;color:#0a8f62}
.accchip.adm{background:#23253a;color:#fff}
.uam-row{display:flex;align-items:center;gap:10px;padding:5px 0;flex-wrap:wrap}
.uam-name{font-weight:700;font-size:13px;flex:1;min-width:140px}
.uam-row select{max-width:230px}
.uam-cols{margin:2px 0 8px 18px}
.uam-hr{border:none;border-top:1px solid #e6e8f0;margin:14px 0}

/* ── Tracker Import / Export ──────────────────────────────────────── */
.imp-drop{border:2px dashed var(--border);border-radius:10px;padding:28px 20px;text-align:center;color:var(--dim);cursor:pointer;transition:border-color .2s,background .2s;display:flex;flex-direction:column;align-items:center;gap:8px;font-size:13px}
.imp-drop.over,.imp-drop:hover{border-color:var(--accent);background:var(--accent-dim)}
.imp-drop svg{opacity:.5}
.lnk{color:var(--accent);cursor:pointer;text-decoration:underline}
.imp-map-label{font-size:11px;font-weight:600;color:var(--dim);text-transform:uppercase;letter-spacing:.4px;margin:14px 0 6px}
.imp-map-grid{display:flex;flex-direction:column;gap:4px;max-height:200px;overflow-y:auto}
.imp-map-row{display:grid;grid-template-columns:1fr 20px 1fr;align-items:center;gap:8px;padding:2px 0}
.imp-col{font-size:12px;color:var(--fg);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.imp-arrow{text-align:center;color:var(--dim)}
.imp-tbl{width:100%;border-collapse:collapse;font-size:11px}
.imp-tbl th{background:var(--surface2);color:var(--dim);padding:4px 8px;text-align:left;white-space:nowrap;position:sticky;top:0}
.imp-tbl td{padding:3px 8px;border-bottom:1px solid var(--border);max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ict-col-grid{display:flex;flex-direction:column;gap:5px;margin:10px 0;max-height:240px;overflow-y:auto;border:1px solid var(--border);border-radius:9px;padding:8px 10px}
.ict-col-row{display:flex;align-items:center;gap:10px}
.ict-col-name{flex:1;font-size:13px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ict-type-sel{flex:0 0 150px;font-size:12px;padding:4px 6px;border:1px solid var(--border2);border-radius:6px}

/* ── Subgroup headers ─────────────────────────────────────────────── */
.grp2-head{display:flex;align-items:center;gap:6px;padding:5px 12px 5px 32px;font-size:12.5px;font-weight:700;border-left:4px solid;margin:2px 0;background:#eef1fa;border-radius:4px}
.grp2-head .cnt{font-weight:600;color:inherit;font-size:11px;opacity:.7;margin-left:3px}
.lrow.sub{padding-left:40px}
.tbl-grp2 td{background:#eef1fa;font-size:12px;font-weight:600}

/* ── Group collapse ───────────────────────────────────────────────── */
.grp-head{cursor:pointer;user-select:none;transition:background .1s}
.grp-head:hover{background:rgba(91,91,240,.06);border-radius:0 0 6px 6px}
.grp-chev{display:inline-block;font-size:11px;margin-right:6px;width:14px;text-align:center;font-weight:900;transition:transform .15s}
.grp-head.grp-collapsed .grp-chev{transform:none}
.tbl-grp td{cursor:pointer;user-select:none}
.tbl-grp td:hover{background:rgba(91,91,240,.04)}
.tbl-grp .grp-chev{font-size:11px;margin-right:6px;font-weight:900}

/* ── Column resize + panel ───────────────────────────────────────── */
.col-resize{position:absolute;right:0;top:0;bottom:0;width:6px;cursor:col-resize;z-index:1}
.col-resize:hover{background:rgba(91,91,240,.25)}
.tbl th{position:relative}
.col-panel{min-width:220px}
.col-panel .cp-hdr{font-size:10px;color:var(--dim);text-transform:uppercase;letter-spacing:.4px;pointer-events:none}
.col-panel .cp-reset{font-size:11px;color:var(--faint);cursor:pointer;margin-top:4px;border-top:1px solid var(--border);padding-top:6px}
.col-panel .cp-reset:hover{color:var(--accent)}
.col-panel [data-cpo].drag-over{border:1px dashed var(--accent);border-radius:6px}

/* ── Checklist field ─────────────────────────────────────────────── */
.cl-badge{display:inline-flex;align-items:center;gap:4px;background:#e6f9f0;color:#00875a;border-radius:12px;padding:2px 8px;font-size:11px;font-weight:700}
.cl-list{display:flex;flex-direction:column;gap:4px;width:100%}
.cl-item{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:3px 0}
.cl-item label{display:flex;align-items:center;gap:6px;cursor:pointer;flex:1;font-size:13px}
.cl-item label input[type=checkbox]{width:15px;height:15px;cursor:pointer;accent-color:var(--accent)}
.cl-item label span.done{text-decoration:line-through;color:var(--faint)}
.cl-del{cursor:pointer;color:var(--faint);font-size:11px;padding:2px 4px;border-radius:4px}
.cl-del:hover{color:var(--stuck);background:#fff0f0}
.cl-add{display:flex;gap:6px;margin-top:4px}
.cl-addinp{flex:1;border:1px solid var(--border2);border-radius:7px;padding:5px 8px;font-size:12px;outline:none}
.cl-addinp:focus{border-color:var(--accent)}
.cl-addbtn{border:none;background:var(--accent);color:#fff;border-radius:6px;padding:5px 10px;cursor:pointer;font-size:13px;font-weight:700}
.cl-addbtn:hover{opacity:.85}

/* ── Saved views bar ─────────────────────────────────────────────── */
.sv-bar{display:flex;align-items:center;gap:4px;padding:0 16px;overflow-x:auto;scrollbar-width:none;border-bottom:1px solid var(--border);min-height:34px}
.sv-bar::-webkit-scrollbar{display:none}
.sv-bar-empty{opacity:.7}
.sv-tab{display:inline-flex;align-items:center;gap:4px;padding:4px 10px;border-radius:6px 6px 0 0;font-size:12px;font-weight:500;cursor:pointer;color:var(--dim);white-space:nowrap;transition:background .15s,color .15s;position:relative;user-select:none}
.sv-tab:hover{background:var(--surface2);color:var(--fg)}
.sv-tab.active{background:var(--surface2);color:var(--accent);border-bottom:2px solid var(--accent)}
.sv-tab.sv-new{color:var(--accent);font-weight:600;padding:4px 8px}
.sv-tab.sv-new:hover{background:var(--accent-dim)}
.sv-star{color:#f5c518;font-size:11px}
.sv-default{color:var(--accent);font-size:9px;margin-left:2px}
.sv-x{opacity:0;font-size:10px;margin-left:2px;color:var(--dim);line-height:1;padding:1px 3px;border-radius:3px}
.sv-tab:hover .sv-x{opacity:1}
.sv-x:hover{background:var(--danger);color:#fff}

/* ════════════════════════════════════════════════
   R3A — Item detail panel, formula/rollup cells,
   offline banner, formula builder, PPT button
   ════════════════════════════════════════════════ */

/* ── offline banner ── */
#offbanner{display:none}
body.offline #offbanner{display:block;position:fixed;top:0;left:0;right:0;z-index:90;
  background:#15172a;color:#ffd479;font-size:12px;font-weight:700;text-align:center;
  padding:6px 12px;box-shadow:0 2px 10px rgba(0,0,0,.25)}
@media (max-width:768px){body.offline #offbanner{top:50px}}

/* ── formula / rollup cells ── */
.num.formula{color:#4a3fd0}
.tbl-sub td,.tbl-total td{background:#fff7e8;border-top:1px solid #f3d9a6;font-size:12.5px}
.tbl-total td{border-top:2px solid #fdab3d;background:#fff2d8}
.tbl-sub .sumlabel,.tbl-total .sumlabel{font-weight:800;color:#8a6d2f}
.sumcell{text-align:right}
.sumtag{display:inline-block;font-weight:800;color:#6b5400}
/* builder formula + summary controls */
.bformula{flex-basis:100%;display:flex;flex-direction:column;gap:4px;margin:6px 0 2px;padding-left:30px}
.bformula .bfx{width:100%;padding:8px 10px;border:1px solid var(--border2);border-radius:8px;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:13px}
.bfxhelp{font-size:11px;color:var(--muted)}
.bfxhelp code{background:var(--accent-soft);padding:1px 5px;border-radius:4px;font-size:11px}
.bsummary{display:flex;align-items:center;gap:7px;flex-basis:100%;padding-left:30px;margin-top:4px}
.bsumlab{font-size:11.5px;font-weight:700;color:var(--muted)}
.bsummary select{padding:5px 8px;border:1px solid var(--border2);border-radius:7px;font-size:12.5px}

/* ── Required + default ── */
.breqrow{display:flex;align-items:center;gap:10px;flex-basis:100%;padding-left:30px;margin-top:4px}
.breqlabel{display:flex;align-items:center;gap:5px;font-size:12px;font-weight:600;color:var(--muted);cursor:pointer;white-space:nowrap}
.breqlabel input[type=checkbox]{width:14px;height:14px;cursor:pointer;accent-color:var(--accent)}
.bdef{flex:1;min-width:100px;padding:5px 8px;border:1px solid var(--border2);border-radius:7px;font-size:12px;outline:none}
.bdef:focus{border-color:var(--accent)}
.req-mark{color:var(--stuck);font-weight:900;margin-left:2px}

/* ── item detail panel ── */
.ip-backdrop{position:fixed;inset:0;background:rgba(15,17,30,.42);z-index:69;opacity:0;
  visibility:hidden;transition:opacity .2s ease}
.ip-backdrop.show{opacity:1;visibility:visible}
.item-panel{position:fixed;top:0;right:-480px;width:460px;max-width:94vw;height:100%;
  background:var(--surface);box-shadow:-10px 0 36px rgba(20,24,40,.18);z-index:70;
  display:flex;flex-direction:column;transition:right .26s cubic-bezier(.4,0,.2,1)}
.item-panel.open{right:0}
.ip-header{display:flex;align-items:center;gap:8px;padding:12px 14px;border-bottom:1px solid var(--border);
  background:var(--bg);flex:0 0 auto}
.ip-crumb{flex:1;font-size:12px;font-weight:600;color:var(--muted);overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.ip-actions{display:flex;align-items:center;gap:4px}
.ip-actions .btn.sm{padding:5px 9px;font-size:13px}
.ip-close{background:none;border:none;font-size:17px;color:var(--muted);cursor:pointer;
  padding:3px 8px;border-radius:7px;line-height:1}
.ip-close:hover{background:var(--border);color:var(--text)}
.ip-body{flex:1;overflow-y:auto;padding:16px 18px 28px}

.ip-title-row{display:flex;flex-direction:column;gap:8px;margin-bottom:6px}
.ip-title{width:100%;border:none;outline:none;font-size:20px;font-weight:800;color:var(--text);
  resize:none;line-height:1.25;font-family:inherit;background:transparent;overflow:hidden}
.ip-title:focus{background:var(--accent-soft);border-radius:7px;padding:2px 6px;margin:-2px -6px}
.ip-title:disabled{color:var(--text);-webkit-text-fill-color:var(--text)}
.ip-pills{display:flex;flex-wrap:wrap;gap:7px;align-items:center}

.ip-desc-wrap{margin:12px 0}
.ip-desc-label,.ip-photo-label,.ip-flabel{font-size:11px;font-weight:800;letter-spacing:.4px;
  text-transform:uppercase;color:var(--faint)}
.ip-desc{width:100%;min-height:70px;border:1px solid var(--border2);border-radius:9px;padding:9px 11px;
  margin-top:5px;font-size:13.5px;font-family:inherit;resize:vertical;outline:none;color:var(--text)}
.ip-desc:focus{border-color:var(--accent)}
.memo-prev{display:inline-block;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle}
.bool-toggle{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:6px;transition:background .12s}
.bool-toggle:hover{background:var(--bg)}
.bool-tick{color:#00c875;font-weight:800;font-size:14px}
.bool-cross{color:#e2445c;font-weight:800;font-size:13px}
.memo-cell-edit{width:100%;min-height:60px;border:1px solid var(--border2);border-radius:6px;padding:6px 8px;font:inherit;resize:vertical;outline:none}

.ip-fields{margin:14px 0 6px;border:1px solid var(--border);border-radius:11px;overflow:hidden}
.ip-frow{display:flex;align-items:center;min-height:42px;border-bottom:1px solid var(--border)}
.ip-frow:last-child{border-bottom:none}
.ip-flabel{flex:0 0 150px;padding:9px 12px;background:var(--bg);align-self:stretch;
  display:flex;align-items:center;gap:5px}
.ip-flabel .lk{font-size:11px;opacity:.7}
.ip-fval{flex:1;padding:8px 12px;font-size:13.5px;display:flex;align-items:center;gap:6px;
  flex-wrap:wrap;min-height:42px}
.ip-fval:not(.ro){cursor:pointer;border-radius:6px}
.ip-fval:not(.ro):hover{background:var(--accent-soft)}
.ip-fval input{border:1px solid var(--accent);border-radius:6px;padding:5px 8px;font-size:13.5px;
  font-family:inherit;outline:none;width:100%}

.ip-photos{margin:14px 0}
.ip-photo-strip{display:flex;flex-wrap:wrap;gap:8px;margin-top:7px}
.ip-photo-strip img{width:78px;height:78px;object-fit:cover;border-radius:9px;border:2px solid var(--border);cursor:pointer}
.ip-add-photo{width:78px;height:78px;border:2px dashed var(--border2);border-radius:9px;display:flex;
  align-items:center;justify-content:center;font-size:22px;cursor:pointer;color:var(--muted)}
.ip-add-photo:hover{border-color:var(--accent);color:var(--accent)}

.ip-save-bar{display:flex;align-items:center;gap:8px;margin:16px 0 6px;padding-top:14px;border-top:1px solid var(--border)}
.ip-item-actions{display:flex;gap:8px;flex-wrap:wrap;padding:12px 0 4px;border-top:1px solid var(--border);margin-top:8px}
.ip-act-btn{flex:1;min-width:90px;padding:8px 10px;border:1px solid var(--border2);background:var(--bg);color:var(--muted);border-radius:9px;font-size:12.5px;font-weight:600;cursor:pointer;text-align:center;transition:.13s}
.ip-act-btn:hover{background:var(--accent-soft);color:var(--accent);border-color:var(--accent)}
.ip-act-btn.danger:hover{background:#fdecef;color:var(--stuck);border-color:var(--stuck)}

.ip-tabs{display:flex;gap:6px;margin:18px 0 10px;border-bottom:1.5px solid var(--border)}
.ip-tab{padding:8px 12px;font-size:12.5px;font-weight:700;color:var(--muted);cursor:pointer;
  border-bottom:2.5px solid transparent;margin-bottom:-1.5px}
.ip-tab.on{color:var(--accent);border-bottom-color:var(--accent)}
.ip-cmtlist{display:flex;flex-direction:column;gap:12px;margin-bottom:12px}
.ip-cmt{display:flex;gap:9px}
.ip-cmt .cmtb{flex:1;background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:8px 11px}
.ip-cmt .cmtb b{font-size:12.5px}
.ip-cmt .cmtb small{color:var(--faint);font-size:10.5px;margin-left:6px}
.ip-cmt .cmtb p{font-size:13px;margin-top:3px;line-height:1.45;word-break:break-word}
.ip-cmt .actline{color:var(--muted)}
.cmt-hdr{display:flex;align-items:center;gap:4px}
.cmt-del{margin-left:auto;background:none;border:none;color:var(--faint);font-size:11px;cursor:pointer;padding:1px 4px;border-radius:4px;opacity:0;transition:.12s}
.ip-cmt:hover .cmt-del{opacity:.7}
.cmt-del:hover{opacity:1!important;color:var(--stuck)}
.ip-empty-cmt{color:var(--faint);font-size:12.5px;padding:8px 2px;display:block}
/* activity log rows with icon */
.ip-act-row{display:flex;gap:8px;align-items:flex-start}
.act-icon{font-size:16px;line-height:1.4;flex:0 0 22px;text-align:center}
.act-meta{display:flex;align-items:center;gap:0}
.act-meta b{font-size:12.5px}
.act-meta small{color:var(--faint);font-size:10.5px;margin-left:6px}
.ip-cmtin{display:flex;gap:7px;align-items:flex-end}
.ip-cmtin textarea{flex:1;min-height:40px;max-height:120px;border:1px solid var(--border2);border-radius:9px;
  padding:9px 11px;font-size:13px;font-family:inherit;resize:vertical;outline:none}
.ip-cmtin textarea:focus{border-color:var(--accent)}
.ip-cmtin button{background:var(--accent);color:#fff;border:none;border-radius:9px;padding:9px 15px;
  font-weight:700;font-size:13px;cursor:pointer}
.ip-cmtin button:hover{filter:brightness(1.05)}

/* mobile → full-screen sheet that slides up */
@media (max-width:768px){
  .item-panel{width:100vw;max-width:100vw;right:0;top:100%;height:100%;
    transition:top .26s cubic-bezier(.4,0,.2,1)}
  .item-panel.open{top:0;right:0}
  .ip-header{padding-top:calc(12px + env(safe-area-inset-top))}
  .ip-body{padding-bottom:calc(40px + env(safe-area-inset-bottom))}
  .ip-flabel{flex-basis:120px}
  .ip-title{font-size:19px}
}

/* ===== builder: format & decimals controls ===== */
.bformat{display:flex;gap:6px;align-items:center;margin-top:5px;flex-wrap:wrap}
.bformat select{flex:1;min-width:140px;padding:5px 8px;border:1px solid var(--border2);
  border-radius:7px;font-size:12.5px;background:#fff}
.bdec{width:80px;padding:5px 8px;border:1px solid var(--border2);border-radius:7px;
  font-size:12.5px;background:#fff}
.bdec:focus,.bformat select:focus{outline:none;border-color:var(--accent)}

/* ── Group header (Level 1 — parent) ─────────────────────────────── */
.tbl-grp .grp-title-cell{
  border-left:5px solid;          /* colored by group value */
  font-weight:800;font-size:13.5px;
  cursor:pointer;user-select:none;
  padding:10px 14px!important;
  white-space:nowrap;
}
.tbl-grp .grp-title-cell:hover{background:#cfd8f2!important}
.tbl-grp td{background:#dce3f8!important;border-top:2px solid #b8c6e6}   /* strong top separator between groups */
.tbl-grp.tbl-grp-coll td{background:#c8d4ef!important}
.tbl-grp .grp-chev{display:inline-block;width:16px;margin-right:8px;font-size:12px;font-weight:900;transition:transform .12s;vertical-align:middle}
.tbl-grp .grp-name{margin-right:8px;font-size:13.5px}
.tbl-grp .cnt{background:rgba(0,0,0,.12);border-radius:10px;padding:1px 8px;font-size:11px;font-weight:700;color:inherit;margin-left:4px}
.tbl-grp .grp-sum{background:#dce3f8!important;text-align:right;padding:4px 10px!important;font-weight:700}

/* ── Sub-group header (Level 2 — nested within group) ────────────── */
.tbl-grp2 td{background:#eef1fa!important;border-top:1px solid #dde4f2;font-weight:700;font-size:12.5px}
.tbl-grp2 .grp2-title-cell{
  border-left:4px solid;          /* colored by sub-group value */
  padding:7px 12px 7px 30px!important;  /* 30px left indent = visually nested */
  cursor:pointer;user-select:none;
  white-space:nowrap;
}
.tbl-grp2 .grp2-title-cell:hover{background:#e3eaf6!important}
.tbl-grp2 .grp-chev{display:inline-block;width:13px;margin-right:5px;font-size:10px;font-weight:900;transition:transform .12s;vertical-align:middle;opacity:.75}
.tbl-grp2 .grp-sum{background:#eef1fa!important;padding:3px 10px!important;font-weight:600;text-align:right}
.tbl-grp2.tbl-grp-coll td{background:#e3eaf5!important}

/* ── Selected row (Ctrl/Cmd+click to select) ─────────────────────── */
.row-selected td{background:#eef2ff!important}
.row-selected:hover td{background:#e8edff!important}
.row-selected .title-cell{border-left:3px solid var(--accent);padding-left:9px}
.drow{cursor:default}
.drow .title-cell{cursor:pointer}
/* hint: when items are selected show selection count in title-cell margin */
.row-selected .title-cell::before{content:"✓";position:absolute;left:4px;top:50%;transform:translateY(-50%);font-size:10px;color:var(--accent);font-weight:900;opacity:.7}
.row-selected .title-cell{position:relative}

/* ── Bulk action bar ─────────────────────────────────────────────── */
/* checkbox select column */
.sel-col{width:32px!important;padding:0 6px!important;text-align:center;white-space:nowrap}
.sel-col input[type=checkbox]{width:14px;height:14px;cursor:pointer;accent-color:var(--accent)}
.tbl.fixed th.sel-col{position:sticky;left:0;z-index:4;background:#fafbfe;border-right:none}
.tbl.fixed td.sel-col{position:sticky;left:0;z-index:1;background:var(--surface);border-right:none}
.tbl.fixed tr:hover td.sel-col{background:#f8f9fe}
.tbl.fixed tr.row-selected td.sel-col{background:#eef0fb}
.bulk-bar{
  position:sticky;bottom:12px;
  display:flex;align-items:center;gap:8px;
  background:#1f2430;color:#fff;
  border-radius:10px;padding:10px 16px;
  box-shadow:0 4px 20px rgba(0,0,0,.35);
  margin:12px 0 4px;
  font-size:13px;width:fit-content;
  max-width:100%;
  z-index:50;
}
.bulk-count{font-weight:700;margin-right:6px;white-space:nowrap;opacity:.9}
.bulk-bar::before{content:"";position:absolute;inset:0;pointer-events:none}
.bulk-act{background:rgba(255,255,255,.12)!important;color:#fff!important;border:1px solid rgba(255,255,255,.2)!important}
.bulk-act:hover{background:rgba(255,255,255,.22)!important}
.bulk-del{background:rgba(226,68,92,.25)!important;border-color:rgba(226,68,92,.5)!important}
.bulk-del:hover{background:rgba(226,68,92,.4)!important}
.bulk-pop{min-width:200px}

/* ── List view sub-group collapse ────────────────────────────────── */
.grp2-head{cursor:pointer;user-select:none}
.grp2-head .grp-chev{font-size:10px;margin-right:5px;display:inline-block;width:12px;font-weight:900}

/* ── R4: conditional row highlighting ────────────────────────────── */
.hl-dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:6px;flex:0 0 9px;vertical-align:middle}
.hlrule-row2{padding:10px 12px;border:1px solid var(--border);border-radius:9px;margin-bottom:8px;background:var(--bg)}
.hlrule-line1{display:flex;align-items:center;gap:8px}
.hlrule-line2{display:flex;align-items:center;gap:10px;margin-top:8px;flex-wrap:wrap}
.hlrule-row2 select,.hlrule-row2 input{height:32px;font-size:12.5px}
.hlrule-target{font-weight:700;color:var(--accent)}
.hlvk{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);cursor:pointer;white-space:nowrap}
.hlcolor-pick{display:flex;align-items:center;gap:6px;margin-left:auto}
.hlcolor-lab{font-size:11.5px;color:var(--faint);font-weight:700}
.hlcolor-name{font-size:12px;color:var(--muted);min-width:48px}
.hlswatch{width:26px;height:26px;border-radius:7px;border:2px solid #fff;box-shadow:0 0 0 1.5px var(--border);cursor:pointer;flex:0 0 26px;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:800;font-size:13px}
.hlswatch.sel{box-shadow:0 0 0 2.5px var(--accent)}
.hlrule-rm{cursor:pointer;color:var(--faint);font-weight:800;padding:0 4px;margin-left:auto}
.hlrule-rm:hover{color:var(--stuck)}

/* ── R4: two-row (plan/actual) table mode ────────────────────────── */
.ap-tag{display:inline-block;min-width:20px;text-align:center;font-size:9.5px;font-weight:800;letter-spacing:.02em;border-radius:4px;padding:1px 4px;margin-right:6px;vertical-align:middle}
.p-tag{background:#eef0fb;color:#5b5bf0}
.ap-tag-a{background:#eef1f4;color:#6b7280}
.drow-actual td{background:#f7f8fc!important;border-top:none;font-size:12px;height:30px!important}
.drow-actual .title-cell{font-weight:600}
.drow-actual .a-actual{color:#6b7280}
.drow-actual .num-cell b.a-actual{color:#6b7280}
.drow-actual .num-cell b.a-projected{color:#3b6fe0}
.drow-delayed-cell{background:#fdeceb!important}
.drow-delayed-cell b{color:#c0392b!important}

/* ── R6.2: calendar view ─────────────────────────────────────────── */
.cal-wrap{width:100%;padding:12px 16px;box-sizing:border-box}
.cal-nav{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.cal-month-label{font-size:16px;font-weight:700;flex:1;text-align:center;color:var(--text)}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);border-left:1px solid var(--border2);border-top:1px solid var(--border2)}
.cal-head{text-align:center;font-size:11px;font-weight:700;text-transform:uppercase;color:var(--muted);padding:6px 0;background:var(--bg2,#f7f8fc);border-right:1px solid var(--border2);border-bottom:1px solid var(--border2)}
.cal-day{min-height:100px;padding:4px 5px;border-right:1px solid var(--border2);border-bottom:1px solid var(--border2);box-sizing:border-box;position:relative;cursor:pointer;transition:background .1s}
.cal-day:hover{background:var(--hover,#f3f4f8)}
.cal-day.other-month{background:var(--bg2,#f7f8fc);cursor:default}
.cal-day.other-month .cal-day-num{color:var(--muted);opacity:.5}
.cal-day.today{background:#eef4ff}
.cal-day.today .cal-day-num{background:var(--accent,#5b5bf0);color:#fff;border-radius:50%;width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;font-weight:700}
.cal-day.has-tasks::after{content:"";display:block;width:5px;height:5px;border-radius:50%;background:var(--accent,#5b5bf0);position:absolute;bottom:4px;right:5px;opacity:.6}
.cal-day-num{display:inline-block;font-size:12px;font-weight:600;color:var(--text);margin-bottom:3px;line-height:1}
.cal-chip{font-size:11px;font-weight:500;color:#fff;border-radius:4px;padding:2px 5px;margin-bottom:2px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;cursor:pointer;opacity:.92;transition:opacity .1s}
.cal-chip:hover{opacity:1}
.cal-more{font-size:11px;color:var(--accent,#5b5bf0);cursor:pointer;padding:1px 3px;font-weight:600}
.cal-more:hover{text-decoration:underline}

/* ── R5.3: automations modal ─────────────────────────────────────── */
.auto-rule{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:8px;background:var(--bg2,#f7f8fc);margin-bottom:7px;border:1px solid var(--border2)}
.auto-rule.disabled{opacity:.5}
.auto-rule-desc{flex:1;display:flex;flex-direction:column;gap:2px}
.auto-rule-trigger{font-size:13px;color:var(--text)}
.auto-rule-actions{font-size:11px;color:var(--muted)}
.auto-toggle{position:relative;display:inline-block;width:34px;height:18px;flex-shrink:0}
.auto-toggle input{opacity:0;width:0;height:0;position:absolute}
.auto-toggle-track{position:absolute;inset:0;background:#ccc;border-radius:18px;transition:background .2s;cursor:pointer}
.auto-toggle input:checked+.auto-toggle-track{background:var(--accent,#5b5bf0)}
.auto-toggle-track::before{content:"";position:absolute;width:12px;height:12px;left:3px;top:3px;border-radius:50%;background:#fff;transition:transform .2s}
.auto-toggle input:checked+.auto-toggle-track::before{transform:translateX(16px)}
.auto-form{background:var(--bg2,#f7f8fc);border:1px solid var(--border2);border-radius:10px;padding:14px;margin-top:10px}
.auto-form-section{margin-bottom:12px}
.auto-action-row{display:flex;align-items:center;gap:6px;margin-bottom:6px;flex-wrap:wrap}

/* ── R4: print view ──────────────────────────────────────────────── */
@media print{
  #sidebar,#mtop,#mnav,#sbback,.sb-toggle,.bellbtn-fixed{display:none!important}
  #crumbProj,#trkFav,.search,#aiBtn,#tImport,#tExport,#tPrint,#addItemBtn,#shareBtn,#trkMenuBtn,.sv-bar,.tabs,.toolbar,.bulk-bar,.addrow,.toast,.hrow .pill,.hrow .tag,.hmore-wrap,#tMore{display:none!important}
  #app{display:block!important;height:auto!important}
  #main{overflow:visible!important;max-height:none!important;padding:0}
  .tblwrap{max-height:none!important;overflow:visible!important;box-shadow:none!important;border-radius:0;border:1px solid #ccc}
  .tbl.fixed td{white-space:normal;height:auto!important}
  .rowx,th .col-resize{display:none!important}
  body{background:#fff}
}

/* ── R6.6: dark mode ──────────────────────────────────────────────── */
body.dark-mode {
  color-scheme: dark;
  --bg: #0f1117;
  --surface: #1a1d2e;
  --border: #2a2d45;
  --border2: #32365a;
  --text: #e8eaf2;
  --muted: #8b8fa8;
  --faint: #5a5e7a;
  --accent-soft: #1e1f3a;
}
body.dark-mode #sidebar { background: #0d0f1c; color: #c5c8e0; }
body.dark-mode .modal-wrap { background: rgba(0,0,0,.6); }
body.dark-mode .modal { background: var(--surface); color: var(--text); }
body.dark-mode .item-panel, body.dark-mode #ntfPanel { background: var(--surface); }
body.dark-mode .card, body.dark-mode .cv-card { background: var(--surface); border-color: var(--border); }
body.dark-mode input, body.dark-mode select, body.dark-mode textarea { background: #1e2035; color: var(--text); border-color: var(--border2); }
body.dark-mode .tbl-wrap table { background: var(--surface); }
body.dark-mode tr:hover { background: #1e2035 !important; }
body.dark-mode .tbl.fixed th:first-child{background:#141628}
body.dark-mode .tbl.fixed td.title-cell{background:#0f1124}
body.dark-mode .tbl.fixed tr:hover td.title-cell{background:#1e2035}
body.dark-mode .grp-head { background: #1a2040 !important; }
body.dark-mode .grp2-head { background: #161830 !important; }
body.dark-mode .bellbtn-fixed { background: var(--surface); border-color: var(--border2); color: var(--muted); }
body.dark-mode .sb-toggle { color: #6b7088; }
body.dark-mode .hrow, body.dark-mode .toolbar { background: var(--surface); }
body.dark-mode .hmore-pop{background:var(--surface);border-color:var(--border)}
body.dark-mode .tabs { background: var(--surface); border-color: var(--border); }
body.dark-mode .sv-bar { background: var(--surface); border-color: var(--border); }
body.dark-mode .tbtn { color: var(--muted); }
body.dark-mode .tbtn:hover, body.dark-mode .tbtn.on { color: var(--accent); background: var(--accent-soft); }
body.dark-mode .btn { background: var(--surface); color: var(--text); border-color: var(--border2); }
body.dark-mode .btn.primary { background: var(--accent); color: #fff; border-color: var(--accent); }
body.dark-mode .col { background: #14172a; }
body.dark-mode .cal-day { background: var(--surface); border-color: var(--border); }
body.dark-mode .cal-day.today { background: #1a1f40; }
body.dark-mode .cal-head { background: #13162a; color: var(--muted); }

/* ── R6.4: milestone diamond on timeline ─────────────────────────── */
.tl-milestone{position:absolute;width:14px;height:14px;background:var(--accent,#5b5bf0);transform:rotate(45deg);top:50%;margin-top:-7px;border-radius:2px;cursor:pointer;z-index:2}

/* ── Action Centre ───────────────────────────────────────────────── */
.ac-wrap{padding:0 18px 32px}
.ac-wrap .lrow{border-bottom:1px solid var(--border);cursor:pointer}
.ac-wrap .lrow:hover{background:var(--accent-soft)}
.ac-wrap .meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:2px}

/* ── Portfolio Dashboard ─────────────────────────────────────────── */
.pf-wrap{padding:18px 20px 32px}
.pf-summary{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:24px}
.pf-kpi{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:14px 20px;display:flex;flex-direction:column;align-items:center;gap:4px;min-width:90px}
.pf-kpi b{font-size:24px;font-weight:800;color:var(--fg);line-height:1}
.pf-kpi span{font-size:11px;color:var(--muted);font-weight:500;text-transform:uppercase;letter-spacing:.04em}
.pf-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:16px}
.pf-card{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:16px 18px;cursor:pointer;transition:box-shadow .15s,transform .1s}
.pf-card:hover{box-shadow:0 4px 20px rgba(0,0,0,.1);transform:translateY(-2px)}
.pf-card-head{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.pf-icon{font-size:22px;flex-shrink:0}
.pf-name{font-weight:700;font-size:15px;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pf-badge{font-size:11px;font-weight:700;color:#fff;background:var(--stuck);border-radius:99px;padding:2px 8px;flex-shrink:0}
.pf-stats{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);margin-bottom:6px}
.pf-pct{font-weight:700;color:var(--fg)}
.pf-bar{height:6px;background:var(--border);border-radius:3px;overflow:hidden;margin-bottom:12px}
.pf-bar-fill{height:100%;background:var(--done);border-radius:3px;transition:width .4s}
.pf-trackers{display:flex;flex-wrap:wrap;gap:4px}

/* ── Lookup / xrollup cells ──────────────────────────────────────── */
.num.formula{color:var(--accent)}

/* ── Built-in Priority flags ─────────────────────────────────────── */
.pri-flag{font-size:13px;line-height:1;cursor:default}
.pri-flag.sm{font-size:11px}
.ip-pri-row{display:flex;align-items:center;gap:10px;padding:10px 0 6px;border-top:1px solid var(--border);margin-top:8px}
.ip-pri-flags{display:flex;gap:4px;align-items:center}
.pri-flag-btn{background:none;border:none;font-size:18px;cursor:pointer;opacity:.4;padding:2px 4px;border-radius:5px;transition:opacity .15s,transform .1s}
.pri-flag-btn:hover{opacity:.75;transform:scale(1.15)}
.pri-flag-btn.active{opacity:1;transform:scale(1.2)}

/* ── Action Centre toolbar ───────────────────────────────────────── */
.ac-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:5px;padding:8px 18px;border-bottom:1px solid var(--border);background:var(--surface)}
.ac-toolbar .tb-search{font-size:12px;border:1px solid var(--border);border-radius:6px;padding:4px 8px;background:var(--bg);color:var(--fg)}
/* ── Advanced filter modal ───────────────────────────────────────── */
.fp-header{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.fp-row{display:flex;align-items:center;gap:6px;margin-bottom:8px;flex-wrap:wrap}
.fp-field,.fp-op{font-size:12px;border:1px solid var(--border);border-radius:6px;padding:4px 6px;background:var(--bg);color:var(--fg);cursor:pointer}
.fp-field{min-width:120px}.fp-op{min-width:90px}
.fp-val,.fp-val2{font-size:12px;border:1px solid var(--border);border-radius:6px;padding:4px 6px;background:var(--bg);color:var(--fg);min-width:100px;max-width:160px}
.fp-rm{background:none;border:none;cursor:pointer;color:var(--muted);font-size:14px;padding:2px 6px;border-radius:4px}
.fp-rm:hover{color:var(--stuck);background:var(--surface2)}
.fp-noval{font-size:12px;color:var(--muted);min-width:100px}
/* ── Cmd+K Global Search ─────────────────────────────────────────── */
.gs-wrap{width:100%;max-width:560px;margin:0 auto}
.gs-input-wrap{display:flex;align-items:center;gap:10px;border-bottom:2px solid var(--border);padding-bottom:10px;margin-bottom:4px}
.gs-input{flex:1;font-size:15px;border:none;outline:none;background:transparent;color:var(--fg)}
.gs-results{max-height:400px;overflow-y:auto}
.gs-group{margin-top:8px}
.gs-group-label{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;padding:6px 4px 3px}
.gs-row{display:flex;align-items:center;gap:6px;padding:7px 8px;border-radius:7px;cursor:pointer;font-size:13px}
.gs-row:hover{background:var(--accent-soft)}
.gs-title{flex:1;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gs-meta{font-size:11px;color:var(--muted)}
.gs-empty{text-align:center;padding:24px;font-size:13px;color:var(--muted)}
.tb-sep{display:inline-block;width:1px;height:18px;background:var(--border);margin:0 2px;flex-shrink:0}
.tbtn-label{font-size:11px;color:var(--muted);white-space:nowrap}
/* AC table view */
.ac-table{padding:0 18px 32px;min-width:0}
.ac-tbl-head{display:flex;align-items:center;padding:6px 10px;background:var(--surface2);border-bottom:2px solid var(--border);font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;border-radius:6px 6px 0 0;gap:4px}
.ac-tbl-row{display:flex;align-items:center;padding:7px 10px;border-bottom:1px solid var(--border);cursor:pointer;gap:4px;font-size:13px}
.ac-tbl-row:hover{background:var(--accent-soft)}
.ac-tc{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:flex;align-items:center;gap:4px}

/* ── Tracker type picker ─────────────────────────────────────────── */
.tt-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin:4px 0 4px}
.tt-card{border:2px solid var(--border);border-radius:10px;padding:14px 12px;cursor:pointer;transition:border-color .15s,background .1s;text-align:center}
.tt-card:hover{border-color:var(--accent);background:var(--accent-soft)}
.tt-icon{font-size:28px;margin-bottom:6px}
.tt-label{font-size:13px;font-weight:700;color:var(--fg);margin-bottom:4px}
.tt-desc{font-size:11px;color:var(--muted);line-height:1.5}
.tt-grid-sm{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 8px}
.tt-card-sm{display:flex;align-items:center;gap:6px;border:1px solid var(--border);border-radius:8px;padding:7px 12px;cursor:pointer;font-size:12px;transition:border-color .15s,background .1s}
.tt-card-sm:hover{border-color:var(--accent);background:var(--accent-soft)}
.tt-icon-sm{font-size:16px}
.tt-label-sm{font-weight:600;color:var(--fg)}
/* tracker type badge in header */
.tracker-type-badge{font-size:11px;font-weight:600;padding:2px 8px;border-radius:10px;border:1px solid currentColor;opacity:.7}
.type-register{color:#5b5bf0}.type-timeline{color:#00b5c4}.type-workflow{color:#a25ddc}

/* ── Register preset preview ─────────────────────────────────────── */
.reg-preview-label{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin:12px 0 5px}
.reg-preview-fields{background:var(--surface2);border-radius:8px;padding:8px 12px;display:flex;flex-direction:column;gap:4px;max-height:220px;overflow-y:auto}
.reg-preview-row{display:flex;align-items:center;justify-content:space-between;padding:3px 0;font-size:12px}
.reg-preview-fixed{font-weight:600;color:var(--muted)}

/* ── Register log view ───────────────────────────────────────────── */
.rlog-wrap{overflow-x:auto;padding:0}
.rlog-table{width:100%;border-collapse:collapse;font-size:12.5px;min-width:500px}
.rlog-table thead th{background:var(--surface2);border-bottom:2px solid var(--border);padding:7px 10px;text-align:left;font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;position:sticky;top:0;z-index:2}
.rlt{padding:6px 10px;border-bottom:1px solid var(--border)}
.rlog-row{cursor:pointer;transition:background .1s}
.rlog-row:hover{background:var(--accent-soft)}
.rlog-num{font-weight:800;font-size:11.5px;color:var(--accent);white-space:nowrap;min-width:80px}
.rlog-title{font-weight:500;min-width:160px}
.rlog-open{}
.rlog-closed{opacity:.55}
.rlog-empty{text-align:center;padding:24px;color:var(--muted);font-size:13px}
.rlog-section-row{cursor:pointer;background:var(--surface2)}
.rlog-section-label{font-size:11.5px;font-weight:700;color:var(--muted);padding:6px 10px;display:block}
.rlog-section-row:hover .rlog-section-label{color:var(--fg)}
.rlog-act{text-align:right;white-space:nowrap}
.rlog-close-btn{font-size:10px;padding:2px 8px}
.reg-status-pill{display:inline-block;padding:2px 9px;border-radius:10px;font-size:10.5px;font-weight:700;color:#fff;white-space:nowrap}

/* ── Register item panel header ──────────────────────────────────── */
.reg-item-header{display:flex;align-items:center;gap:10px;padding:10px 0 12px;border-bottom:1px solid var(--border);margin-bottom:10px;flex-wrap:wrap}
.reg-item-num{font-size:18px;font-weight:900;color:var(--accent);letter-spacing:.02em}
.reg-locked-badge{font-size:10.5px;color:var(--muted);background:var(--surface2);border:1px solid var(--border);border-radius:6px;padding:2px 8px}

/* ── Pivot view ─────────────────────────────────────────────────── */
.pv-toolbar{display:flex;align-items:center;gap:8px;padding:10px 18px;border-bottom:1px solid var(--border);background:var(--surface);flex-wrap:wrap}
.pv-lbl{font-size:11px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.pv-sel{font-size:12px;border:1px solid var(--border);border-radius:6px;padding:4px 8px;background:var(--bg);color:var(--fg);cursor:pointer}
.pv-wrap{overflow:auto;padding:18px;min-height:200px}
.pv-table{border-collapse:collapse;font-size:13px;min-width:400px}
.pv-table th,.pv-table td{border:1px solid var(--border);padding:6px 12px;text-align:center;min-width:60px}
.pv-corner{background:var(--surface2);font-size:11px;font-weight:700;color:var(--muted);text-align:left}
.pv-colh{background:var(--surface2);font-weight:600;font-size:12px;color:var(--fg)}
.pv-rowh{font-weight:600;text-align:left;background:var(--surface2);white-space:nowrap;font-size:12px}
.pv-total{font-weight:700;background:var(--surface2);color:var(--muted)}
.pv-cell{cursor:pointer;transition:background .1s;font-weight:500}
.pv-cell:hover{background:var(--accent-soft)!important;color:var(--accent)}
.pv-cell:empty{color:transparent;cursor:default}
.heat-0{background:transparent}.heat-1{background:rgba(91,91,240,.04)}.heat-2{background:rgba(91,91,240,.08)}
.heat-3{background:rgba(91,91,240,.13)}.heat-4{background:rgba(91,91,240,.18)}.heat-5{background:rgba(91,91,240,.25)}
.heat-6{background:rgba(91,91,240,.33)}.heat-7{background:rgba(91,91,240,.42)}.heat-8{background:rgba(91,91,240,.54)}
.heat-9{background:rgba(91,91,240,.68)}.heat-10{background:rgba(91,91,240,.82);color:#fff}
.pv-modal-list{max-height:300px;overflow-y:auto;margin:8px 0}
.pv-modal-row{padding:8px 12px;border-radius:7px;cursor:pointer;font-size:13px}
.pv-modal-row:hover{background:var(--accent-soft)}

/* ── Task dependencies ──────────────────────────────────────────── */
.ip-dep-row{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid var(--border);font-size:13px}
.ip-dep-kind{font-size:11px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;min-width:70px}
.ip-dep-title{flex:1;cursor:pointer;color:var(--accent);font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ip-dep-title:hover{text-decoration:underline}
.ip-dep-rm{background:none;border:none;cursor:pointer;color:var(--muted);font-size:13px;padding:2px 5px;border-radius:4px}
.ip-dep-rm:hover{color:var(--stuck);background:var(--surface2)}
.ip-deps-list{min-height:24px;padding:4px 0}
.ip-deps-add{display:flex;align-items:center;gap:6px;margin-top:10px;flex-wrap:wrap}
.ip-deps-add .inp{font-size:12px;padding:5px 8px;flex:1;min-width:120px}

/* ── Automation webhook action row ──────────────────────────────── */
.auto-action-row{display:flex;align-items:center;gap:6px;margin-bottom:6px;flex-wrap:wrap}

/* ── Gantt / Timeline tracker view ─────────────────────────────── */
.gantt-wrap{display:flex;flex-direction:column;height:100%;overflow:hidden}
.gantt-toolbar{display:flex;align-items:center;gap:6px;padding:8px 12px;border-bottom:1px solid var(--border);flex-shrink:0;flex-wrap:wrap}
.gantt-toolbar-label{font-size:12px;font-weight:500;color:var(--dim)}
.gantt-legend{display:flex;align-items:center;gap:6px;font-size:11px;margin-left:auto;color:var(--text)}
.gc-lg{display:inline-block;width:14px;height:8px;border-radius:2px;vertical-align:middle;margin-right:2px}
.gantt-container{display:flex;flex:1;overflow:hidden;min-height:0}
/* Left name column */
.gantt-left-col{width:240px;flex-shrink:0;border-right:2px solid var(--border);display:flex;flex-direction:column}
.gantt-col-hdr{display:flex;align-items:center;justify-content:space-between;padding:0 10px;height:48px;border-bottom:1px solid var(--border);background:var(--surface2);font-size:11px;font-weight:600;flex-shrink:0}
.gantt-name-list{overflow-y:auto;overflow-x:hidden;flex:1;scrollbar-width:thin}
.gantt-name-row{display:flex;align-items:center;gap:6px;padding:0 10px;border-bottom:1px solid var(--border);cursor:pointer;box-sizing:border-box}
.gantt-name-row:hover{background:var(--hover)}
.gantt-name-text{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}
.gantt-dur-text{font-size:11px;flex-shrink:0;min-width:28px;text-align:right}
/* Right chart column */
.gantt-chart-col{flex:1;overflow:hidden;display:flex;flex-direction:column;min-width:0}
.gantt-chart-hdr{flex-shrink:0;overflow:hidden;border-bottom:1px solid var(--border)}
.gantt-months-row{display:flex;height:28px}
.gantt-month-cell{border-right:1px solid var(--border);padding:4px 6px;font-size:11px;font-weight:600;background:var(--surface2);overflow:hidden;white-space:nowrap;flex-shrink:0}
.gantt-weeks-row{height:20px;position:relative}
.gantt-week-cell{position:absolute;border-right:1px solid #e5e7eb;padding:2px 4px;font-size:10px;color:#9aa0ad;overflow:hidden;white-space:nowrap}
.gantt-chart-scroll{flex:1;overflow:auto;scrollbar-width:thin}
.gantt-chart-inner{position:relative}
/* Grid & today */
.gc-grid-line{position:absolute;top:0;width:1px;background:#e5e7eb;pointer-events:none}
.gc-today-line{position:absolute;top:0;width:2px;background:rgba(226,68,92,.6);pointer-events:none}
/* Chart rows */
.gc-row{position:relative;border-bottom:1px solid #f0f2f5;box-sizing:border-box}
/* Bars */
.gc-bar{position:absolute;border-radius:3px;cursor:pointer;transition:opacity .12s}
.gc-bar:hover{opacity:.8}
.gc-baseline{height:6px;top:6px;background:#d1d5db}
.gc-plan{height:12px;top:15px;background:#579bfc;display:flex;align-items:center;overflow:hidden}
.gc-actual{height:8px;top:29px}
.gc-bar-lbl{font-size:9px;color:#fff;padding:0 4px;white-space:nowrap;overflow:hidden;pointer-events:none;line-height:1}
.gc-milestone{position:absolute;width:0;height:0;top:15px;margin-left:-7px;border-left:7px solid transparent;border-right:7px solid transparent;border-top:14px solid #a25ddc;cursor:pointer}
.gc-deps-svg{display:block}
.gc-dep-arrow{fill:none;stroke:#94a3b8;stroke-width:1.5}
/* ── Timeline dates in item panel ──────────────────────────────── */
.tl-dates-section{background:var(--surface2);border:1px solid var(--border);border-radius:8px;padding:12px 14px;margin-bottom:14px}
.tl-dates-title{font-size:11px;font-weight:700;color:var(--dim);text-transform:uppercase;letter-spacing:.05em;margin-bottom:10px}
.tl-date-row{display:flex;align-items:flex-start;gap:8px;margin-bottom:8px}
.tl-date-row-lbl{font-size:11px;font-weight:700;width:56px;flex-shrink:0;padding-top:16px}
.tl-date-pair{display:flex;gap:8px;flex:1}
.tl-date-pair>div{flex:1;display:flex;flex-direction:column;gap:3px}
.tl-date-cell label{font-size:10px;color:var(--dim);font-weight:500}
.tl-date-inp{padding:4px 6px;border:1px solid var(--border);border-radius:5px;font-size:12px;background:var(--bg);color:var(--text);width:100%;box-sizing:border-box}
.tl-date-inp:disabled{opacity:.5}
.tl-dur-row{font-size:11px;color:var(--dim);margin-top:8px;padding-top:8px;border-top:1px solid var(--border)}

/* ── Workflow Stage Grid view ────────────────────────────────────── */
.wf-wrap{overflow:auto;height:100%;padding:0}
.wf-grid{border-collapse:collapse;min-width:100%;font-size:13px}
.wf-name-hdr{position:sticky;left:0;z-index:3;background:var(--surface2);padding:10px 14px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;border-bottom:2px solid var(--border);white-space:nowrap;min-width:180px}
.wf-stage-hdr{padding:8px 14px;border-bottom:2px solid var(--border);border-right:1px solid var(--border);font-size:12px;font-weight:600;min-width:140px;text-align:left;vertical-align:bottom;background:var(--surface2)}
.wf-stage-pct{display:flex;align-items:center;gap:6px;margin-top:4px;font-size:10px;color:var(--dim);font-weight:400}
.wf-mini-bar{display:inline-block;width:60px;height:4px;background:var(--border);border-radius:2px;overflow:hidden;flex-shrink:0}
.wf-mini-bar i{display:block;height:100%;border-radius:2px;transition:width .3s}
.wf-row{border-bottom:1px solid var(--border)}
.wf-row:hover{background:var(--hover)}
.wf-name-cell{position:sticky;left:0;z-index:2;background:var(--bg);padding:10px 14px;font-size:13px;font-weight:500;cursor:pointer;border-right:2px solid var(--border);white-space:nowrap;max-width:220px;overflow:hidden;text-overflow:ellipsis}
.wf-row:hover .wf-name-cell{background:var(--hover)}
.wf-cell{padding:8px 10px;border-right:1px solid var(--border);vertical-align:top;cursor:pointer;min-height:56px}
.wf-cell:hover{background:var(--accent-soft)}
.wf-status-pill{display:inline-flex;align-items:center;gap:3px;padding:2px 8px;border-radius:20px;font-size:11px;font-weight:600;color:#fff;white-space:nowrap}
.wf-cell-date{display:block;font-size:10px;color:var(--dim);margin-top:3px}
.wf-late{color:#e2445c!important;font-weight:600}
.wf-iter-badge{display:inline-block;font-size:10px;color:var(--muted);background:var(--surface2);border:1px solid var(--border);border-radius:10px;padding:1px 5px;margin-top:3px}
/* ── Workflow builder stage rows ─────────────────────────────────── */
.wfb-stages{display:flex;flex-direction:column;gap:4px;max-height:300px;overflow-y:auto;padding:2px}
.wfb-row{display:flex;align-items:center;gap:6px;padding:5px 4px;border:1px solid var(--border);border-radius:7px;background:var(--bg);cursor:grab;user-select:none}
.wfb-row.dragging{opacity:.5}
.wfb-row:hover{background:var(--hover)}
/* ── Stage panel (inside modal) ─────────────────────────────────── */
.wfs-iters{margin-top:12px;padding-top:10px;border-top:1px solid var(--border)}
.wfs-iter-title{font-size:11px;font-weight:700;color:var(--dim);text-transform:uppercase;letter-spacing:.04em;margin-bottom:6px}
.wfs-iter-row{display:flex;align-items:center;gap:8px;padding:5px 0;border-bottom:1px solid var(--border);font-size:12px;flex-wrap:wrap}
.wfs-iter-n{font-size:10px;font-weight:700;color:var(--muted);min-width:20px}
.wfs-iter-note{font-size:11px;color:var(--dim);font-style:italic}

/* ════════════════════════════════════════════════
   v7 — Two-tier tracker header (no title collision)
   ════════════════════════════════════════════════ */
.hrow{flex-wrap:nowrap;gap:12px}
.hrow-id{display:flex;align-items:center;gap:10px;flex:1 1 auto;min-width:0}
.hrow-id .crumb{flex:0 8 auto;min-width:22px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hrow-id h2{min-width:0;display:flex;align-items:center;gap:8px;flex:0 1 auto;overflow:hidden}
.hrow-id h2 .trk-ico{flex:0 0 auto}
.hrow-id h2 #trkName{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.hrow-id .fav.big,.hrow-id .pill.sm,.hrow-id .tracker-type-badge,.hrow-id .tag{flex:0 0 auto}
.hrow-act{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.hrow-act .search input{width:170px}
.hmore-wrap{position:relative}
#tMore{font-size:17px;font-weight:800;line-height:1;padding:7px 11px}
.hmore-pop{position:absolute;top:calc(100% + 6px);right:0;background:var(--surface);border:1px solid var(--border);border-radius:11px;box-shadow:0 12px 40px rgba(23,26,33,.2);padding:6px;min-width:184px;z-index:70;display:none;flex-direction:column;gap:2px}
.hmore-pop.open{display:flex}
.hmore-pop .btn{justify-content:flex-start;border:none;box-shadow:none;width:100%;border-radius:8px;padding:9px 11px;color:var(--text)}
.hmore-pop .btn:hover{background:var(--accent-soft);color:var(--accent)}
.tab.tab-more{color:var(--muted);font-weight:700}
.tab.tab-more:hover{color:var(--accent);background:var(--accent-soft);border-radius:8px 8px 0 0}
@media (max-width:768px){
  .hrow{flex-wrap:wrap}
  .hrow-id{flex:1 1 100%}
  .hrow-act{flex:1 1 100%;justify-content:flex-end}
  .hrow-act .search{flex:1}
  .hrow-act .search input{width:100%}
}

/* ── new field types ── */
.field-link{color:var(--accent);text-decoration:none;font-size:13px}
.field-link:hover{text-decoration:underline}
.autonumber-val{font-family:monospace;font-size:12px;color:#6b7280;letter-spacing:.5px}
.duration-val{font-size:13px;color:#374151}

/* rating field */
.rating-field{display:inline-flex;gap:1px;align-items:center}
.rating-icon{font-size:16px;color:#d1d5db;transition:color .1s}
.rating-icon.on{color:#f59e0b}
.rating-icon:hover{color:#f59e0b;opacity:.8}

/* select display modes */
.icon-badge-wrap{display:inline-flex;align-items:center;gap:5px;border:2px solid var(--bc,#9aa0ad);border-radius:20px;padding:2px 8px 2px 5px;font-size:12px;font-weight:600;cursor:default;white-space:nowrap;color:var(--bc,#374151)}
.icon-badge-wrap.dd{cursor:pointer}
.icon-badge-icon{font-size:14px;line-height:1}
.icon-badge-label{font-size:12px}
.dot-pill{display:inline-flex;align-items:center;gap:5px;font-size:13px;color:#374151;cursor:default}
.dot-pill.dd{cursor:pointer}
.dot-sw{width:9px;height:9px;border-radius:50%;flex-shrink:0;display:inline-block}

/* builder field type icon */
.btype-icon{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:6px;background:var(--faint);font-size:13px;flex-shrink:0;font-weight:700;color:var(--accent)}
.btype-sel{flex:0 0 150px}
.bopt-icon{width:44px;flex-shrink:0;text-align:center;font-size:14px}
/* option icon picker button */
.bopt-icon-btn{width:30px;height:30px;border-radius:7px;border:1px solid var(--border);background:var(--faint);cursor:pointer;font-size:16px;line-height:1;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;padding:0;transition:border-color .15s}
.bopt-icon-btn:hover{border-color:var(--accent)}
.bopt-icon-btn.bopt-icon-empty{color:var(--muted);font-size:11px}
/* emoji picker popup */
.opt-icon-picker{background:#fff;border:1px solid var(--border);border-radius:11px;box-shadow:0 8px 30px rgba(20,24,40,.18);padding:8px;display:flex;flex-wrap:wrap;gap:4px;width:228px;max-height:180px;overflow-y:auto}
.opt-icon-picker span{width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;border-radius:6px;cursor:pointer;font-size:16px;transition:background .12s}
.opt-icon-picker span:hover{background:var(--faint)}
.opt-icon-picker .oip-clear{font-size:10px;width:auto;padding:0 6px;color:var(--muted)}
.dark-mode .opt-icon-picker{background:#1e2130;border-color:#333}

/* === Builder redesign — card-per-field === */
.btb-header{display:flex;gap:8px;align-items:flex-end;flex-wrap:wrap;padding-bottom:10px;margin-bottom:10px}
.btb-hf{display:flex;flex-direction:column;gap:3px}
.btb-hf label{font-size:10px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}
.btb-hicon{flex:0 0 64px}.btb-hicon input{text-align:center;font-size:22px}
.btb-hname{flex:1;min-width:180px}.btb-hname input{font-size:15px;font-weight:600}
.btb-hprio{flex:0 0 110px}.btb-hcat{flex:0 0 170px}.btb-htlbl{flex:0 0 130px}
.bc-fields-wrap{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column}
.bc-fields-hdr{font-size:10px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:5px;display:flex;align-items:center;gap:6px}
.btb-fcnt{background:var(--faint);border-radius:20px;padding:1px 7px;font-size:11px;color:var(--muted)}
#bFields{display:flex;flex-direction:column;gap:4px}
.bc-add-btn{margin-top:8px;padding:8px 0;color:var(--accent);font-size:13px;cursor:pointer;font-weight:500;user-select:none;display:flex;align-items:center;gap:5px}
.bc-add-btn:hover{opacity:.75}
/* Field card */
.bcard{background:var(--surface);border:1px solid #eef0f6;border-radius:10px;overflow:hidden;transition:box-shadow .15s}
.bcard:hover{box-shadow:0 2px 8px rgba(20,24,40,.06)}
.bcard.drag-over{outline:2px solid var(--accent)}
.bcard-head{display:flex;align-items:center;gap:7px;padding:7px 10px}
.bcard-drag{color:var(--muted);cursor:grab;font-size:12px;opacity:.35;flex-shrink:0;padding:2px}
.bcard-label{flex:1;font-size:14px;font-weight:600;border:none;background:transparent;outline:none;min-width:0}
.bcard-type{flex:0 0 168px;font-size:12px}
.bcard-dup{color:var(--muted);cursor:pointer;font-size:16px;padding:2px 5px;border-radius:5px;transition:color .1s;flex-shrink:0}
.bcard-dup:hover{color:var(--accent)}
.bcard-del{color:var(--muted);cursor:pointer;font-size:13px;padding:2px 6px;border-radius:5px;transition:all .1s;flex-shrink:0;opacity:.5}
.bcard-del:hover{background:#fee2e2;color:#dc2626;opacity:1}
.bcard-cfg{border-top:1px solid #f0f1f7;padding:7px 10px 7px 36px;display:flex;flex-direction:column;gap:6px;background:var(--faint)}
/* Options in card */
.bc-presets{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.bc-preset-lbl{font-size:10.5px;color:var(--faint);font-weight:600;white-space:nowrap;margin-right:2px}
.bc-preset-btn{font-size:11px;font-weight:600;padding:3px 9px;border-radius:20px;border:1.5px solid var(--border2);background:#fff;color:var(--muted);cursor:pointer;transition:.13s;white-space:nowrap}
.bc-preset-btn:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-soft)}
.bc-opts{display:flex;flex-wrap:wrap;gap:5px;align-items:center}
.bc-opt{display:inline-flex;align-items:center;gap:4px;background:var(--surface);border:1px solid #eef0f6;border-radius:7px;padding:3px 7px;cursor:default}
.bc-opt.drag-over{outline:2px solid var(--accent)}
.bc-opt-drag{color:var(--muted);cursor:grab;font-size:10px;opacity:.35}
.bc-opt-icon{font-size:13px;line-height:1;flex-shrink:0}
.bc-opt input[type=color]{width:16px;height:16px;border:none;border-radius:3px;cursor:pointer;padding:0;background:none;flex-shrink:0}
.bc-opt-lbl{border:none;background:transparent;outline:none;font-size:12.5px;width:76px;min-width:36px}
.bc-opt-del{color:var(--muted);cursor:pointer;font-size:10px;padding:1px 3px;border-radius:3px;opacity:.4;transition:all .1s}
.bc-opt-del:hover{background:#fee2e2;color:#dc2626;opacity:1}
.bc-addopt{font-size:11.5px;color:var(--accent);cursor:pointer;padding:3px 8px;border-radius:7px;border:1.5px dashed var(--border);font-weight:500;white-space:nowrap;transition:border-color .1s}
.bc-addopt:hover{border-color:var(--accent)}
/* Config rows inside card */
.bc-cfg-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.bc-cfg-lbl{font-size:11px;color:var(--muted);white-space:nowrap;flex-shrink:0}
.bc-twin{display:flex;gap:6px;flex-wrap:wrap}
.bc-twin select{flex:1;min-width:120px}
.bc-formula-inp{width:100%;font-family:monospace;font-size:13px;padding:7px 9px;border-radius:7px;border:1px solid var(--border)}
.bc-hint{font-size:11px;color:var(--muted);line-height:1.4}
.pri-pill{display:inline-flex;align-items:center;gap:4px;padding:2px 9px;border-radius:20px;font-size:12px;font-weight:700;border:1.5px solid;white-space:nowrap;cursor:default}
.bc-req-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding-top:1px}
.bc-req-lbl{font-size:13px;display:flex;align-items:center;gap:5px;cursor:pointer;white-space:nowrap}
.bc-def-inp{flex:1;min-width:120px}
/* Tracker settings collapsible */
.btb-settings{margin-top:8px;flex-shrink:0}
.btb-settings>summary{padding:10px 0 8px;cursor:pointer;font-size:13px;color:var(--muted);user-select:none;font-weight:500;list-style:none;display:flex;align-items:center;gap:6px}
.btb-settings>summary::before{content:"▶";font-size:9px;transition:transform .15s}
.btb-settings[open]>summary::before{transform:rotate(90deg)}
.btb-settings-body{padding:4px 0 10px}
.dark-mode .bcard{background:var(--surface2)}
.dark-mode .bc-opt{background:var(--surface)}
.dark-mode .bcard-del:hover,.dark-mode .bc-opt-del:hover{background:#450a0a;color:#fca5a5}

/* ══════════════════════════════════════
   Dashboard View
   ══════════════════════════════════════ */
.dash-wrap{padding:22px;display:flex;flex-direction:column;gap:20px;max-width:1400px}
/* KPI row */
.dkpi-row{display:flex;gap:12px;flex-wrap:wrap}
.dkpi{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:16px 20px;flex:1;min-width:110px;display:flex;flex-direction:column;box-shadow:var(--shadow);gap:4px}
.dkpi-n{font-size:30px;font-weight:800;line-height:1;color:var(--text)}
.dkpi-l{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}
/* Charts grid */
.dchart-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
.dcard{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:18px 20px;box-shadow:var(--shadow)}
.dcard-t{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:14px}
.dcard-body{display:flex;flex-direction:column;gap:0}
/* Donut layout */
.donut-layout{flex-direction:row!important;align-items:center;gap:16px}
.donut-layout svg{flex-shrink:0}
/* Legend */
.dlegend{display:flex;flex-direction:column;gap:7px;flex:1;min-width:0}
.dlr{display:flex;align-items:center;gap:6px;font-size:12px}
.dld{width:9px;height:9px;border-radius:50%;flex-shrink:0}
.dll{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text);font-weight:500}
.dlc{color:var(--text);flex-shrink:0;font-size:13px}
.dlp{color:var(--muted);min-width:30px;text-align:right;font-size:11px}
/* Bar chart */
.dbar-row{display:flex;align-items:center;gap:8px;margin-bottom:9px;font-size:12.5px}
.dbar-row:last-child{margin-bottom:0}
.dbar-lbl{flex:0 0 110px;color:var(--text);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px}
.dbar-track{flex:1;height:26px;background:var(--bg);border-radius:7px;overflow:hidden}
.dbar-fill{height:100%;border-radius:7px;min-width:4px;transition:width .5s cubic-bezier(.4,0,.2,1)}
.dbar-cnt{flex:0 0 30px;text-align:right;font-weight:800;font-size:13px;color:var(--text)}
/* Number summary grid */
.dnum-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.dnum-cell{background:var(--bg);border-radius:9px;padding:10px 12px;display:flex;flex-direction:column;gap:3px}
.dnum-v{font-size:20px;font-weight:800;color:var(--text)}
.dnum-l{font-size:10.5px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.4px}
/* AI section */
.dash-ai{margin-top:0}
.dash-ai-hint{font-size:13px;color:var(--muted);margin:0 0 12px}
.dash-ai-loading{font-size:13px;color:var(--accent);padding:8px 0;animation:pulse 1.2s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:.5}50%{opacity:1}}
.dash-ai-out{margin-top:14px;font-size:13.5px;line-height:1.7;color:var(--text);white-space:pre-wrap}
/* Dark mode */
body.dark-mode .dkpi,body.dark-mode .dcard{background:var(--surface);border-color:var(--border)}
body.dark-mode .dnum-cell{background:rgba(255,255,255,.04)}
body.dark-mode .dbar-track{background:rgba(255,255,255,.06)}

/* ── RBAC: locked rows and columns ── */
.row-locked{background:repeating-linear-gradient(135deg,transparent,transparent 18px,rgba(0,0,0,.018) 18px,rgba(0,0,0,.018) 20px)!important}
.row-locked td{color:var(--dim)!important}
.lock-ico{font-size:10px;opacity:.6;margin-left:4px;cursor:default}
.col-locked-hdr::after{content:" 🔒";font-size:10px;opacity:.5}

/* ── Empty states ── */
.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:60px 24px;gap:10px}
.empty-state.es-compact{padding:30px 20px}
.empty-state.es-tracker{padding:80px 24px}
.es-icon{font-size:44px;line-height:1;margin-bottom:4px}
.es-compact .es-icon{font-size:32px}
.es-title{font-size:18px;font-weight:700;color:var(--text)}
.es-compact .es-title{font-size:15px}
.es-sub{font-size:14px;color:var(--muted);line-height:1.6;max-width:380px}
.es-sub b{color:var(--text)}
.es-cta{margin-top:6px}

/* ── Skeleton loading ── */
@keyframes skel-shine{0%{background-position:-300px 0}100%{background-position:300px 0}}
.skel-wrap{padding:16px 20px;display:flex;flex-direction:column;gap:10px}
.skel-row{display:flex;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--border)}
.skel-cell{height:14px;border-radius:7px;background:linear-gradient(90deg,var(--border) 25%,var(--surface) 50%,var(--border) 75%);background-size:600px 100%;animation:skel-shine 1.4s infinite linear}

/* ── Custom confirm dialog ── */
.sc-body{padding:4px 0}
.sc-title{margin:0 0 10px;font-size:17px}
.sc-msg{margin:0 0 6px;font-size:14px;line-height:1.5;color:var(--text)}
.sc-msg b,.sc-detail b{color:var(--text)}
.sc-detail{margin:0 0 20px;font-size:13px;color:var(--muted);line-height:1.5;padding:8px 12px;background:rgba(239,68,68,.07);border-radius:8px;border-left:3px solid var(--stuck)}
.sc-acts{justify-content:flex-end;gap:8px;margin-top:20px}
.modal-actions{display:flex;gap:8px;margin-top:16px}
.modal-actions.sc-acts{justify-content:flex-end}

/* ── Auth screen: ToS link ── */
.auth-tos{font-size:11px;color:var(--faint);text-align:center;line-height:1.5;margin-top:4px}
.auth-tos a{color:var(--muted);text-decoration:underline}
.auth-tos a:hover{color:var(--accent)}

/* ── No-org waiting screen ── */
/* (reuses .acard) */

/* ── Super-admin platform panel ── */
.sa-panel{width:100%;max-width:960px;margin:0 auto;display:flex;flex-direction:column;gap:0;min-height:100vh}
.sa-head{display:flex;align-items:center;justify-content:space-between;padding:14px 24px;background:#fff;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:10}
.sa-badge{background:linear-gradient(135deg,#5b5bf0,#a25ddc);color:#fff;font-size:10px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;padding:2px 8px;border-radius:20px;margin-left:8px;vertical-align:middle}
.sa-body{padding:28px 24px;flex:1}
.sa-toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}
.sa-loading{color:var(--muted);font-size:13px;padding:24px 0}
.sa-empty{color:var(--muted);font-size:13px;padding:40px 0;text-align:center}
.sa-tbl{width:100%;border-collapse:collapse;font-size:13px}
.sa-tbl thead th{text-align:left;padding:8px 12px;font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;border-bottom:2px solid var(--border);white-space:nowrap}
.sa-tbl tbody tr{border-bottom:1px solid var(--border);transition:background .12s}
.sa-tbl tbody tr:hover{background:var(--accent-soft)}
.sa-tbl td{padding:12px 12px;vertical-align:middle}
.sa-num{text-align:center;font-weight:700;color:var(--text)}
.sa-date{color:var(--muted);font-size:12px;white-space:nowrap}
.sa-email{font-size:12px;color:var(--muted)}
.sa-acts{display:flex;gap:6px;white-space:nowrap}
.sa-del{color:var(--stuck)!important}
.role-chip{font-size:11px;font-weight:700;padding:2px 8px;border-radius:20px;background:var(--accent-soft);color:var(--accent);text-transform:capitalize}
.dark-mode .sa-head{background:#141628;border-color:#2a2d4a}
.dark-mode .sa-tbl tbody tr:hover{background:rgba(91,91,240,.08)}
.sa-add-admin{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:4px}
.sa-add-admin .inp{padding:7px 10px;font-size:13px}
.sa-tabs{display:flex;gap:0;border-bottom:2px solid var(--border);margin-top:4px}
.sa-tab{padding:10px 20px;font-size:13px;font-weight:700;color:var(--muted);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-2px;transition:color .15s}
.sa-tab:hover{color:var(--text)}
.sa-tab.on{color:var(--accent);border-bottom-color:var(--accent)}