body[data-menu="settings"] .calendar-card,
body[data-menu="settings"] .day-status-control,
body[data-menu="settings"] #addTaskButton { display: none; }
body[data-menu="settings"] .planner-shell { display: block; max-width: 820px; }
.settings-view { display: grid; gap: 13px; padding-top: 14px; }
.settings-card { border: 1px solid var(--line); border-radius: 17px; padding: 17px; background: var(--card); }
.settings-title { display: flex; align-items: center; gap: 10px; margin-bottom: 15px; }
.settings-title > i { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 11px; background: var(--mint); color: var(--green); font-style: normal; }
.settings-title strong,.settings-title span { display: block; }.settings-title strong{font-size:12px}.settings-title span{font-size:8px;color:var(--muted);margin-top:2px}
.theme-options { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }
.theme-options button { min-height: 43px; border: 1px solid var(--line); border-radius: 12px; background: var(--cream); color: var(--ink); font-size: 9px; }
.theme-options button.active { border-color: var(--green); background: var(--mint); color: var(--green); box-shadow: inset 0 0 0 1px var(--green); }
#accountSettingsForm { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; }
#accountSettingsForm label { color: var(--muted); font-size: 9px; }
#accountSettingsForm label:first-child,#accountSettingsForm label:nth-child(2),#accountSettingsForm .save-button { grid-column: 1/-1; }
#accountSettingsForm input { display: block; width: 100%; margin-top: 5px; padding: 11px 12px; border: 1px solid var(--line); border-radius: 11px; background: var(--cream); color: var(--ink); outline: none; }
#accountSettingsForm input:focus { border-color: var(--green); box-shadow: 0 0 0 3px color-mix(in srgb,var(--green) 12%,transparent); }
#accountSettingsForm small { font-size: 7px; }.version-card{display:flex;align-items:center;justify-content:space-between}.version-card .settings-title{margin:0}.version-card>b{font-size:8px;color:var(--muted)}
html[data-theme="dark"] {
  color-scheme: dark;
  --cream:#0d1018;
  --card:#171b27;
  --ink:#f3f5fb;
  --muted:#9da6b8;
  --line:#2b3242;
  --mint:#252c4a;
  --green:#9fa8ff;
  --green2:#bdc3ff;
  --coral:#ff8e80;
}
html[data-theme="dark"] body {
  background:
    radial-gradient(circle at 78% -12%,rgba(105,91,210,.16),transparent 31rem),
    radial-gradient(circle at 0 100%,rgba(41,121,135,.1),transparent 26rem),
    var(--cream);
  background-attachment:fixed;
}
html[data-theme="dark"] .app-header {
  background:#121621;
  color:var(--ink);
  border-color:#272e3e;
  box-shadow:8px 0 32px rgba(0,0,0,.22);
}
html[data-theme="dark"] .calendar-card,
html[data-theme="dark"] .tasks-card,
html[data-theme="dark"] .settings-card,
html[data-theme="dark"] .report-card {
  background:linear-gradient(145deg,#191e2b,#161a25);
  color:var(--ink);
  border-color:var(--line);
  box-shadow:0 16px 38px rgba(0,0,0,.2);
}
html[data-theme="dark"] .main-menu { background:transparent; border-color:transparent; }
html[data-theme="dark"] .main-menu button { color:#969fb2; }
html[data-theme="dark"] .main-menu button:hover { background:#1c2231; color:#dce1ed; }
html[data-theme="dark"] .main-menu button.active {
  background:#252c45;
  color:#dfe2ff;
  box-shadow:inset 3px 0 0 #929cff;
}
html[data-theme="dark"] .sidebar-footer { border-color:var(--line); }
html[data-theme="dark"] .sidebar-footer button,
html[data-theme="dark"] .sidebar-focus-button { color:#9da6b8; }
html[data-theme="dark"] .sidebar-footer button:hover,
html[data-theme="dark"] .sidebar-focus-button:hover { background:#1c2231; color:var(--ink); }
html[data-theme="dark"] input,
html[data-theme="dark"] textarea,
html[data-theme="dark"] select,
html[data-theme="dark"] dialog:not(.memory-book-dialog) {
  background:#1d2330!important;
  color:var(--ink)!important;
  border-color:#343d50!important;
}
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder { color:#727d91; opacity:1; }
html[data-theme="dark"] input:focus,
html[data-theme="dark"] textarea:focus,
html[data-theme="dark"] select:focus { border-color:#7f89e8!important; box-shadow:0 0 0 3px rgba(127,137,232,.15); }
html[data-theme="dark"] dialog:not(.memory-book-dialog) { box-shadow:0 28px 90px rgba(0,0,0,.55); }
html[data-theme="dark"] dialog:not(.memory-book-dialog)::backdrop { background:rgba(3,5,10,.72); }
html[data-theme="dark"] .calendar-header button,
html[data-theme="dark"] .today-button,
html[data-theme="dark"] .picker-field,
html[data-theme="dark"] .theme-options button,
html[data-theme="dark"] .plan-kind span,
html[data-theme="dark"] .result-choice span,
html[data-theme="dark"] .reminder-row>button:not(.remove-reminder),
html[data-theme="dark"] .month-days button,
html[data-theme="dark"] .habit-frequency span,
html[data-theme="dark"] .habit-month-picker button {
  background:#1d2330;
  color:var(--ink);
  border-color:#343d50;
}
html[data-theme="dark"] .calendar-day:hover,
html[data-theme="dark"] .daily-item:hover { background:#202737; }
html[data-theme="dark"] .calendar-day.today { color:#cbd0ff; box-shadow:inset 0 0 0 1.5px #7782df; }
html[data-theme="dark"] .calendar-day.selected { background:#6974d6; color:#fff; box-shadow:0 7px 18px rgba(73,84,190,.35); }
html[data-theme="dark"] .calendar-day .count { background:#293250; color:#cbd0ff; }
html[data-theme="dark"] .calendar-day.selected .count { background:#f0f1ff; color:#414b9e; }
html[data-theme="dark"] .task-item,
html[data-theme="dark"] .daily-item,
html[data-theme="dark"] .daily-habit-item { border-color:#282f3e; }
html[data-theme="dark"] .daily-habit-item { background:linear-gradient(90deg,#211f35,#191e2b); }
html[data-theme="dark"] .task-status,
html[data-theme="dark"] .status-badge.pending,
html[data-theme="dark"] .daily-meta span,
html[data-theme="dark"] .goal-days-summary span { background:#252c39; color:#b5bdca; }
html[data-theme="dark"] .time-badge,
html[data-theme="dark"] .status-badge.completed,
html[data-theme="dark"] .daily-meta .priority-low { background:#203a3a; color:#8ed8c6; }
html[data-theme="dark"] .time-badge.reminder,
html[data-theme="dark"] .status-badge.not_done,
html[data-theme="dark"] .daily-meta .priority-high,
html[data-theme="dark"] .remove-reminder { background:#43282c; color:#ffaaa0; }
html[data-theme="dark"] .daily-meta .priority-medium { background:#3d3522; color:#f4cc72; }
html[data-theme="dark"] .result-note { background:#202633; color:#b8c0ce; }
html[data-theme="dark"] .day-status-options { background:#111620; }
html[data-theme="dark"] .day-status-options button { color:#a7b0c1; }
html[data-theme="dark"] .day-status-options button.active { background:#293143; color:#fff; box-shadow:0 2px 10px rgba(0,0,0,.25); }
html[data-theme="dark"] .notification-note { background:#35272a; }
html[data-theme="dark"] .reminders-editor,
html[data-theme="dark"] .habit-date-calendar { background:#141923; border-color:var(--line); }
html[data-theme="dark"] .dialog-header button { background:#272e3d; color:#c4cad5; }
html[data-theme="dark"] .wheel-columns:before { background:linear-gradient(#1d2330,transparent); }
html[data-theme="dark"] .wheel-columns:after { background:linear-gradient(transparent,#1d2330); }
html[data-theme="dark"] .confirm-dialog>section { background:#171b27; }
html[data-theme="dark"] .confirm-actions button:first-child { background:#292f3d; color:#c5cbd6; }
html[data-theme="dark"] .daily-conflict { background:#32291d; border-color:#65502e; }
html[data-theme="dark"] .daily-conflict label span { background:#211e1a; border-color:#584830; color:#ddd3c5; }
html[data-theme="dark"] .daily-conflict label input:checked+span { background:#44331f; border-color:#b97935; color:#ffd39d; }
html[data-theme="dark"] .goal-item.done { background:#192a28; }
html[data-theme="dark"] .theme-options button.active { background:#293250; border-color:#8791ed; color:#dfe2ff; }
@media(max-width:767px){
  html[data-theme="dark"] body { background:#0d1018; }
  html[data-theme="dark"] .main-menu { background:#151a25; border:1px solid #293143; box-shadow:0 8px 26px rgba(0,0,0,.38); }
  html[data-theme="dark"] .main-menu button,
  html[data-theme="dark"] .main-menu button:hover,
  html[data-theme="dark"] .main-menu button:focus { background:transparent; color:#8993a6; box-shadow:none; outline:none; }
  html[data-theme="dark"] .main-menu button .nav-icon,
  html[data-theme="dark"] .main-menu button:hover .nav-icon,
  html[data-theme="dark"] .main-menu button:focus .nav-icon {
    --top:#252b39;
    --bottom:#1c2230;
    border-color:#303849;
    background:linear-gradient(145deg,var(--top),var(--bottom));
    box-shadow:inset 1px 1px 0 rgba(255,255,255,.055),0 2px 5px rgba(0,0,0,.3);
    transform:translateY(-1px) scale(1);
  }
  html[data-theme="dark"] .main-menu button .nav-icon::after { background:linear-gradient(135deg,rgba(255,255,255,.07),transparent 55%); }
  html[data-theme="dark"] .main-menu button .nav-icon svg { filter:none; }
  html[data-theme="dark"] .main-menu button.active,
  html[data-theme="dark"] .main-menu button.active:hover,
  html[data-theme="dark"] .main-menu button.active:focus { background:transparent; color:#cbd0ff; box-shadow:none; }
  html[data-theme="dark"] .main-menu button.active .nav-icon,
  html[data-theme="dark"] .main-menu button.active:hover .nav-icon,
  html[data-theme="dark"] .main-menu button.active:focus .nav-icon {
    --top:#3b4265;
    --bottom:#2a3152;
    border-color:#6570c6;
    box-shadow:0 0 0 1px rgba(143,153,246,.13),0 4px 9px rgba(0,0,0,.3);
    transform:translateY(-2px) scale(1.02);
  }
  html[data-theme="dark"] .main-menu button:active .nav-icon { transform:translateY(0) scale(.96); box-shadow:inset 1px 2px 4px rgba(0,0,0,.3); }
}
@media(max-width:767px) and (hover:none){
  html[data-theme="dark"] .main-menu button:not(.active):hover,
  html[data-theme="dark"] .main-menu button:not(.active):focus { color:#8993a6; }
  html[data-theme="dark"] .main-menu button:not(.active):hover span,
  html[data-theme="dark"] .main-menu button:not(.active):focus span { color:inherit; font-weight:400; }
}
@media(max-width:767px){#accountSettingsForm{grid-template-columns:1fr}#accountSettingsForm label{grid-column:1!important}.settings-card{padding:14px}.theme-options button{min-height:46px}}

/* Phones in landscape are wide enough to trip the desktop breakpoint, but not tall enough for a sidebar. */
@media (orientation:landscape) and (max-height:600px) and (max-width:1024px) {
  html { scrollbar-gutter:auto; }
  body { background-attachment:scroll; }
  .app-header,
  .sidebar-collapsed .app-header {
    position:static;
    width:100%;
    height:56px;
    min-height:56px;
    padding:7px 16px;
    display:flex;
    flex-direction:row;
    align-items:center;
    border:0;
    border-bottom:1px solid var(--line);
  }
  .sidebar-head { width:100%; min-height:0; padding:0; border:0; }
  .brand>i { width:36px; height:36px; border-radius:12px; }
  .brand strong { font-size:15px; }
  .brand span { display:none; }
  .collapse-button,.sidebar-footer,.sidebar-focus-button,.desktop-extra { display:none!important; }
  .mobile-focus-button { position:absolute; z-index:2; top:8px; left:14px; width:40px; height:40px; padding:0; display:grid; place-items:center; border:0; background:transparent; }
  .main-menu,
  .sidebar-collapsed .main-menu {
    position:fixed;
    z-index:90;
    right:10px;
    left:10px;
    bottom:max(7px,env(safe-area-inset-bottom));
    width:auto;
    height:58px;
    margin:0;
    padding:4px 6px;
    display:flex!important;
    flex-direction:row;
    align-items:center;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    gap:2px;
    border-radius:18px;
    background:rgba(255,255,255,.96);
    box-shadow:0 8px 25px rgba(34,34,65,.18);
    scrollbar-width:none;
  }
  .main-menu::-webkit-scrollbar { display:none; }
  .main-menu button,.main-menu button:last-child {
    flex:1 0 70px!important;
    min-width:70px!important;
    width:auto!important;
    height:48px;
    min-height:48px;
    padding:3px 2px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    gap:0;
    border-radius:13px;
    font-size:7px;
  }
  .main-menu button .nav-icon { width:29px; height:29px; border-radius:9px; }
  .main-menu button .nav-icon svg { width:16px; height:16px; }
  .main-menu button span { display:block; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .planner-shell,.sidebar-collapsed .planner-shell {
    width:100%;
    max-width:1024px;
    margin:0 auto;
    padding:10px 12px 78px;
    grid-template-columns:minmax(280px,.85fr) minmax(360px,1.15fr);
    gap:10px;
  }
  .calendar-card,.tasks-card { border-radius:17px; }
  .calendar-card { padding:15px; }
  .tasks-card { padding:16px; }
  .weekdays { margin-top:15px; }
  .calendar-day { max-height:43px; }
  dialog:not(.memory-book-dialog):not(.focus-dialog) { max-height:88dvh; overflow-y:auto; }
  .toast { bottom:75px; }
  body[data-menu=goals] .planner-shell,
  body[data-menu=habits] .planner-shell,
  body[data-menu=notes] .planner-shell,
  body[data-menu=memories] .planner-shell,
  body[data-menu=settings] .planner-shell { display:block; max-width:820px; }
  html[data-theme="dark"] .app-header { background:#121621; }
  html[data-theme="dark"] .main-menu { background:#151a25; border:1px solid #293143; box-shadow:0 8px 26px rgba(0,0,0,.38); }
  html[data-theme="dark"] .main-menu button:hover { background:transparent; color:#8993a6; }
  html[data-theme="dark"] .main-menu button.active:hover { color:#cbd0ff; }
  html[data-theme="dark"] .main-menu button:hover .nav-icon { transform:translateY(-1px) scale(1); box-shadow:0 2px 5px rgba(0,0,0,.3); }
}

/* Desktop and laptop fluid layout */
.planner-shell>*{min-width:0}
@media(min-width:1024px) and (max-width:1199px){
  :root{--sidebar:82px}
  .app-header{padding-inline:11px}
  .app-header .brand>div,.app-header .main-menu span,.app-header .sidebar-footer span,.app-header .collapse-button,.app-header .sidebar-focus-button span{display:none}
  .app-header .sidebar-head{justify-content:center}
  .app-header .main-menu button,.app-header .sidebar-footer button,.app-header .sidebar-focus-button{padding-inline:0;justify-content:center}
  .planner-shell{width:calc(100% - var(--sidebar));margin-right:var(--sidebar);padding:24px;grid-template-columns:minmax(260px,.72fr) minmax(0,1.28fr);gap:16px}
  .metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dashboard-grid{grid-template-columns:1fr}
}
@media(min-width:1200px){
  .planner-shell{width:calc(100% - var(--sidebar));margin-right:var(--sidebar);margin-left:auto}
}
@media(hover:hover){
  .main-menu button .nav-icon,.sidebar-footer button .nav-icon{transition:background .16s ease,border-color .16s ease,box-shadow .16s ease,color .16s ease;transform:translateY(-1px) scale(1)}
  .main-menu button:hover .nav-icon,.sidebar-footer button:hover .nav-icon{transform:translateY(-1px) scale(1);border-color:color-mix(in srgb,var(--icon) 24%,#d8d8e2);box-shadow:inset 1px 1px 1px rgba(255,255,255,.72),0 2px 5px rgba(41,41,75,.11)}
  .main-menu button.active .nav-icon,.main-menu button.active:hover .nav-icon{transform:translateY(-1px) scale(1);border-color:color-mix(in srgb,var(--icon) 32%,#d3d3df);box-shadow:inset 0 0 0 1px rgba(255,255,255,.45),0 2px 5px rgba(41,41,75,.12)}
  html[data-theme="dark"] .main-menu button:hover .nav-icon,html[data-theme="dark"] .sidebar-footer button:hover .nav-icon{border-color:#424b60;box-shadow:inset 1px 1px 0 rgba(255,255,255,.06),0 2px 5px rgba(0,0,0,.25)}
}
.main-menu button.active,
.main-menu button.active:hover,
.main-menu button.active:focus,
html[data-theme="dark"] .main-menu button.active,
html[data-theme="dark"] .main-menu button.active:hover,
html[data-theme="dark"] .main-menu button.active:focus{background:transparent!important;box-shadow:none!important}
html[data-theme="dark"] .main-menu button.active{color:#f1f3f8!important}
@media(hover:hover){
  .main-menu button:not(.active):hover,.sidebar-footer button:hover{background:transparent!important;color:#626274!important;box-shadow:none!important;outline:none!important}
  .main-menu button:not(.active):hover .nav-icon,.sidebar-footer button:hover .nav-icon{transform:translateY(-1px) scale(1)!important;border-color:rgba(255,255,255,.85)!important;box-shadow:inset 1px 1px 1px rgba(255,255,255,.9),inset -1px -1px 1px rgba(35,35,60,.07),0 2px 4px rgba(41,41,75,.12)!important}
  .main-menu button:focus,.main-menu button:focus-visible,.sidebar-footer button:focus,.sidebar-footer button:focus-visible{outline:none!important}
  html[data-theme="dark"] .main-menu button:not(.active):hover,html[data-theme="dark"] .sidebar-footer button:hover{background:transparent!important;color:#9da6b8!important}
  html[data-theme="dark"] .main-menu button:not(.active):hover .nav-icon,html[data-theme="dark"] .sidebar-footer button:hover .nav-icon{border-color:#303849!important;box-shadow:inset 1px 1px 0 rgba(255,255,255,.055),0 2px 5px rgba(0,0,0,.28)!important}
}

body.auth-locked > :not(#loginDialog):not(#updateBanner):not(script) { visibility: hidden !important; }
.fingerprint-login { display:flex;align-items:center;justify-content:center;width:64px;height:64px;margin:12px auto 0;padding:14px;background:transparent;border:0;box-shadow:none;color:var(--primary,#5b5bd6);cursor:pointer;border-radius:50%;transition:opacity .15s,transform .15s; }
.fingerprint-login svg { width:36px;height:36px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round; }
.fingerprint-login:active { opacity:.65;transform:scale(.95); }
.fingerprint-login:focus-visible { outline:2px solid currentColor;outline-offset:2px; }
.fingerprint-login:disabled { opacity:.4;cursor:wait; }

/* The APK update must remain above the locked login dialog, including small screens. */
dialog#updateBanner { height:fit-content; border-radius:20px; inset:0; margin:auto; width:min(440px,calc(100vw - 32px)); max-height:calc(100dvh - 32px); padding:24px; grid-template-columns:42px minmax(0,1fr) 28px; gap:16px; background:var(--card,#fff); }
dialog.update-banner:not([open]),dialog.update-banner[hidden] { display:none; }
dialog.update-banner::backdrop { background:rgba(20,20,40,.45); }
dialog.update-banner strong { font-size:16px; }
dialog.update-banner span { display:block; font-size:13px; }
dialog.update-banner #installUpdate { grid-column:1 / -1;grid-row:2;padding:14px;font-size:14px; }
dialog.update-banner #dismissUpdate { grid-column:3;grid-row:1; }