:root{
  color-scheme: light;
  --white:#FFFFFF; --paper:#FBFBFA; --wash:#F2F2EF; --wash-2:#E8E8E3;
  --black:#161515; --ink-2:#514F4B; --ink-3:#8C8983;
  --line:#E2E2DC; --line-2:#C9C9C1;
  --citron:#8F9203; --citron-bright:#C7C106; --citron-wash:#F2F3D6;
  --mag:#DF327B; --mag-wash:#FCE4EE; --pink:#EA87D7;
  --orange:#E24C2D; --orange-wash:#FCE6E0;
  --forest:#2F4439; --redwine:#A7171E;
  --p0:#A7171E; --p1:#E24C2D; --p2:#C08A00; --p3:#4A7A63; --p4:#3F6188;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--paper)}
body{color:var(--black);font-family:Figtree,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}
button,input{font-family:inherit;color:inherit}
.mbar{display:none;position:sticky;top:0;z-index:45;background:var(--black);color:var(--paper);
  align-items:center;gap:14px;padding:11px 14px}
.mburger{background:none;border:none;width:26px;height:22px;padding:0;display:flex;flex-direction:column;
  justify-content:space-between;cursor:pointer;flex:none}
.mburger span{display:block;height:2.5px;background:var(--citron-bright);width:100%;transition:transform .18s,opacity .18s}
.mburger[aria-expanded="true"] span:nth-child(1){transform:translateY(9.75px) rotate(45deg)}
.mburger[aria-expanded="true"] span:nth-child(2){opacity:0}
.mburger[aria-expanded="true"] span:nth-child(3){transform:translateY(-9.75px) rotate(-45deg)}
.mburger:focus-visible{outline:2px solid var(--citron-bright);outline-offset:3px}
.mtitle{font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:15px;letter-spacing:-.02em;
  text-transform:uppercase}
.mmark{margin-left:auto;font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:10px;
  letter-spacing:.06em;text-transform:uppercase;color:#6E6B66}
.mmark i{font-style:normal;color:var(--citron)}
.navscrim{display:none;position:fixed;inset:0;background:rgba(22,21,21,.6);z-index:61;opacity:0;
  pointer-events:none;transition:opacity .18s}
.navscrim.on{opacity:1;pointer-events:auto}
.app{display:grid;grid-template-columns:230px 1fr;min-height:100vh}

/* SIDEBAR */
.side{background:var(--black);color:var(--paper);padding:24px 0 50px;position:sticky;top:0;height:100vh;overflow-y:auto}
.mark{padding:0 20px 6px;font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:19px;
  line-height:.98;letter-spacing:-.035em;text-transform:uppercase}
.mark i{font-style:normal;color:var(--citron-bright);display:block}
.savechip{padding:0 20px 22px;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#6E6B66;font-weight:600}
.backup{display:flex;gap:6px;padding:0 20px 20px}
.bkbtn{flex:1;text-align:center;background:none;border:1px solid #3A3836;color:#8C8983;font-size:9px;
  font-weight:800;letter-spacing:.11em;text-transform:uppercase;padding:7px 6px;cursor:pointer;font-family:inherit}
.bkbtn:hover{border-color:var(--citron-bright);color:var(--citron-bright)}
.bkbtn:focus-visible{outline:2px solid var(--citron-bright);outline-offset:2px}
.ng{padding:0 10px;margin-bottom:16px}
.nglab{font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;color:#66635E;font-weight:700;padding:10px 10px 8px}
.nv{display:flex;align-items:center;gap:9px;width:100%;background:none;border:none;text-align:left;
  padding:8px 10px;cursor:pointer;font-size:13.5px;font-weight:600;color:#C9C6C0;line-height:1.25}
.nv:hover{background:#242222;color:var(--paper)}
.nv[aria-current="true"]{background:var(--citron-bright);color:var(--black)}
.nv[aria-current="true"] .nc{color:var(--black);opacity:.7}
.nv:focus-visible{outline:2px solid var(--citron-bright);outline-offset:-2px}
.nv .sw{width:4px;height:15px;flex:none}
.nv .nt{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nv .nc{font-size:11.5px;font-weight:700;color:#7C7973;font-variant-numeric:tabular-nums}
.nv.sub{padding-left:28px;font-size:13px;font-weight:500;color:#A5A29C;position:relative}
.nv.sub::before{content:"";position:absolute;left:16px;top:0;bottom:0;width:1px;background:#332F2F}
.nv.sub:first-of-type::before{top:6px}
.nv.sub[aria-current="true"]::before{background:rgba(22,21,21,.28)}
.nv.hot .nc{color:var(--orange)}
.nv[aria-current="true"].hot .nc{color:var(--black)}

/* MAIN */
.main{padding:0 0 130px;min-width:0;background:var(--paper)}
.calband{border-bottom:1px solid var(--line);background:var(--white)}
.todaystrip{display:flex;align-items:center;gap:16px;padding:13px 40px;background:var(--black);color:var(--paper);flex-wrap:wrap}
.todaystrip .tlab{font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:12px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--citron-bright);flex:none}
.todaystrip .tdate{font-size:12.5px;font-weight:600;flex:none}
.todaystrip .tev{display:flex;gap:14px;flex-wrap:wrap;margin-left:6px}
.todaystrip .tev span{font-size:12px;color:#B4B1AB}
.todaystrip .tev span b{color:var(--paper);font-weight:600}
.calfold{margin-left:auto;background:none;border:1.5px solid #3A3836;color:#B4B1AB;font-size:9.5px;font-weight:800;
  letter-spacing:.12em;text-transform:uppercase;padding:6px 12px;cursor:pointer;flex:none}
.calfold:hover{border-color:var(--citron-bright);color:var(--citron-bright)}
.wkhead{padding:14px 40px 10px;display:flex;align-items:baseline;gap:12px}
.wkhead .wt{font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:12px;letter-spacing:.15em;
  text-transform:uppercase;color:var(--ink-3)}
.wkhead .wr{flex:1;height:1px;background:var(--line)}
.days{display:grid;grid-template-columns:repeat(7,1fr);border-top:1px solid var(--line)}
.dc{border-right:1px solid var(--line);padding:11px 12px 16px;min-height:172px;display:flex;flex-direction:column;gap:6px}
.dc:last-child{border-right:none}
.dc.wknd{background:var(--wash)}
.dc.past{opacity:.4}
.dc.istoday{background:var(--citron-wash);box-shadow:inset 0 4px 0 var(--citron-bright)}
.dc.istoday.wknd{background:var(--citron-wash)}
.dc.istoday .dh{border-bottom-color:var(--citron);border-bottom-width:2.5px}
.dc.istoday .dh .dw{color:var(--citron)}
.dc.istoday .dh .dn{color:var(--black)}
.dc.istoday .dh .dw::after{content:" · today";letter-spacing:.06em}
.wknav{background:none;border:1px solid var(--line);color:var(--ink-3);font-size:10px;font-weight:800;
  letter-spacing:.1em;text-transform:uppercase;padding:5px 9px;cursor:pointer;flex:none;margin-left:5px}
.wknav:hover{border-color:var(--black);color:var(--black)}
.wknav:focus-visible{outline:2px solid var(--citron-bright);outline-offset:1px}
.dh{display:flex;align-items:baseline;justify-content:space-between;padding-bottom:8px;margin-bottom:2px;border-bottom:1.5px solid var(--line-2)}
.dh .dw{font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:800;color:var(--ink-3)}
.dh .dn{font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:20px;line-height:1;letter-spacing:-.03em;color:var(--ink-2)}
.ad{font-size:10px;font-weight:800;letter-spacing:.04em;padding:4px 7px;line-height:1.25;text-transform:uppercase}
.ad.school{background:var(--pink);color:var(--black)}
.ad.dead{background:var(--orange);color:var(--white)}
.ad.kid{background:var(--forest);color:var(--white)}
.ad.work{background:var(--citron-bright);color:var(--black)}
.adsep{height:1px;background:var(--line);margin:2px 0 3px}
.ce{font-size:11px;line-height:1.3;padding-left:8px;border-left:3px solid var(--line-2);color:var(--ink-2)}
.ce b{display:block;font-weight:800;font-size:10px;color:var(--ink-3);letter-spacing:.04em;font-variant-numeric:tabular-nums}
.ce.kid{border-left-color:var(--forest)}
.ce.work{border-left-color:var(--citron)}
.ce.dead{border-left-color:var(--orange);color:var(--orange);font-weight:600}
.ce.school{border-left-color:var(--pink)}
.devs{display:flex;flex-direction:column;gap:6px}
.dc .quiet{font-size:11px;color:var(--line-2);font-style:italic;margin-top:4px}

.masthead{padding:38px 40px 0}
.mh-rule{height:7px;width:64px;margin-bottom:18px}
.masthead h1{font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:44px;line-height:.96;
  letter-spacing:-.04em;margin:0;text-transform:uppercase}
.masthead .sub{color:var(--ink-2);font-size:14.5px;margin-top:14px;max-width:58ch;line-height:1.55}
.body{padding:34px 40px 0}

/* TABLE */
.tblwrap{background:var(--white);border:1px solid var(--line)}
.tbl{width:100%;border-collapse:collapse}
.tbl thead th{font-family:"Bricolage Grotesque",sans-serif;font-size:10px;letter-spacing:.16em;text-transform:uppercase;
  color:#B4B1AB;font-weight:700;text-align:left;padding:12px 14px;background:var(--black);white-space:nowrap}
.tbl thead th.r{text-align:right}
.grouprow td{background:var(--citron-bright);color:var(--black);font-family:"Bricolage Grotesque",sans-serif;
  font-weight:800;font-size:11px;letter-spacing:.14em;text-transform:uppercase;padding:8px 14px;
  border-top:1px solid var(--line)}
.grouprow td span{float:right;color:rgba(22,21,21,.62);font-weight:700;letter-spacing:.08em}
.tbl tbody tr.t{border-bottom:1px solid var(--line);cursor:pointer}
.tbl tbody tr.t:last-child{border-bottom:none}
.tbl tbody tr.t:hover{background:var(--wash)}
.tbl tbody tr.t:focus-visible{outline:2px solid var(--citron-bright);outline-offset:-2px}
.tbl td{padding:13px 14px;vertical-align:middle}
.c-grip{width:30px;padding-right:0!important}
.grip{display:block;width:16px;height:22px;cursor:grab;touch-action:none;position:relative;opacity:.35}
.grip::before{content:"";position:absolute;left:3px;top:4px;width:3px;height:3px;border-radius:50%;
  background:var(--ink-2);box-shadow:0 5px 0 var(--ink-2),0 10px 0 var(--ink-2),
    7px 0 0 var(--ink-2),7px 5px 0 var(--ink-2),7px 10px 0 var(--ink-2)}
tr.t:hover .grip{opacity:.75}
.grip:active{cursor:grabbing}
tr.dragging{background:var(--citron-wash)!important;box-shadow:0 6px 18px rgba(22,21,21,.14)}
tr.dragging .grip{opacity:1}
tbody.reordering tr.t:not(.dragging){transition:transform .12s ease}
.orderhint{font-size:11px;font-weight:700;letter-spacing:.06em;color:var(--ink-3);margin-bottom:9px}
.c-chk{width:40px;padding-right:0}
.c-own{width:150px} .c-due{width:100px} .c-pri{width:118px} .c-note{width:52px;text-align:right}
.chk{width:18px;height:18px;border:2px solid var(--line-2);background:var(--white);cursor:pointer;padding:0;position:relative;display:block}
.chk:hover{border-color:var(--citron)}
.chk:focus-visible{outline:2px solid var(--citron-bright);outline-offset:2px}
tr.done .chk,.bchk.cleared{background:var(--forest);border-color:var(--forest)}
tr.done .chk::after{content:"";position:absolute;left:5px;top:1px;width:4px;height:9px;
  border:solid var(--white);border-width:0 2px 2px 0;transform:rotate(42deg)}
.tt{font-weight:600;font-size:14.5px;letter-spacing:-.008em;display:block;line-height:1.35}
tr.done .tt{color:var(--ink-3);text-decoration:line-through}
.tsub{font-size:11.5px;color:var(--ink-3);margin-top:3px;font-weight:500}
.tbl tr.sub{border-bottom:1px solid var(--line);cursor:pointer;background:var(--wash)}
.tbl tr.sub:hover{background:var(--wash-2)}
.tbl tr.sub td{padding:13px 14px;vertical-align:middle}
.tbl tr.sub td.c-chk{padding-left:34px;width:auto}
.subtask{display:flex;align-items:center;gap:10px}
.subn{font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:12px;color:var(--line-2);
  width:14px;flex:none;text-align:right}
tr.sub.active .subn{color:var(--citron)}
tr.sub.done .subn{color:var(--forest)}
.subchk{width:16px;height:16px}
.subchk:disabled{cursor:not-allowed;background:var(--wash-2);border-color:var(--wash-2)}
tr.sub.done .subchk{background:var(--forest);border-color:var(--forest)}
tr.sub.done .subchk::after{content:"";position:absolute;left:4px;top:0.5px;width:4px;height:8px;
  border:solid var(--white);border-width:0 2px 2px 0;transform:rotate(42deg)}
.subt{font-size:13.5px;font-weight:600;color:var(--ink-2)}
tr.sub.active .subt{color:var(--black)}
tr.sub.done .subt{color:var(--line-2);text-decoration:line-through;font-weight:500}
tr.sub.locked .subt{color:var(--ink-3);font-weight:500}
tr.sub.locked{opacity:.72}
@media (max-width:960px){
  .tbl tr.sub{display:flex;flex-wrap:wrap;align-items:center;gap:9px 10px;padding:15px 16px 15px 30px}
  .tbl tr.sub td{padding:0}
  .tbl tr.sub td.c-chk{padding-left:0;width:20px;order:1;flex:none}
  .tbl tr.sub td.c-task{order:2;flex:1 1 calc(100% - 30px)}
}
.stepchip{display:inline-block;margin-left:9px;font-size:9px;font-weight:800;letter-spacing:.11em;
  text-transform:uppercase;color:var(--ink-2);background:var(--wash-2);padding:3px 7px;vertical-align:2px}
.stepchip.full{background:var(--forest);color:var(--white)}
.rec{display:inline-block;margin-left:9px;font-size:9px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;
  color:var(--mag);background:var(--mag-wash);padding:3px 7px;vertical-align:2px}
.asg{display:flex;align-items:center;gap:9px;min-width:0}
.avwrap{position:relative;flex:none;width:26px;height:26px;border-radius:50%;display:block}
.avwrap .aav{width:100%;height:100%;border-radius:50%;object-fit:cover;display:block}
.avwrap.blk{box-shadow:0 0 0 2px var(--orange)}
.avwrap.blk::after{content:"";position:absolute;right:-2px;bottom:-2px;width:9px;height:9px;border-radius:50%;
  background:var(--orange);border:1.5px solid var(--white)}
.avwrap.big{width:46px;height:46px}
.avwrap.big.blk::after{width:13px;height:13px;right:-1px;bottom:-1px}
.aname{font-size:12.5px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.prio{display:flex;align-items:center;gap:7px;font-size:10.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.prio svg{width:13px;height:13px;flex:none}
.due{font-size:12.5px;font-weight:600;color:var(--ink-2);font-variant-numeric:tabular-nums}
.due.late{color:var(--orange);font-weight:800}
.due.none{color:var(--line-2);font-weight:500}
.nb{font-size:11.5px;font-weight:700;color:var(--line-2)}
.nb.has{color:var(--mag)}
.empty{background:var(--white);border:1px solid var(--line);padding:56px 26px;text-align:center}
.empty b{display:block;font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:22px;text-transform:uppercase;letter-spacing:-.02em;margin-bottom:8px}
.empty span{color:var(--ink-3);font-size:13.5px}


/* client info — deliberately secondary to the task list */
.ccard{border:1px solid var(--line);background:var(--white);margin-bottom:16px}
.cbar{display:flex;align-items:center;gap:12px;width:100%;background:none;border:none;padding:9px 14px;
  cursor:pointer;text-align:left}
.cbar:hover{background:var(--wash)}
.cbar:focus-visible{outline:2px solid var(--citron-bright);outline-offset:-2px}
.cbar .cco{font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2)}
.ctype{font-size:9px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;padding:3px 7px}
.ctype.hourly{background:var(--citron-wash);color:var(--citron)}
.ctype.project{background:var(--mag-wash);color:var(--mag)}
.cbar .cearn{font-size:11.5px;color:var(--ink-3);font-weight:600}
.cbar .ccar{margin-left:auto;font-size:9.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.cbar:hover .ccar{color:var(--black)}
.cbody{display:none;border-top:1px solid var(--line)}
.ccard.open .cbody{display:block}
.cwork{padding:13px 14px;font-size:13px;line-height:1.55;color:var(--ink-2);border-bottom:1px solid var(--line);outline:none}
.cgrid{display:grid;grid-template-columns:repeat(3,1fr)}
.crow{padding:9px 14px;border-bottom:1px solid var(--line);border-right:1px solid var(--line);min-width:0}
.crow:nth-child(3n){border-right:none}
.ck{display:block;font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);font-weight:800;margin-bottom:3px}
.cv{font-size:12.5px;font-weight:600;line-height:1.4;word-break:break-word;outline:none;display:block}
.cv.gap{color:var(--line-2);font-weight:500;font-style:italic}
.cv:focus,.cwork:focus,.cnote [contenteditable]:focus{box-shadow:0 0 0 2px var(--citron-bright)}
.cnote{padding:11px 14px;background:var(--wash);font-size:12.5px;line-height:1.5;color:var(--ink-2)}
.cnk{display:block;font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);font-weight:800;margin-bottom:4px}
.cnote [contenteditable]{outline:none;display:block}
@media (max-width:820px){.cgrid{grid-template-columns:1fr 1fr}.crow:nth-child(3n){border-right:1px solid var(--line)}.crow:nth-child(2n){border-right:none}}
@media (max-width:560px){.cgrid{grid-template-columns:1fr}.crow{border-right:none!important}}

.donetog{display:block;width:100%;margin-top:10px;background:none;border:1px dashed var(--line-2);
  padding:11px;font-size:10.5px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;
  color:var(--ink-3);cursor:pointer}
.donetog:hover{border-color:var(--black);color:var(--black);background:var(--white)}
.donetog:focus-visible{outline:2px solid var(--citron-bright);outline-offset:2px}

.addrow{display:flex;gap:8px;margin-top:10px;background:var(--white);border:1px dashed var(--line-2);padding:10px}
.addrow input{flex:1;min-width:0;background:none;border:none;font-size:14px;padding:6px 4px;outline:none}
.addrow input::placeholder{color:var(--ink-3)}
.addrow select{background:var(--wash);border:1px solid var(--line);font-size:12px;font-weight:700;padding:6px 8px;
  color:var(--ink-2);cursor:pointer;max-width:150px}
.addbtn{background:var(--black);color:var(--white);border:none;padding:8px 16px;font-size:10.5px;font-weight:800;
  letter-spacing:.12em;text-transform:uppercase;cursor:pointer;flex:none}
.addbtn:hover{background:var(--citron-bright);color:var(--black)}
.addbtn:focus-visible,.addrow input:focus,.addrow select:focus-visible{outline:2px solid var(--citron-bright);outline-offset:1px}
.addrow:focus-within{border-color:var(--citron);border-style:solid}

.moverow{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.movelab{font-size:12.5px;font-weight:600;color:var(--ink-2);flex:none}
#moveSel{flex:1;min-width:150px;background:var(--white);border:1.5px solid var(--line-2);padding:9px 10px;
  font-size:13px;font-family:inherit;color:var(--ink)}
#moveSel:focus{outline:none;border-color:var(--citron)}
.dangerzone{padding:4px 2px 8px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.delbtn{background:none;border:1px solid var(--line-2);color:var(--ink-3);padding:9px 14px;font-size:10px;
  font-weight:800;letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.delbtn:hover{border-color:var(--orange);color:var(--orange)}
.delconfirm{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.delconfirm span{font-size:12px;font-weight:700;color:var(--ink-2)}
.delyes{background:var(--orange);color:var(--white);border:none;padding:9px 14px;font-size:10px;font-weight:800;
  letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.delno{background:none;border:1px solid var(--line-2);color:var(--ink-2);padding:9px 14px;font-size:10px;
  font-weight:800;letter-spacing:.12em;text-transform:uppercase;cursor:pointer}

/* DRAWER */
.scrim{position:fixed;inset:0;background:rgba(22,21,21,.55);z-index:50;opacity:0;pointer-events:none;transition:opacity .16s}
.scrim.on{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(560px,100%);background:var(--wash);z-index:51;
  transform:translateX(101%);transition:transform .2s cubic-bezier(.32,.72,0,1);display:flex;flex-direction:column;
  box-shadow:-20px 0 60px rgba(22,21,21,.22)}
.drawer.on{transform:none}
.dtop{background:var(--black);padding:14px 24px 22px;flex:none;color:var(--paper)}
.dtoprow{display:flex;align-items:center;gap:10px}
.dtop .dcrumb{font-size:10.5px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:#8C8983}
.dchips{display:flex;gap:9px;flex-wrap:wrap;margin:16px 0 15px}
.dchip{display:flex;align-items:center;gap:9px;border:1.5px solid #3A3836;padding:8px 12px}
.dchip i{font-style:normal;font-size:9.5px;letter-spacing:.15em;text-transform:uppercase;color:#8C8983;font-weight:800}
.dchip b{font-size:13.5px;font-weight:700;color:var(--paper);font-variant-numeric:tabular-nums}
.dchip em{font-style:normal;font-size:9.5px;font-weight:800;letter-spacing:.11em;text-transform:uppercase;color:var(--orange)}
.dchip em:empty{display:none}
.dchip .prio{font-size:12px}
.dchip .prio svg{width:14px;height:14px}
.dtop h2{font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:26px;line-height:1.1;
  letter-spacing:-.032em;margin:0;color:var(--paper)}
.x{margin-left:auto;background:#2A2827;border:none;color:#C9C6C0;width:28px;height:28px;font-size:16px;line-height:1;cursor:pointer;flex:none}
.x:hover{background:var(--citron-bright);color:var(--black)}
.x:focus-visible{outline:2px solid var(--citron-bright);outline-offset:2px}
.db{overflow-y:auto;flex:1;padding:18px;display:flex;flex-direction:column;gap:14px}


.pane{background:var(--white);border:1px solid var(--line)}
.ph{display:flex;align-items:center;gap:10px;padding:11px 16px;background:var(--black);color:var(--paper)}
.ph .pt{font-family:"Bricolage Grotesque",sans-serif;font-weight:700;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase}
.pbody{padding:15px 16px}

/* bottleneck checklist */
.bl{display:flex;gap:12px;padding:13px 16px;border-bottom:1px solid var(--line);align-items:flex-start}
.bl:last-child{border-bottom:none}
.bl .pipe{width:4px;align-self:stretch;background:var(--line-2);flex:none;margin:-13px 0 -13px -16px;margin-right:8px}
.bl.confirmed .pipe{background:var(--orange)}
.bl.cleared .pipe{background:var(--forest)}
.bl .btxt{flex:1;font-size:13.5px;color:var(--ink-2);line-height:1.5}
.bl.cleared .btxt{color:var(--line-2);text-decoration:line-through}
.bl .bacts{display:flex;gap:5px;flex:none}
.ba{background:var(--white);border:1.5px solid var(--line-2);color:var(--ink-3);font-size:9.5px;font-weight:800;
  letter-spacing:.09em;text-transform:uppercase;padding:5px 9px;cursor:pointer;white-space:nowrap}
.ba:hover{border-color:var(--ink-3);color:var(--ink-2)}
.ba:focus-visible{outline:2px solid var(--citron-bright);outline-offset:1px}
.bl.confirmed .ba.c{background:var(--orange);border-color:var(--orange);color:var(--white)}
.bl.cleared .ba.k{background:var(--forest);border-color:var(--forest);color:var(--white)}

/* activity */
.fbody{padding:16px;display:flex;flex-direction:column;gap:17px;max-height:360px;overflow-y:auto}
.m{display:flex;gap:12px;align-items:flex-start}
.m.me{flex-direction:row-reverse}
.av{width:36px;height:36px;flex:none;border-radius:50%;overflow:hidden;background:var(--wash-2)}
.av img{width:100%;height:100%;display:block;object-fit:cover}
.mb{flex:1;min-width:0;display:flex;flex-direction:column}
.m.me .mb{align-items:flex-end}
.m.me .mhead{flex-direction:row-reverse}
.m.me .mt{max-width:86%}
.m.them .mt{max-width:92%}
.mhead{display:flex;align-items:baseline;gap:9px;margin-bottom:5px;flex-wrap:wrap}
.mname{font-size:12px;font-weight:800;letter-spacing:.04em}
.mname.c{color:var(--citron)} .mname.m{color:var(--mag)}
.mstamp{font-size:10.5px;color:var(--ink-3);font-weight:600;font-variant-numeric:tabular-nums}
.mt{font-size:13.5px;color:var(--ink-2);line-height:1.55;background:var(--wash);padding:10px 12px;
  border-left:3px solid var(--line-2)}
.m.me .mt{background:var(--mag-wash);border-left:none;border-right:3px solid var(--mag);text-align:left}
.m.them .mt{border-left-color:var(--citron-bright)}
.ffoot{display:flex;gap:8px;padding:13px 16px;border-top:1px solid var(--line);background:var(--wash)}
.ffoot input{flex:1;background:var(--white);border:1.5px solid var(--line-2);padding:10px 12px;font-size:13.5px}
.ffoot input:focus{outline:none;border-color:var(--mag)}
.post{background:var(--black);color:var(--white);border:none;padding:10px 16px;font-size:11px;font-weight:800;
  letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.post:hover{background:var(--mag)}
.post:focus-visible{outline:2px solid var(--mag);outline-offset:2px}
.fempty{font-size:13px;color:var(--ink-3);padding:2px}


/* --- drawer header --- */
.dassignee{display:flex;align-items:center;gap:11px;margin:16px 0 14px}
.dassignee .asgname{font-size:14px;font-weight:700;color:var(--paper)}
.dtop h2{font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:26px;line-height:1.1;
  letter-spacing:-.032em;margin:0;color:var(--paper);outline:none;padding:3px 6px;margin-left:-6px;border-radius:2px}
.dtop h2:hover{background:#242222}
.dtop h2:focus{background:#242222;box-shadow:inset 0 0 0 1.5px var(--citron-bright)}
.dchips{display:flex;gap:9px;flex-wrap:wrap;margin:18px 0 0}
.dchip{display:flex;align-items:center;gap:8px;border:1.5px solid #3A3836;padding:7px 11px;cursor:pointer}
.dchip:focus-within{border-color:var(--citron-bright)}
.dchip i{font-style:normal;font-size:9.5px;letter-spacing:.15em;text-transform:uppercase;color:#8C8983;font-weight:800}
.dchip em{font-style:normal;font-size:9.5px;font-weight:800;letter-spacing:.11em;text-transform:uppercase;color:var(--orange)}
.dchip em:empty{display:none}
.dchip select,.dchip input[type=date]{background:none;border:none;color:var(--paper);font-family:inherit;
  font-size:13px;font-weight:700;padding:0;cursor:pointer;outline:none;color-scheme:dark}
.dchip select option{background:#1D1C1C;color:var(--paper)}
.dchip .prioicon{display:flex}
.dchip .prioicon svg{width:14px;height:14px}

/* --- description --- */
.ph .fmt{margin-left:auto;display:flex;gap:4px}
.ph .fmt button{background:#2A2827;border:1px solid #3A3836;color:#C9C6C0;width:24px;height:22px;
  font-size:11px;line-height:1;cursor:pointer;padding:0}
.ph .fmt button:hover{background:var(--citron-bright);color:var(--black);border-color:var(--citron-bright)}
.ph .fmt button:focus-visible{outline:2px solid var(--citron-bright);outline-offset:1px}
.desc{font-size:14.5px;line-height:1.64;color:var(--ink-2);outline:none;min-height:40px;padding:2px}
.desc:focus{box-shadow:0 0 0 2px var(--citron-bright);padding:6px}
.desc ul{margin:8px 0;padding-left:20px}
.desc li{margin-bottom:4px}
.desc b,.desc strong{color:var(--black)}

/* --- bottlenecks --- */
.ph .stepnote{margin-left:auto;font-size:10px;font-weight:800;letter-spacing:.11em;text-transform:uppercase;color:#8C8983}
.stp{display:flex;align-items:center;gap:12px;padding:13px 16px;border-bottom:1px solid var(--line)}
.stp:last-child{border-bottom:none}
.stp.locked{background:var(--wash);opacity:.6}
.stp.active{background:var(--citron-wash)}
.stpn{font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:13px;color:var(--line-2);width:16px;flex:none}
.stp.active .stpn{color:var(--citron)}
.stp.done .stpn{color:var(--forest)}
.stpchk{width:18px;height:18px;border:2px solid var(--line-2);background:var(--white);cursor:pointer;padding:0;
  position:relative;flex:none}
.stpchk:hover:not(:disabled){border-color:var(--citron)}
.stpchk:disabled{cursor:not-allowed;background:var(--wash-2)}
.stp.done .stpchk{background:var(--forest);border-color:var(--forest)}
.stp.done .stpchk::after{content:"";position:absolute;left:5px;top:1px;width:4px;height:9px;
  border:solid var(--white);border-width:0 2px 2px 0;transform:rotate(42deg)}
.stpt{flex:1;font-size:13.5px;color:var(--ink-2);outline:none;line-height:1.45}
.stp.done .stpt{color:var(--line-2);text-decoration:line-through}
.stpwait{font-size:9px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);flex:none}
.bl .btxt{outline:none}
.bl .btxt:focus{box-shadow:0 0 0 2px var(--citron-bright);padding:2px 4px;margin:-2px -4px}
.bl .bdel{background:none;border:none;color:var(--line-2);font-size:15px;line-height:1;cursor:pointer;padding:2px 4px;flex:none}
.bl .bdel:hover{color:var(--orange)}
.botadd{display:flex;gap:8px;padding:13px 16px;border-top:1px solid var(--line);background:var(--wash)}
.botadd input{flex:1;background:var(--white);border:1.5px solid var(--line-2);padding:9px 11px;font-size:13px}
.botadd input:focus{outline:none;border-color:var(--citron)}
.post.ghosty{background:var(--white);color:var(--black);box-shadow:inset 0 0 0 1.5px var(--black)}
.post.ghosty:hover{background:var(--black);color:var(--white)}
.emptybot{padding:14px 16px;font-size:13px;color:var(--ink-3);font-style:italic}

/* --- system messages --- */
.m.sys{display:block;text-align:center;padding:2px 0}
.m.sys .st{display:inline-block;font-size:11.5px;color:var(--ink-3);background:var(--wash);
  padding:5px 12px;border-radius:999px;line-height:1.4}
.m.sys .st b{color:var(--ink-2);font-weight:700}
.m.sys .sts{display:block;font-size:10px;color:var(--line-2);margin-top:4px;font-weight:600}

/* --- status pill --- */
.stat{display:inline-flex;align-items:center;gap:6px;font-size:10.5px;font-weight:800;letter-spacing:.08em;
  text-transform:uppercase;padding:4px 9px;white-space:nowrap}
.stat s{width:7px;height:7px;border-radius:50%;flex:none;text-decoration:none}
.stat.todo{background:var(--wash-2);color:var(--ink-2)} .stat.todo s{background:var(--ink-3)}
.stat.doing{background:var(--citron-wash);color:#5E6002} .stat.doing s{background:var(--citron-bright)}
.stat.blocked{background:var(--orange-wash);color:#8E2F17} .stat.blocked s{background:var(--orange)}
.stat.waiting{background:var(--mag-wash);color:#96214F} .stat.waiting s{background:var(--mag)}
.stat.done{background:#E2ECE6;color:var(--forest)} .stat.done s{background:var(--forest)}
.c-stat{width:132px}


/* ================= REFERENCE CARDS ================= */
.card{background:var(--white);border:1px solid var(--line);overflow:hidden}
.ch{display:flex;align-items:center;gap:10px;padding:12px 18px;background:var(--black);color:var(--paper)}
.ch .ct{font-family:"Bricolage Grotesque",sans-serif;font-weight:700;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase}
.ch .cn{margin-left:auto;font-size:10.5px;color:#8C8983;font-weight:700;letter-spacing:.1em}
.ch.bad{background:var(--orange)} .ch.bad .cn{color:rgba(255,255,255,.78)}
.ch.warn{background:var(--citron-bright);color:var(--black)} .ch.warn .cn{color:rgba(22,21,21,.62)}
.ch.ok{background:var(--forest)} .ch.ok .cn{color:rgba(255,255,255,.72)}
.li{display:flex;align-items:flex-start;gap:14px;padding:15px 18px;border-bottom:1px solid var(--line)}
.li:last-child{border-bottom:none}
.li .lt{font-weight:700;font-size:14px;line-height:1.35}
.li .ls{font-size:12.5px;color:var(--ink-3);margin-top:4px;line-height:1.5}
.li .ls.hard{color:var(--ink-2);font-weight:500;margin-top:5px}
.li .lr{margin-left:auto;flex:none;font-size:10px;color:var(--ink-3);text-transform:uppercase;
  letter-spacing:.1em;font-weight:800;padding-top:3px;text-align:right;max-width:112px;line-height:1.4}
.numx{font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:15px;color:var(--line-2);
  flex:none;width:22px;padding-top:1px}
.sq{width:9px;height:9px;flex:none;margin-top:5px}
.sq.ok{background:var(--forest)} .sq.warn{background:var(--citron-bright)}
.sq.bad{background:var(--orange)} .sq.off{background:var(--line-2)}
@media (max-width:640px){ .li{flex-wrap:wrap} .li .lr{margin-left:34px;max-width:none;text-align:left;padding-top:6px} }

.rday .dayhead{width:100%;border:none;cursor:pointer;text-align:left}
.rday .dayhead:hover{background:#242222}
.rday .dayhead:focus-visible{outline:2px solid var(--citron-bright);outline-offset:-2px}
.rday .dayhead::after{content:"+";margin-left:12px;font-size:15px;line-height:1;color:#8C8983}
.rday.open .dayhead::after{content:"\2013"}
.rday .daybody{display:none}
.rday.open .daybody{display:block}
.rli{align-items:center;gap:12px}
.rtime{flex:none;width:88px;font-size:10.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink-3);font-variant-numeric:tabular-nums}
.rtext{flex:1;outline:none;font-weight:600;font-size:13.5px}
.rtext[contenteditable]:focus,.li [contenteditable]:focus{box-shadow:0 0 0 2px var(--citron-bright)}
.rin{flex:1;background:var(--white);border:1.5px solid var(--line-2);padding:9px 11px;font-size:13px}
.rin:focus{outline:none;border-color:var(--citron)}
@media (max-width:640px){ .rtime{width:100%;margin-bottom:2px} .rli{flex-wrap:wrap} }

/* ================= LOW MOTIVATION ================= */
.lowbar{position:fixed;right:30px;bottom:28px;z-index:40}
.lowbtn{display:flex;align-items:center;gap:10px;background:var(--mag);color:var(--white);border:none;
  padding:15px 24px;cursor:pointer;font-size:12px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;
  box-shadow:0 10px 30px rgba(223,50,123,.38);transition:transform .12s ease,background .12s ease}
.lowbtn svg{width:19px;height:19px;flex:none;color:var(--citron-bright);animation:zap 2.6s ease-in-out infinite}
@keyframes zap{0%,88%,100%{transform:scale(1) rotate(0)}92%{transform:scale(1.28) rotate(-9deg)}96%{transform:scale(1.1) rotate(6deg)}}
.lowbtn:hover{background:var(--black);transform:translateY(-2px)}
.lowbtn:hover svg{color:var(--mag)}
.lowbtn:active{transform:translateY(0) scale(.97)}
.ov{position:fixed;inset:0;z-index:70;background:var(--black);color:var(--paper);display:none;
  align-items:center;justify-content:center;padding:32px}
.ov.on{display:flex}
.ovin{max-width:560px;width:100%}
.ovlab{display:flex;align-items:center;gap:9px;font-size:10px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--citron-bright);font-weight:800;margin-bottom:26px}
.ovlab svg{width:15px;height:15px;flex:none}
.ovt{font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:38px;line-height:1.06;
  letter-spacing:-.04em;margin:0 0 18px;text-wrap:balance;color:var(--paper)}
.ovw{font-size:15px;color:#A5A29C;margin:0 0 38px;line-height:1.6;max-width:46ch}
.ovacts{display:flex;gap:9px;flex-wrap:wrap}
.gh{background:none;color:var(--paper);border:1.5px solid #3A3836;padding:13px 22px;font-size:11px;
  font-weight:800;letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.gh:hover{border-color:var(--paper)}
.gh.pri{background:var(--citron-bright);color:var(--black);border-color:var(--citron-bright)}
.gh.pri:hover{background:var(--white)}
.gh:focus-visible{outline:2px solid var(--citron-bright);outline-offset:2px}
.lowbtn:focus-visible{outline:3px solid var(--citron-bright);outline-offset:3px}

.hide{display:none!important}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
@media (max-width:960px){
  /* ---- chrome ---- */
  .mbar{display:flex}
  .navscrim{display:block}
  .app{grid-template-columns:1fr}
  .side{position:fixed;top:0;left:0;bottom:0;width:262px;z-index:62;height:100vh;
    transform:translateX(-102%);transition:transform .2s cubic-bezier(.32,.72,0,1);padding:22px 0 40px;
    box-shadow:14px 0 40px rgba(0,0,0,.35)}
  .side.on{transform:none}
  .ng{padding:0 10px;margin-bottom:16px;display:block;overflow:visible}
  .nglab{display:block}
  .nv{width:100%;white-space:normal}
  .nv.sub{padding-left:28px}
  .main{padding-top:0}

  /* ---- masthead ---- */
  .masthead{padding:24px 20px 0}
  .masthead h1{font-size:30px}
  .masthead .sub{font-size:13.5px;margin-top:10px}
  .body{padding:20px 20px 0}
  .mh-rule{width:48px;height:6px;margin-bottom:14px}

  /* ---- calendar: stacked days ---- */
  .todaystrip{padding:14px 20px;gap:10px}
  .todaystrip .tev{margin-left:0;width:100%;gap:8px}
  .calfold{margin-left:0}
  .wkhead{padding:14px 20px 8px}
  .days{grid-template-columns:1fr;overflow:visible;border-top:1px solid var(--line)}
  .dc{min-height:0;border-right:none;border-bottom:1px solid var(--line);padding:12px 20px;
    display:flex;flex-direction:row;gap:14px;align-items:flex-start}
  .dc:last-child{border-bottom:none}
  .dh{flex:none;width:46px;flex-direction:column;align-items:flex-start;gap:0;
    border-bottom:none;padding-bottom:0;margin:0}
  .dh .dn{font-size:21px}
  .devs{flex:1;min-width:0}

  /* ---- lists become cards ---- */
  .tblwrap{margin:0}
  .tbl,.tbl tbody{display:block}
  .tbl thead{display:none}
  .tbl tr.grouprow,.tbl tr.grouprow td{display:block;width:auto}
  .tbl tr.t{display:flex;flex-wrap:wrap;align-items:center;gap:9px 10px;padding:15px 16px;width:auto}
  .tbl td{display:block;padding:0;border:none;width:auto;vertical-align:baseline}
  td.c-grip{order:0;width:22px;flex:none}
  td.c-chk{order:1;width:20px;flex:none}
  td.c-task{order:2;flex:1 1 calc(100% - 30px);min-width:0}
  .tbl tr.t{row-gap:0}
  td.c-stat{order:3;margin-left:29px;margin-top:9px}
  td.c-own{order:4;margin-top:9px} td.c-due{order:5;margin-top:9px} td.c-pri{order:6;margin-top:9px}
  td.c-note{order:7;margin-top:9px}
  td.c-stat,td.c-own,td.c-due,td.c-pri,td.c-note{display:block;flex:none;align-self:center}
  .tt{font-size:15px;white-space:normal;line-height:1.3}
  .tsub{margin-top:3px}
  .aname{display:none}
  .avwrap{width:21px;height:21px}
  .stat{font-size:9.5px;padding:4px 8px;gap:5px}
  .prio{font-size:9.5px;gap:5px}
  .prio svg{width:12px;height:12px}
  .due{font-size:11.5px}
  .nb{font-size:11px}
  .nb.has::before{content:"\25CF";font-size:8px;margin-right:4px;vertical-align:2px}
  .donetog{margin:12px 0 0}

  /* ---- client card ---- */
  .cbar{flex-wrap:wrap;gap:8px}
  .cbar .ccar{margin-left:auto}
  .cgrid{grid-template-columns:1fr 1fr}
  .crow:nth-child(3n){border-right:1px solid var(--line)}
  .crow:nth-child(2n){border-right:none}

  /* ---- drawer ---- */
  .drawer{width:100%;border-left:none}
  .dtop{padding:14px 20px 22px}
  .dtop h2{font-size:23px}
  .dchips{flex-direction:column;gap:8px;margin-top:16px}
  .dchip{width:100%;flex-wrap:wrap;align-items:center;gap:4px 10px;padding:10px 13px}
  .dchip i{flex:1 1 100%;margin-bottom:2px;order:-2}
  .dchip select{flex:1 1 auto;font-size:15px;min-width:0}
  .dchip input[type=date]{flex:1 1 auto;font-size:15px;min-width:0}
  .dchip em{flex:none}
  .dchip .prioicon{flex:none;order:-1}
  .dchip em{order:2}
  .db{padding:16px;gap:14px}
  .fbody{max-height:none}
  .m.me .mt,.m.them .mt{max-width:100%}
  .bl{flex-wrap:wrap}
  .bl .bacts{width:100%;padding-left:16px}

  /* ---- misc ---- */
  .ovt{font-size:26px}
  .ovw{font-size:14px;margin-bottom:28px}
  .ovacts{flex-direction:column}
  .gh{width:100%;text-align:center}
  .lowbar{right:14px;bottom:14px}
  .lowbtn{padding:13px 18px;font-size:11px;gap:8px}
  .lowbtn svg{width:16px;height:16px}
  .li{padding:14px 18px}
  .stack{gap:18px}
}
@media (max-width:520px){
  .cgrid{grid-template-columns:1fr}
  .crow{border-right:none!important}
  .masthead h1{font-size:26px}
  .lowbtn span{display:none}
  .lowbtn{padding:14px;border-radius:50%}
  .lowbtn svg{width:20px;height:20px}
  .ov{padding:24px 20px}
  .ovt{font-size:25px}
}

/* ===================== added in the rebuild ===================== */
.hide{display:none!important}

/* sign in */
.gate,.reset{position:fixed;inset:0;z-index:200;background:var(--black);
  display:flex;align-items:center;justify-content:center;padding:24px}
.gatebox{width:100%;max-width:360px;background:var(--white);border:1px solid var(--line);padding:30px 26px 26px}
.gatemark{font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:20px;
  letter-spacing:-.3px;margin-bottom:22px;color:var(--black)}
.gatemark i{font-style:normal;color:var(--citron)}
.gatelab{display:block;font-size:10.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink-3);margin:14px 0 6px}
.gatein{width:100%;padding:11px 12px;border:1.5px solid var(--line-2);background:var(--paper);
  font-size:14px;border-radius:0}
.gatein:focus{outline:none;border-color:var(--black)}
.gatebtn{width:100%;margin-top:20px;padding:12px;background:var(--black);color:var(--white);border:none;
  font-size:11.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;cursor:pointer}
.gatebtn:hover{background:var(--citron-bright);color:var(--black)}
.gatebtn:disabled{opacity:.5;cursor:default}
.gateerr{min-height:18px;margin:12px 0 0;font-size:12px;color:var(--orange)}
.gatehint{font-size:12.5px;color:var(--ink-2);margin:0 0 6px}
.gatelink{display:block;width:100%;margin-top:6px;background:none;border:none;padding:6px;
  font-size:11.5px;color:var(--ink-3);text-decoration:underline;cursor:pointer}
.gatelink:hover{color:var(--black)}

/* assignee control in the drawer header */
.asgsel{margin-left:10px;background:transparent;color:var(--paper);border:1px solid rgba(251,251,250,.28);
  font-size:11px;font-weight:700;padding:3px 6px;border-radius:0;cursor:pointer}
.asgsel:focus{outline:none;border-color:var(--citron-bright)}
.asgsel option{background:var(--black);color:var(--paper)}
.aname.none{color:var(--ink-3);font-style:italic}