:root{--ink:#173d50;--text:#203d4b;--muted:#627784;--line:#dce5e9;--bg:#f2f6f8;--surface:#fff;--subtle:#f5f8f9;--teal:#087d72;--focus:#178e9a;--danger:#a34538;--green:#e8f3ee;--green-ink:#386454;--amber:#fff1d2;--amber-ink:#805d21;--red:#f9e3df;--red-ink:#9a493b;--radius:8px;font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--text);background:var(--bg)}
*{box-sizing:border-box}
body{margin:0;font-size:14px;line-height:1.5;background:var(--bg)}
button,input,select{font:inherit}
a{color:inherit}
button{cursor:pointer}
button:disabled{cursor:default;opacity:.45}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
h1{font-size:28px;line-height:1.2;letter-spacing:-.5px;font-weight:600;margin:0 0 8px;color:var(--ink)}
h2{font-size:18px;line-height:1.3;font-weight:600;margin:0 0 12px;color:var(--ink)}
h3{font-size:15px;font-weight:600;margin:0;color:var(--ink)}
p{margin:0}
[hidden]{display:none!important}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

input,select{border:1px solid #c6d5de;background:var(--surface);border-radius:6px;padding:8px 10px;color:var(--ink)}
input[type=color]{width:64px;height:38px;padding:3px}
input[type=file]{padding:6px}

.button{display:inline-flex;align-items:center;justify-content:center;border:1px solid #c7d7df;background:var(--surface);color:var(--ink);border-radius:6px;padding:9px 14px;font-weight:600;line-height:1.2;text-decoration:none;white-space:nowrap;transition:filter .13s}
.button:hover:not(:disabled){filter:brightness(.95)}
.button.primary{background:var(--teal);border-color:var(--teal);color:#fff}
.button.danger{background:var(--danger);border-color:var(--danger);color:#fff}
.button.small{padding:7px 11px;font-size:12px}
.button.quiet{background:transparent;border-color:#5f7c8c;color:#fff;font-size:12px;padding:8px 12px}
.button.quiet:hover{background:#ffffff1a;filter:none}
.text-button{border:0;background:none;color:var(--muted);padding:4px 2px;font-size:12px;text-decoration:underline;text-underline-offset:3px}
.text-button.danger{color:var(--danger)}

.topbar{background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px 20px;padding:14px 28px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font-size:19px;font-weight:600}
.brand small{display:block;font-size:11px;font-weight:400;color:#bed3db}
.brand-mark{display:flex;align-items:flex-end;gap:4px;height:28px}
.brand-mark i{display:block;width:7px;background:#96d0be;border-radius:2px}
.brand-mark i:nth-child(1){height:13px}
.brand-mark i:nth-child(2){height:26px}
.brand-mark i:nth-child(3){height:19px}
.header-actions{display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.header-actions>span{color:#c7d8df;font-size:12px;margin-right:6px}
.header-actions form{margin:0}

.page{max-width:1100px;margin:0 auto;padding:28px}
.page.narrow{max-width:560px}
.back-link{font-size:13px;color:var(--muted);margin-bottom:14px}
.lede{color:var(--muted);margin-bottom:6px}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:22px;margin:18px 0}
.stack{display:grid;gap:14px}
.stack>*{margin:0}
.field{display:flex;flex-direction:column;gap:6px;font-size:12px;font-weight:600;color:var(--ink)}
.field input,.field select{width:100%;min-width:0;font-weight:400;font-size:14px}
.field input[type=color]{width:64px}
.field-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px;align-items:end}
.field-row>.button{justify-self:start}
.form-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0}
.form-note{font-size:12px;color:var(--muted)}
.eyebrow{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.muted{color:var(--muted)}
.error{color:var(--red-ink);background:var(--red);padding:10px 12px;border-radius:6px;margin:12px 0}
.success{display:grid;gap:6px;background:var(--green);padding:16px;border-radius:6px;margin:18px 0;overflow-wrap:anywhere}
.editor-form fieldset{border:0;padding:0;margin:0;min-width:0}

.table-scroll{overflow-x:auto;max-width:100%}
.data-table{width:100%;border-collapse:collapse;font-size:13px}
.data-table th,.data-table td{padding:9px 12px;text-align:left;vertical-align:top;border-top:1px solid var(--line)}
.data-table thead th{border-top:0;font-size:11px;font-weight:600;color:var(--muted);white-space:nowrap}
.data-table tbody th{font-weight:600;color:var(--ink);white-space:nowrap}
.data-table input,.data-table select{width:100%;min-width:90px}
.data-table form{margin:0}
.workload-grid th,.workload-grid td{padding:6px}
.workload-grid input{width:64px;min-width:56px;padding:6px}

.login-page{min-height:100vh;display:grid;place-items:center;padding:16px;background:#e8f0f5}
.login-card{width:min(440px,100%);padding:36px;background:var(--surface);border:1px solid var(--line);border-radius:12px}
.login-card form{margin:22px 0 16px}
.login-card input{padding:11px 12px}

.planner-layout{max-width:1450px;margin:0 auto;padding:28px;display:grid;grid-template-columns:300px minmax(0,1fr);gap:20px;align-items:start}
.project-panel,.main-panel,.capacity-panel,.month-panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius)}
.project-panel{padding:20px}
.main-panel{padding:24px;min-width:0}
.project-panel-heading,.planner-heading,.section-heading,.funding-summary{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}
.project-panel-heading h2{font-size:20px;margin:0}
.project-panel-heading p,.section-heading p{color:var(--muted);font-size:12px;margin-top:4px}
.project-list{margin-top:14px}
.project-card{padding:14px 0;border-top:1px solid var(--line)}
.project-card-heading{display:flex;align-items:center;gap:8px;font-weight:600}
.project-card-heading a{text-decoration:none}
.project-card-heading a:hover{text-decoration:underline}
.project-card.off .project-card-heading a{color:var(--muted)}
.color-dot{flex-shrink:0;width:10px;height:10px;border-radius:50%}
.project-dates{display:flex;justify-content:space-between;gap:8px;font-size:11px;color:var(--muted);margin:8px 0}
.project-track{display:grid;grid-template-columns:repeat(12,1fr);gap:3px;height:8px}
.project-track i{background:#edf2f4;border-radius:2px}
.project-track i.active{background:var(--teal)}
.project-card.off .project-track i.active{background:#becbd1}
.toggle-form,.project-state{display:flex;align-items:center;justify-content:space-between;margin-top:6px;font-size:11px;color:var(--muted)}
.sidebar-actions{display:flex;flex-wrap:wrap;gap:12px;border-top:1px solid var(--line);padding-top:14px;font-size:12px}
.planner-heading{align-items:center;margin-bottom:18px}
.planner-heading h1{margin:0}
.year-nav{display:flex;align-items:center;gap:8px;white-space:nowrap}
.year-nav a,.year-nav span{padding:6px 10px;border:1px solid var(--line);border-radius:6px;text-decoration:none;font-size:13px}
.year-nav a:hover{background:#f0f6f8}
.year-nav span{color:#a6b4bb;border-style:dashed}
.filter-row form{display:flex;align-items:center;flex-wrap:wrap;gap:10px}
.filter-row label{display:flex;align-items:center;gap:8px;font-size:13px}
.mode-tabs{display:flex;align-items:center;flex-wrap:wrap;gap:4px;border-bottom:1px solid var(--line);margin:16px 0}
.mode-tabs a{padding:10px 14px;margin-bottom:-1px;border-bottom:3px solid transparent;text-decoration:none;color:var(--muted)}
.mode-tabs a[aria-current=page]{color:var(--ink);border-bottom-color:var(--teal);font-weight:600}
.changed-indicator{margin-left:auto;color:var(--amber-ink);font-size:12px}
.metric-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin:18px 0}
.metric-card{border:1px solid var(--line);border-radius:var(--radius);padding:16px;display:grid;gap:6px;align-content:start}
.metric-card small,.metric-card span{color:var(--muted);font-size:12px}
.metric-card strong{font-size:24px;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}
.capacity-panel,.month-panel{padding:20px;margin-top:18px}
.section-heading{margin-bottom:12px}
.section-heading h2{margin:0}
.section-tag{font-size:12px;color:var(--muted);white-space:nowrap}

.capacity-table{width:100%;min-width:720px;border-collapse:separate;border-spacing:4px;table-layout:fixed;font-variant-numeric:tabular-nums}
.capacity-table th{font-size:11px;font-weight:500;color:var(--muted);text-align:center;padding:4px 2px}
.capacity-table td{padding:0}
.capacity-table thead th:first-child,.capacity-table .person-heading{width:160px;text-align:left;position:sticky;left:0;z-index:1;background:var(--surface)}
.capacity-table .team-heading th{text-align:left;font-weight:600;color:var(--ink);background:var(--subtle);padding:6px 8px;border-radius:4px}
.capacity-table .person-heading{font-size:12px;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.person-heading small{display:block;font-size:10px;color:var(--muted)}
.heat-cell{display:flex;align-items:center;justify-content:center;min-height:34px;border-radius:4px;text-decoration:none;font-size:11px;font-weight:600;background:var(--green);color:var(--green-ink)}
.heat-cell.tight{background:var(--amber);color:var(--amber-ink)}
.heat-cell.over{background:var(--red);color:var(--red-ink)}
.heat-cell:hover{box-shadow:inset 0 0 0 1px #5e8d99}
.heat-cell[aria-current]{box-shadow:inset 0 0 0 2px var(--ink)}
.capacity-legend{display:flex;flex-wrap:wrap;gap:16px;margin-top:12px;font-size:12px;color:var(--muted)}
.capacity-legend span{display:flex;align-items:center;gap:6px}
.swatch{width:12px;height:12px;border-radius:3px;background:var(--green)}
.swatch.tight{background:var(--amber)}
.swatch.over{background:var(--red)}

.month-panel .data-table td:last-child{min-width:200px}
.quiet-notice{background:var(--amber);color:var(--amber-ink);padding:10px 12px;border-radius:6px;margin-bottom:12px}
.monthly-funding{display:grid;gap:10px;border-top:1px solid var(--line);margin-top:20px;padding-top:16px}
.funding-summary{flex-wrap:wrap;align-items:baseline}
.funding-summary span{color:var(--muted);font-size:13px}
.funding-bar{height:10px;background:#edf2f4;border-radius:5px;overflow:hidden}
.funding-bar span{display:block;height:100%;background:var(--teal)}
.monthly-funding .error{margin:0}
.baseline-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}

@media(max-width:900px){.topbar{padding:12px 16px}.header-actions>span{display:none}.page{padding:20px 16px}.planner-layout{grid-template-columns:1fr;padding:16px}.project-panel{order:2}.main-panel{padding:16px}}
@media(max-width:540px){.brand-mark{display:none}.brand{font-size:16px}h1{font-size:24px}.planner-heading,.section-heading{flex-direction:column;align-items:flex-start;gap:8px}.panel{padding:16px}.login-card{padding:24px}.changed-indicator{margin-left:0;padding:6px 0}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
