/* User-selectable daylight / low-glare night, and Material-inspired form surfaces. */
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:36px;padding:7px 12px;border:1px solid #ad965e77;border-radius:100px;background:#ffffff18;color:#65512e;font-size:12px;font-weight:720;white-space:nowrap;transition:background .16s ease,border-color .16s ease,color .16s ease}
.theme-toggle .mi{width:17px;height:17px}
.theme-toggle .theme-symbol{display:inline-block;min-width:18px;text-align:center;font-size:19px;line-height:1;color:#ad7e38}
.theme-toggle:hover{background:#d9bd7a24;border-color:#be8430}
.theme-toggle:focus-visible{outline:3px solid #d4a74e;outline-offset:2px}
.top-actions{display:flex;align-items:center;justify-content:flex-end;gap:15px}
.login-topline .theme-toggle{margin-left:auto;color:#77613e;background:#f7f1e6}
.md-field-group{min-width:0;position:relative;display:flex;flex-direction:column;gap:9px}
.md-field-group>label{margin:0}
.md-select-root{position:relative;min-width:0}
.editor-dialog .md-field{appearance:none;display:flex;align-items:center;gap:9px;width:100%;min-height:54px;padding:0 13px;text-align:left;font:600 14px var(--ui);color:#38362f;border:1px solid #bfb7a8;border-radius:13px;background:#fffcf6;box-shadow:0 1px 2px #423d3422;transition:background .16s ease,border-color .16s ease,box-shadow .16s ease}
.editor-dialog .md-field:hover{background:#fffefa;border-color:#9d804d}
.editor-dialog .md-field:focus-visible{outline:0;border-color:#9d7439;box-shadow:0 0 0 3px #be84302a}
.md-field-leading{display:flex;align-items:center;color:#a37b3c}
.md-field-leading .mi{width:20px;height:20px}
.md-field-trailing{width:17px;height:17px;margin-left:auto;opacity:.7;transition:transform .17s ease}
.md-select-trigger[aria-expanded=true] .md-field-trailing{transform:rotate(90deg)}
.md-due-trigger #due-display{font-weight:560;font-variant-numeric:tabular-nums}
.md-options{position:absolute;z-index:30;left:0;right:0;top:calc(100% + 6px);padding:6px;background:#fffefa;border:1px solid #c8bda7;box-shadow:0 14px 36px #11162030;border-radius:15px}
.md-options button{width:100%;min-height:43px;padding:10px 13px;display:flex;align-items:center;justify-content:space-between;gap:12px;border:0;border-radius:10px;background:transparent;font-size:14px;text-align:left;color:#3e3930}
.md-options button[aria-selected=true]{background:#f6ecd9;color:#7b5624;font-weight:730}
.md-options button:hover,.md-options button:focus-visible{background:#efe3cb;outline:0}
.md-options .option-check{opacity:0;color:#996b2b}
.md-options button[aria-selected=true] .option-check{opacity:1}
.editor-dialog input:not([type=checkbox]):not([type=hidden]),.editor-dialog textarea{border-radius:13px;min-height:51px;padding:13px 15px;background:#fffcf6;border-color:#bfb7a8;box-shadow:0 1px 2px #423d3410}
.editor-dialog textarea{min-height:95px}
.editor-dialog input:not([type=checkbox]):not([type=hidden]):focus-visible,.editor-dialog textarea:focus-visible{outline:0;border-color:#b78c50;box-shadow:0 0 0 3px #be84302c}
/* The custom date/time picker is a distinct nested dialog: no native OS-specific popup. */
.md-picker-dialog{width:min(436px,calc(100vw - 24px));max-height:min(95vh,760px);padding:24px;border:1px solid #d2c9b8;border-radius:25px;background:#f7f4ee;color:#2b2c29;box-shadow:0 25px 90px #0b1119aa;overflow:auto}
.md-picker-dialog::backdrop{background:#080f1aba;backdrop-filter:blur(3px)}
.picker-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.picker-eyebrow{font:10px var(--mono);letter-spacing:.13em;color:#967344;font-weight:720}
.picker-head h2{font-size:20px;margin:4px 0 0;line-height:1.35}
.picker-selected{margin:17px 0 11px;padding:13px 16px;border-radius:14px;background:#e8e2d7;color:#58452d;font-size:16px;font-weight:750;min-height:48px;font-variant-numeric:tabular-nums}
.picker-month-nav{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:15px 0 10px}
.picker-month-nav strong{font-size:15px;letter-spacing:.02em}
.picker-icon-button{border:0;border-radius:50%;width:38px;height:38px;background:transparent;color:#6d6252;display:grid;place-items:center;font-size:25px}
.picker-icon-button:hover,.picker-icon-button:focus-visible{background:#e8dcc6;outline:0}
.picker-weekdays,.picker-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.picker-weekdays{font-size:12px;color:#827768;font-weight:670;text-align:center;padding:4px 0 8px}
.picker-days button{width:100%;aspect-ratio:1;min-height:37px;display:grid;place-items:center;border:1px solid transparent;border-radius:50%;background:transparent;color:#35342e;font:600 13px var(--ui);padding:0}
.picker-days button:not(.outside):hover{border-color:#caa35a;background:#e9dfca}
.picker-days button.today{border-color:#be8430}
.picker-days button.selected{background:#8b642b;color:#fff6e7;border-color:#8b642b;box-shadow:0 3px 9px #81602d46}
.picker-days button.outside{color:#a7a399}
.picker-days button:focus-visible{outline:2px solid #b88635;outline-offset:2px}
.picker-time-row{display:flex;align-items:center;gap:10px;margin-top:17px;padding-top:17px;border-top:1px solid #dcd4c7}
.picker-time-label{display:flex;flex-direction:column;flex:1;min-width:0;gap:3px}
.picker-time-label strong{font-size:14px}
.picker-time-label small{font-size:11px;color:#837869}
.picker-time-row label{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:11px;font-weight:600;color:#807567}
.picker-time-input{width:62px;height:48px;text-align:center;border:1px solid #c6b8a0;background:#fffcf7;color:#3c3225;border-radius:12px;font:700 20px var(--mono);outline:0}
.picker-time-input:focus{border-color:#a77a37;box-shadow:0 0 0 3px #be843033}
.picker-time-input::-webkit-inner-spin-button{opacity:.5}
.picker-time-separator{font:700 21px var(--mono);align-self:flex-end;margin-bottom:12px;color:#8d734f}
.picker-presets{display:flex;flex-wrap:wrap;gap:7px;margin:15px 0 8px}
.picker-presets button{flex:1 1 42%;min-height:33px;padding:7px 10px;border:1px solid #d5c7ad;border-radius:99px;background:#fdf9f0;color:#715832;font-size:11px;white-space:nowrap}
.picker-presets button:hover,.picker-presets button:focus-visible{background:#e9ddc7;border-color:#bd914b}
.picker-actions{display:flex;align-items:center;gap:8px;margin-top:6px}
.picker-spacer{flex:1}
.picker-text-button,.picker-apply-button{min-height:41px;padding:8px 13px;border-radius:12px;border:0;background:transparent;color:#84612c;font-weight:700;font-size:13px}
.picker-text-button:hover{background:#e7dbc5}
.picker-apply-button{background:#94703b;color:#fff7ed;padding:9px 20px}
.picker-apply-button:hover{background:#79582b}
@media(max-width:640px){
  .top-actions{gap:7px}
  .theme-toggle{min-height:36px;padding:6px 9px;font-size:11px}
  .top-line .connected{display:none}
  .sidebar .nav-item .nav-text{white-space:normal;line-height:1.2;text-align:center;max-width:100%;font-size:10px}
  .login-topline .theme-toggle{min-width:64px}
  .md-options{top:calc(100% + 3px)}
  .md-picker-dialog{padding:18px 16px;border-radius:22px}
  .picker-days button{min-height:36px}
}
@media(max-width:370px){.sidebar .nav-item .nav-text{font-size:9px}}
@media(prefers-reduced-motion:reduce){.theme-toggle,.editor-dialog .md-field,.md-field-trailing{transition:none}}
/* Night: warm low-glare text on graphite/navy surfaces, preserving functional gold. */
:root[data-theme=night]{
  color-scheme:dark;
  --bg-0:#0a1017;--bg-1:#101721;--bg-2:#151d27;
  --surface-0:#171f29;--surface-1:#1d2731;--surface-2:#27343d;
  --ink:#e3e5df;--text:#c2c9cb;--muted:#9ba6ac;--line:#3e4b55;
  --gold-bright:#dec28a;--gold:#d6aa61;--gold-dark:#e0ba74;
  --danger:#e49b91;
}
[data-theme=night] .main{background:#171f29;border-color:#3d4a56;box-shadow:0 28px 80px #0009,inset 0 1px #ffffff0a}
[data-theme=night] .main::before{border-color:#af92671c;box-shadow:0 0 0 78px #d9ba7410,0 0 0 138px #d9ba7407}
[data-theme=night] .sidebar{background:linear-gradient(180deg,#101824,#0b111a)}
[data-theme=night] .top-line{color:#9eabb4;border-color:#47515a}
[data-theme=night] .breadcrumb b{color:#ccd3d6}
[data-theme=night] .breadcrumb span:nth-child(2),[data-theme=night] .connected{color:#a2b1b8}
[data-theme=night] .page-header p,[data-theme=night] .list-desc,[data-theme=night] .todo-description,[data-theme=night] .main footer,[data-theme=night] .empty-state p{color:#b0b8b9}
[data-theme=night] .section-id{color:#baa680}
[data-theme=night] .list-head{border-color:#49545d}
[data-theme=night] .search-field{background:#202b35;border-color:#4c5863;color:#d0b580}
[data-theme=night] .search-field input{color:#e3e5df}
[data-theme=night] .search-field input::placeholder{color:#96a3ac}
[data-theme=night] .search-field:focus-within{border-color:#bfa064;box-shadow:0 0 0 2px #c2a36a33}
[data-theme=night] .todo-card{background:#222c36;border-color:#43505b;box-shadow:0 2px 0 #05090e44}
[data-theme=night] .todo-card:hover{background:#2a3540;border-color:#9d8666}
[data-theme=night] .todo-card::before{background:#72808c}
[data-theme=night] .todo-card.is-hard{border-color:#90774f}
[data-theme=night] .todo-card.is-hard::before{background:#ddbb7b}
[data-theme=night] .todo-card.is-done .todo-title{color:#a2aaac}
[data-theme=night] .todo-actions{border-top-color:#47535f}
[data-theme=night] .todo-edit{color:#abb6be}
[data-theme=night] .todo-edit:not(:disabled):hover{color:#e2c797;background:#34404b;border-color:#657584}
[data-theme=night] .todo-edit:not(:disabled):active{background:#394a56}
[data-theme=night] .meta-pill{background:#33414d;color:#d7dedb}
[data-theme=night] .meta-pill.source-mingxi{background:#25395b;color:#cbdcff;border-color:#648ac3}
[data-theme=night] .meta-pill.source-xixi{background:#532b43;color:#ffd4e5;border-color:#a65d83}
[data-theme=night] .meta-pill.recipient{background:#303b45;color:#bfc9d1}
[data-theme=night] .meta-pill.due{background:#374453;color:#d9d7cd}
[data-theme=night] .meta-pill.due.overdue{background:#5b3136;color:#ffd0c8}
[data-theme=night] .meta-pill.done{background:#2c4535;color:#c1e5c3}
[data-theme=night] .meta-pill.hard-due{background:linear-gradient(135deg,#79521d,#956e32);color:#fff6e8;border-color:#d7ad6f}
[data-theme=night] .meta-pill.hard-due.overdue{background:linear-gradient(135deg,#79373e,#a04a42);border-color:#d88773}
[data-theme=night] .empty-state{background:#1e2933;border-color:#52606b}
[data-theme=night] .summary-bar{background:linear-gradient(125deg,#202a36,#293745 85%);border:1px solid #4b535b}
[data-theme=night] .summary-label strong{color:#f0ede5}
[data-theme=night] .summary-label small{color:#bcc5ce}
[data-theme=night] .login-card{background:#171f29;border-color:#414e58;box-shadow:0 24px 70px #0008}
[data-theme=night] .login-card .intro{color:#bac4c5}
[data-theme=night] .login-topline,[data-theme=night] .login-footnote{color:#baa782;border-color:#45515b}
[data-theme=night] .login-rule{border-color:#47545b;color:#bda987}
[data-theme=night] .login-rule span:last-child{color:#a6aaac}
[data-theme=night] .login-form label,[data-theme=night] .editor-dialog label:not(.check-line){color:#d5d5c9}
[data-theme=night] .login-form input{background:#242f39;border-color:#57626a;color:#e5e8e2}
[data-theme=night] .login-form input::placeholder{color:#a2adb0}
[data-theme=night] .small-hint{color:#a3adb3}
[data-theme=night] .login-topline .theme-toggle{background:#1d2630;color:#bac0b9;border-color:#3b4852}
[data-theme=night] .theme-toggle{background:#1b252f;border-color:#3b4956;color:#aeb8b7;box-shadow:none}
[data-theme=night] .theme-toggle:hover{background:#27333e;border-color:#5c6c77;color:#d0d6d0}
[data-theme=night] .theme-toggle .theme-symbol{color:#aaa084}
[data-theme=night] .editor-dialog{background:#1b2530;border-color:#64717b;color:#e8e8df;box-shadow:0 28px 80px #000a}
[data-theme=night] .editor-dialog::backdrop{background:#03070bbd}
[data-theme=night] .dialog-intro,[data-theme=night] .check-line small{color:#aeb9c0}
[data-theme=night] .check-line strong{color:#ded5c2}
[data-theme=night] .editor-dialog input:not([type=checkbox]):not([type=hidden]),[data-theme=night] .editor-dialog textarea,[data-theme=night] .editor-dialog .md-field{background:#293540;color:#e9e7dc;border-color:#626f77;box-shadow:0 1px 2px #0003}
[data-theme=night] .editor-dialog input::placeholder,[data-theme=night] .editor-dialog textarea::placeholder{color:#adb8bc}
[data-theme=night] .editor-dialog .md-field:hover{background:#303e49;border-color:#c0a46c}
[data-theme=night] .md-options{background:#2a3641;border-color:#68727c;box-shadow:0 13px 34px #02070bd9}
[data-theme=night] .md-options button{color:#e4e3db}
[data-theme=night] .md-options button[aria-selected=true]{background:#4c412c;color:#ffe4aa}
[data-theme=night] .md-options button:hover,[data-theme=night] .md-options button:focus-visible{background:#3e4d58}
[data-theme=night] .md-picker-dialog{background:#202b36;color:#e7e7df;border-color:#64707a}
[data-theme=night] .picker-selected{background:#34414a;color:#ecd2a0}
[data-theme=night] .picker-icon-button{color:#d2d3c9}
[data-theme=night] .picker-icon-button:hover,[data-theme=night] .picker-icon-button:focus-visible{background:#45515b}
[data-theme=night] .picker-weekdays,[data-theme=night] .picker-time-label small,[data-theme=night] .picker-time-row label{color:#b0bec5}
[data-theme=night] .picker-days button{color:#dedfdc}
[data-theme=night] .picker-days button.outside{color:#8795a0}
[data-theme=night] .picker-days button:not(.outside):hover{background:#3a4853}
[data-theme=night] .picker-days button.selected{background:#a97c39;color:#fff8eb}
[data-theme=night] .picker-time-row{border-color:#54616a}
[data-theme=night] .picker-time-input{background:#2d3945;color:#e8e8de;border-color:#65717d}
[data-theme=night] .picker-time-separator{color:#d4ba89}
[data-theme=night] .picker-presets button{background:#34414c;border-color:#6c736f;color:#e4cfa7}
[data-theme=night] .picker-presets button:hover{background:#455365}
[data-theme=night] .picker-text-button{color:#e7c790}
[data-theme=night] .picker-text-button:hover{background:#414d55}
[data-theme=night] .picker-apply-button{background:#4d5143;color:#ddd8c5;border:1px solid #6d715d}

/* Prevent an old bright foreground from animating over a new dark background. */
:root.theme-changing *, :root.theme-changing *::before, :root.theme-changing *::after {transition:none!important;animation:none!important}
/* Night interaction surfaces: no pale CTA gradients, glossy glint, or bright white cards. */
[data-theme=night] :is(.primary-button,.secondary-button,.mini-button,.icon-button,.logout-button){
  background-color:#26323d;
  background-image:linear-gradient(180deg,#303b46,#222e39);
  color:#ced7d5;border-color:#52616b;
  box-shadow:0 2px 0 #111a24;
  text-shadow:none
}
[data-theme=night] :is(.primary-button,.secondary-button,.mini-button,.icon-button,.logout-button)::after{
  content:none!important;opacity:0!important;animation:none!important
}
[data-theme=night] :is(.primary-button,.secondary-button,.mini-button,.icon-button,.logout-button) .mi{color:#b7beb8}
[data-theme=night] .primary-button{
  background-color:#383c34;
  background-image:linear-gradient(180deg,#3f4439,#30392f);
  border-color:#6a6953;color:#e5d8b8;
  box-shadow:0 2px 0 #171c1b
}
[data-theme=night] .primary-button .mi{color:#c7ae79}
[data-theme=night] .todo-actions .todo-complete{
  background-color:#283a34;
  background-image:linear-gradient(180deg,#354a3e,#28392f);
  border-color:#526e5d;color:#d0e0d0;
  box-shadow:0 2px 0 #17281d
}
[data-theme=night] .todo-actions .todo-complete .mi{color:#a2c4a5}
[data-theme=night] .todo-actions .todo-delete{
  background-color:#382d32;
  background-image:linear-gradient(180deg,#47373c,#342a2e);
  border-color:#765457;color:#e5c5c4;
  box-shadow:0 2px 0 #241b22
}
[data-theme=night] .todo-actions .todo-delete .mi{color:#d4a1a0}
[data-theme=night] .todo-actions .todo-decline{
  background-color:#2e343f;
  background-image:linear-gradient(180deg,#36414e,#28343f);
  border-color:#596b7d;color:#c4d5e5;
}
[data-theme=night] :is(.primary-button,.secondary-button,.mini-button,.icon-button,.logout-button):focus-visible{
  outline:2px solid #9a8a6e;outline-offset:3px
}
@media(hover:hover) and (pointer:fine){
  [data-theme=night] :is(.primary-button,.secondary-button,.mini-button,.icon-button,.logout-button):not(:disabled):hover{
    background-color:#344350;background-image:linear-gradient(180deg,#3b4b58,#2c3a47);
    border-color:#71808c;color:#e0e5df;box-shadow:0 3px 0 #16202a,0 5px 12px #050a0f45
  }
  [data-theme=night] .primary-button:not(:disabled):hover{
    background-color:#444939;background-image:linear-gradient(180deg,#4a4f3e,#364033);
    border-color:#807858;color:#e9dfc7;box-shadow:0 3px 0 #252920
  }
  [data-theme=night] .todo-actions .todo-complete:not(:disabled):hover{
    background-color:#345043;background-image:linear-gradient(180deg,#3f5546,#304536);
    border-color:#6f947b;color:#e0f0df
  }
  [data-theme=night] .todo-actions .todo-delete:not(:disabled):hover{
    background-color:#47343d;background-image:linear-gradient(180deg,#544047,#3c2e36);
    border-color:#997274;color:#f0d2cf
  }
  [data-theme=night] .todo-actions .todo-decline:not(:disabled):hover{
    background-color:#34404d;background-image:linear-gradient(180deg,#435161,#30404f);
    border-color:#728597;color:#deebf6
  }
}
[data-theme=night] :is(.primary-button,.secondary-button,.mini-button,.icon-button,.logout-button):not(:disabled):active{
  transform:translateY(1px);
  background-color:#24313b;background-image:linear-gradient(180deg,#26323d,#202a35);
  border-color:#596876;color:#c7cfce;
  box-shadow:inset 0 2px 5px #0b111a80,0 1px 0 #121b24
}
[data-theme=night] .primary-button:not(:disabled):active{background:#353b32;border-color:#726c57;color:#dacdb2}
[data-theme=night] .todo-actions .todo-complete:not(:disabled):active{background:#26382f;border-color:#60836b;color:#cadeca}
[data-theme=night] .todo-actions .todo-delete:not(:disabled):active{background:#372c34;border-color:#806165;color:#dfc1bf}
[data-theme=night] .todo-actions .todo-decline:not(:disabled):active{background:#2c3742;border-color:#6c7f8d;color:#c2d1dd}
[data-theme=night] .picker-apply-button:hover{background:#575f4d;color:#ede4ce}
[data-theme=night] .picker-apply-button:active{background:#41493e;color:#dbd2be}
