/* Shared project styling with a quieter task list and room for context. */
#tracker-pane { padding: 0 clamp(20px, 3.2vw, 48px); background: var(--bg); min-width: 0; height: 100dvh; max-height: 100dvh; }
.tk-page-topbar { flex: none; display: flex; align-items: center; gap: 22px; min-height: 65px; border-bottom: 1px solid var(--border); }
.tk-page-topbar > button { font-size: 12px; flex: none; }
#tk-context { font-size: 11px; color: var(--text-soft); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.tk-data-menu { position: relative; margin-left: auto; flex: none; font-size: 11px; }
.tk-data-menu > summary { cursor: pointer; list-style: none; padding: 8px 10px; border: 1px solid var(--border); border-radius: 7px; background: var(--card); }
.tk-data-menu > summary::-webkit-details-marker { display: none; }
.tk-data-menu > summary > span { margin-left: 10px; }
.tk-data-menu > div { position: absolute; right: 0; top: calc(100% + 7px); z-index: 10; padding: 6px; width: 220px; border: 1px solid var(--border); border-radius: 10px; background: var(--card); box-shadow: var(--shadow-2); }
.tk-data-menu button { display: block; width: 100%; text-align: left; padding: 11px; font-size: 12px; border-radius: 6px; }
.tk-data-menu button:hover { background: var(--bg-soft); }
.tracker-head { display: flex; align-items: center; justify-content: space-between; flex-wrap: nowrap; gap: 20px; margin: 25px 0 20px; padding: 0; border: 0; }
.tk-eyebrow { color: var(--text-soft); font-size: 9px; font-weight: 550; letter-spacing: .11em; margin: 0 0 8px; }
#tracker-pane h1 { font: 550 33px/1.2 var(--font-ui); letter-spacing: -.04em; margin: 0; }
.tk-intro { color: var(--text-soft); font-size: 12px; line-height: 1.7; margin: 9px 0 0; }
.tracker-head > button { flex: none; font-size: 12px; padding: 10px 16px; }
.tk-overview { flex: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 22px; }
.tk-overview > button { position: relative; display: grid; grid-template-columns: 30px 1fr; gap: 1px 11px; padding: 15px 17px; text-align: left; border: 1px solid var(--border); border-radius: 10px; background: var(--card); color: var(--text); font: inherit; cursor: pointer; }
.tk-overview > button:hover, .tk-overview > button[aria-pressed='true'] { border-color: var(--accent); background: var(--accent-wash); }
.tk-overview > button:disabled { cursor: default; opacity: .7; }
.tk-overview strong { grid-column: 2; font-size: 23px; line-height: 1.3; font-weight: 550; }
.tk-overview > button > span:not(.tk-stat-icon):not(.tk-stat-arrow) { grid-column: 2; font-size: 10px; color: var(--text-soft); }
.tk-stat-icon { grid-row: 1 / 3; align-self: center; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 7px; background: var(--accent-tint); color: var(--accent); }
.tk-stat-icon .ic { width: 16px; height: 16px; }
.tk-stat-arrow { position: absolute; top: 12px; right: 12px; color: var(--text-soft); font-size: 12px; }
.tk-controls { flex: none; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding-bottom: 16px; border-bottom: 1px solid var(--border); }
.tracker-repo-box { display: flex; align-items: center; gap: 10px; min-width: 0; }
.tracker-repo-box[hidden] { display: none; }
.tracker-repo-box label { font-size: 11px; color: var(--text-soft); }
#tracker-repo { font-size: 12px; padding: 8px 10px; max-width: 340px; }
.tk-view-toggle { margin-left: auto; border: 1px solid var(--border); border-radius: 8px; padding: 3px; background: var(--bg-soft); }
.tk-view-toggle .chip { border: 0; border-radius: 5px; padding: 7px 14px; font-size: 11px; }
.tk-view-toggle .chip.active { color: var(--accent); background: var(--card); box-shadow: 0 1px 4px #203f2210; }
.tk-expand { display: inline-flex; align-items: center; justify-content: center; gap: 7px; flex: none; padding: 9px 11px; font-size: 11px; border: 1px solid var(--border); border-radius: 8px; background: var(--card); }
.tk-expand:hover { border-color: var(--accent); color: var(--accent); }
.tk-expand > span { font-size: 16px; line-height: 1; }
.tk-focus-heading { display: none; font-size: 15px; font-weight: 550; }
#tracker-pane.tk-expanded { position: fixed; inset: 0; z-index: 50; width: 100%; padding: 20px clamp(16px, 3vw, 40px) 0; overflow: hidden; }
.tk-expanded > .tk-page-topbar, .tk-expanded > .tracker-head, .tk-expanded > .tk-overview { display: none; }
.tk-expanded .tk-focus-heading { display: block; }
.tk-expanded .tk-scroll { flex: 1 1 auto; min-height: 0; overflow: auto; }
.tk-expanded .tk-board { height: 100%; min-height: 0; }
.tk-expanded .tk-controls { flex-wrap: wrap; }
.tk-task-dialog { width: min(1000px, calc(100vw - 48px)); max-width: none; max-height: calc(100dvh - 48px); margin: auto; padding: 0; border: 1px solid var(--border); border-radius: 16px; background: var(--card); color: var(--text); box-shadow: var(--shadow-2); overflow: auto; overscroll-behavior: contain; font-family: var(--font-ui); }
.tk-task-dialog::backdrop { background: #101c2b75; backdrop-filter: blur(4px); }
.tk-task-dialog .tk-detail { border: 0; border-radius: 16px; padding: 28px; }
.tk-task-dialog .tk-detail-heading { position: sticky; top: -28px; z-index: 2; background: var(--card); padding-top: 16px; }
.tk-task-dialog .tk-detail-heading h3 { overflow-wrap: anywhere; }
.tk-task-dialog .tk-detail-layout { grid-template-columns: minmax(0, 1fr) 280px; }
.tk-dialog-fields { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px 10px; }
.tk-dialog-fields > label { display: flex; flex-direction: column; gap: 7px; color: var(--text-soft); font-size: 10px; }
.tk-dialog-fields select, .tk-dialog-fields input { width: 100%; min-height: 34px; }
.tk-row, .tkt-un-row { cursor: pointer; }
.tkt-label, .tkt-un-title { border: 0; text-align: left; cursor: pointer; font: inherit; }
.tkt-label:hover, .tkt-un-title:hover { color: var(--accent); background: var(--accent-wash); }
.tkt-un-title { padding: 4px 0; background: transparent; }
.tkt-label:focus-visible, .tkt-un-title:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
@media (max-width: 850px) { .tk-task-dialog .tk-detail-layout { grid-template-columns: minmax(0, 1fr); } }
.tk-filters { display: grid; grid-template-columns: auto 1fr; gap: 10px 18px; margin: 17px 0; }
.tk-filter-tabs { display: flex; flex-wrap: wrap; align-items: center; gap: 3px; }
.tk-filter-tabs .chip { padding: 7px 9px; border: 1px solid transparent; font-size: 11px; border-radius: 6px; }
.tk-filter-tabs .chip.active { color: var(--accent); border-color: var(--border); background: var(--card); }
.tk-filter-tabs .chip b { display: inline-block; margin-left: 4px; font-weight: 400; font-size: 10px; color: var(--text-soft); }
.tk-filter-tools { display: flex; align-items: center; justify-content: flex-end; gap: 12px; min-width: 0; }
.tk-search { width: 100%; min-width: 140px; max-width: 250px; padding: 9px 11px; margin: 0; font-size: 11px; }
.tk-group-by { flex: none; margin: 0; gap: 8px; font-size: 10px; }
.tk-group-by select { padding: 8px; font-size: 11px; max-width: 135px; }
.tk-filter-notes { display: flex; align-items: center; gap: 7px; grid-column: 1 / -1; }
.tk-filter-notes:not(:has(*)) { display: none; }
.tk-filter-notes .tk-scope-note { font-size: 10px; border: 0; border-radius: 5px; padding: 4px 7px; background: var(--bg-soft); }
.tk-composer { flex: none; gap: 12px; padding: 9px 12px; margin: 0; border-radius: 9px; }
.tk-composer-plus { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 6px; background: var(--accent-tint); }
.tk-composer-plus svg { color: var(--accent); }
#tk-new-title { min-width: 0; font-size: 12px; padding: 4px 0; }
#tk-add-task { flex: none; font-size: 11px; }
#tk-add-task kbd { color: var(--text-soft); margin-left: 8px; font: inherit; }
.tk-result-info { flex: none; min-height: 40px; display: flex; align-items: center; color: var(--text-soft); font-size: 10px; }
.tk-scroll { overflow-x: hidden; padding-bottom: 32px; scrollbar-gutter: stable; }
.tk-list { container-type: inline-size; }
.tk-group { margin: 0 0 18px; border: 1px solid var(--border); border-radius: 10px; background: var(--card); overflow: clip; }
.tk-group-head { top: 0; padding: 13px 15px; margin: 0; background: var(--card); border-bottom: 1px solid var(--border); }
.tk-group-head::before { display: none; }
.tk-group-pill { font-size: 10px; text-transform: none; letter-spacing: 0; font-weight: 550; border-radius: 5px; padding: 4px 8px; }
.tk-group-count { font-size: 10px; font-weight: 400; margin-left: 3px; }
.tk-headrow, .tk-row { min-width: 0; grid-template-columns: 108px minmax(160px, 1fr) 124px 100px 112px 112px 24px; gap: 10px; padding: 11px 15px; }
.tk-headrow { font-size: 9px; text-transform: none; letter-spacing: 0; background: var(--bg); padding-block: 10px; }
.tk-row { min-height: 64px; border-bottom: 1px solid var(--border-soft); border-radius: 0; }
.tk-row.is-open { background: var(--accent-wash); }
.tk-row .tk-title { font-size: 12px; font-weight: 500; line-height: 1.65; }
.tk-title .tk-tag { font-weight: 400; font-size: 9px; padding: 1px 5px; }
.tk-status, .tk-priority { padding: 6px 8px; min-width: 0; max-width: 100%; border-radius: 6px; font-size: 10px; font-weight: 400; }
.tk-status.s-blocked { background: var(--attn-bg); border-color: var(--border); color: var(--attn-text); }
.tk-status.s-todo, .tk-priority.p-high { border-color: var(--border); }
.tk-date-field { min-width: 0; }
.tk-date-field > span { display: none; }
.tk-date-field .tk-date { width: 100%; padding: 6px 5px; font-size: 10px; background: var(--bg); border-color: var(--border); min-height: 32px; }
.tk-row .tk-people-cell { font-size: 11px; padding: 3px 0; }
.tk-row .avatar { width: 23px; height: 23px; font-size: 9px; }
.tk-del { padding: 5px; opacity: .5; }
.tk-del:focus-visible, .tk-row:hover .tk-del { opacity: 1; }
.tk-group-add { min-width: 0; margin: 0; padding: 3px 8px; }
.tk-group-add input { font-size: 11px; padding: 10px 8px; }
.tk-empty, .tk-none { min-width: 0; padding: 35px 24px; font-size: 12px; line-height: 1.8; color: var(--text-soft); border: 1px dashed var(--border); border-radius: 10px; background: var(--card); }
.tk-empty strong { color: var(--text); font-weight: 550; font-size: 17px; }
.tk-empty button { margin-top: 8px; }
.tk-detail { margin: 0; padding: 24px; border: 0; border-bottom: 1px solid var(--border); border-radius: 0; background: var(--card); }
.tk-detail-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 14px; padding-bottom: 18px; border-bottom: 1px solid var(--border); margin-bottom: 20px; }
.tk-detail-heading h3 { font-size: 17px; font-weight: 550; line-height: 1.6; margin: 0; letter-spacing: -.02em; }
.tk-detail-heading > button { font-size: 24px; line-height: 1; padding: 4px; }
.tk-detail-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(230px, .65fr); gap: 24px; }
.tk-detail-layout h4 { font-size: 12px; font-weight: 550; margin: 0 0 9px; }
.tk-field-help { margin: 0 0 15px; color: var(--text-soft); font-size: 11px; line-height: 1.8; }
.tk-toolbar { padding: 8px; margin: 0; gap: 3px; background: var(--bg-soft); border: 1px solid var(--border); border-bottom: 0; border-radius: 8px 8px 0 0; }
.tk-toolbar button { font-size: 10px; border-color: transparent; padding: 5px 7px; background: none; }
.tk-rich { min-height: 170px; max-height: 380px; padding: 15px; font-size: 13px; line-height: 1.8; border-radius: 0 0 8px 8px; }
.tk-properties { padding: 18px; background: var(--bg); border: 1px solid var(--border); border-radius: 9px; min-width: 0; }
.tk-people-edit { gap: 6px; margin: 16px 0 0; }
.tk-people-label { flex-basis: 100%; font-size: 9px; text-transform: none; letter-spacing: 0; margin-bottom: 3px; }
.tk-person-add { border-radius: 6px; padding: 7px 9px; font-size: 10px; width: 100%; min-width: 0; }
.tk-chip-person { font-size: 10px; border-radius: 6px; padding: 5px 7px; }
.tk-remind-preset { padding: 5px 7px; font-size: 9px; border-radius: 5px; }
.tk-remind-at { min-width: 0; width: 100%; padding: 7px; font-size: 11px; border-radius: 6px; }
.tk-detail-foot { flex-wrap: wrap; padding-top: 17px; margin-top: 20px; border-top: 1px solid var(--border); gap: 12px; }
.tk-detail-foot .tk-meta { flex: 1; min-width: 140px; font-size: 10px; }
.tk-detail-foot button { font-size: 11px; }
.tk-convo { margin-top: 24px; padding-top: 23px; border-top-style: solid; }
.tk-convo h4 { font-size: 13px; font-weight: 550; text-transform: none; letter-spacing: 0; margin-bottom: 16px; }
.tkc-none { font-size: 11px; line-height: 1.8; margin-bottom: 17px; }
.tkc-composer { padding: 9px; border: 1px solid var(--border); border-radius: 8px; background: var(--bg); gap: 8px; }
.tkc-text { font-size: 12px; border: 0; background: transparent; }
.tkc-composer button { font-size: 11px; }
.tk-board { gap: 14px; padding-bottom: 14px; }
.tk-col { flex-basis: 276px; padding: 12px; border-radius: 10px; }
.tk-col header { padding: 4px 2px 12px; }
.tk-col header h3 { font-size: 11px; font-weight: 550; text-transform: none; letter-spacing: 0; }
.tk-col header b { font-size: 10px; font-weight: 400; }
.tk-col-cards { gap: 10px; }
.tk-card { padding: 15px; border-radius: 9px; gap: 15px; }
.tk-card-title { font-size: 13px; line-height: 1.65; font-weight: 500; }
.tk-card-meta, .tk-card-foot { gap: 9px; flex-wrap: wrap; }
.tk-card .tk-status, .tk-card .tk-priority, .tk-card .tk-date { font-size: 10px; padding: 6px 7px; }
.tk-card .tk-people-cell { font-size: 10px; }
.tkt-scroll { border-radius: 10px; }
.tkt-label-text { font-size: 12px; }
.tkt-unscheduled { border: 1px solid var(--border); border-radius: 9px; background: var(--card); padding: 15px; }
.tkt-unscheduled h3 { margin: 0 0 15px; }
@container (max-width: 880px) {
  .tk-headrow { display: none; }
  .tk-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 26px; gap: 10px; padding: 15px; }
  .tk-row .tk-title { grid-column: 1 / 3; grid-row: 1; font-size: 13px; }
  .tk-row > .tk-del { grid-column: 3; grid-row: 1; }
  .tk-row > .tk-status { grid-column: 1; grid-row: 2; justify-self: start; }
  .tk-row > .tk-priority { grid-column: 2; grid-row: 2; justify-self: start; }
  .tk-row > .tk-people-cell { grid-column: 1 / -1; grid-row: 3; }
  .tk-date-field { grid-row: 4; }
  .tk-date-field > span { display: block; font-size: 9px; color: var(--text-soft); margin-bottom: 6px; }
  .tk-date-field:nth-last-of-type(2) { grid-column: 1; }
  .tk-date-field:last-of-type { grid-column: 2; }
  .tk-detail-layout { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 1250px) { .tk-filters { grid-template-columns: minmax(0, 1fr); } .tk-filter-tools { justify-content: space-between; } .tk-search { max-width: none; } }
@media (max-width: 700px) {
  #tracker-pane { padding: 0 16px; overflow-y: auto; }
  .tk-page-topbar { gap: 12px; min-height: 57px; }
  #tk-context { display: none; }
  .tracker-head { align-items: flex-start; margin: 22px 0 18px; gap: 12px; }
  .tk-eyebrow { font-size: 8px; max-width: 190px; line-height: 1.7; }
  #tracker-pane h1 { font-size: 28px; }
  .tk-intro { font-size: 11px; max-width: 220px; }
  .tracker-head > button { font-size: 11px; padding: 9px 10px; margin-top: 24px; }
  .tk-overview { gap: 7px; margin-bottom: 18px; }
  .tk-overview > button { display: flex; flex-direction: column; padding: 12px; gap: 5px; }
  .tk-stat-icon, .tk-stat-arrow { display: none; }
  .tk-overview strong { font-size: 22px; }
  .tk-overview > button > span:not(.tk-stat-icon):not(.tk-stat-arrow) { font-size: 9px; }
  .tk-controls { flex-wrap: wrap; gap: 12px; }
  .tracker-repo-box { width: 100%; }
  #tracker-repo { flex: 1; width: 100%; max-width: none; }
  .tk-view-toggle { margin-left: 0; }
  .tk-controls { column-gap: 8px; }
  .tk-controls .tk-expand { margin-left: auto; }
  .tk-view-toggle .chip { padding-inline: 10px; }
  .tk-expanded .tk-focus-heading { flex-basis: 100%; }
  .tk-task-dialog { width: calc(100vw - 16px); max-height: calc(100dvh - 16px); border-radius: 12px; }
  .tk-task-dialog .tk-detail { padding: 16px; }
  .tk-task-dialog .tk-detail-heading { top: -16px; }
  .tk-task-dialog .tk-detail-layout { grid-template-columns: minmax(0, 1fr); }
  .tk-filters { margin: 14px 0; gap: 12px; }
  .tk-filter-tabs .chip { padding: 7px 8px; }
  .tk-filter-tools { flex-wrap: wrap; gap: 10px; }
  .tk-search { flex: 1; font-size: 12px; min-width: 170px; }
  .tk-group-by { gap: 6px; }
  .tk-group-by label { display: none; }
  .tk-group-by select { max-width: 120px; }
  .tk-filter-notes .tk-scope-note { font-size: 9px; }
  #tk-new-title { font-size: 12px; }
  #tk-add-task kbd { display: none; }
  .tk-composer { gap: 8px; padding: 9px; }
  .tk-scroll { flex: none; overflow: visible; min-height: 200px; scrollbar-gutter: auto; }
  .tk-board { height: 65dvh; min-height: 350px; }
  .tk-col { flex-basis: calc(100vw - 40px); }
  .tk-detail { padding: 18px 15px; }
  .tk-detail-heading h3 { font-size: 15px; }
  .tk-detail-layout { gap: 18px; }
  .tk-detail-foot .tk-meta { flex-basis: 100%; }
  .tkc-composer { flex-wrap: wrap; }
  .tkc-text { width: 100%; flex-basis: 100%; font-size: 16px; padding: 8px; }
  .tk-rich { font-size: 16px; }
  .tkt-un-row { grid-template-columns: minmax(0, 1fr); gap: 10px; }
}