@font-face{font-family:Space Grotesk;src:url('./assets/space-grotesk.ttf') format('truetype');font-display:swap}
@font-face{font-family:DM Sans;src:url('./assets/dm-sans.ttf') format('truetype');font-display:swap}
@font-face{font-family:IBM Plex Mono;src:url('./assets/ibm-plex-mono.ttf') format('truetype');font-display:swap}
:root{--bg:#f5f5f0;--surface:#fcfcf9;--ink:#20352f;--muted:#65716b;--accent:#c76d42;--accent-ink:#fffaf6;--line:#dfe4dd;--sidebar:#20352f;--shadow:0 22px 70px rgba(25,41,33,.17);--todo:#58665b;--todo-bg:#edf0eb;--progress:#426e8a;--progress-bg:#eaf2f6;--blocked:#a64e35;--blocked-bg:#faeee8;--done:#34745a;--done-bg:#e8f2ec}
*{box-sizing:border-box}
html{background:var(--bg)}
body{margin:0;color:var(--ink);font:15px/1.5 'DM Sans',Arial,sans-serif;min-width:320px}
button,input,select{font:inherit}
button{cursor:pointer}
button:focus,input:focus,select:focus{outline:2px solid var(--accent);outline-offset:2px}
button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
button:active{transform:scale(.98)}
input:active,select:active{border-color:var(--accent)}
.app-shell{display:grid;grid-template-columns:246px minmax(0,1fr);min-height:100vh}
.sidebar{background:var(--sidebar);color:#edf1eb;min-height:100vh;display:flex;flex-direction:column;padding:31px 19px 24px;position:relative}
.brand{display:flex;align-items:center;gap:12px;padding:0 10px 42px}
.brand-mark{width:32px;height:32px;display:flex;align-items:flex-end;gap:3px;transform:skewY(-15deg)}
.brand-mark span{display:block;width:8px;border-radius:1px;background:#e8a278}
.brand-mark span:nth-child(1){height:13px}.brand-mark span:nth-child(2){height:22px}.brand-mark span:nth-child(3){height:29px}
.brand-copy{display:flex;flex-direction:column;line-height:1.1}
.brand-copy strong{font:700 23px/1 'Space Grotesk',Arial,sans-serif;letter-spacing:-.06em}
.brand-period{color:#e8a278}
.brand-copy small{font:10px/1.3 'IBM Plex Mono',monospace;letter-spacing:.035em;color:#a9bcb1;margin-top:6px}
.sidebar-content{flex:1}
.sidebar-label{font:11px/1.4 'IBM Plex Mono',monospace;text-transform:uppercase;letter-spacing:.12em;color:#9fb5a8;padding:0 14px;margin-bottom:13px}
.sidebar-label-spaced{margin-top:38px}
.sidebar-current{height:45px;border-radius:6px;display:flex;align-items:center;gap:11px;padding:0 13px;background:#345148;color:#fff;font-weight:700}
.sidebar-current-icon{font-size:19px;line-height:1;color:#e8a278}
.sidebar-current-count{margin-left:auto;font:12px 'IBM Plex Mono',monospace;color:#c6d5cc;font-variant-numeric:tabular-nums}
.status-nav{display:grid;gap:4px}
.status-nav-button{width:100%;min-height:44px;border:0;background:transparent;color:#c6d5cc;display:grid;grid-template-columns:9px 1fr auto;align-items:center;gap:10px;text-align:left;padding:0 14px;border-radius:5px;transition:background-color .18s,color .18s}
.status-nav-button.is-active{background:#314b42;color:#fff}
.status-nav-button:focus,.status-nav-button:focus-visible{outline-color:#e8a278;outline-offset:-2px}
.nav-marker{width:7px;height:7px;border-radius:50%;background:#e1eae3}
.marker-todo{background:#afb9b0}.marker-in-progress{background:#8ec0db}.marker-blocked{background:#eea88e}.marker-done{background:#91d1a8}
.nav-count{font:12px 'IBM Plex Mono',monospace;font-variant-numeric:tabular-nums;color:#a9bdb0}
.sidebar-foot{padding:0 11px;color:#9fb5a8;font:11px 'IBM Plex Mono',monospace;letter-spacing:.02em}
.sidebar-foot-rule{display:block;width:30px;height:1px;background:#799386;margin-bottom:14px}
.main-content{padding:51px clamp(30px,4.6vw,76px) 55px;min-width:0}
.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:38px}
.eyebrow{margin:0 0 14px;font:11px/1.2 'IBM Plex Mono',monospace;letter-spacing:.13em;color:#64746a}
.eyebrow-divider{color:#d0906d;margin:0 8px}
h1,h2,h3,p{margin-top:0}
h1{font:700 clamp(38px,3.1vw,48px)/1.04 'Space Grotesk',Arial,sans-serif;letter-spacing:-.055em;margin-bottom:11px}
.heading-period{color:var(--accent)}
.page-intro{margin-bottom:0;color:var(--muted);font-size:15px}
.head-total{display:flex;align-items:flex-end;gap:10px;white-space:nowrap;padding-bottom:3px}
.head-total>span{font:500 46px/.9 'Space Grotesk',Arial,sans-serif;letter-spacing:-.065em;font-variant-numeric:tabular-nums}
.head-total small{font:10px/1.25 'IBM Plex Mono',monospace;letter-spacing:.1em;color:var(--muted);width:43px}
.workspace{min-width:0}
.workspace-header{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:18px}
.workspace-title{display:flex;align-items:center;gap:11px;min-width:0}
.workspace-title-rule{width:4px;height:21px;background:var(--accent);border-radius:2px;flex:none}
.workspace-title h2{font:700 19px/1.25 'Space Grotesk',Arial,sans-serif;letter-spacing:-.035em;margin:0;white-space:nowrap}
.visible-count{font:11px/1.5 'IBM Plex Mono',monospace;color:var(--muted);padding:3px 7px;background:#e8ebe5;border-radius:3px;white-space:nowrap;font-variant-numeric:tabular-nums}
.workspace-note{font-size:13px;color:var(--muted);text-align:right}
.toolbar{display:flex;gap:12px;margin-bottom:20px}
.field{display:flex;flex-direction:column;gap:7px;font-size:12px;font-weight:700;color:#465a4e}
.search-field{width:min(430px,100%)}
.filter-field{width:190px;flex:none}
.input-wrap,.select-wrap,.detail-select-wrap{height:44px;display:flex;align-items:center;position:relative;background:var(--surface);border:1px solid #cfd8ce;border-radius:5px;color:#7c8b80;transition:border-color .18s,box-shadow .18s}
.input-wrap:focus-within,.select-wrap:focus-within,.detail-select-wrap:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px rgba(199,109,66,.12)}
.input-wrap:active,.select-wrap:active,.detail-select-wrap:active{border-color:var(--accent);background:#f8f4ee}
.input-wrap svg{position:absolute;left:14px;pointer-events:none}
.input-wrap input{width:100%;height:100%;padding:0 14px 0 42px;background:transparent;border:0;outline:0;color:var(--ink);font-size:15px}
.input-wrap input:focus{outline:0}
.input-wrap input::placeholder{color:#617064}
.select-wrap select,.detail-select-wrap select{appearance:none;width:100%;height:100%;border:0;outline:0;background:transparent;padding:0 38px 0 14px;color:var(--ink);font-size:14px;cursor:pointer}
.select-wrap select:focus,.detail-select-wrap select:focus{outline:0}
.select-wrap svg,.detail-select-wrap svg{position:absolute;right:13px;pointer-events:none;color:#516657}
.list-surface{background:var(--surface);border:1px solid var(--line);border-radius:7px;overflow:hidden}
.list-columns,.task-item{display:grid;grid-template-columns:minmax(250px,2.4fr) minmax(95px,.84fr) minmax(110px,.95fr) minmax(75px,.67fr) minmax(100px,.75fr);gap:14px;align-items:center}
.list-columns{min-height:41px;padding:0 22px;background:#eef1eb;border-bottom:1px solid var(--line);font:11px 'IBM Plex Mono',monospace;letter-spacing:.055em;text-transform:uppercase;color:#5e6e62}
.list-columns[hidden]{display:none}
.task-list{list-style:none;margin:0;padding:0}
.loading-state{padding:34px 22px;color:var(--muted);font-size:14px}
.loading-state[hidden]{display:none}
.task-item{min-height:73px;padding:9px 22px;border-bottom:1px solid #e8ece6;transition:background-color .18s}
.task-item:focus-within{background:#f5f7f2}
.task-item:last-child{border-bottom:0}
.task-primary{min-width:0;display:flex;align-items:center;gap:11px}
.priority-indicator{width:4px;height:33px;border-radius:2px;background:#d8ded5;flex:none}
.priority-high{background:#cf7952}.priority-medium{background:#d6bb79}
.task-copy{min-width:0}
.open-item{display:block;padding:5px 2px;margin:-5px -2px 1px;border:0;background:none;color:var(--ink);font-weight:700;text-align:left;line-height:1.28;max-width:100%;min-height:44px;transition:color .18s;cursor:pointer}
.open-item:focus,.open-item:focus-visible{outline-offset:1px;border-radius:2px}
.task-summary{font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:410px}
.cell-project{font-size:13px;font-weight:600;color:#526356}
.cell-owner{display:flex;gap:8px;align-items:center;min-width:0;font-size:13px;color:#45584b}
.avatar{width:25px;height:25px;display:grid;place-items:center;background:#e9e4d8;border:1px solid #dcd5c6;border-radius:50%;color:#765d47;flex:none;font:700 10px 'Space Grotesk',Arial,sans-serif;letter-spacing:-.02em}
.cell-owner span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cell-due{font:12px 'IBM Plex Mono',monospace;color:#526356;white-space:nowrap;font-variant-numeric:tabular-nums}
.status-badge{display:inline-flex;align-items:center;gap:6px;width:max-content;max-width:100%;padding:5px 8px;border-radius:3px;font-size:11px;font-weight:700;white-space:nowrap}
.status-badge:before{content:'';width:6px;height:6px;border-radius:50%;background:currentColor;flex:none}
.status-todo{color:var(--todo);background:var(--todo-bg)}
.status-in-progress{color:var(--progress);background:var(--progress-bg)}
.status-blocked{color:var(--blocked);background:var(--blocked-bg)}
.status-done{color:var(--done);background:var(--done-bg)}
.list-footer{display:flex;justify-content:space-between;gap:12px;padding:13px 2px;color:var(--muted);font:11px 'IBM Plex Mono',monospace;font-variant-numeric:tabular-nums}
.list-footer span:last-child{letter-spacing:.08em}
.empty-state,.error-state{text-align:center;padding:57px 24px 61px}
.empty-state[hidden],.error-state[hidden]{display:none}
.empty-symbol{width:54px;height:54px;border:1px solid #cfdbce;border-radius:50%;display:grid;place-items:center;margin:0 auto 17px;font:27px 'Space Grotesk',Arial,sans-serif;color:#7c9380}
.empty-state h3,.error-state h3{font:700 21px 'Space Grotesk',Arial,sans-serif;letter-spacing:-.04em;margin-bottom:5px}
.empty-state p,.error-state p{font-size:14px;color:var(--muted);margin-bottom:18px}
.secondary-button{min-height:44px;border:1px solid #b7c8b9;background:#f3f7f1;color:var(--ink);border-radius:4px;padding:9px 14px;font-weight:700;transition:background-color .18s,border-color .18s}
.secondary-button span{margin-left:9px;color:var(--accent)}
.detail-dialog{position:fixed;inset:0 0 0 auto;max-width:none;max-height:none;width:min(530px,100vw);height:100dvh;margin:0;padding:0;border:0;background:var(--surface);color:var(--ink);box-shadow:var(--shadow);overflow:hidden}
.detail-dialog::backdrop{background:rgba(16,31,25,.43)}
.detail-shell{display:flex;flex-direction:column;height:100%;min-height:0}
.detail-topline{height:66px;flex:none;display:flex;align-items:center;justify-content:space-between;padding:0 29px;border-bottom:1px solid var(--line)}
.detail-kicker{font:11px 'IBM Plex Mono',monospace;letter-spacing:.11em;color:#617064}
.detail-kicker>span:first-child{padding:0 7px;color:var(--accent)}
.close-button{width:44px;height:44px;border:1px solid var(--line);border-radius:4px;background:#f7f8f4;display:grid;place-items:center;color:var(--ink);transition:background-color .18s,border-color .18s}
.detail-content{overflow-y:auto;min-height:0;flex:1;padding:31px 36px 32px}
.detail-heading{padding-bottom:29px;border-bottom:1px solid var(--line)}
.detail-overline{font:11px 'IBM Plex Mono',monospace;letter-spacing:.08em;text-transform:uppercase;color:#617064;margin-bottom:16px}
.overline-dot{margin:0 7px;color:var(--accent)}
.detail-heading h2{font:700 clamp(27px,3vw,35px)/1.13 'Space Grotesk',Arial,sans-serif;letter-spacing:-.045em;margin-bottom:15px}
.detail-section{padding:27px 0 30px;border-bottom:1px solid var(--line)}
.detail-section h3{font:700 15px 'Space Grotesk',Arial,sans-serif;margin-bottom:15px}
.detail-body{font-size:15px;line-height:1.7;color:#3e5044}
.detail-body p{margin:0 0 14px}
.detail-body p:last-child{margin-bottom:0}
.detail-facts{border-bottom:0;padding-bottom:0}
.detail-facts dl{margin:0}
.detail-facts dl>div{display:grid;grid-template-columns:115px 1fr;gap:16px;padding:11px 0;border-bottom:1px solid #edf0e9;font-size:13px}
.detail-facts dl>div:last-child{border-bottom:0}
.detail-facts dt{color:#617064}
.detail-facts dd{margin:0;font-weight:600;color:#34493a}
.tag{display:inline-block;margin:0 5px 4px 0;padding:3px 7px;background:#eff2eb;border-radius:3px;font-weight:600;font-size:11px}
.detail-action{flex:none;background:#f2f4ef;border-top:1px solid var(--line);padding:20px 36px 22px}
.detail-action label{display:block;margin-bottom:8px;font-size:12px;font-weight:700;color:#3b5342}
.detail-select-wrap{width:100%;background:var(--surface)}
.detail-select-wrap select{font-size:15px;font-weight:700}
.status-feedback{margin:9px 0 0;min-height:20px;font-size:12px;color:#586a5c}
.status-feedback.is-success{color:#2d7454;font-weight:700}
@media (hover:hover) and (pointer:fine){.status-nav-button:hover{background:#314b42;color:#fff}.task-item:hover{background:#f5f7f2}.task-item:hover .open-item{color:#9a512f}.open-item:hover{text-decoration:underline;text-decoration-color:#bd7653;text-underline-offset:3px}.secondary-button:hover{background:#e8f0e6;border-color:#8ea88f}.close-button:hover{background:#e9eee7;border-color:#b7c8b9}.input-wrap:hover,.select-wrap:hover,.detail-select-wrap:hover{border-color:#96aa98}}
@media (max-width:1160px){.app-shell{grid-template-columns:205px minmax(0,1fr)}.sidebar{padding-inline:12px}.main-content{padding-inline:30px}.list-columns,.task-item{grid-template-columns:minmax(230px,2fr) minmax(90px,.8fr) minmax(90px,.8fr) minmax(95px,.8fr);gap:10px}.list-columns span:nth-child(4),.cell-due{display:none}}
@media (max-width:800px){.app-shell{display:block}.sidebar{min-height:0;padding:16px 22px;display:block}.brand{padding:0}.brand-mark{width:26px;height:26px;gap:2px}.brand-mark span{width:7px}.brand-copy strong{font-size:21px}.brand-copy small{display:none}.sidebar-content,.sidebar-foot{display:none}.main-content{padding:31px 22px 45px}.page-head{margin-bottom:31px}.head-total>span{font-size:40px}.list-columns,.task-item{grid-template-columns:minmax(230px,2fr) minmax(95px,.8fr) minmax(100px,.8fr);gap:12px}.list-columns span:nth-child(3),.cell-owner{display:none}.list-columns span:nth-child(4),.cell-due{display:none}}
@media (max-width:600px){.main-content{padding:29px 20px 38px}.page-head{align-items:flex-start;margin-bottom:28px}.eyebrow{font-size:10px;margin-bottom:11px}h1{font-size:38px}.page-intro{font-size:14px;max-width:255px}.head-total{padding-top:29px;gap:5px}.head-total>span{font-size:35px}.head-total small{font-size:8px;width:34px}.workspace-header{align-items:flex-start;margin-bottom:15px}.workspace-note{display:none}.toolbar{display:grid;gap:12px;margin-bottom:17px}.search-field,.filter-field{width:100%}.list-columns{display:none}.task-item{display:grid;grid-template-columns:1fr auto;align-items:start;gap:9px 8px;min-height:0;padding:15px 16px}.task-primary{grid-column:1/-1;gap:10px;align-items:flex-start}.priority-indicator{height:30px;margin-top:2px}.open-item{font-size:15px;padding:3px 2px;margin:-3px -2px 3px}.task-summary{font-size:12px;max-width:300px}.cell-project{grid-column:1;font-size:12px;padding-left:14px;color:#617064}.cell-status{grid-column:2;grid-row:2}.cell-owner{display:flex;grid-column:1;grid-row:3;padding-left:14px;font-size:12px}.cell-due{display:block;grid-column:2;grid-row:3;align-self:center;font-size:11px}.status-badge{font-size:10px;padding:4px 7px}.list-footer span:last-child{display:none}.detail-dialog{width:100vw}.detail-topline{height:60px;padding-inline:20px}.detail-content{padding:27px 22px}.detail-action{padding:17px 22px 19px}.detail-heading h2{font-size:30px}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:0s!important;animation-duration:0s!important}}