/* Calm, consistent feedback and movement. */
:root{--ui-ease:cubic-bezier(.2,.75,.25,1);--ui-shadow:0 18px 50px #324c2820,0 3px 9px #324c2807;--ui-focus:#a6bf8e}
button,a,input,textarea{touch-action:manipulation}button{transition:background-color .18s,border-color .18s,color .18s,box-shadow .18s,transform .16s var(--ui-ease)}button:not(:disabled):not(.cell):not(.custom-option):active{transform:scale(.975)}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--ui-focus);outline-offset:3px}.primary{background:linear-gradient(135deg,#527b49,#35634e);border:1px solid #386147;box-shadow:0 3px 7px #3b663b12}.primary:hover{background:linear-gradient(135deg,#496f40,#2f5845);box-shadow:0 5px 13px #3b663b1c}.secondary:hover{border-color:#c2d3b1;box-shadow:0 2px 7px #55734508}.danger-primary{background:linear-gradient(135deg,#b77f64,#9e6b55)!important;border-color:#a6735b!important;box-shadow:0 3px 8px #a26d5415}.delete:hover{color:#a56c51;background:#fbf0e9;border-radius:6px}
dialog{border:1px solid #e1e9d8;border-radius:19px;box-shadow:0 28px 90px #243d2a2e,0 4px 16px #243d2a09;padding:31px;outline:none}dialog[open]{animation:ui-dialog-in .23s var(--ui-ease)}dialog::backdrop{background:#21382c55;backdrop-filter:blur(5px);animation:ui-backdrop-in .23s ease}dialog .actions{gap:12px;padding-top:20px;margin-top:23px}dialog .actions>button:not(.primary):not(.delete){padding:10px 15px;border:1px solid #e1e8d8;border-radius:8px;background:#fbfcf8;color:#8c9d7a}dialog .actions>button:not(.primary):not(.delete):hover{background:#f0f5e9;border-color:#cbdabd}.dialog-close{display:grid;place-items:center;width:29px;height:29px;border-radius:8px;background:#f4f7ee}.dialog-close:hover{background:#eaf1e1;color:#608247}dialog input:not([type=checkbox]),dialog textarea,.cloud-gate-card input{transition:border-color .18s,box-shadow .18s,background-color .18s}dialog input:not([type=checkbox]):focus,dialog textarea:focus,.cloud-gate-card input:focus{background:#fefffc;border-color:#9db987;box-shadow:0 0 0 3px #95b67c19;outline:none}.custom-trigger[aria-expanded=true]{border-color:#a7be91;box-shadow:0 0 0 3px #abc49517;background:#fcfef9}.custom-pop,.account-menu:not([hidden]){animation:ui-menu-in .17s var(--ui-ease);transform-origin:top right;box-shadow:0 13px 36px #30492318,0 2px 6px #30492305}.custom-option{transition:background-color .14s,color .14s}.custom-option:hover{background:#f0f6e8}.custom-option.chosen{background:#e9f2df;color:#577d3e}.custom-option.chosen>span{color:#719852}.account-menu>button:hover svg{color:#60824b}
.app-confirm-dialog{width:min(420px,calc(100vw - 32px));padding:29px}.app-confirm-dialog .confirm-symbol{width:46px;height:46px;border-radius:14px;margin-bottom:21px;border:1px solid #e1ead7;background:linear-gradient(145deg,#f4f8ec,#e9f2df);color:#7b9c5f}.app-confirm-dialog[data-tone=danger] .confirm-symbol{border-color:#ecdacf;background:linear-gradient(145deg,#fff8f0,#f6e9dc);color:#b58366}.app-confirm-dialog h2{font-size:21px;color:#405835;letter-spacing:.2px}.app-confirm-dialog p{color:#91a07f;font-size:12px;line-height:1.9}.app-confirm-dialog[data-tone=danger] h2{color:#6c5743}.app-confirm-dialog .actions button{min-width:80px}.app-confirm-dialog .actions [hidden]{display:none}
.error:empty{display:none!important}.error:not(:empty){display:flex;align-items:flex-start;gap:8px;min-height:0!important;margin:10px 0 14px;padding:10px 12px;background:#fcf3ed;border:1px solid #efdfd2;border-radius:8px;color:#aa7b60;font-size:11px;line-height:1.8}.error:not(:empty)::before{content:'!';display:inline-grid;place-items:center;width:15px;height:15px;border:1px solid #dbbba5;border-radius:50%;font-size:10px;line-height:1;flex-shrink:0;margin-top:2px}.field-validation{display:block;margin:5px 0 12px;color:#b18468;font-size:10px;line-height:1.6;animation:ui-inline-in .16s ease}.field-invalid:not(.native-source),.custom-trigger[aria-invalid=true]{border-color:#d9b399!important;background:#fffcf9!important;box-shadow:0 0 0 3px #dfbfa319!important}label:has(.field-validation) input{margin-bottom:5px}label:has(.field-validation) .custom-control{margin-bottom:5px}.button-busy{display:inline-flex;align-items:center;justify-content:center;gap:9px;cursor:wait!important;opacity:.8!important}.button-busy::after{content:'';width:12px;height:12px;border:1.6px solid currentColor;border-right-color:transparent;border-radius:50%;animation:ui-spin .8s linear infinite;flex-shrink:0}
/* A single feedback surface for save, success, warning and failure. */
.feedback-toast{--feedback-accent:#75965f;--feedback-tint:#edf4e6;--feedback-line:#d7e4ca;display:flex;position:fixed;left:auto;right:28px;bottom:27px;transform:none;width:376px;max-width:calc(100vw - 32px);padding:17px 16px 18px;gap:12px;align-items:flex-start;border:1px solid var(--feedback-line);border-radius:15px;background:linear-gradient(115deg,#fff,#fcfef8);box-shadow:var(--ui-shadow);color:#526b42;pointer-events:auto;overflow:hidden;z-index:22000;white-space:normal;text-align:left}.feedback-toast.hidden{display:none}.feedback-icon{display:grid;place-items:center;width:36px;height:36px;flex-shrink:0;border-radius:11px;background:var(--feedback-tint);color:var(--feedback-accent);border:1px solid var(--feedback-line)}.feedback-copy{flex:1;min-width:0;padding-top:1px}.feedback-title{display:block;color:#536b43;font-size:12px;font-weight:600;line-height:1.5;overflow-wrap:anywhere}.feedback-detail{display:block;font-size:10px;line-height:1.8;color:#91a17e;margin-top:5px;overflow-wrap:anywhere}.feedback-detail[hidden]{display:none}.feedback-close{display:grid;place-items:center;flex-shrink:0;width:24px;height:24px;margin:-3px -4px 0 0;padding:0;border-radius:6px;color:#a4b195}.feedback-close:hover{background:var(--feedback-tint);color:var(--feedback-accent)}.feedback-progress{position:absolute;bottom:0;left:0;height:2px;background:var(--feedback-accent);opacity:.36;width:100%;transform-origin:left}.feedback-enter{animation:ui-toast-in .23s var(--ui-ease)}.feedback-enter .feedback-progress{animation:ui-toast-countdown var(--feedback-duration,3800ms) linear forwards}.feedback-toast.feedback-paused .feedback-progress{animation-play-state:paused}.feedback-toast.feedback-leaving{animation:ui-toast-out .17s ease forwards}.feedback-toast[data-tone=warning]{--feedback-accent:#ba9865;--feedback-tint:#faf4e8;--feedback-line:#ede1ca}.feedback-toast[data-tone=error]{--feedback-accent:#b78268;--feedback-tint:#fbf0e8;--feedback-line:#ecd9ca}.feedback-toast[data-tone=error] .feedback-title{color:#a1775b}.feedback-toast[data-tone=warning] .feedback-title{color:#a18b60}.feedback-toast[data-tone=info]{--feedback-accent:#8ba08b;--feedback-tint:#f0f5ee;--feedback-line:#dfe8da}.feedback-toast[data-tone=saving] .feedback-icon svg{animation:ui-spin 1s linear infinite}.feedback-toast[data-tone=saving] .feedback-progress{width:55%;animation:ui-toast-saving 1.5s ease-in-out infinite}dialog>.feedback-toast{position:sticky;right:auto;bottom:0;width:100%;max-width:none;margin-top:18px;box-shadow:0 5px 15px #3049230d}.cloud-bar{gap:8px}.cloud-bar button{font-size:10px;color:#8ca077;background:#fcfef8;border-color:#dfe8d5;padding:7px 10px}.cloud-bar button:hover{background:#f0f6e8;border-color:#bfd2aa}.local-note{position:relative;display:flex;align-items:flex-start;gap:8px;line-height:1.8;transition:color .18s}.local-note::before{content:'';display:inline-block;flex-shrink:0;width:6px;height:6px;border-radius:50%;background:#b3c3a1;margin-top:6px}.local-note[data-state=success]::before{background:#8eae72;box-shadow:0 0 0 3px #a6c08e15}.local-note[data-state=pending]::before{background:#bcad83}.local-note[data-state=saving]::before{width:8px;height:8px;margin-top:4px;background:none;border:1px solid #afc797;border-right-color:transparent;animation:ui-spin .85s linear infinite}.local-note[data-state=error],.local-note[data-state=warning]{color:#ae8b6c}.local-note[data-state=error]::before,.local-note[data-state=warning]::before{background:#bf9a75;box-shadow:0 0 0 3px #cfb59215}.sync-in-progress{background:#f0f5e9!important;color:#79985f!important}.sync-in-progress::after{content:' ···';letter-spacing:1px;animation:ui-pulse 1s ease-in-out infinite}
.project-card-v2{transition:border-color .2s,box-shadow .2s,transform .2s var(--ui-ease)}.project-card-v2:hover{transform:translateY(-2px);border-color:#c3d5b3;box-shadow:0 8px 22px #526f3410}.check{transition:background-color .18s,border-color .18s,transform .18s}.check:hover{transform:scale(1.07)}.task-state-changed{animation:ui-complete .42s ease}.category-choice{transition:background-color .18s,border-color .18s,box-shadow .18s}.category-choice:hover{border-color:#a9c08f;box-shadow:0 2px 5px #4c6f2f08}.category-choice-check{transition:background-color .18s,color .18s,border-color .18s}.category-choice.selected .category-choice-check{animation:ui-check-in .18s var(--ui-ease)}.cloud-gate{background:radial-gradient(ellipse at 25% 15%,#eaf2e0 0,transparent 50%),radial-gradient(ellipse at 85% 85%,#f4eddc 0,transparent 45%),#f5f7f0}.cloud-gate-card{border-radius:22px;box-shadow:0 20px 65px #4967310e;background:#ffffffef;padding:37px}.cloud-gate-card>h2{font-size:22px;color:#4e673d}.cloud-gate-card .logo{box-shadow:0 6px 18px #486e3d1c}.auth-tabs{border:1px solid #e4ecda;background:#f1f5eb}.auth-tabs button.active{color:#61804a;box-shadow:0 2px 7px #4565310c}.auth-tabs button{transition:background-color .2s,box-shadow .2s,color .2s}
@keyframes ui-dialog-in{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:none}}@keyframes ui-backdrop-in{from{background:#21382c00;backdrop-filter:blur(0)}to{background:#21382c55;backdrop-filter:blur(5px)}}@keyframes ui-menu-in{from{opacity:0;transform:translateY(-5px) scale(.985)}to{opacity:1;transform:none}}@keyframes ui-inline-in{from{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:none}}@keyframes ui-toast-in{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:none}}@keyframes ui-toast-out{to{opacity:0;transform:translateY(8px) scale(.99)}}@keyframes ui-toast-countdown{from{transform:scaleX(1)}to{transform:scaleX(0)}}@keyframes ui-toast-saving{from{transform:translateX(-110%)}to{transform:translateX(210%)}}@keyframes ui-spin{to{transform:rotate(360deg)}}@keyframes ui-pulse{50%{opacity:.4}}@keyframes ui-complete{0%{background:#e9f3df}100%{background:transparent}}@keyframes ui-check-in{from{transform:scale(.75)}to{transform:scale(1)}}
@media(max-width:650px){dialog{padding:25px 22px;border-radius:17px}.feedback-toast{left:16px;right:16px;bottom:18px;width:auto;max-width:none;padding:15px;gap:10px;border-radius:13px}.feedback-icon{width:33px;height:33px;border-radius:10px}.feedback-title{font-size:12px}.feedback-detail{font-size:10px}.cloud-gate-card{padding:30px 25px}.cloud-bar button{font-size:10px}.app-confirm-dialog .actions button{min-width:76px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.project-card-v2:hover,button:active{transform:none!important}}
/* Keep page geometry stable when switching between long and short views. */
html{scrollbar-gutter:stable;scrollbar-color:#c6d3ba #f5f7f2;scrollbar-width:thin}body{min-height:100dvh}aside,dialog,.project-preview-list{scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:#cedac2 transparent}main{min-width:0}#tasks-view,#projects-view,#calendar-view{width:100%;min-width:0}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#cbd7bf;border:2px solid transparent;background-clip:padding-box;border-radius:8px}::-webkit-scrollbar-thumb:hover{background-color:#afc39d}@supports not (scrollbar-gutter:stable){html{overflow-y:scroll}}
/* Symmetric date navigation: one shared size, icon grid and baseline. */
#calendar-view .toolbar{align-items:center;min-height:78px;gap:12px}#month-label{margin:0;line-height:1.25;white-space:nowrap;font-variant-numeric:tabular-nums}.month-actions.period-switcher,.week-navigation>.period-switcher{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;gap:4px;padding:4px;background:#f2f6ec;border:1px solid #e1e9d7;border-radius:11px;box-shadow:inset 0 1px 1px #fff9}.period-switcher .period-arrow{display:grid;place-items:center;flex-shrink:0;width:32px;height:32px;min-width:32px;min-height:32px;padding:0;margin:0;line-height:1;background:#fff;border:1px solid #e3ebda;border-radius:7px;color:#839c6c;box-shadow:0 1px 2px #3b592107}.period-switcher .period-arrow svg{display:block;width:16px;height:16px;pointer-events:none}.period-switcher .period-arrow:hover{background:#e9f2df;color:#50763a;border-color:#c2d4af;box-shadow:0 2px 5px #4f74300b;filter:none}.period-switcher .period-home{display:grid;place-items:center;flex-shrink:0;width:54px;height:32px;min-height:32px;padding:0 8px;margin:0;background:transparent;border:1px solid transparent;border-radius:7px;color:#8c9f77;font-size:11px;line-height:1;white-space:nowrap}.period-switcher .period-home:hover{background:#e8f0df;color:#638547;border-color:#d9e5cb;filter:none}.week-navigation{align-items:center;min-height:42px;gap:12px;margin-bottom:16px}.week-navigation>span{line-height:1.5;font-variant-numeric:tabular-nums}.picker-month{align-items:center;min-height:38px}.picker-month>button{display:grid;place-items:center;width:29px;height:29px;min-width:29px;padding:0;margin:0;border:1px solid #e1e9d7;background:#f6f9f1;border-radius:7px;color:#819d66;line-height:1}.picker-month>button svg{display:block;pointer-events:none}.picker-month>button:hover{background:#eaf3df;border-color:#c6d7b4;color:#557d39}.picker-month>strong{line-height:1.2;font-variant-numeric:tabular-nums}
@media(max-width:650px){#calendar-view .toolbar{min-height:72px;gap:8px}#month-label{font-size:15px}.month-actions.period-switcher,.week-navigation>.period-switcher{gap:3px;padding:3px;border-radius:9px}.period-switcher .period-arrow{width:30px;height:30px;min-width:30px;min-height:30px;border-radius:6px}.period-switcher .period-home{width:45px;height:30px;min-height:30px;font-size:10px;padding:0 5px}.week-navigation{gap:8px}.week-navigation>span{font-size:10px}}
#calendar-view{--calendar-nav-height:84px}#calendar-view .toolbar{height:var(--calendar-nav-height);min-height:var(--calendar-nav-height);padding:0 22px}#calendar-view .week-navigation{height:var(--calendar-nav-height);min-height:var(--calendar-nav-height);padding:1px 2px 0;margin-bottom:0}@media(max-width:650px){#calendar-view{--calendar-nav-height:72px}#calendar-view .toolbar{padding:0 15px}}
/* Sliding navigation and magnetized calendar controls. */
nav.nav button,nav.nav button:hover,nav.nav button.active{background:transparent!important;box-shadow:none!important}nav.nav .nav-slider-thumb{background:linear-gradient(110deg,#e8f1df,#eef5e7);border:1px solid #deead2;box-shadow:inset 3px 0 #8da975,0 2px 5px #526e3106;transition:transform .28s cubic-bezier(.2,.8,.2,1),width .22s,height .22s,opacity .16s}nav.nav button:hover{color:#66864e}.period-switcher{position:relative;isolation:isolate}.period-follow{position:absolute;top:0;left:0;z-index:0;pointer-events:none;background:#fff;border:1px solid #dce8d1;border-radius:7px;box-shadow:0 2px 5px #5677350b;transition:transform .25s cubic-bezier(.18,.85,.25,1),width .2s,height .2s,opacity .15s}.period-switcher button{position:relative;z-index:1;transition:translate .22s cubic-bezier(.2,.8,.2,1),color .18s,background .18s,border-color .18s,box-shadow .18s}.period-switcher .period-arrow,.period-switcher .period-home{background:transparent;border-color:transparent;box-shadow:none}.period-switcher .period-arrow:hover,.period-switcher .period-home:hover{background:transparent;border-color:transparent;box-shadow:none;color:#52783c}.picker-month>button{transition:translate .22s cubic-bezier(.2,.8,.2,1),background .18s,border-color .18s}.primary:hover{box-shadow:0 5px 14px #526f3c1f}.secondary:hover,.cloud-bar button:hover{transform:translateY(-1px)}@keyframes ui-label-unfold{from{opacity:0;clip-path:inset(0 12% 0 12% round 9px);transform:translateY(3px) scale(.96)}to{opacity:1;clip-path:inset(0 0 0 0 round 9px);transform:none}}@media(max-width:650px){nav.nav .nav-slider-thumb{box-shadow:inset 0 -2px #8da975,0 2px 5px #526e3106}}@media(prefers-reduced-motion:reduce){nav.nav .nav-slider-thumb,.period-follow,.period-switcher button,.picker-month>button{transition:none!important;translate:0 0!important}.secondary:hover,.cloud-bar button:hover{transform:none}}