:root{--size-2:2px;--size-4:4px;--size-6:6px;--size-8:8px;--size-12:12px;--size-16:16px;--size-20:20px;--size-24:24px;--size-28:28px;--size-32:32px;--size-40:40px;--size-48:48px;--size-56:56px;--size-64:64px;--size-80:80px;--size-96:96px;--size-128:128px;--color-neutral-99:oklch(99% .008 75);--color-neutral-96:oklch(96% .014 75);--color-neutral-92:oklch(92% .018 75);--color-neutral-88:oklch(88% .016 75);--color-neutral-86:oklch(86% .016 75);--color-neutral-50:oklch(50% .02 60);--color-neutral-26:oklch(26% .02 50);--color-neutral-24:oklch(24% .02 50);--color-white:#fff;--color-blue-600:#2563eb;--color-green-600:#16a34a;--color-red-600:#dc2626;--color-amber-92:oklch(92% .03 80);--color-black-alpha-50:#00000080;--color-white-alpha-40:#fff6;--color-slate-alpha-20:#6b728033;--color-workload-mid:oklch(79% .075 80);--radius-sm:10px;--radius-md:12px;--radius-lg:20px;--radius-xl:40px;--radius-pill:999px;--shadow-popover:0 2px 8px #00000026;--shadow-card:0 1px 2px #0000000a, 0 16px 40px #00000012;--font-primary-sans:"Google Sans", -apple-system, BlinkMacSystemFont, sans-serif;--text-2xs:10px;--text-xs:11px;--text-sm:13px;--text-base:14px;--text-lg:16px;--text-xl:24px;--color-bg:var(--color-neutral-96);--color-surface:var(--color-neutral-99);--color-ink:var(--color-neutral-26);--color-ink-cta:var(--color-neutral-24);--color-text:var(--color-ink);--color-muted:var(--color-neutral-50);--color-border:var(--color-neutral-86);--color-border-subtle:var(--color-neutral-88);--color-weekend:var(--color-neutral-92);--color-accent:var(--color-blue-600);--color-success:var(--color-green-600);--color-danger:var(--color-red-600);--color-overlay:var(--color-black-alpha-50);--color-highlight-today:var(--color-amber-92);--color-code-bg:var(--color-slate-alpha-20);--color-divider-inverse:var(--color-white-alpha-40);--color-text-inverse:var(--color-white);--color-surface-primary:#232127;--color-text-on-primary:#f1f0f0;--space-page-x:var(--size-24);--space-page-y:var(--size-32);--space-section-padding:var(--size-28);--space-section-gap:var(--size-24);--space-card-padding:var(--size-24);--space-card-gap:var(--size-28);--space-item-gap:var(--size-2);--space-inline-gap:var(--size-8);--space-inline-gap-sm:var(--size-4);--size-gantt-label-width:220px;--size-subtask-col-name:150px;--size-subtask-col-date:120px;--size-subtask-col-qty:35px;--size-subtask-col-action:60px;--type-h1-size:32px;--type-h2-size:30px;--type-h3-size:18px;--type-h4-size:18px;--type-body-size:var(--text-base);--type-label-size:var(--text-sm);--type-button-size:var(--text-sm)}@media (width<=480px){:root{--space-page-x:var(--size-16);--space-page-y:var(--size-20);--space-section-padding:var(--size-16);--space-section-gap:var(--size-16);--space-card-padding:var(--size-16);--space-card-gap:var(--size-12);--space-item-gap:var(--size-12);--type-h1-size:24px;--type-h2-size:20px;--type-h3-size:16px}}*,:after,:before{box-sizing:border-box}body{font-family:var(--font-primary-sans);color:var(--color-text);background:var(--color-bg);margin:0}.duration,.elapsed,h1,h2,h3,h4,strong{font-family:var(--font-primary-sans);font-weight:500}h1{font-size:var(--type-h1-size)}h2{font-size:var(--type-h2-size)}h3{font-size:var(--type-h3-size)}h4{font-size:var(--type-h4-size);margin:0}label{gap:var(--size-4);font-size:var(--type-label-size);flex-direction:column;display:flex}input,select{font:inherit;color:inherit;padding:var(--size-6) var(--size-8);border-radius:var(--radius-sm);border:1px solid var(--color-border);background:var(--color-surface)}button{font:inherit;padding:var(--size-8) var(--size-12);border-radius:var(--radius-sm);border:1px solid var(--color-border);background:var(--color-surface);color:inherit;cursor:pointer}button:hover:not(:disabled){filter:brightness(.96)}button:disabled{opacity:.6;cursor:default}.btn-primary{background:var(--color-ink-cta);color:var(--color-text-inverse);border-color:var(--color-ink-cta)}.btn-pill{border-radius:var(--radius-pill)}.link-button{color:var(--color-accent);text-align:left;font-size:var(--type-body-size);background:0 0;border:none;padding:0}.error{color:var(--color-danger);font-size:var(--text-sm)}.color-hue-picker{gap:var(--space-inline-gap);flex-direction:column;display:flex}.color-hue-picker .hex-row{align-items:center;gap:var(--space-inline-gap-sm);display:flex}.color-hue-picker .hex-swatch{width:var(--size-24);height:var(--size-24);border:1px solid var(--color-border);cursor:pointer;border-radius:50%;flex-shrink:0;padding:0}.color-hue-picker .hex-prefix{color:var(--color-muted)}.color-hue-picker .hex-input{text-transform:uppercase;flex:1;min-width:0}.color-sv-popover{z-index:100;gap:var(--space-inline-gap);width:240px;padding:var(--space-inline-gap);background:var(--color-surface);border-radius:var(--radius-md);box-shadow:var(--shadow-popover);flex-direction:column;display:flex;position:fixed}.color-sv-popover .sv-square{border-radius:var(--radius-sm);cursor:crosshair;touch-action:none;width:100%;height:160px;position:relative}.color-sv-popover .sv-thumb{width:var(--size-16);height:var(--size-16);border:2px solid var(--color-white);pointer-events:none;border-radius:50%;position:absolute;transform:translate(-50%,-50%);box-shadow:0 0 0 1px #0000004d}.color-sv-popover .tone-slider{width:100%;height:var(--size-12);border-radius:var(--radius-sm);appearance:none;cursor:pointer}.color-sv-popover .tone-slider::-webkit-slider-thumb{appearance:none;width:var(--size-16);height:var(--size-16);background:var(--color-white);border:2px solid var(--color-neutral-24);border-radius:50%}.color-sv-popover .tone-slider::-moz-range-thumb{width:var(--size-16);height:var(--size-16);background:var(--color-white);border:2px solid var(--color-neutral-24);border-radius:50%}.page{max-width:1440px;padding:var(--space-page-y) var(--space-page-x);margin:0 auto}.page-card{background:var(--color-surface);border-radius:var(--radius-xl);overflow:hidden}.page-header{padding:var(--size-16) var(--space-section-padding);border-bottom:1px solid var(--color-border-subtle);color:var(--color-muted);font-size:var(--text-sm);justify-content:space-between;align-items:center;font-weight:500;display:flex}.page-header nav{gap:var(--space-inline-gap);align-items:center;display:flex}.nav-tabs{background:var(--color-border-subtle);border-radius:var(--radius-pill);padding:var(--size-4);gap:var(--size-2);display:flex}.nav-tab{padding:var(--space-inline-gap) var(--size-16);border-radius:var(--radius-pill);font-size:var(--type-button-size);color:var(--color-muted);font-weight:600;text-decoration:none}.nav-tab.nav-tab-active{background:var(--color-ink-cta);color:var(--color-text-inverse)}.page-content{padding:var(--space-section-padding);gap:var(--space-section-gap);flex-direction:column;display:flex}.toolbar{gap:var(--space-inline-gap);display:flex}.modal-backdrop{background:var(--color-overlay);z-index:50;padding:var(--size-16);justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal{background:var(--color-surface);color:var(--color-text);border-radius:var(--radius-lg);padding:var(--space-card-padding);gap:var(--size-12);flex-direction:column;width:min(380px,92vw);max-height:90vh;display:flex;overflow-y:auto}.modal.modal--wide{width:min(560px,96vw)}.modal .time-row{gap:var(--size-12);display:flex}.modal .time-row label{flex:1}.modal .actions{justify-content:flex-end;gap:var(--space-inline-gap);margin-top:var(--size-4);display:flex}.login-screen,.setup-screen{min-height:100vh;padding:var(--size-16);justify-content:center;align-items:center;display:flex}.login-card{text-align:center;gap:var(--size-16);flex-direction:column;width:100%;max-width:320px;display:flex}.setup-card{width:100%;max-width:480px}.setup-card code{background:var(--color-code-bg);padding:var(--size-2) var(--size-4);border-radius:var(--radius-sm)}.setup-card ol{padding-left:var(--size-20);gap:var(--space-inline-gap);flex-direction:column;display:flex}.card-grid{gap:var(--space-item-gap);grid-template-columns:repeat(auto-fill,minmax(280px,1fr));display:grid}.project-create-form{gap:var(--space-inline-gap);padding:var(--size-16);border:1px solid var(--color-border-subtle);border-radius:var(--radius-lg);flex-wrap:wrap;align-items:center;display:flex}.project-create-form label{font-size:var(--text-xs)}.project-create-form .error{width:100%}.project-card{background:var(--color-surface-primary);border-radius:var(--radius-lg);padding:var(--space-card-padding);gap:var(--space-card-gap);cursor:grab;flex-direction:column;transition:transform .15s,opacity .15s,background .15s;display:flex}.project-card.dragging{opacity:.5;transform:scale(.95)}.project-card.running{--color-text-on-primary:var(--color-ink)}.project-card .task-frame{gap:var(--size-12);flex-direction:column;display:flex}.project-card .card-header{justify-content:space-between;align-items:flex-start;gap:var(--space-inline-gap);display:flex}.project-card .client{color:var(--color-text-on-primary);font-size:var(--text-sm);display:block}.project-card .subtask-select{color:var(--color-text-on-primary);display:block;position:relative}.project-card .subtask-select select{appearance:none;background:var(--color-surface-primary);width:100%;color:inherit;padding-right:var(--size-28);border:1px solid}.project-card .subtask-select select:disabled{opacity:1}.project-card .subtask-select .subtask-select-arrow{top:50%;right:var(--size-8);color:inherit;pointer-events:none;position:absolute;transform:translateY(-50%)}.project-card.running .subtask-select select{background:0 0}.project-card .edit-button{align-items:center;gap:var(--size-2);color:var(--color-text-on-primary);font-size:var(--type-button-size);background:0 0;border:none;flex-shrink:0;padding:0;font-weight:600;display:flex}.project-card .timer-frame{gap:var(--size-4)}.project-card .reserved-line,.project-card .timer-frame{flex-direction:column;display:flex}.project-card .reserved-line{gap:var(--space-inline-gap-sm);margin-bottom:var(--size-4);color:var(--color-text-on-primary);font-size:var(--text-sm)}.project-card .progress-track{height:var(--size-6);align-items:center;display:flex}.project-card .progress-fill,.project-card .progress-remainder{background:var(--color-text-on-primary);border-radius:var(--radius-pill)}.project-card .progress-fill{height:100%}.project-card .progress-remainder{flex:1 0 0;min-width:0;height:1px}.project-card .timer-row{justify-content:space-between;align-items:center;display:flex}.project-card .elapsed{font-variant-numeric:tabular-nums;color:var(--color-text-on-primary)}.project-card .elapsed,.project-card .timer-button{font-size:var(--type-h2-size)}.project-card .timer-button{background:0 0;border:none;padding:0}.project-card .link-button{color:var(--color-text-on-primary)}.time-entry-list{gap:var(--space-inline-gap);flex-direction:column;display:flex}.time-entry-list .filters{gap:var(--size-16);margin-bottom:var(--space-inline-gap);display:flex}.day-separator{justify-content:space-between;align-items:baseline;gap:var(--size-4) var(--size-16);padding:var(--size-12) 0 var(--size-8);flex-wrap:wrap;display:flex}.day-separator:not(:first-child){margin-top:var(--size-16);border-top:2px solid var(--color-ink)}.day-separator .day-label{font-family:var(--font-primary-sans);font-weight:700;font-size:var(--text-xl)}.day-separator .day-totals{gap:var(--size-12);font-size:var(--text-base);color:var(--color-muted);font-weight:500;display:flex}.day-separator .day-total.billable{color:var(--color-ink);font-weight:600}.time-entry-row{justify-content:space-between;align-items:center;gap:var(--space-item-gap);padding:var(--size-8) 0;border-bottom:1px solid var(--color-border-subtle);display:flex}.time-entry-row .project-line{align-items:center;gap:var(--size-6);display:flex}.time-entry-row .dot{width:var(--size-8);height:var(--size-8);border-radius:50%;display:inline-block}.time-entry-row .project-number,.time-entry-row .source,.time-entry-row .subtask{color:var(--color-muted);font-size:var(--text-sm)}.time-entry-row .billable-times{align-items:center;gap:var(--size-6);font-variant-numeric:tabular-nums;margin:var(--size-2) 0;display:flex}.time-entry-row .billable-time{font-family:var(--font-primary-sans);font-weight:700;font-size:var(--text-xl)}.time-entry-row .billable-arrow{color:var(--color-muted);font-size:var(--text-base)}.time-entry-row .comment,.time-entry-row .time-line{font-size:var(--text-sm);color:var(--color-muted)}.time-entry-row .comment{font-style:italic}.time-entry-row .right{align-items:center;gap:var(--size-6);flex-shrink:0;display:flex}.time-entry-row .durations{flex-direction:column;align-items:flex-end;min-width:72px;display:flex}.time-entry-row .duration{font-variant-numeric:tabular-nums;text-align:right}.time-entry-row .duration-billable{font-size:var(--text-xs);color:var(--color-muted);font-variant-numeric:tabular-nums}.gantt-scroll{overflow-x:auto}.gantt-scroll .project-heading{border-top:var(--size-4) solid var(--color-border);border-bottom:1px solid var(--color-border-subtle);display:flex;position:relative}.gantt-scroll .project-heading .row-label{width:var(--size-gantt-label-width);padding:var(--size-6) var(--size-8);z-index:2;background:var(--color-surface);flex-direction:column;flex-shrink:0;display:flex;position:sticky;left:0}.gantt-scroll .project-heading .client-name{font-size:var(--text-2xs);color:var(--color-muted)}.gantt-scroll .project-heading .project-name{font-weight:700;font-size:var(--text-sm)}.gantt-scroll .project-heading .row-track{position:relative}.gantt-scroll .project-heading .project-stroke{height:var(--size-2);position:absolute;top:0;left:0;right:0}.gantt-scroll .project-heading .project-range-block{top:var(--size-4);bottom:var(--size-4);border-radius:var(--size-4);position:absolute}.gantt-sticky-header{z-index:5;background:var(--color-surface);position:sticky;top:0}.period-row{background:var(--color-surface);display:flex}.period-row .row-label{width:var(--size-gantt-label-width);background:var(--color-surface);z-index:6;flex-shrink:0;position:sticky;left:0}.period-row .period-track{display:flex}.period-row .period-cell{text-align:left;padding:var(--size-4) var(--size-6);white-space:nowrap;text-overflow:ellipsis;border-right:1px solid var(--color-border-subtle);border-bottom:1px solid var(--color-border-subtle);flex-shrink:0;overflow:hidden}.period-row.month-row .period-cell{font-family:var(--font-primary-sans);font-weight:700;font-size:var(--text-xs)}.period-row.week-row .period-cell{font-size:var(--text-2xs);color:var(--color-muted)}.header-row{background:var(--color-surface);display:flex}.header-row .row-label{width:var(--size-gantt-label-width);background:var(--color-surface);z-index:6;flex-shrink:0;position:sticky;left:0}.header-row .header-track{display:flex}.header-row .day-cell{text-align:center;font-size:var(--text-2xs);padding:var(--size-4) 0;border-right:1px solid var(--color-border-subtle);border-bottom:1px solid var(--color-border-subtle);flex-shrink:0}.header-row .day-cell.weekend{background:var(--color-weekend)}.header-row .day-cell.today{background:var(--color-highlight-today);font-weight:700}.totals-row{border-bottom:1px solid var(--color-border-subtle);display:flex}.totals-row .row-label{width:var(--size-gantt-label-width);padding:var(--size-4) var(--size-8);font-size:var(--text-xs);color:var(--color-muted);background:var(--color-surface);z-index:6;flex-shrink:0;align-items:center;font-weight:600;position:sticky;left:0}.totals-row .row-label,.totals-row .totals-track{display:flex}.totals-row .totals-cell{height:var(--size-24);font-size:var(--text-2xs);border-right:1px solid var(--color-border-subtle);flex-shrink:0;justify-content:center;align-items:center;font-weight:600;display:flex}.gantt-row{height:var(--size-40);border-bottom:1px solid var(--color-border-subtle);align-items:stretch;display:flex}.gantt-row .row-label{width:var(--size-gantt-label-width);padding:0 var(--size-8);font-size:var(--text-sm);background:var(--color-surface);z-index:2;flex-shrink:0;align-items:center;display:flex;position:sticky;left:0}.gantt-row .row-track{position:relative}.gantt-row .track-grid{display:flex;position:absolute;inset:0}.gantt-row .track-cell{border-right:1px solid var(--color-border-subtle);flex-shrink:0;height:100%}.gantt-row .track-cell.weekend{background:var(--color-weekend)}.gantt-row .no-dates{padding:0 var(--size-8);line-height:var(--size-40);font-size:var(--text-sm);color:var(--color-muted);font-style:italic;display:block}.gantt-bar{top:var(--size-4);bottom:var(--size-4);border-radius:var(--size-4);cursor:grab;-webkit-user-select:none;user-select:none;align-items:stretch;display:flex;position:absolute}.gantt-bar .handle{width:var(--size-6);cursor:ew-resize;flex-shrink:0}.gantt-bar .handle-start{margin-left:calc(var(--size-6)*-1)}.gantt-bar .segments{border-radius:var(--size-2);flex:1;display:flex}.gantt-bar .bar-error{top:calc(var(--size-24)*-1);font-size:var(--text-xs);background:var(--color-danger);color:var(--color-text-inverse);padding:var(--size-2) var(--size-4);border-radius:var(--radius-sm);white-space:nowrap;z-index:10;position:absolute;left:0}.gantt-heatmap-segment{border-right:1px solid var(--color-divider-inverse);cursor:pointer;flex-shrink:0;justify-content:center;align-items:center;height:100%;display:flex;position:relative}.gantt-heatmap-segment .hours-label{font-size:var(--text-2xs);font-weight:600}.gantt-heatmap-segment .hours-label.auto{opacity:.8;font-style:italic}.day-popover{background:var(--color-surface);color:var(--color-text);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--size-6);z-index:1000;gap:var(--size-4);width:110px;box-shadow:var(--shadow-popover);flex-direction:column;display:flex;position:fixed}.day-popover input{width:100%}.day-popover .popover-date{font-size:var(--text-2xs);color:var(--color-muted)}.day-popover .popover-actions{gap:var(--size-4);display:flex}.day-popover .reset-button{font-size:var(--text-xs)}.project-edit-modal .modal-header{justify-content:space-between;align-items:flex-start;gap:var(--space-inline-gap);display:flex}.project-edit-modal .modal-header h2{margin:0}.project-edit-modal .icon-button{padding:var(--size-2) var(--size-6);font-size:var(--text-lg);background:0 0;border:none;line-height:1}.project-edit-modal .project-fields{gap:var(--space-inline-gap);grid-template-columns:1fr 1fr;display:grid}.project-edit-modal h3{margin:0}.project-edit-modal .total{font-weight:400;font-size:var(--text-sm)}.project-edit-modal .subtasks-header,.project-edit-modal .total{color:var(--color-muted)}.project-edit-modal .subtasks-header{grid-template-columns:var(--size-subtask-col-name) var(--size-subtask-col-date) var(--size-subtask-col-date) var(--size-subtask-col-qty) var(--size-subtask-col-action);gap:var(--size-6);font-size:var(--text-xs);display:grid}.project-edit-modal .add-subtask{grid-template-columns:var(--size-subtask-col-name) var(--size-subtask-col-date) var(--size-subtask-col-date) var(--size-subtask-col-qty) var(--size-subtask-col-action);gap:var(--size-6);align-items:center;display:grid}.project-edit-modal .add-subtask input{font-size:var(--text-sm);padding:var(--size-4) var(--size-6);width:100%;min-width:0}.project-edit-modal .add-subtask input[type=number]{appearance:textfield}.project-edit-modal .add-subtask input[type=number]::-webkit-inner-spin-button{appearance:none;margin:0}.project-edit-modal .add-subtask input[type=number]::-webkit-outer-spin-button{appearance:none;margin:0}.project-edit-modal .add-subtask button{font-size:var(--text-xs);padding:var(--size-4) var(--size-8);width:100%}.project-edit-modal hr{border:none;border-top:1px solid var(--color-border-subtle);margin:var(--size-4) 0}.project-edit-modal .danger-actions{gap:var(--space-inline-gap);margin-right:auto;display:flex}.subtask-edit-row{grid-template-columns:var(--size-subtask-col-name) var(--size-subtask-col-date) var(--size-subtask-col-date) var(--size-subtask-col-qty) var(--size-subtask-col-action);gap:var(--size-6);border-left:2px solid #0000;align-items:center;display:grid}.subtask-edit-row.dirty{border-left-color:var(--color-accent)}.subtask-edit-row input{font-size:var(--text-sm);padding:var(--size-4) var(--size-6);width:100%;min-width:0}.subtask-edit-row input[type=number]{appearance:textfield}.subtask-edit-row input[type=number]::-webkit-inner-spin-button{appearance:none;margin:0}.subtask-edit-row input[type=number]::-webkit-outer-spin-button{appearance:none;margin:0}.subtask-edit-row .row-actions{justify-content:flex-end;gap:var(--size-4);display:flex}.subtask-edit-row .row-actions button{white-space:nowrap;font-size:var(--text-xs);padding:var(--size-4) var(--size-8);flex-shrink:0}.subtask-edit-row .row-actions:has(>button:only-child) button{width:100%}.subtask-edit-row .error{grid-column:1/-1;margin:0}.todo-columns{gap:var(--space-section-gap);grid-template-columns:repeat(3,minmax(220px,1fr));align-items:start;display:grid}@media (width<=720px){.todo-columns{grid-template-columns:1fr}}.todo-column{gap:var(--space-inline-gap);min-height:var(--size-40);flex-direction:column;display:flex}.todo-add-form input{width:100%}.todo-list{gap:var(--space-item-gap);margin-top:var(--space-section-gap);flex-direction:column;display:flex}.todo-empty{color:var(--color-muted);font-size:var(--text-sm)}.todo-card{background:var(--color-surface-primary);color:var(--color-text-on-primary);border-radius:var(--radius-lg);padding:var(--size-12);gap:var(--size-4);cursor:grab;flex-direction:column;transition:transform .15s,opacity .15s;display:flex}.todo-card.dragging{opacity:.5;transform:scale(.95)}.todo-card-row{justify-content:space-between;align-items:flex-start;gap:var(--space-inline-gap);display:flex}.todo-text{white-space:pre-wrap;word-break:break-word}.todo-delete{color:var(--color-text-on-primary);line-height:1;font-size:var(--text-lg);background:0 0;border:none;padding:0}.todo-delete:hover{color:var(--color-danger)}.todo-notes{font:inherit;color:inherit;padding:var(--size-6) var(--size-8);border-radius:var(--radius-sm);border:1px solid var(--color-border-subtle);background:var(--color-surface);resize:vertical}