/* Time Tracker (Mo only) — weekly log reached from the account menu. */
.tt-app{max-width:760px;margin:0 auto;padding:26px 22px 60px}
.tt-hdr{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:18px}
.tt-hdr h2{font-family:var(--font-serif);font-size:26px;font-weight:700;color:var(--ink);margin:0 0 2px}
.tt-sub{font-size:13px;color:var(--ink-3);margin:0}
.tt-hdr-right{display:flex;align-items:center;gap:6px;flex:none}
.tt-nav,.tt-this{border:1px solid var(--line-strong);background:var(--panel);color:var(--ink-2);
  font:inherit;font-size:13px;font-weight:600;border-radius:9px;padding:7px 11px;cursor:pointer}
.tt-nav:hover,.tt-this:hover{background:var(--bg-2);color:var(--ink)}
.tt-loading,.tt-empty{padding:26px 4px;color:var(--ink-3);font-size:13.5px;text-align:center}

/* add row */
.tt-add{display:flex;gap:8px;margin-bottom:14px}
.tt-in{border:1px solid var(--line-strong);background:var(--panel);color:var(--ink);
  font:inherit;font-size:14px;border-radius:10px;padding:11px 13px;outline:none}
.tt-in:focus{border-color:var(--green);box-shadow:0 0 0 2px var(--green-bg)}
.tt-in-item{flex:1;min-width:0}
.tt-in-hrs{width:82px;flex:none}
.tt-addbtn{flex:none;border:0;background:var(--green);color:#fff;font:inherit;font-size:14px;
  font-weight:700;border-radius:10px;padding:11px 20px;cursor:pointer}
.tt-addbtn:hover{filter:brightness(1.06)}

/* rows */
.tt-list{border:1px solid var(--line);border-radius:12px;background:var(--panel);overflow:hidden}
.tt-row{display:flex;align-items:center;gap:10px;padding:9px 12px;border-bottom:1px solid var(--line)}
.tt-row:last-child{border-bottom:0}
.tt-row.st-done .tt-item{color:var(--ink-3);text-decoration:line-through}
.tt-row.st-blocked{background:color-mix(in oklab, var(--amber, #e2b552) 7%, transparent)}
/* Status is its own field — a compact colour-coded select. */
.tt-status{flex:none;width:112px;border:1px solid var(--line-strong);border-radius:7px;
  background:var(--panel);color:var(--ink-2);font:inherit;font-size:12px;font-weight:600;
  padding:5px 6px;cursor:pointer;outline:none}
.tt-status:disabled{cursor:default;opacity:.75}
.tt-status.st-doing{border-color:color-mix(in oklab,var(--green) 55%,transparent);color:var(--green-2);background:var(--green-bg)}
.tt-status.st-blocked{border-color:color-mix(in oklab,var(--amber,#e2b552) 65%,transparent);color:#8a6412;background:color-mix(in oklab,var(--amber,#e2b552) 16%,transparent)}
.tt-status.st-done{color:var(--ink-3)}
/* Lane chip on rows pulled from the Pile */
.tt-lane{flex:none;font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;
  padding:2px 6px;border-radius:5px;border:1px solid var(--line);background:var(--bg-2);color:var(--ink-3)}
.tt-lane.lane-fire{color:#a3341f;border-color:color-mix(in oklab,var(--rust,#b8472a) 40%,transparent);background:color-mix(in oklab,var(--rust,#b8472a) 12%,transparent)}
.tt-lane.lane-feature{color:var(--green-2);border-color:color-mix(in oklab,var(--green) 40%,transparent);background:var(--green-bg)}
/* Add-from-the-Pile picker */
.tt-pilewrap{margin:-6px 0 14px}
.tt-pilesel{width:100%;border:1px dashed var(--line-strong);border-radius:10px;background:transparent;
  color:var(--ink-2);font:inherit;font-size:13.5px;font-weight:600;padding:9px 12px;cursor:pointer;outline:none}
.tt-pilesel:hover{border-color:var(--green);color:var(--green-2)}
.tt-item{flex:1;min-width:0;border:0;background:transparent;color:var(--ink);font:inherit;font-size:14px;
  padding:5px 4px;border-radius:6px;outline:none}
.tt-item:focus{background:var(--bg-2)}
.tt-carried{flex:none;font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;
  color:var(--ink-3);background:var(--bg-2);border:1px solid var(--line);border-radius:5px;padding:2px 6px}
.tt-hrs{flex:none;width:62px;text-align:right;border:1px solid transparent;background:transparent;
  color:var(--ink);font:inherit;font-size:14px;font-weight:600;font-variant-numeric:tabular-nums;
  padding:5px 6px;border-radius:6px;outline:none}
.tt-hrs:focus{background:var(--bg-2);border-color:var(--line-strong)}
.tt-hlbl{color:var(--ink-3);font-size:12px}
.tt-del{flex:none;width:26px;height:26px;border:0;background:transparent;color:var(--ink-3);
  font-size:19px;line-height:1;cursor:pointer;border-radius:6px}
.tt-del:hover{background:var(--bg-2);color:var(--red)}

/* closed banner + footer */
.tt-banner{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;
  padding:11px 14px;border-radius:10px;background:var(--bg-2);border:1px solid var(--line);
  font-size:13.5px;font-weight:600;color:var(--ink-2)}
.tt-linkbtn{border:0;background:transparent;color:var(--green);font:inherit;font-size:13px;
  font-weight:700;cursor:pointer;padding:0}
.tt-foot{display:flex;align-items:center;gap:14px;margin-top:16px}
.tt-total{font-size:22px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
.tt-total .tt-hlbl{font-size:13px}
.tt-openct{font-size:12.5px;color:var(--ink-3)}
.tt-close{margin-left:auto;border:1px solid var(--line-strong);background:var(--panel);color:var(--ink);
  font:inherit;font-size:13.5px;font-weight:700;border-radius:10px;padding:10px 16px;cursor:pointer}
.tt-close:hover{background:var(--green);border-color:var(--green);color:#fff}

@media (max-width:768px){
  .tt-app{padding:16px 14px 120px}
  .tt-hdr h2{font-size:22px}
  .tt-add{flex-wrap:wrap}
  .tt-in-item{flex:1 1 100%}
  .tt-in-hrs{flex:1 1 0;width:auto}
  .tt-addbtn{flex:1 1 0}
  .tt-carried{display:none}
  /* Item gets the whole first line (it truncated when sharing a row with the
     hours); hours + delete wrap underneath, indented under the item text. */
  .tt-row{flex-wrap:wrap;row-gap:2px;padding:10px 12px}
  .tt-item{flex:1 1 100%;font-size:14.5px;order:2}
  .tt-status{order:1;width:106px}
  .tt-hrs{order:3}
  .tt-hrs{margin-left:0}
  .tt-del{margin-left:auto;order:4}
}