*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--font: "DM Sans", system-ui, sans-serif;--font-mono: "DM Mono", monospace;--radius: 6px;--radius-lg: 10px;--bg: #FAFAF8;--surface: #FFFFFF;--surface-2: #F4F3EF;--surface-3: #EEECEA;--border: rgba(0,0,0,.08);--border-strong: rgba(0,0,0,.14);--text: #1A1917;--text-2: #5C5A55;--text-3: #9C9A95;--row-h: 42px;--task-row-h: 34px;--label-w: 220px;--header-h: 56px;--toolbar-h: 52px}html,body{height:100%}body{font-family:var(--font);font-size:14px;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased}#root{height:100%;display:flex;flex-direction:column}.app{display:flex;flex-direction:column;height:100vh;overflow:hidden}.app-header{height:var(--header-h);padding:0 20px;display:flex;align-items:center;justify-content:space-between;background:var(--surface);border-bottom:1px solid var(--border);flex-shrink:0}.header-brand{display:flex;align-items:center;gap:8px}.header-logo{font-size:18px;color:var(--text-3)}.header-title{font-size:15px;font-weight:600;letter-spacing:-.01em}.header-meta{font-size:12px;color:var(--text-3)}.app-main{flex:1;overflow:auto;padding:0}.toolbar{height:var(--toolbar-h);padding:0 20px;display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--surface);border-bottom:1px solid var(--border);flex-shrink:0;position:sticky;top:0;z-index:10}.toolbar-left,.toolbar-right{display:flex;align-items:center;gap:8px}.btn-group{display:flex;border:1px solid var(--border-strong);border-radius:var(--radius);overflow:hidden}.btn-group-item{padding:5px 12px;font-size:13px;font-family:var(--font);background:var(--surface);border:none;border-right:1px solid var(--border-strong);color:var(--text-2);cursor:pointer;transition:background .1s}.btn-group-item:last-child{border-right:none}.btn-group-item:hover{background:var(--surface-2)}.btn-group-item.active{background:var(--surface-3);color:var(--text);font-weight:500}.filter-select{height:30px;padding:0 8px;font-size:13px;font-family:var(--font);color:var(--text-2);background:var(--surface);border:1px solid var(--border-strong);border-radius:var(--radius);cursor:pointer}.toggle-label{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--text-2);cursor:pointer;-webkit-user-select:none;user-select:none}.btn-icon{width:30px;height:30px;display:flex;align-items:center;justify-content:center;font-size:16px;background:var(--surface);border:1px solid var(--border-strong);border-radius:var(--radius);color:var(--text-2);cursor:pointer}.btn-icon:hover{background:var(--surface-2)}.timeline-wrap{display:flex;flex-direction:column;min-height:100%}.timeline-header{display:grid;grid-template-columns:var(--label-w) 1fr;position:sticky;top:0;z-index:5;background:var(--surface-2);border-bottom:1px solid var(--border-strong)}.header-label-spacer{background:var(--surface-2);border-right:1px solid var(--border-strong)}.header-columns{display:flex}.header-col{flex:1;padding:8px;font-size:11px;font-weight:500;color:var(--text-3);text-transform:uppercase;letter-spacing:.06em;border-left:1px solid var(--border)}.timeline-body{flex:1;position:relative}.timeline-row{display:grid;grid-template-columns:var(--label-w) 1fr;border-bottom:1px solid var(--border);min-height:var(--row-h)}.category-row{background:var(--surface-3);min-height:32px}.project-row{background:var(--surface)}.task-row{background:var(--surface-2);min-height:var(--task-row-h)}.is-done{opacity:.55}.row-label{display:flex;align-items:center;gap:6px;padding:0 12px;border-right:1px solid var(--border-strong);overflow:hidden}.category-label{font-size:10px;font-weight:600;color:var(--text-3);text-transform:uppercase;letter-spacing:.07em}.project-label{font-size:13px;font-weight:500;color:var(--text)}.task-label{font-size:12px;color:var(--text-2);padding-left:28px}.row-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.expand-btn{width:16px;height:16px;display:flex;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;color:var(--text-3);font-size:11px;flex-shrink:0}.always-on-badge{font-size:11px;color:var(--text-3);flex-shrink:0}.bar-track{position:relative;display:flex;align-items:center;overflow:hidden}.category-track{display:flex}.track-col{flex:1;height:100%;border-left:1px solid var(--border)}.bar{position:absolute;height:22px;border-radius:4px;display:flex;align-items:center;padding:0 8px;font-size:11px;font-weight:500;white-space:nowrap;overflow:hidden;cursor:default;transition:opacity .15s;min-width:4px}.bar:hover{opacity:.82}.task-bar{height:14px;border-radius:3px;font-size:10px}.bar-label{overflow:hidden;text-overflow:ellipsis}.timeline-legend{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:12px 20px;border-top:1px solid var(--border);background:var(--surface-2);font-size:12px;color:var(--text-2)}.legend-title{font-weight:500;color:var(--text-3)}.legend-item{display:flex;align-items:center;gap:6px}.legend-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}.legend-divider{width:1px;height:16px;background:var(--border-strong)}.calendar-view{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;padding:20px}.calendar-month{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden}.calendar-month-title{padding:12px 16px;font-size:13px;font-weight:600;border-bottom:1px solid var(--border);background:var(--surface-2)}.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:1px;background:var(--border);padding:1px}.calendar-day-name{background:var(--surface-2);padding:4px 2px;font-size:10px;font-weight:500;color:var(--text-3);text-align:center;text-transform:uppercase;letter-spacing:.04em}.calendar-day{background:var(--surface);padding:4px;min-height:64px;display:flex;flex-direction:column;gap:2px}.calendar-day.empty{background:var(--surface-2)}.calendar-day.today{background:#fffbee}.calendar-day-num{font-size:11px;font-weight:500;color:var(--text-3);margin-bottom:2px}.calendar-day.today .calendar-day-num{color:var(--text);font-weight:700}.calendar-item{font-size:9px;font-weight:500;padding:1px 4px;border-radius:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.calendar-more{font-size:9px;color:var(--text-3)}.loading-screen,.error-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;gap:16px;color:var(--text-2)}.loading-spinner{width:32px;height:32px;border:2px solid var(--border-strong);border-top-color:var(--text-2);border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.error-screen code{font-family:var(--font-mono);font-size:12px;color:#e24b4a;background:#fcebeb;padding:8px 12px;border-radius:var(--radius)}