@font-face { font-family:Geist; src:url("assets/fonts/geist.woff2") format("woff2"); font-weight:100 900; font-display:swap; }
@font-face { font-family:"Geist Mono"; src:url("assets/fonts/geist-mono.woff2") format("woff2"); font-weight:100 900; font-display:swap; }
:root { color-scheme:light; --ink:var(--gray12); --muted:var(--gray11); --line:var(--gray6); --ease-out:cubic-bezier(0.23,1,0.32,1); --ease-in-out:cubic-bezier(0.77,0,0.175,1); --shadow-sm:0px 2px 3px -1px rgba(0,0,0,.1),0px 1px 0px 0px rgba(25,28,33,.02),0px 0px 0px 1px rgba(25,28,33,.08); --shadow-md:0px 0px 0px 1px rgba(0,0,0,.06),0px 1px 1px -.5px rgba(0,0,0,.06),0px 3px 3px -1.5px rgba(0,0,0,.06),0px 6px 6px -3px rgba(0,0,0,.06),0px 12px 12px -6px rgba(0,0,0,.06),0px 24px 24px -12px rgba(0,0,0,.06); font-family:Geist,"Segoe UI",Arial,sans-serif; font-synthesis:none; }
* { box-sizing:border-box; }
body { margin:0; background:#fafafa; color:var(--ink); font-size:13px; line-height:1.5; }
button,input,select,textarea,summary { font:inherit; }
button,a,summary { -webkit-tap-highlight-color:transparent; }
button { border:0; cursor:pointer; }
a { color:inherit; text-decoration:none; }
button:disabled { cursor:default; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible { outline:2px solid var(--blue11); outline-offset:4px; }
[hidden] { display:none!important; }
.sr-only { position:absolute; top:0; left:0; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
.skip-link { position:fixed; top:8px; left:8px; z-index:50; padding:12px; background:white; transform:translateY(-200%); }
.skip-link:focus { transform:none; }
.ui-icon { display:inline-block; width:16px; height:16px; flex-shrink:0; background:currentColor; mask-size:contain; mask-repeat:no-repeat; mask-position:center; vertical-align:middle; }
.app-header { height:76px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:24px; max-width:1200px; padding:0 38px; margin:auto; }
.brand { display:flex; align-items:center; gap:9px; font-size:18px; font-weight:650; letter-spacing:-.6px; width:fit-content; }
.brand img { border-radius:7px; }
.view-switch { position:relative; display:grid; grid-template-columns:1fr 1fr; background:var(--gray3); border-radius:8px; padding:3px; width:170px; }
.view-switch button { z-index:1; padding:7px; border-radius:6px; background:transparent; color:var(--muted); font-size:12px; font-weight:500; }
.view-switch button[aria-selected=true] { color:var(--ink); }
.view-indicator { position:absolute; top:3px; bottom:3px; left:3px; width:calc(50% - 3px); border-radius:6px; background:white; box-shadow:0 1px 3px #00000013; transform:translateX(0); transition:transform 200ms var(--ease-in-out); }
.view-switch[data-view=tasks] .view-indicator { transform:translateX(100%); }
.export-menu { position:relative; justify-self:end; }
.export-menu summary { display:flex; align-items:center; gap:7px; cursor:pointer; list-style:none; color:var(--muted); font-size:11px; padding:8px 0; }
.export-menu summary::-webkit-details-marker,.day-details summary::-webkit-details-marker { display:none; }
.export-menu summary .ui-icon { width:14px; height:14px; }
.menu-panel { position:absolute; right:0; top:calc(100% + 6px); z-index:20; width:185px; padding:5px; background:white; border-radius:9px; box-shadow:var(--shadow-md); transform-origin:top right; opacity:1; transform:scale(1); transition:opacity 180ms var(--ease-out),transform 180ms var(--ease-out); }
.menu-panel button { background:transparent; width:100%; text-align:left; font-size:12px; padding:10px; border-radius:5px; }
.menu-panel button:hover { background:var(--gray3); }
.page { max-width:1124px; padding:36px 36px 25px; margin:auto; }
.page-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:20px; }
.eyebrow { font-size:11px; color:var(--muted); margin:0 0 9px; }
h1 { font-size:42px; font-weight:600; line-height:1.05; letter-spacing:-2px; margin:0; }
h1 span { color:var(--blue11); }
h2 { font-size:17px; font-weight:550; letter-spacing:-.5px; margin:0; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:7px; padding:10px 14px; min-height:38px; font-size:12px; font-weight:500; border-radius:7px; transition:transform 140ms var(--ease-out),background-color 140ms ease; }
.button .ui-icon { width:15px; height:15px; }
.primary { background:var(--blue11); color:white; box-shadow:inset 0 1px 0 #ffffff26,0 1px 2px #00000012; }
.primary:hover { background:var(--blue12); }
.secondary { background:white; color:var(--ink); border:1px solid var(--gray7); }
.secondary:hover { background:var(--gray3); }
.text-button { display:inline-flex; align-items:center; gap:6px; padding:5px 0; background:transparent; color:var(--muted); font-size:11px; font-weight:500; white-space:nowrap; }
.text-button:hover { color:var(--ink); }
.text-button .ui-icon { width:13px; height:13px; }
.demo-note { display:flex; align-items:center; gap:12px; color:var(--muted); font-size:10px; margin:0 0 22px; }
.demo-label { padding:2px 6px; border:1px solid var(--gray6); border-radius:4px; color:var(--muted); font-size:9px; }
.demo-note .text-button { font-size:10px; }
.summary-strip { display:flex; align-items:center; gap:32px; margin:0 0 30px; color:var(--muted); }
.summary-strip > div,.summary-strip > button { display:flex; align-items:baseline; gap:7px; }
.summary-strip strong { font:500 21px "Geist Mono",monospace; color:var(--ink); letter-spacing:-.8px; }
.summary-strip span { font-size:11px; }
.summary-strip button { background:transparent; padding:0; color:var(--muted); }
.summary-strip button > span:last-child { display:flex; gap:6px; align-items:center; }
.summary-strip button:disabled .ui-icon { visibility:hidden; }
.stat-unit { font:10px Geist,sans-serif!important; margin-left:3px; color:var(--muted); letter-spacing:0; }
.attention-dot { width:5px; height:5px; border-radius:50%; background:#d3a046; align-self:center; }
.view-panel { opacity:1; transform:translateY(0); transition:opacity 180ms var(--ease-out),transform 180ms var(--ease-out); }
.week-card { background:white; border-radius:10px; overflow:hidden; box-shadow:var(--shadow-sm); }
.section-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.week-card > .section-heading { padding:18px 20px; }
.range-label { font-size:13px; font-weight:500; color:var(--ink); }
.board-scroll { overflow-x:auto; }
.week-days { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); min-width:780px; border-top:1px solid #eeeeee; }
.day { display:flex; flex-direction:column; position:relative; min-width:0; padding:0; background:white; text-align:left; color:var(--ink); border-right:1px solid #eeeeee; }
.day:last-child { border-right:0; }
.day.selected { background:#fafcfe; }
.day-header { display:flex; align-items:center; gap:7px; padding:19px 12px 7px; }
.day-name { font-size:11px; color:var(--muted); }
.day-number { font:500 14px "Geist Mono",monospace; }
.today-tag { font-size:8px; padding:1px 4px; background:var(--blue3); color:var(--blue11); border-radius:4px; margin-left:auto; }
.day-budget { font:9px "Geist Mono",monospace; color:var(--muted); padding:0 12px; }
.day-budget > span { color:var(--ink); }
.day-meter { height:2px; margin:10px 12px 18px; background:var(--gray3); border-radius:2px; overflow:hidden; }
.day-fill { display:block; height:100%; background:var(--gray8); }
.day.selected .day-fill { background:var(--blue11); }
.day-blocks { display:flex; flex-direction:column; gap:9px; width:100%; padding:0 9px 20px; min-height:220px; }
.colour-blue { --block-bg:#eef4ff; --block-ink:#315f9c; --block-border:#dbe6f8; }
.colour-teal { --block-bg:#edf6f0; --block-ink:#34735d; --block-border:#d9e9df; }
.colour-amber { --block-bg:#fbf5e9; --block-ink:#8a642c; --block-border:#eee2c9; }
.colour-rose { --block-bg:#faf0f2; --block-ink:#9b596b; --block-border:#efdee3; }
.colour-slate { --block-bg:#f0f2f7; --block-ink:#5a6681; --block-border:#e1e5ee; }
.work-block { display:flex; flex-direction:column; padding:12px 10px; gap:13px; background:var(--block-bg); border:1px solid var(--block-border); color:var(--block-ink); border-radius:6px; transition:transform 160ms var(--ease-out); }
.block-title { font-size:11px; font-weight:500; line-height:1.45; overflow-wrap:anywhere; }
.block-duration { display:flex; align-items:center; gap:5px; font:9px "Geist Mono",monospace; }
.block-duration .ui-icon { width:11px; height:11px; }
.free-block { display:flex; align-items:center; justify-content:center; gap:4px; border:1px dashed var(--gray6); border-radius:6px; padding:14px 3px; font-size:9px; color:var(--muted); }
.free-block .ui-icon { width:10px; height:10px; }
.board-footer { display:flex; justify-content:space-between; gap:10px; border-top:1px solid #eeeeee; padding:12px 20px; color:var(--muted); font-size:10px; }
.mobile-board-hint { display:none; }
.day-details { margin-top:22px; border-bottom:1px solid var(--line); }
.day-details > summary { display:flex; align-items:center; gap:13px; list-style:none; cursor:pointer; padding:12px 0 20px; font-size:13px; font-weight:500; }
.day-details > summary > .ui-icon { margin-left:auto; color:var(--muted); transition:transform 160ms var(--ease-out); }
.day-details[open] > summary > .ui-icon { transform:rotate(180deg); }
.muted { font-size:11px; font-weight:400; color:var(--muted); }
.day-content { padding:0 0 10px; }
.agenda-item { display:flex; justify-content:space-between; align-items:center; gap:14px; padding:13px 0; border-top:1px solid #ededed; }
.agenda-item-left { display:flex; align-items:center; gap:10px; min-width:0; }
.agenda-mark { width:3px; height:31px; background:var(--block-ink); border-radius:2px; flex-shrink:0; }
.agenda-item strong { font-size:12px; font-weight:500; }
.agenda-item p { margin:3px 0 0; font-size:10px; color:var(--muted); }
.agenda-item-right { display:flex; align-items:center; gap:21px; flex-shrink:0; }
.agenda-minutes { font:10px "Geist Mono",monospace; color:var(--muted); }
.tasks-card { background:white; padding:21px; border-radius:10px; box-shadow:var(--shadow-sm); }
.tasks-card .section-heading { margin-bottom:20px; flex-wrap:wrap; }
.count-badge { margin-left:8px; padding:2px 6px; font:10px "Geist Mono",monospace; color:var(--muted); background:var(--gray3); border-radius:4px; }
.task-filters { display:flex; align-items:center; gap:8px; }
.search-box { display:flex; gap:7px; align-items:center; padding:8px 9px; border:1px solid var(--gray6); border-radius:6px; }
.search-box .ui-icon { width:13px; height:13px; color:var(--muted); }
.search-box input { border:0; padding:0; border-radius:0; width:150px; font-size:11px; }
.task-filters select { font-size:11px; padding:8px; }
.table-scroll { overflow-x:auto; }
table { width:100%; border-collapse:collapse; text-align:left; font-size:11px; }
th { font-size:10px; color:var(--muted); font-weight:400; padding:11px 0; border-bottom:1px solid var(--line); }
td { padding:16px 0; border-bottom:1px solid #eeeeee; vertical-align:middle; }
tr:last-child td { border-bottom:0; }
th:not(:first-child),td:not(:first-child) { padding-left:16px; }
.task-name { display:flex; align-items:center; gap:11px; min-width:220px; }
.task-name input { width:15px; height:15px; margin:0; accent-color:var(--blue11); flex-shrink:0; cursor:pointer; }
.task-name strong { display:block; font-size:11px; font-weight:500; }
.task-name small { display:block; font-size:9px; color:var(--muted); margin-top:3px; }
.task-name .done-name { text-decoration:line-through; color:var(--muted); }
.deadline { white-space:nowrap; font-size:10px; color:var(--muted); }
.status-pill { display:inline-flex; align-items:center; gap:5px; white-space:nowrap; font-size:9px; color:#34735d; background:#f3f8f4; padding:3px 7px; border-radius:4px; }
.status-pill::before { content:""; width:4px; height:4px; border-radius:50%; background:currentColor; }
.status-pill.at-risk,.status-pill.overdue { background:#faf5e9; color:#946018; }
.status-pill.later { background:var(--gray3); color:var(--muted); }
.task-controls { display:flex; justify-content:flex-end; gap:3px; }
.icon-button { display:inline-flex; align-items:center; justify-content:center; min-width:30px; min-height:30px; padding:6px; border-radius:5px; background:transparent; color:var(--muted); transition:transform 140ms var(--ease-out); }
.icon-button .ui-icon { width:14px; height:14px; }
.icon-button:hover { background:var(--gray3); color:var(--ink); }
.empty-message { text-align:center; padding:25px 10px; color:var(--muted); font-size:12px; }
.notice { padding:13px 15px; margin-bottom:18px; border-radius:6px; font-size:11px; }
.warning { background:#fcf6ea; color:#875b1d; border:1px solid #f0e1c3; }
.risk-note { display:flex; justify-content:space-between; align-items:center; gap:15px; }
.risk-note p { margin:0; }
.page-footer { display:flex; justify-content:space-between; align-items:center; gap:15px; margin-top:26px; color:var(--muted); font-size:10px; }
.save-status,.page-footer a { display:flex; align-items:center; gap:6px; }
.status-dot { width:5px; height:5px; border-radius:50%; background:#43826c; }
.page-footer .ui-icon { width:12px; height:12px; }
dialog { border:1px solid var(--gray7); border-radius:11px; padding:24px; width:460px; max-width:calc(100% - 28px); max-height:calc(100dvh - 32px); overflow:auto; color:var(--ink); box-shadow:0 16px 60px #00000020; }
dialog::backdrop { background:#15151550; backdrop-filter:blur(3px); }
.dialog-heading { display:flex; justify-content:space-between; gap:20px; align-items:flex-start; margin-bottom:20px; }
.dialog-heading h2 { font-size:21px; font-weight:600; letter-spacing:-.6px; }
.dialog-heading .eyebrow { font:9px "Geist Mono",monospace; letter-spacing:.5px; }
form > label,.form-grid label { display:block; margin:15px 0 7px; font-size:11px; font-weight:550; }
input,select,textarea { background:white; border:1px solid var(--gray7); color:var(--ink); border-radius:5px; padding:10px 11px; max-width:100%; }
form > input:not([type=hidden]),form > select,form > textarea,.form-grid input { width:100%; }
textarea { resize:vertical; }
.optional { font-weight:400; color:var(--muted); margin-left:7px; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.dialog-actions { display:flex; justify-content:flex-end; gap:8px; border-top:1px solid var(--line); margin-top:23px; padding-top:18px; }
.form-error { color:#a84133; font-size:11px; }
.capacity-fields { margin-top:17px; }
.capacity-row { display:flex; align-items:center; justify-content:space-between; gap:20px; border-top:1px solid var(--line); padding:9px 0; }
.capacity-row label { font-size:12px; }
.capacity-row input { width:95px; padding:8px; }
.capacity-input { display:flex; align-items:center; gap:8px; font-size:11px; color:var(--muted); }
.log-task-name { font-size:12px; padding:12px; background:var(--gray3); border-radius:5px; }
.toast { position:fixed; bottom:20px; left:50%; transform:translateX(-50%); display:flex; align-items:center; gap:16px; background:var(--gray12); color:white; padding:13px 16px; border-radius:8px; font-size:12px; z-index:40; box-shadow:0 4px 18px #00000022; max-width:calc(100% - 30px); }
.toast button { padding:4px; font-size:12px; font-weight:550; background:transparent; color:#b9ddff; }
#toast-close { color:#aaaaaa; font-size:18px; }

dialog { box-shadow:var(--shadow-md); border:0; opacity:0; transform:scale(.96); transition:opacity 200ms var(--ease-out),transform 200ms var(--ease-out),display 200ms allow-discrete,overlay 200ms allow-discrete; }
dialog[open] { opacity:1; transform:scale(1); }
dialog::backdrop { background:rgba(24,24,24,.35); backdrop-filter:none; opacity:0; transition:opacity 200ms var(--ease-out),display 200ms allow-discrete,overlay 200ms allow-discrete; }
dialog[open]::backdrop { opacity:1; }
.toast { opacity:1; transform:translate(-50%,0); transition:opacity 180ms var(--ease-out),transform 180ms var(--ease-out),display 180ms allow-discrete; }
.toast[hidden] { opacity:0; transform:translate(-50%,25%); }
@starting-style { dialog[open] { opacity:0; transform:scale(.96); } dialog[open]::backdrop { opacity:0; } .toast { opacity:0; transform:translate(-50%,25%); } .view-panel { opacity:0; transform:translateY(6px); } .menu-panel { opacity:0; transform:scale(.96); } }
.button:active,.icon-button:active { transform:scale(.97); }
@media(hover:hover) and (pointer:fine) { .day:hover .work-block { transform:translateY(-2px); } }
[data-input=keyboard] .view-panel,[data-input=keyboard] .view-indicator,[data-input=keyboard] dialog,[data-input=keyboard] dialog::backdrop,[data-input=keyboard] .toast,[data-input=keyboard] .menu-panel { transition:none; }
[data-input=keyboard] .button:active,[data-input=keyboard] .icon-button:active { transform:none; }
[data-input=keyboard] .day-details summary > .ui-icon { transition:none; }
@media(max-width:900px) { .page { padding:28px 24px 22px; } .app-header { padding:0 24px; gap:12px; } .export-label { display:none; } .task-filters { width:100%; } }
@media(max-width:600px) { .app-header { padding:0 18px; gap:12px; height:68px; } .brand { font-size:0; gap:0; } .brand img { width:29px; height:29px; } .view-switch { width:158px; } .page { padding:27px 18px 20px; } .page-heading { margin-bottom:17px; } h1 { font-size:36px; } .eyebrow { font-size:10px; } .demo-note { gap:8px; margin-bottom:20px; } .summary-strip { gap:18px; flex-wrap:wrap; margin-bottom:24px; } .summary-strip strong { font-size:19px; } .summary-strip span { font-size:10px; } .summary-strip > button { width:100%; font-size:10px; } .summary-strip > button strong { font-size:12px; } .week-card > .section-heading { padding:16px 13px; } .range-label { font-size:12px; } .week-card .text-button { font-size:10px; } .week-days { min-width:735px; } .board-footer { padding:11px 13px; font-size:9px; flex-direction:column; gap:5px; } .mobile-board-hint { display:flex; align-items:center; gap:4px; } .mobile-board-hint .ui-icon { width:11px; height:11px; } .day-details > summary { gap:9px; font-size:12px; } .day-details .muted { font-size:9px; } .agenda-item strong { font-size:11px; } .agenda-item-right { gap:9px; } .agenda-item-right .text-button { font-size:9px; } .agenda-minutes { font-size:9px; } .tasks-card { padding:17px 12px; } .task-filters { flex-wrap:wrap; gap:7px; } .search-box { width:100%; } .search-box input { width:100%; min-width:0; } .task-filters select { flex:1; min-width:0; } .risk-note { flex-direction:column; align-items:flex-start; gap:4px; } .toast { width:calc(100% - 28px); font-size:11px; gap:10px; } .page-footer { font-size:9px; } }
@media(prefers-reduced-motion:reduce) { .view-panel,.view-indicator,.menu-panel,dialog,dialog::backdrop,.toast,.work-block,.button,.icon-button,.day-details summary > .ui-icon { transition:none; } .button:active,.icon-button:active,.day:hover .work-block { transform:none; } }