/* Hallmark · shape: app screen · genre: modern-minimal · theme: Console (deal 3/3) · redesign: full
 * nav: kept · signature: project ledger with server readings · states: loading, empty, error, full · console: graphite
 * axes: dark/grotesk-sans/chromatic-amber · posture: restrained · v2.0.0 */
/* Hallmark · pre-emit critique: P4 H4 E4 S4 R5 V4 · weakest: S; project ledger leads the workspace, no decorative imagery */
/* Hallmark · answered F7 · the server dashboard uses shared control radii for consistent inputs; panels, readings and rows have distinct surfaces */
@import url('https://fonts.googleapis.com/css2?family=Host+Grotesk:wght@400;500;600&family=Atkinson+Hyperlegible+Mono:wght@400;500&display=swap');
@import './tokens.css';
@import './base.css' layer(base);
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font:16px var(--font-body)}
button,input,select{font:inherit}
a{color:inherit;text-decoration:none}
button,a,input,select{outline-offset:5px}
button{cursor:pointer}
aside{width:244px;background:var(--color-paper-2);border-right:1px solid var(--border);position:fixed;height:100dvh;padding:var(--space-step-36) var(--space-lg);display:flex;flex-direction:column}
.brand{font-size:23px;font-weight:800;letter-spacing:-1px;position:relative;padding-left:var(--space-step-44)}
.logo{position:absolute;left:0;top:0;background:var(--accent);color:var(--color-paper-2);border-radius:10px;width:32px;height:34px;display:grid;place-items:center;font-size:22px}
.logo span{font-size:12px;position:absolute;right:3px;top:1px}
.brand small{display:block;font-size:12px;letter-spacing:normal;color:var(--muted);margin-top:var(--space-2xs);font-weight:500}
.muted{color:var(--muted);font-weight:500}
.nav-label{font-size:12px;letter-spacing:normal;color:var(--color-muted);margin-top:var(--space-step-56);margin-bottom:var(--space-md)}
nav{display:grid;gap:var(--space-xs)}
nav a{padding:var(--space-sm) var(--space-sm);display:flex;align-items:center;gap:var(--space-sm);color:var(--color-muted);border-radius:7px;font-size:18px}
nav a span{font-size:12px;font-weight:600}
nav a.active{background:var(--color-paper-2);color:var(--accent)}
nav b{margin-left:auto;font-size:12px;background:var(--color-ink);padding:var(--space-3xs) var(--space-xs);border-radius:4px}
.aside-bottom{margin-top:auto;padding-top:var(--space-step-36)}
.host-icon{display:inline-grid;place-items:center;width:33px;height:33px;background:var(--color-paper-2);border-radius:7px;color:var(--color-muted);margin-right:var(--space-xs)}
.aside-bottom>small{display:block;color:var(--muted);font-size:12px;margin:var(--space-sm) 0 var(--space-step-28) var(--space-3xs)}
.profile{border-top:1px solid var(--border);padding-top:var(--space-lg);display:flex;gap:var(--space-sm);align-items:center;font-size:12px}
.profile>span,.avatar{background:var(--color-rule);border:1px solid var(--color-rule);width:31px;height:31px;border-radius:50%;display:grid;place-items:center;color:var(--color-ink);font-size:12px}
.profile small{display:block;font-size:12px;color:var(--muted);margin-top:var(--space-2xs)}
.workspace{margin-left:244px}
header{height:80px;border-bottom:1px solid var(--border);padding:0 var(--space-step-44);display:flex;justify-content:space-between;align-items:center;font-size:12px;color:var(--muted)}
header strong{color:var(--color-ink);font-weight:500}
header>div{display:flex;gap:var(--space-step-20);align-items:center}
.slash{margin:0 var(--space-sm);color:var(--color-rule)}
.date{font-size:12px}
main{max-width:1530px;margin:auto;padding:var(--space-xl) var(--space-step-44) var(--space-step-20)}
.page-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-step-32)}
h1{overflow-wrap:break-word;min-width:0;font-size:33px;letter-spacing:-1.4px;margin:var(--space-xs) 0 var(--space-xs);font-weight:600}
h1>span{color:inherit}
p{color:var(--muted);line-height:1.7}
h1+p{margin:0;font-size:12px}
.primary,.secondary{border:0;border-radius:7px;padding:var(--space-sm) var(--space-md);font-size:12px;font-weight:700}
.primary{background:var(--accent);color:var(--color-paper-2)}
.primary:hover{background:var(--color-ink)}
.secondary{background:var(--color-paper-2);color:var(--color-ink);border:1px solid var(--color-rule)}
.connection-banner{border:1px solid var(--color-rule);background:var(--color-paper-2);padding:var(--space-md) var(--space-step-20);border-radius:10px;display:flex;align-items:center;gap:var(--space-md);margin-bottom:var(--space-step-28)}
.connection-symbol{background:var(--color-rule);color:var(--accent);width:35px;height:35px;border-radius:8px;font-size:25px;display:grid;place-items:center}
.connection-banner strong{font-size:12px;font-weight:600}
.connection-banner p{font-size:12px;margin:var(--space-2xs) 0 0}
.connection-banner a{margin-left:auto;color:var(--accent);font-size:12px;white-space:nowrap}
.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-md);margin-bottom:var(--space-lg)}
.metric,.panel{background:var(--panel);border:1px solid var(--border);border-radius:11px;color:var(--text)}
.metric{padding:var(--space-step-20)}
.metric>div{font-size:12px;color:var(--color-muted);display:flex;justify-content:space-between}
.metric>div span{color:var(--color-muted)}
.metric>strong{display:block;font-size:34px;letter-spacing:-1px;font-weight:500;margin:var(--space-sm) 0 var(--space-xs)}
.metric em{font-size:15px;font-style:normal;color:var(--color-muted);margin-left:var(--space-xs)}
.metric small{font-size:12px;color:var(--muted)}
.dot{display:inline-block;width:5px;height:5px;border-radius:50%;margin-right:var(--space-2xs)}
.amber{background:var(--color-muted)}
.overview-grid{display:grid;grid-template-columns:1.7fr 1fr;gap:var(--space-lg)}
.panel{padding:var(--space-lg)}
.panel-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--space-md);margin-bottom:var(--space-step-20)}
h2{font-size:15px;margin:0;font-weight:600;letter-spacing:-.3px}
h2 span{font-size:12px;margin-left:var(--space-xs);padding:var(--space-2xs) var(--space-xs);border-radius:5px}
.panel-heading p{font-size:12px;margin:var(--space-xs) 0 0}
.panel-heading a{font-size:12px;white-space:nowrap;color:var(--color-muted);margin-top:var(--space-2xs)}
.pill{font-size:12px;letter-spacing:normal;background:var(--color-paper-2);color:var(--color-muted);padding:var(--space-2xs) var(--space-xs);border:1px solid var(--color-rule);border-radius:4px;white-space:nowrap}
.empty{display:flex;min-height:190px;align-items:center;justify-content:center;flex-direction:column;text-align:center;border:1px dashed var(--color-rule);border-radius:8px;background:var(--color-paper-2);padding:var(--space-lg)}
.empty-icon{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--color-rule);background:var(--color-paper-2);color:var(--color-muted);border-radius:12px;font-size:23px;margin-bottom:var(--space-md)}
.empty strong{font-size:12px;font-weight:500}
.empty p{font-size:12px;max-width:250px;margin:var(--space-xs) 0 var(--space-md)}
.empty button{font-size:12px;padding:var(--space-xs) var(--space-sm)}
.gauge{width:160px;height:108px;margin:var(--space-step-20) auto var(--space-md);position:relative;overflow:hidden}
.gauge:before{content:'';position:absolute;left:0;top:0;width:136px;height:136px;border:12px solid var(--color-paper-2);border-bottom-color:var(--color-clear);border-radius:50%;transform:rotate(-45deg)}
.gauge>div{text-align:center;position:relative;padding-top:var(--space-step-28)}
.gauge strong{display:block;font-size:32px;font-weight:500}
.gauge span{font-size:12px;color:var(--muted)}
.resource-row{display:flex;justify-content:space-between;font-size:12px;color:var(--color-muted);margin:var(--space-md) 0 var(--space-xs)}
.resource-row b{color:var(--color-muted);font-weight:500}
.track{height:4px;background:var(--color-paper-2);border-radius:5px}
.resource-link{display:block;font-size:12px;color:var(--accent);text-align:center;border-top:1px solid var(--border);margin-top:var(--space-lg);padding-top:var(--space-md)}
.tasks-panel{margin-top:var(--space-lg)}
.tasks-panel .empty{min-height:110px;flex-direction:row;gap:var(--space-step-20);text-align:left;justify-content:flex-start}
.tasks-panel .empty-icon{margin:0}
.tasks-panel .empty p{margin-bottom:0;max-width:none}
.tasks-panel .empty button{margin-left:auto}
footer{display:flex;justify-content:space-between;font-size:12px;color:var(--color-muted);margin-top:var(--space-step-32);border-top:1px solid var(--color-paper-2);padding-top:var(--space-step-20)}
.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-step-20)}
.project-grid>.empty{grid-column:1/-1}
.filterbar{display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);margin:0 0 var(--space-lg);color:var(--muted);font-size:12px}
.filterbar label{display:flex;align-items:center;gap:var(--space-sm);border:1px solid var(--border);border-radius:7px;padding:var(--space-sm) var(--space-md);background:var(--panel)}
.filterbar input{background:none;border:0;color:var(--text);min-width:180px}
.project-card{padding:var(--space-step-20);background:var(--panel);border:1px solid var(--border);border-radius:10px}
.project-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-step-20)}
.project-icon{background:var(--color-rule);color:var(--accent);width:35px;height:35px;border-radius:9px;display:grid;place-items:center;font-size:16px}
.project-card p{font-size:12px;white-space:pre-wrap;overflow-wrap:anywhere}
.project-card a{font-size:12px;color:var(--accent);display:inline-block;margin-top:var(--space-sm)}
.project-actions{display:flex;gap:var(--space-xs);margin-top:var(--space-md);padding-top:var(--space-md);border-top:1px solid var(--border)}
.project-actions button,.task-actions button{background:none;color:var(--color-muted);border:0;font-size:12px;padding:var(--space-2xs)}
.project-mini{display:flex;gap:var(--space-sm);align-items:center;padding:var(--space-md) 0;border-top:1px solid var(--border)}
.project-mini div:nth-child(2){flex:1}
.project-mini strong{font-size:12px}
.project-mini p{font-size:12px;margin:var(--space-2xs) 0 0}
.tag{font-size:12px;border:1px solid var(--color-rule);color:var(--color-muted);background:var(--color-paper-2);padding:var(--space-2xs) var(--space-xs);border-radius:4px}
.kanban{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-step-20)}
.column{background:var(--color-paper-2);border:1px solid var(--border);border-radius:10px;padding:var(--space-md);min-height:360px}
.column.drag-over{border-color:var(--accent)}
.column h2{font-size:12px;margin-bottom:var(--space-step-20);display:flex;justify-content:space-between}
.column h2 span{font-size:12px}
.task-card{background:var(--color-paper-2);border:1px solid var(--color-rule);border-radius:8px;padding:var(--space-md);margin-bottom:var(--space-sm)}
.task-card h3{font-size:12px;font-weight:500;line-height:1.6;margin:var(--space-sm) 0;overflow-wrap:anywhere}
.task-meta{display:flex;gap:var(--space-xs);justify-content:space-between;align-items:center;color:var(--color-muted);font-size:12px}
.priority{font-size:12px;border-radius:4px;background:var(--color-rule);color:var(--color-muted);padding:var(--space-2xs) var(--space-xs)}
.priority.high{color:var(--color-muted);background:var(--color-rule)}
.task-actions{display:flex;justify-content:space-between;border-top:1px solid var(--color-rule);margin-top:var(--space-sm);padding-top:var(--space-xs)}
.task-actions select{max-width:150px;font-size:12px;border:1px solid var(--color-rule);background:var(--color-paper-2);color:var(--color-muted);border-radius:4px;padding:var(--space-2xs)}
.column-empty{font-size:12px;text-align:center;color:var(--color-muted);padding:var(--space-lg) var(--space-2xs);border:1px dashed var(--color-rule);border-radius:6px}
.storage-note{font-size:12px;margin-top:var(--space-step-20);color:var(--color-muted)}
.setup-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-lg)}
.setup-grid h2{font-size:22px;margin-top:var(--space-md)}
.setup-copy{font-size:12px;line-height:1.9;margin:var(--space-md) 0 var(--space-lg)}
.checklist>div{display:flex;gap:var(--space-md);align-items:center;border-top:1px solid var(--border);padding:var(--space-sm) 0}
.checklist>div>span{color:var(--accent);font-size:18px}
.checklist p{margin:0;color:var(--text);font-size:12px}
.checklist small{display:block;font-size:12px;color:var(--muted);margin-top:var(--space-2xs)}
.feature-list{padding-left:var(--space-md);font-size:12px;line-height:2.6;color:var(--color-muted)}
.limit-row{padding:var(--space-md) 0;border-top:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;gap:var(--space-md)}
.limit-row strong{font-size:12px}
.limit-row small{display:block;color:var(--muted);margin-top:var(--space-2xs);font-size:12px}
.limit-row button{color:var(--color-muted);background:none;border:1px solid var(--color-rule);border-radius:5px;padding:var(--space-xs);font-size:12px}
dialog{background:var(--color-paper-2);color:var(--text);border:1px solid var(--color-rule);border-radius:14px;width:min(460px,92vw);padding:var(--space-step-28)}
dialog::backdrop{background:var(--color-paper-2);}
.dialog-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-lg)}
.dialog-heading button{background:none;color:var(--color-muted);border:0;font-size:25px}
form label{display:block;font-size:12px;margin-bottom:var(--space-md);color:var(--color-muted)}
form input,form select{display:block;width:100%;background:var(--color-paper-2);border:1px solid var(--color-rule);border-radius:6px;color:var(--text);padding:var(--space-sm);margin-top:var(--space-xs)}
form .primary{width:100%;margin-top:var(--space-xs)}
.form-error{font-size:12px;color:var(--color-muted)}
#notice{background:var(--color-paper-2);border:1px solid var(--color-rule);padding:var(--space-sm);border-radius:7px;margin-bottom:var(--space-step-20);font-size:12px}
button:hover,a:hover{filter:brightness(1.12)}
[hidden]{display:none!important}
@media(min-width:1550px){main{padding-top:var(--space-step-56)}
.metrics{gap:var(--space-lg)}
.metric{padding:var(--space-lg)}
.panel{padding:var(--space-step-28)}
.empty{min-height:235px}
}
@media(max-width:1150px){aside{width:200px;padding:var(--space-step-32) var(--space-md)}
.workspace{margin-left:200px}
main{padding:var(--space-step-28) var(--space-lg)}
header{padding:0 var(--space-lg)}
.overview-grid{grid-template-columns:1.3fr 1fr}
.metrics{gap:var(--space-sm)}
.metric{padding:var(--space-md)}
.connection-banner{padding:var(--space-md)}
.connection-banner a{font-size:12px}
.project-grid{grid-template-columns:repeat(2,1fr)}
h1{overflow-wrap:break-word;min-width:0;font-size:29px}
.kanban{gap:var(--space-sm)}
.column{padding:var(--space-sm)}
}
@media(max-width:800px){aside{position:sticky;top:0;width:auto;height:auto;padding:var(--space-md);z-index:2;border-bottom:1px solid var(--border)}
.brand{font-size:19px;min-height:32px}
.brand small,.nav-label,.aside-bottom{display:none}
nav{display:flex;overflow-x:auto;gap:var(--space-xs);margin-top:var(--space-md)}
nav a{padding:var(--space-xs);white-space:nowrap;font-size:15px;gap:var(--space-xs)}
nav a span{font-size:12px}
nav b{display:none}
.workspace{margin-left:0}
header{height:53px;padding:0 var(--space-step-20);font-size:12px}
.date{display:none}
main{padding:var(--space-lg) var(--space-step-20)}
.page-heading{gap:var(--space-sm)}
h1{overflow-wrap:break-word;min-width:0;font-size:25px;letter-spacing:-1px}
.primary{font-size:12px;padding:var(--space-sm)}
.connection-banner{flex-wrap:wrap;gap:var(--space-sm)}
.connection-banner a{margin-left:var(--space-step-44)}
.connection-banner strong{font-size:12px}
.metrics{grid-template-columns:repeat(2,1fr);gap:var(--space-sm)}
.overview-grid,.setup-grid{grid-template-columns:1fr}
.project-grid{grid-template-columns:1fr}
.kanban{grid-template-columns:1fr}
.column{min-height:180px;padding:var(--space-md)}
.tasks-panel .empty{flex-wrap:wrap}
.tasks-panel .empty button{margin-left:0}
footer span:last-child{display:none}
.filterbar{flex-wrap:wrap}
.panel{padding:var(--space-step-20)}
.gauge{margin:var(--space-md) auto}
.filterbar label{flex:1}
}

.connected{border-color:var(--color-rule)}
.track>span{height:4px;display:block;background:var(--accent);border-radius:4px}
.server-resources{margin:var(--space-md) 0}
#serverProjects{margin-bottom:var(--space-lg)}
#serviceList .limit-row{font-size:12px;overflow-wrap:anywhere}
#serviceList .limit-row span{font-size:12px}
#importLocal{margin-bottom:var(--space-sm)}

.attention-panel,.history-panel{margin-bottom:var(--space-lg)}
.attention-item{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm) 0;border-top:1px solid var(--border)}
.attention-item>div{flex:1;min-width:0}
.attention-item strong{font-size:12px}
.attention-item p{font-size:12px;margin:var(--space-2xs) 0 0;overflow-wrap:anywhere}
.attention-dot{display:grid;place-items:center;flex:none;width:25px;height:25px;border-radius:50%;background:var(--color-rule);color:var(--color-muted);font-weight:700}
.attention-ok{font-size:12px;color:var(--accent);margin:0;line-height:1.8}
.history-range{display:flex;align-items:center;gap:var(--space-xs);font-size:12px;color:var(--muted)}
.history-range select{background:var(--color-paper-2);color:var(--text);border:1px solid var(--color-rule);border-radius:6px;padding:var(--space-xs)}
.history-metric{margin-top:var(--space-step-20);--line:var(--color-muted)}
.history-memory{--line:var(--color-muted)}
.history-disk{--line:var(--color-muted)}
.history-caption{display:flex;justify-content:space-between;gap:var(--space-sm);font-size:12px}
.history-caption strong{color:var(--line)}
.history-caption span{color:var(--muted);font-size:12px}
.history-metric svg{width:100%;height:auto;display:block;overflow:visible}
.history-metric svg text{font:12px var(--font-body);fill:var(--muted)}
.chart-grid{stroke:var(--border);stroke-width:1}
.chart-line{fill:none;stroke:var(--line);stroke-width:2;stroke-linejoin:round}
.history-metric circle{fill:var(--line)}
.history-empty{padding:var(--space-step-28) 0;color:var(--muted);font-size:12px}
.history-empty p{margin-bottom:0}
@media(max-width:600px){.history-panel .panel-heading{flex-wrap:wrap}
.history-metric svg{min-height:140px}
.history-range select{min-height:40px}
}

/* Kanban workspace */
.board-toolbar{display:flex;flex-wrap:wrap;gap:var(--space-sm);padding:var(--space-step-20);background:var(--panel);border:1px solid var(--border);border-radius:11px;margin-bottom:var(--space-step-20);align-items:end}
.board-toolbar label{display:flex;flex:1 1 125px;flex-direction:column;gap:var(--space-xs);color:var(--color-muted);font-size:12px;min-width:0}
.board-toolbar .board-search{flex:2 1 250px}
.board-toolbar input,.board-toolbar select{width:100%;min-width:0;background:var(--color-paper-2);border:1px solid var(--color-rule);color:var(--text);border-radius:6px;padding:var(--space-sm);font-size:12px;min-height:40px}
.board-heading{display:flex;align-items:center;gap:var(--space-md);margin-bottom:var(--space-step-20);flex-wrap:wrap}
.board-heading>span{font-size:12px;color:var(--muted)}
.board-heading>.secondary{margin-left:auto}
.board-tabs{display:flex;gap:var(--space-2xs);background:var(--color-paper-2);padding:var(--space-2xs);border:1px solid var(--border);border-radius:8px}
.board-tabs button{background:none;border:0;border-radius:5px;color:var(--color-muted);padding:var(--space-xs) var(--space-md);font-size:12px}
.board-tabs button[aria-pressed=true]{background:var(--color-rule);color:var(--accent)}
.kanban{align-items:start}
.column{min-width:0}
.column>h2{font-size:13px;align-items:center}
.task-card{min-width:0;transition:border-color .12s}
.task-card[draggable=true]{cursor:grab}
.task-card.overdue{border-left:1px solid var(--border)}
.task-card.today{border-left:1px solid var(--border)}
.task-title{background:none;border:0;color:var(--text);padding:0;text-align:left;font-size:13px;line-height:1.65;font-weight:600;overflow-wrap:anywhere;width:100%}
.task-title:hover{color:var(--accent)}
.task-excerpt{font-size:12px;line-height:1.6;margin:calc(-1 * var(--space-2xs)) 0 var(--space-sm);white-space:pre-wrap;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.task-progress{display:flex;gap:var(--space-sm);align-items:center;margin:var(--space-sm) 0;font-size:12px;color:var(--color-muted)}
.task-progress progress{min-width:25px;flex:1;width:60px;height:5px;accent-color:var(--accent)}
.due-label{font-size:12px}
.due-label.overdue{color:var(--color-muted)}
.due-label.today{color:var(--color-muted)}
.due-label.soon{color:var(--color-ink)}
.task-link{font-size:12px;color:var(--accent)}
.task-actions{gap:var(--space-xs);flex-wrap:wrap;align-items:center}
.task-actions button{min-height:32px}
.task-actions select{font-size:12px;min-height:34px;flex:1;max-width:none;min-width:100px}
.task-reorder{display:flex;gap:var(--space-3xs)}
.task-reorder button{min-width:30px;font-size:17px;border:1px solid var(--color-rule);border-radius:4px}
.task-list{grid-template-columns:repeat(3,minmax(0,1fr))}
.task-list>.column-empty{grid-column:1/-1;padding:var(--space-xl)}
.quick-task{display:flex;margin-top:var(--space-sm);gap:var(--space-xs)}
.quick-task input{margin:0;padding:var(--space-sm);min-width:0;font-size:12px}
.quick-task button{background:var(--color-paper-2);border:1px solid var(--color-rule);color:var(--accent);border-radius:6px;min-width:36px;font-size:20px}
.drop-before{box-shadow:0 -3px 0 var(--accent)}
.drop-after{box-shadow:0 3px 0 var(--accent)}
.task-undo{display:flex;align-items:center;justify-content:space-between;gap:var(--space-sm);background:var(--color-paper-2);border:1px solid var(--color-rule);border-radius:8px;padding:var(--space-sm) var(--space-md);margin-bottom:var(--space-md);font-size:12px}
.task-editor{width:min(640px,94vw);max-height:90dvh;overflow:auto}
.task-editor textarea{display:block;width:100%;margin-top:var(--space-xs);padding:var(--space-sm);background:var(--color-paper-2);color:var(--text);border:1px solid var(--color-rule);border-radius:6px;resize:vertical;font:inherit;font-size:13px;line-height:1.6}
.task-checklist{border:1px solid var(--color-rule);border-radius:8px;padding:var(--space-md);margin:0 0 var(--space-md);min-width:0}
.task-checklist legend{font-size:12px;color:var(--color-muted);padding:0 var(--space-xs)}
.task-checklist legend span{color:var(--muted);margin-left:var(--space-xs)}
.checklist-item{display:flex;align-items:center;gap:var(--space-xs);margin-bottom:var(--space-xs)}
.checklist-item input[type=checkbox]{width:19px;height:19px;flex:none;margin:0;accent-color:var(--accent)}
.checklist-item input[type=text]{margin:0;min-width:0;flex:1;padding:var(--space-xs);font-size:12px}
.checklist-item input[type=checkbox]:checked+input{text-decoration:line-through;color:var(--muted)}
.checklist-item button{background:none;border:0;color:var(--color-muted);font-size:20px;min-width:30px;min-height:36px}
.task-checklist>.secondary{font-size:12px;padding:var(--space-xs);margin-top:var(--space-2xs)}
button:disabled{cursor:not-allowed;opacity:.45;background-color:var(--color-paper-3);color:var(--muted)}

@media(max-width:1100px) and (min-width:801px){.kanban{grid-template-columns:repeat(3,minmax(240px,1fr));overflow-x:auto;padding-bottom:var(--space-sm)}
.task-list{grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible}
}

@media(max-width:800px){.board-toolbar{padding:var(--space-sm);gap:var(--space-sm)}
.board-toolbar .board-search{flex-basis:100%}
.board-toolbar label{flex-basis:calc(50% - 10px)}
.board-toolbar input,.board-toolbar select,.quick-task input,.task-editor input,.task-editor select,.task-editor textarea{font-size:16px;min-height:44px}
.board-heading{gap:var(--space-sm)}
.board-heading>.secondary{min-height:44px}
.board-tabs button{min-height:40px;padding:var(--space-xs) var(--space-sm)}
.task-card{padding:var(--space-md)}
.task-title{font-size:15px}
.task-actions select,.task-actions button,.task-reorder button{min-height:44px;font-size:12px}
.task-reorder button{min-width:40px;font-size:20px}
.task-meta{font-size:12px}
.task-list{grid-template-columns:1fr}
.task-editor{padding:var(--space-step-20)}
.checklist-item input[type=checkbox]{min-height:22px;width:22px}
.checklist-item button{min-height:44px}
.task-undo{position:sticky;top:130px;z-index:1;font-size:12px}
.task-undo button{min-height:44px}
.board-toolbar>.secondary{min-height:44px}
.column{min-height:160px}
.column>h2{font-size:14px}
}

@media(min-width:601px){.task-editor #fields{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-md)}
.task-editor #fields>label{margin:0}
.task-editor #fields>label:first-child,.task-editor #fields>label:nth-child(n+6),.task-editor #fields>.task-checklist{grid-column:1/-1}
.task-editor .task-checklist{margin-bottom:0}
.task-editor .form-error{margin-top:var(--space-step-20)}
}


html,body{overflow-x:clip}

body{font-family:var(--font-body);font-size:16px;line-height:1.5}

:focus-visible{outline:2px solid var(--color-focus);outline-offset:3px}

button,input,select,textarea{font-family:var(--font-body)}

button,a{transition:background-color var(--dur-short) var(--ease-out),color var(--dur-short) var(--ease-out)}

button:hover,a:hover{filter:none}
button:active{transform:translateY(1px)}
button:disabled{opacity:.5;cursor:not-allowed;background-color:var(--color-paper-3);color:var(--muted)}
button[aria-busy=true]{cursor:progress}

.skip{position:fixed;transform:translateY(-200%);z-index:10;padding:var(--space-sm) var(--space-step-20);background:var(--color-accent);color:var(--color-accent-ink)}
.skip:focus-visible{transform:none}

aside{width:232px;padding:var(--space-step-32) var(--space-step-20);background:var(--color-paper-3)}

.brand{font-size:22px;letter-spacing:-.7px;font-weight:500;padding-left:var(--space-step-44)}
.logo{background:var(--color-paper-2);color:var(--text);border:1px solid var(--border);border-radius:6px;height:35px}
.brand small{font-size:12px;letter-spacing:normal;margin-top:var(--space-2xs)}
.brand .muted{color:var(--text)}

.nav-label{margin-top:var(--space-step-48);margin-left:var(--space-sm);font-size:12px;color:var(--muted)}

nav{gap:var(--space-2xs)}
nav a{min-height:44px;padding:var(--space-sm) var(--space-sm);gap:var(--space-sm);color:var(--muted)}
nav a span{font-size:14px;font-weight:400}
.nav-icon{width:19px;height:19px;flex:none}
nav a.active{color:var(--accent);background:var(--color-accent-soft)}
nav a:hover{background:var(--color-paper-2)}
nav b{font-family:var(--font-outlier);font-weight:400;background:var(--color-clear);font-size:12px}

.aside-bottom{font-size:14px}
.aside-bottom>small{font-size:12px;margin:var(--space-sm) 0 var(--space-lg)}
.host-icon{color:var(--muted);background:var(--color-paper-2)}
.profile{font-size:13px}
.profile small{font-size:12px}
.profile>span,.avatar{background:var(--color-paper-2);color:var(--text);border-color:var(--border);border-radius:6px}

.workspace{margin-left:232px}
header{height:72px;padding:0 var(--space-step-36);font-size:13px;background:var(--color-paper)}
header strong{color:var(--text)}
.date{font-size:12px}

main{max-width:1480px;padding:var(--space-step-32) var(--space-step-36)}
.page-heading{margin-bottom:var(--space-step-28);gap:var(--space-step-20)}
h1{overflow-wrap:break-word;min-width:0;font-size:32px;font-weight:500;line-height:1.2;letter-spacing:-1px;margin:0 0 var(--space-xs);text-wrap:balance}
h1+p{font-size:14px}
h2{font-size:17px;font-weight:500;line-height:1.4;text-wrap:balance;overflow-wrap:break-word;min-width:0}
h2 span{font-family:var(--font-outlier)}

.primary,.secondary{font-size:13px;font-weight:500;border-radius:6px;min-height:40px;padding:var(--space-xs) var(--space-md);white-space:nowrap}
.primary{background:var(--accent);color:var(--color-accent-ink);border:1px solid var(--accent)}
.primary:hover{background:var(--color-ink)}
.secondary{background:var(--color-paper-2);border:1px solid var(--color-rule-2);color:var(--text)}
.secondary:hover{background:var(--color-rule)}

.connection-banner{background:var(--color-paper-2);border-color:var(--border);border-radius:8px;padding:var(--space-md) var(--space-step-20);gap:var(--space-md);margin-bottom:var(--space-lg)}
.connection-symbol{background:var(--color-clear);color:var(--muted);font-size:26px}
.connection-banner strong{font-size:13px;font-weight:500}
.connection-banner p{font-size:12px}
.connection-banner a{font-size:12px;color:var(--text);text-decoration:underline;text-underline-offset:4px}
.connected{border-color:var(--color-rule-2)}

#overview{display:flex;flex-direction:column;gap:var(--space-lg)}
.metrics{order:0;gap:0;margin:0;border:1px solid var(--border);border-radius:8px;overflow:clip;background:var(--color-paper-2)}
.metric{background:var(--color-clear);border:0;border-right:1px solid var(--border);border-radius:0;padding:var(--space-step-20) var(--space-lg);min-width:0}
.metric:last-child{border-right:0}
.metric>div{font-size:13px;color:var(--muted)}
.metric>strong{font-family:var(--font-outlier);font-size:36px;font-weight:400;letter-spacing:-1px;margin:var(--space-sm) 0 var(--space-xs);color:var(--text);font-variant-numeric:tabular-nums}
.metric:nth-child(n+3)>strong{color:var(--color-cool)}
.metric em{font-size:15px;color:var(--muted)}
.metric small{font-size:12px;line-height:1.5}
.metric>div span,.dot{display:none}

.overview-grid{order:1;grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);gap:var(--space-lg);align-items:start}
.panel{border-radius:8px;padding:var(--space-lg);background:var(--panel);color:var(--text);min-width:0}
.panel-heading{margin-bottom:var(--space-step-20);align-items:center}
.panel-heading p{font-size:12px}
.panel-heading a{font-size:12px;color:var(--text);text-decoration:underline;text-underline-offset:4px}
.projects-panel{grid-column:1;grid-row:1}
.resource-panel{grid-column:2;grid-row:1 / 3}
.tasks-panel{grid-column:1;grid-row:2;margin:0}
.attention-panel{order:2;margin:0}
.attention-item strong{font-size:14px}
.attention-item p{font-size:12px}
.attention-dot{background:var(--color-accent-soft);color:var(--accent);border-radius:4px}

.empty{border:0;border-radius:0;background:var(--color-clear);min-height:155px;padding:var(--space-step-20) var(--space-sm)}
.empty-icon{display:none}
.empty strong{font-size:16px;font-weight:500}
.empty p{font-size:13px;max-width:330px}
.empty button{font-size:13px}
.tasks-panel .empty{min-height:110px;gap:var(--space-md)}
.tasks-panel .empty p{max-width:270px}

.project-mini{gap:var(--space-md);padding:var(--space-md) 0}
.project-mini strong{font-size:14px;font-weight:500}
.project-mini p{font-size:12px;overflow-wrap:anywhere}
.project-mini>div:nth-child(2){min-width:0}
.project-mini .secondary{min-height:34px;font-size:12px}
.project-icon{background:var(--color-paper-3);color:var(--muted);border:1px solid var(--border);border-radius:6px;font-size:15px}
.project-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.project-card{background:var(--panel);color:var(--text)}
.project-card p{font-size:14px}
.project-card a{font-size:13px}
.project-actions button{font-size:12px;min-height:40px}

.gauge{width:auto;height:auto;margin:var(--space-step-28) 0 var(--space-step-32);overflow:visible}
.gauge:before{display:none}
.gauge>div{padding:0;text-align:left}
.gauge strong{font-family:var(--font-outlier);font-size:48px;line-height:1.2;color:var(--color-cool);font-weight:400}
.gauge span{font-size:12px}
.resource-row{font-size:12px;color:var(--muted);margin-top:var(--space-lg)}
.resource-row b{color:var(--text);font-family:var(--font-outlier);font-weight:400}
.track{background:var(--color-rule);height:4px}
.track>span{background:var(--color-cool)}
.resource-link{color:var(--text);font-size:12px;text-align:left}
.pill{background:var(--color-paper-3);color:var(--muted);border-color:var(--border);font-size:12px;letter-spacing:normal}

.tag,.priority{background:var(--color-paper-3);color:var(--muted);border-color:var(--border);font-size:12px}
.priority.high,.due-label.today{color:var(--accent);background:var(--color-accent-soft)}
.due-label.overdue,.form-error{color:var(--color-bad)}
.due-label.soon{color:var(--color-ok)}
.task-card.overdue{border-color:var(--color-bad);border-left-width:1px}
.task-card.today{border-color:var(--accent);border-left-width:1px}
.column{border:0;background:var(--color-paper-3);padding:var(--space-md)}
.column h2{font-size:14px}
.task-card{background:var(--panel);color:var(--text);border:1px solid var(--border)}
.task-title{font-size:14px;font-weight:500}
.task-excerpt,.task-meta,.task-progress{font-size:12px;color:var(--muted)}

form input,form select,textarea,.board-toolbar input,.board-toolbar select{background:var(--color-paper-3);color:var(--text);border-color:var(--color-rule-2);font-size:14px}
form label{font-size:13px;color:var(--muted)}
dialog{background:var(--panel);border-color:var(--color-rule-2);border-radius:10px}
dialog::backdrop{background:var(--color-backdrop)}
.board-tabs button[aria-pressed=true]{background:var(--color-accent-soft)}
.history-metric{--line:var(--color-cool)}
.history-memory{--line:var(--color-ok)}
.history-disk{--line:var(--color-muted)}
.history-caption{font-size:14px}
.history-caption span{font-size:12px}
.history-metric svg text{font-family:var(--font-outlier)}
.history-empty{font-size:14px}
.limit-row strong,.setup-copy,.feature-list{font-size:14px}
.limit-row small,.storage-note{font-size:12px}
.publication-panel{margin-bottom:var(--space-lg)}
.publication-panel .panel-heading{flex-wrap:wrap}
#notice{background:var(--color-paper-2);border-color:var(--color-rule-2);font-size:13px}
footer{font-size:12px;color:var(--muted);margin-top:var(--space-step-28)}

@media(min-width:1800px){aside{left:max(0px,calc((100% - 1800px)/2))}
.workspace{max-width:1568px;margin-left:calc(232px + max(0px,(100% - 1800px)/2))}
}

@media(max-width:1100px){aside{width:208px}
.workspace{margin-left:208px}
main{padding:var(--space-step-28) var(--space-lg)}
header{padding:0 var(--space-lg)}
.overview-grid{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr)}
.metric{padding:var(--space-step-20)}
.metric>strong{font-size:30px}
.panel-heading{flex-wrap:wrap}
.tasks-panel .empty{flex-wrap:wrap}
.tasks-panel .empty button{margin-left:0}
}

@media(max-width:800px){aside{position:relative;width:auto;height:auto;padding:var(--space-step-20);border-right:0}
.workspace{margin-left:0}
.brand small,.nav-label,.aside-bottom{display:none}
.brand{font-size:22px;display:block;min-height:36px}
nav{margin-top:var(--space-md);overflow-x:auto;display:flex}
nav a{padding:var(--space-sm);gap:var(--space-xs);white-space:nowrap}
nav a span{font-size:13px}
header{height:52px;padding:0 var(--space-step-20)}
.page-heading{align-items:flex-start;flex-wrap:wrap}
main{padding:var(--space-step-28) var(--space-step-20)}
h1{overflow-wrap:break-word;min-width:0;font-size:28px}
h1+p{font-size:14px}
.metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
.metric{padding:var(--space-step-20)}
.metric:nth-child(2){border-right:0}
.metric:nth-child(-n+2){border-bottom:1px solid var(--border)}
.metric>strong{font-size:32px}
.overview-grid{grid-template-columns:minmax(0,1fr)}
.projects-panel,.resource-panel,.tasks-panel{grid-column:auto;grid-row:auto}
.resource-panel{order:1}
.tasks-panel{order:2}
.connection-banner{flex-wrap:wrap}
.connection-banner a{margin-left:0}
.connection-symbol{display:none}
.panel{padding:var(--space-step-20)}
.project-grid{grid-template-columns:minmax(0,1fr)}
.primary,.secondary{min-height:44px}
.project-mini{flex-wrap:wrap}
.project-mini>div:nth-child(2){flex:1}
.project-mini .secondary{min-height:40px}
.setup-grid{grid-template-columns:minmax(0,1fr)}
.panel-heading a{white-space:normal}
.filterbar label{min-width:0}
.filterbar input{min-width:0;width:100%}
.task-editor input,.task-editor select,.task-editor textarea{font-size:16px}
footer{gap:var(--space-md);flex-wrap:wrap}
}

@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}

.project-detail{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-step-20);margin-bottom:var(--space-step-20)}
.project-detail>.panel:nth-child(n+3){grid-column:1/-1}
.project-detail .limit-row>span,.project-detail .tag{white-space:nowrap}
.project-detail .limit-row>span{font-size:13px}
.project-detail .limit-row strong{font-weight:500}
.project-back{display:flex;justify-content:space-between;gap:var(--space-md);font-size:12px;margin:0 0 var(--space-md)}
.project-warn{color:var(--color-accent);border-color:currentColor}
.file-tree{font-size:12px;max-height:520px;overflow:auto}
.file-tree details>*:not(summary){margin-left:var(--space-md)}
.file-dir summary{cursor:pointer;padding:var(--space-2xs) 0}
.file-row{display:flex;justify-content:space-between;gap:var(--space-md);padding:var(--space-2xs) 0;border-top:1px solid var(--border);overflow-wrap:anywhere}
.file-row small{color:var(--muted);white-space:nowrap}
@media (max-width:760px){.project-detail{grid-template-columns:1fr}}
body.tg-only>:not(#tgOnly){display:none!important}
#tgOnly{min-height:100vh;display:grid;place-content:center;gap:8px;padding:16px;text-align:center}
#tgOnly[hidden]{display:none}
#tgOnly h1{margin:0}
#tgOnly p{margin:0;color:var(--color-muted,#9aa3ad);max-width:320px}