/* dots — quiet refractive surfaces, tuned for this app rather than a platform clone */
:root{color-scheme:light;--bg:#fff;--glass:rgba(255,255,255,.68);--glass-strong:rgba(255,255,255,.84);--line:rgba(33,38,52,.08);--text:#17191f;--muted:#777b86;--soft:rgba(32,40,60,.045);--accent:#8176d9;--shadow:0 18px 55px rgba(27,34,55,.08);--editorial-serif:Georgia,'Times New Roman',serif;--editorial-sans:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;background:#fff;color:var(--text)}
:root[data-theme=light]{color-scheme:light;--bg:#fff;--glass:rgba(255,255,255,.68);--glass-strong:rgba(255,255,255,.88);--line:rgba(33,38,52,.08);--text:#17191f;--muted:#777b86;--soft:rgba(32,40,60,.045);--accent:#7166ca;--shadow:0 18px 55px rgba(27,34,55,.08);background:#fff;color:var(--text)}
:root[data-theme=dark]{color-scheme:dark;--bg:#000;--glass:rgba(24,26,32,.64);--glass-strong:rgba(18,20,25,.82);--line:rgba(255,255,255,.09);--text:#f5f5f7;--muted:#9699a4;--soft:rgba(255,255,255,.055);--accent:#aaa1ff;--shadow:0 20px 60px rgba(0,0,0,.3);background:#000;color:var(--text)}
html,body{background:var(--bg)!important;color:var(--text);font-family:var(--editorial-sans);-webkit-font-smoothing:antialiased}
body{letter-spacing:0;line-height:1.5}
button,input,select,textarea{font:inherit;color:inherit}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,canvas:focus-visible{outline:2px solid color-mix(in srgb,var(--accent) 65%,transparent)!important;outline-offset:3px}
::selection{background:color-mix(in srgb,var(--accent) 28%,transparent);color:var(--text)}
aside,#sidebar{background:color-mix(in srgb,var(--bg) 72%,transparent)!important;border-color:var(--line)!important;backdrop-filter:blur(22px) saturate(150%);-webkit-backdrop-filter:blur(22px) saturate(150%);box-shadow:1px 0 24px rgba(30,35,55,.035)!important}
main{background:transparent;max-width:none}
header{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--bg) 66%,transparent)!important;border-bottom:1px solid var(--line)!important;backdrop-filter:blur(24px) saturate(155%);-webkit-backdrop-filter:blur(24px) saturate(155%)}
.breadcrumb{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.centralClock{gap:2px;padding:7px 14px;border:1px solid var(--line)!important;border-radius:999px!important;background:var(--glass)!important;backdrop-filter:blur(18px) saturate(160%);-webkit-backdrop-filter:blur(18px) saturate(160%);box-shadow:0 5px 20px rgba(20,28,48,.055)!important}
.centralClock time{font:600 17px/1.15 var(--editorial-sans)!important;letter-spacing:.055em;font-variant-numeric:tabular-nums;color:var(--text)}
.centralClock small{font:9px/1.2 var(--editorial-sans)!important;letter-spacing:.08em;color:var(--muted);text-transform:uppercase}
aside .brand{font:600 24px/1 var(--editorial-sans);letter-spacing:-1.1px;color:var(--text)}.brandicon{color:var(--accent)}
.iconbutton,.navitem,.sideboard,.account,.bell,.avatar,.viewbutton{border-radius:13px!important;transition:background .18s ease,color .18s ease,transform .18s ease}
.iconbutton:hover,.navitem:hover,.sideboard:hover,.account:hover,.bell:hover,.avatar:hover,.viewbutton:hover{background:var(--soft)!important;color:var(--text)!important}
.navitem.active{background:var(--soft)!important;color:var(--text)!important;box-shadow:inset 0 0 0 1px var(--line)!important}
.navitem.active i{color:var(--accent)}.navitem{height:42px;color:var(--muted)}.sidesectionlabel{color:var(--muted)}
.avatar{border:1px solid var(--line)!important;background:var(--glass)!important;color:var(--text)!important;box-shadow:0 4px 16px rgba(20,28,48,.06)!important}
#homeLayout.homeActive{margin-top:42px;gap:clamp(28px,5vw,76px)}
.homeHeading{border-bottom:1px solid var(--line)!important;padding-bottom:24px}
.homeHeading h1,.pageheading h1{font:500 clamp(48px,6vw,78px)/.98 var(--editorial-serif)!important;letter-spacing:-.055em!important;text-transform:none!important;color:var(--text)!important;-webkit-text-stroke:0!important;margin:0!important}
.homeHeading p,.pageheading p{font-size:12px;color:var(--muted);line-height:1.65;margin-top:12px}
.homeHeading>div:first-child{max-width:60ch}.homeDate{font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin:18px 0}
.sortLabel select,.insightheading select{background:var(--glass)!important;border:1px solid var(--line)!important;border-radius:12px!important;padding:9px 30px 9px 12px;color:var(--text)!important}
.homeTask{padding:15px 14px;margin:0 0 8px;border:1px solid transparent!important;border-radius:16px!important;background:transparent!important;transition:background .2s ease,border-color .2s ease}
.homeTask:hover{background:var(--soft)!important;border-color:var(--line)!important}
.taskTick{background:var(--glass)!important;border:1px solid color-mix(in srgb,var(--muted) 30%,transparent)!important;border-radius:50%!important;width:21px;height:21px;color:var(--text)}
.taskTick[aria-pressed=true]{background:var(--accent)!important;border-color:var(--accent)!important;color:#fff!important}
.taskBody b{font:500 18px/1.3 var(--editorial-sans)!important;letter-spacing:-.02em}
.taskBody p,.taskBody small{color:var(--muted);font-size:10px}
.editTask{background:var(--glass)!important;border:1px solid var(--line)!important;border-radius:10px!important;padding:6px 10px;color:var(--muted);font-size:10px}
.editTask:hover{background:var(--glass-strong)!important;color:var(--text)}
#notificationPanel{width:100%;max-width:360px;aspect-ratio:4/3;background:var(--glass)!important;border:1px solid var(--line)!important;border-radius:22px!important;padding:20px!important;margin:0!important;box-shadow:var(--shadow)!important;backdrop-filter:blur(24px) saturate(145%);-webkit-backdrop-filter:blur(24px) saturate(145%)}
#notificationPanel .sectionhead{border-bottom:1px solid var(--line);padding-bottom:12px}
#notificationPanel .sectionhead h2{font:500 22px/1.05 var(--editorial-serif)!important;letter-spacing:-.03em;text-transform:none}
.notificationpanel .notice{background:rgba(255,255,255,.04)!important;border:1px solid var(--line)!important;border-radius:13px!important;padding:12px;margin:8px 0}
.notice button,.secondary,.primary,.textbutton,.sortLabel select,.insightheading select,#saveClock,#settingsAlerts,#settingsAccount,#exportData{transition:background .2s ease,border-color .2s ease,transform .2s ease}
.primary{background:color-mix(in srgb,var(--text) 92%,transparent)!important;color:var(--bg)!important;border:1px solid transparent!important;border-radius:13px!important;padding:12px 18px;box-shadow:0 7px 22px rgba(20,25,40,.1)!important}
.primary:hover{transform:translateY(-1px);filter:brightness(1.1)}
.secondary,.notice button{background:var(--glass)!important;border:1px solid var(--line)!important;border-radius:12px!important;color:var(--text)!important;padding:9px 13px}
.secondary:hover,.notice button:hover{background:var(--glass-strong)!important;border-color:color-mix(in srgb,var(--accent) 25%,var(--line))!important}
.textbutton{color:var(--accent)!important;border-radius:8px!important}
.createDock #createHabit{width:52px!important;height:52px!important;min-width:52px!important;border-radius:18px!important;background:color-mix(in srgb,var(--text) 94%,transparent)!important;color:var(--bg)!important;border:1px solid rgba(255,255,255,.12)!important;box-shadow:0 12px 35px rgba(20,25,40,.17)!important;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
.createDock #createHabit:hover{transform:translateY(-2px) scale(1.03)}
.habitsection,.workspaceView,.summary{max-width:1220px}
.habitsection>.sectionhead{border-bottom:1px solid var(--line)!important}
.sectionhead h2,#listTitle,.analyticscard h2,.settingscard h2,.remindercard h2{font:500 clamp(23px,3vw,35px)/1.1 var(--editorial-serif)!important;letter-spacing:-.035em!important;text-transform:none!important}
.habit{background:var(--glass)!important;border:1px solid var(--line)!important;border-radius:20px!important;padding:20px!important;margin-bottom:12px;box-shadow:0 9px 25px rgba(25,32,50,.045)!important;backdrop-filter:blur(20px) saturate(135%);-webkit-backdrop-filter:blur(20px) saturate(135%)}
.habit:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(25,32,50,.085)!important}
.habiticon{border:1px solid var(--line)!important;border-radius:13px!important;background:var(--soft)!important}
.habittitle b{font:500 20px/1.2 var(--editorial-serif)!important;letter-spacing:-.025em}
.check{background:var(--glass)!important;border:1px solid color-mix(in srgb,var(--muted) 20%,transparent)!important;border-radius:50%!important}
.check.done{background:var(--accent)!important;border-color:var(--accent)!important;color:#fff!important}
.boardLegend,.habitfoot,.metarow,.footnote{color:var(--muted)}
.boardScroller{border-radius:14px}.cell{border-radius:4px!important}
.metricgrid{gap:9px}.metricgrid>div{background:var(--glass)!important;border:1px solid var(--line)!important;border-radius:18px!important;padding:19px!important;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.metricgrid strong{font:500 36px/1 var(--editorial-serif)!important;letter-spacing:-.04em}
.analyticscard,.settingscard{background:var(--glass)!important;border:1px solid var(--line)!important;border-radius:19px!important;padding:21px!important;margin-bottom:12px;box-shadow:0 10px 28px rgba(25,32,50,.04)!important;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.tableScroll{border-radius:14px;overflow:auto}th{color:var(--muted);border-color:var(--line)!important}td{border-color:var(--line)!important}
.remindercard{background:var(--glass)!important;border:1px solid var(--line)!important;border-radius:18px!important;padding:18px!important;margin:0 0 10px;box-shadow:0 8px 22px rgba(25,32,50,.04)!important;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.scheduleTime{font:500 26px/1 var(--editorial-sans);letter-spacing:-.03em;color:var(--accent)}
.historyrow{border-color:var(--line)!important}
.quietempty{background:var(--glass)!important;border:1px solid var(--line)!important;border-radius:18px!important;padding:28px!important;color:var(--muted)}
.settingscard label{color:var(--muted);font-size:11px}.settingscard input,.settingscard select,#habitDialog input:not([type=checkbox]):not([type=color]):not([type=range]),#habitDialog select,#authDialog input,#profileDialog input,#searchDialog input,#dayDialog textarea,#cropDialog input{background:var(--glass)!important;border:1px solid var(--line)!important;border-radius:12px!important;padding:11px 12px!important;color:var(--text)!important}
.settingscard input:focus,.settingscard select:focus,#habitDialog input:focus,#habitDialog select:focus{border-color:color-mix(in srgb,var(--accent) 36%,var(--line))!important;outline:0!important;box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 11%,transparent)!important}
#zonePreference{background:var(--glass-strong)!important;border:1px solid var(--line)!important;border-radius:14px!important}
.settingscard .togglelabel{padding:12px 13px;border:1px solid var(--line);border-radius:13px;background:var(--glass)}
.fieldrow{gap:18px}.weekdays span{border-radius:12px!important}.daynotes{border-radius:12px!important}
dialog{width:min(540px,calc(100vw - 26px));max-height:90dvh;background:var(--glass-strong)!important;color:var(--text)!important;border:1px solid var(--line)!important;border-radius:22px!important;padding:30px!important;box-shadow:var(--shadow)!important;backdrop-filter:blur(30px) saturate(165%);-webkit-backdrop-filter:blur(30px) saturate(165%)}
dialog::backdrop{background:rgba(18,22,36,.10)!important;backdrop-filter:blur(6px) saturate(110%);-webkit-backdrop-filter:blur(6px) saturate(110%)}
dialog h2{font:500 32px/1.08 var(--editorial-serif)!important;letter-spacing:-.035em!important;text-transform:none!important}
dialog .close{border:1px solid var(--line);border-radius:12px;background:var(--glass);width:38px;height:38px;display:grid;place-items:center;font-size:20px}
dialog p,label{color:var(--muted)}
.colors .color{border:1px solid var(--line);box-shadow:0 2px 9px rgba(0,0,0,.1)}
.boardpreview{background:var(--glass)!important;border:1px solid var(--line)!important;border-radius:15px!important}
.cropStage{background:var(--glass)!important;border:1px solid var(--line)!important;border-radius:17px!important}
.cropMask{border-radius:50%;box-shadow:0 0 0 100px rgba(0,0,0,.52)!important}
#toast{background:var(--glass-strong)!important;color:var(--text)!important;border:1px solid var(--line)!important;border-radius:14px!important;box-shadow:var(--shadow)!important;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
#sidebarBackdrop{background:rgba(10,12,20,.13)!important;backdrop-filter:blur(5px)}
/* The habit editor expands into a working canvas while the live clock and app rail remain visible. */
#habitDialog{position:fixed;inset:92px 28px 22px calc(var(--sidebar) + 28px);width:auto;max-width:none;max-height:none;height:auto;margin:0;padding:32px clamp(22px,4vw,60px)!important;border-radius:26px!important;overflow:auto;background:color-mix(in srgb,var(--glass-strong) 88%,transparent)!important}
#habitDialog h2{font-size:clamp(34px,4vw,52px)!important;margin:0 0 8px}
#habitDialog>p{margin:0 0 24px}
#habitForm{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 22px;max-width:1180px;margin:0 auto}
#habitForm>label:nth-of-type(1),#habitForm>label:nth-of-type(2){grid-column:span 1}
#habitForm>label:nth-of-type(3),#habitForm>#colors,#habitForm>label:has(#habitIcon),#habitForm>.customsettings,#habitForm>.primary{grid-column:1/-1}
#habitForm>.customsettings{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px 24px}
#habitForm>.customsettings h3{grid-column:1/-1}
#habitForm>.customsettings h3:nth-of-type(2){margin-top:14px}
#habitForm>.customsettings .fieldrow,#habitForm>.customsettings #weekdays,#habitForm>.customsettings .notificationhint,#habitForm>.customsettings #boardPreview{grid-column:1/-1}
#habitForm>.customsettings>label:has(#reminderEnabled){grid-column:1/-1}
#habitForm>.customsettings>label:has(#boardTitle){grid-column:1/-1}
#habitForm>.customsettings>label:has(#dotGap){grid-column:1/-1}
#habitForm>.customsettings>h3:not(:first-child){padding-top:20px;border-top:1px solid var(--line)}
#habitForm>.customsettings .fieldrow>label{min-width:0}
#habitForm>.customsettings .fieldrow>label:has(#reminderTime),#habitForm>.customsettings .fieldrow>label:has(#reminderDate){flex:1}
#habitForm>.customsettings>.fieldrow:last-of-type{grid-column:1/-1}
#habitDialog #deleteHabit{margin-top:14px}
/* World clock */
#worldClockDialog{width:min(820px,calc(100vw - 28px));max-height:min(88dvh,920px);padding:28px!important}
.worldClockTop{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;padding:4px 0 18px;border-bottom:1px solid var(--line)}
.worldClockTop h2{margin:0!important}.worldClockTop p{margin:8px 0 0!important}
.worldClockCurrent{min-width:190px;padding:14px 16px;border:1px solid var(--line);border-radius:16px;background:var(--glass)}
.worldClockCurrent small{display:block;color:var(--muted);font-size:9px;letter-spacing:.1em;text-transform:uppercase}
.worldClockCurrent strong{display:block;margin-top:5px;font:500 24px/1.1 var(--editorial-sans);font-variant-numeric:tabular-nums}
.worldClockSearch{margin:16px 0 8px}.worldClockList{max-height:55dvh;overflow:auto;border-radius:15px;scrollbar-width:thin}
.worldClockRow{display:grid;grid-template-columns:minmax(0,1fr) 115px 95px;align-items:center;gap:12px;width:100%;text-align:left;padding:12px 14px;border:0;border-bottom:1px solid var(--line);background:transparent;color:var(--text);transition:background .16s ease}
.worldClockRow:hover,.worldClockRow[aria-current=true]{background:var(--soft)}
.worldClockCity{font-size:13px;font-weight:500}.worldClockOffset,.worldClockTime{font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}.worldClockOffset{letter-spacing:.04em}.worldClockTime{text-align:right;color:var(--text)}
.worldClockActions{display:flex;justify-content:flex-end;padding-top:14px}
.worldClockActions button{background:var(--glass)!important;border:1px solid var(--line)!important;border-radius:12px!important;padding:9px 14px}
.homeControls{display:flex;gap:8px;justify-content:flex-end;align-items:center;flex-wrap:wrap}.homeControls label{display:grid;gap:4px;font-size:8px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.homeControls select{border:1px solid var(--line);border-radius:11px;background:var(--glass);padding:7px 24px 7px 9px;color:var(--text);font-size:10px;max-width:150px}
.homeTaskList{display:grid;gap:8px}.taskGroup{border:1px solid var(--line);border-radius:17px;background:color-mix(in srgb,var(--glass) 65%,transparent);overflow:hidden;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.taskGroup summary{list-style:none;display:flex;align-items:center;gap:10px;padding:13px 15px;cursor:pointer;user-select:none}
.taskGroup summary::-webkit-details-marker{display:none}.taskGroup summary::before{content:'⌄';font-size:12px;color:var(--muted);transition:transform .18s ease}.taskGroup:not([open]) summary::before{transform:rotate(-90deg)}
.taskGroupName{font-size:12px;font-weight:600;letter-spacing:-.01em}.taskGroupMeta{margin-left:auto;font-size:9px;color:var(--muted);letter-spacing:.04em}.taskGroup .homeTask{margin:0 7px 6px}
#toast{z-index:100}
@media(max-width:1100px){#habitDialog{inset:88px 18px 18px calc(var(--sidebar) + 18px)}#homeLayout.homeActive{gap:25px}}
@media(max-width:720px){:root{--sidebar:60px}.sidebarExpanded{--sidebar:60px}main{margin-left:60px;padding:0 16px 100px}header{height:68px;min-height:68px}.centralClock{padding:5px 8px}.centralClock time{font-size:14px!important}.centralClock small{font-size:7px!important}.headeractions{gap:5px}.avatar{width:30px;height:30px}#homeLayout.homeActive{grid-template-columns:minmax(0,1fr);margin:28px auto 0;gap:16px}#notificationPanel{grid-row:1;width:100%;max-width:none;aspect-ratio:4/3;padding:15px!important}#homeTasks{grid-row:2}.homeHeading{align-items:flex-start;flex-direction:column}.homeHeading h1,.pageheading h1{font-size:clamp(42px,12vw,60px)!important}.homeControls{width:100%;justify-content:flex-start}.homeControls label{flex:1}.homeControls select{width:100%;max-width:none}.homeTask{padding:13px 10px}.habitsection{padding-top:28px}.metricgrid{grid-template-columns:repeat(2,minmax(0,1fr))}.metricgrid>div{padding:14px!important}.remindercard{display:grid;grid-template-columns:70px minmax(0,1fr);gap:12px}.remindercard .secondary{grid-column:2;justify-self:start}.fieldrow{gap:10px}#habitDialog{inset:74px 8px 8px calc(var(--sidebar) + 8px);padding:19px 16px!important;border-radius:18px!important}#habitForm,#habitForm>.customsettings{grid-template-columns:1fr;gap:13px}#habitForm>label:nth-of-type(1),#habitForm>label:nth-of-type(2),#habitForm>label:nth-of-type(3),#habitForm>#colors,#habitForm>label:has(#habitIcon),#habitForm>.customsettings,#habitForm>.primary{grid-column:1/-1}#habitForm>.customsettings>*{grid-column:1/-1}.worldClockTop{display:block}.worldClockCurrent{margin-top:13px}.worldClockRow{grid-template-columns:minmax(0,1fr) 82px 72px;gap:7px;padding:11px 9px}.worldClockCity{font-size:11px}.worldClockOffset,.worldClockTime{font-size:9px}#worldClockDialog{padding:20px!important}.worldClockList{max-height:51dvh}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* Dots liquid: quiet translucent layers with minimal framing. */
:root{--glass:rgba(255,255,255,.48);--glass-strong:rgba(255,255,255,.66);--line:rgba(32,36,46,.045);--soft:rgba(32,36,46,.035);--shadow:0 8px 28px rgba(28,34,50,.035)}
:root[data-theme=dark]{--glass:rgba(255,255,255,.035);--glass-strong:rgba(255,255,255,.065);--line:rgba(255,255,255,.055);--soft:rgba(255,255,255,.045);--shadow:0 10px 32px rgba(0,0,0,.18)}
aside,#sidebar{background:color-mix(in srgb,var(--bg) 78%,transparent)!important;box-shadow:none!important}
header{background:color-mix(in srgb,var(--bg) 70%,transparent)!important;border-bottom-color:transparent!important}
.centralClock{border-color:transparent!important;background:var(--glass)!important;box-shadow:none!important;border-radius:14px!important}
.iconbutton,.navitem,.sideboard,.account,.bell,.avatar,.viewbutton{border-radius:10px!important}
.navitem.active{box-shadow:none!important}
.avatar{box-shadow:none!important;border-color:transparent!important}
.homeHeading{border-bottom-color:color-mix(in srgb,var(--muted) 12%,transparent)!important}
.sortLabel select,.insightheading select,.homeControls select{border-color:transparent!important;background:var(--glass)!important;border-radius:10px!important}
.homeTask{border-color:transparent!important;border-radius:12px!important;background:transparent!important}
.homeTask:hover{border-color:transparent!important;background:var(--soft)!important}
.taskTick{background:transparent!important;border-color:color-mix(in srgb,var(--muted) 32%,transparent)!important}
.editTask{background:transparent!important;border-color:transparent!important}
#notificationPanel{border-color:transparent!important;border-radius:18px!important;box-shadow:none!important;background:var(--glass)!important}
.notificationpanel .notice{border-color:transparent!important;background:var(--soft)!important;border-radius:11px!important}
.primary{box-shadow:none!important;border-radius:11px!important}
.secondary,.notice button{border-color:transparent!important;border-radius:10px!important}
.createDock #createHabit{border:0!important;border-radius:50%!important;box-shadow:0 5px 18px rgba(0,0,0,.12)!important}
.habit{border-color:transparent!important;border-radius:14px!important;box-shadow:none!important;background:var(--glass)!important}
.habit:hover{box-shadow:none!important}
.habiticon{border-color:transparent!important;border-radius:10px!important}
.metricgrid>div,.analyticscard,.settingscard,.remindercard,.quietempty{border-color:transparent!important;box-shadow:none!important;border-radius:14px!important;background:var(--glass)!important}
.metricgrid>div{backdrop-filter:blur(18px) saturate(145%);-webkit-backdrop-filter:blur(18px) saturate(145%)}
.tableScroll{border-radius:10px}th,td{border-color:color-mix(in srgb,var(--muted) 14%,transparent)!important}
.settingscard input,.settingscard select,#habitDialog input:not([type=checkbox]):not([type=color]):not([type=range]),#habitDialog select,#authDialog input,#profileDialog input,#searchDialog input,#dayDialog textarea,#cropDialog input{border-color:transparent!important;border-radius:10px!important;background:color-mix(in srgb,var(--glass) 88%,var(--bg))!important}
.settingscard .togglelabel{border-color:transparent;background:var(--glass);border-radius:10px}
dialog{border-color:transparent!important;border-radius:18px!important;box-shadow:0 20px 65px rgba(0,0,0,.12)!important}
dialog::backdrop{background:transparent!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
#habitDialog{inset:84px 22px 18px calc(var(--sidebar) + 22px);border-radius:20px!important;background:rgba(255,255,255,.08)!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
:root[data-theme=dark] #habitDialog{background:rgba(0,0,0,.035)!important}
#habitDialog .close{position:sticky;top:0;float:right;z-index:3;border:0;background:var(--glass);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.worldClockCurrent{border-color:transparent;border-radius:12px;background:var(--glass)}
.worldClockList{border-radius:12px}
.worldClockRow{border-bottom-color:color-mix(in srgb,var(--muted) 12%,transparent)}
.taskGroup{border-color:transparent;border-radius:13px;background:color-mix(in srgb,var(--glass) 70%,transparent);backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%)}
.taskGroup summary{padding:12px 14px}
#toast{border-color:transparent!important;box-shadow:0 8px 25px rgba(0,0,0,.1)!important}
@media(max-width:720px){#habitDialog{inset:72px 6px 6px calc(var(--sidebar) + 6px);border-radius:14px!important;background:rgba(255,255,255,.08)!important} :root[data-theme=dark] #habitDialog{background:rgba(0,0,0,.035)!important}}

/* Settings directory and account details, drawn in the native system type style. */
:root{--editorial-serif:-apple-system,BlinkMacSystemFont,"SF Pro Display","Helvetica Neue",Arial,sans-serif;--editorial-sans:-apple-system,BlinkMacSystemFont,"SF Pro Text","Helvetica Neue",Arial,sans-serif}
html,body{font-family:var(--editorial-sans)}
.homeHeading h1,.pageheading h1{font-weight:600!important}
.settingsIndex,.settingsDetail{width:min(920px,100%);margin:clamp(34px,6vh,72px) auto 60px}
.settingsIndex .pageheading,.settingsDetailHeading{margin-bottom:28px}
.settingsIndex .pageheading h1,.settingsDetailHeading h1{font:600 clamp(36px,5vw,52px)/1.08 var(--editorial-sans)!important;letter-spacing:-.045em!important}
.settingsIndex .pageheading p,.settingsDetailHeading p{max-width:58ch;font-size:14px;margin-top:9px}
.settingsSearch{height:48px;display:flex;align-items:center;gap:12px;padding:0 16px;margin:28px 0 24px;border:0!important;border-radius:14px!important;background:var(--glass)!important;color:var(--muted);font-size:18px}
.settingsSearch:focus-within{box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 28%,transparent)!important}
.settingsSearch input{width:100%;border:0!important;outline:0!important;background:transparent!important;color:var(--text)!important;padding:8px 0!important;box-shadow:none!important;font-size:14px}
.settingsCatalog{border-top:1px solid var(--line)}
.settingsNoResults{padding:24px 14px;color:var(--muted);font-size:13px}
.settingsItem{width:100%;display:grid;grid-template-columns:54px minmax(0,1fr) 32px;gap:14px;align-items:center;text-align:left;padding:17px 14px;border:0!important;border-bottom:1px solid var(--line)!important;border-radius:0!important;background:transparent;color:var(--text);transition:background .2s ease,padding .2s ease,transform .18s ease}
.settingsItem:hover{background:var(--soft)!important;padding-left:19px}
.settingsItem>span:nth-child(2){display:grid;gap:4px}.settingsItem b{font-size:16px;font-weight:550;letter-spacing:-.015em}.settingsItem small{font-size:11px;color:var(--muted)}
.settingsIndexNo,.eyebrow{font:500 10px/1 var(--editorial-sans);letter-spacing:.1em;color:var(--muted);font-variant-numeric:tabular-nums}
.settingsItem i{justify-self:end;font-style:normal;font-size:16px;color:var(--muted);transition:transform .18s ease,color .18s ease}.settingsItem:hover i{transform:translate(2px,-2px);color:var(--text)}
.settingsBack{display:inline-flex;align-items:center;gap:10px;margin:0 0 32px;padding:8px 0;border:0!important;background:transparent!important;color:var(--muted)!important;font-size:12px;transition:color .18s ease,transform .18s ease}
.settingsBack:hover{color:var(--text)!important;transform:translateX(-2px)}.settingsBack span{font-size:19px;line-height:1}
.settingsDetailHeading{padding-bottom:20px;border-bottom:1px solid var(--line)}.settingsDetailHeading .eyebrow{display:block;margin-bottom:13px}
.settingsPageContent{min-height:180px}.settingsPage[hidden]{display:none!important}.settingsEnter{animation:settingsEnter .24s ease-out both}
@keyframes settingsEnter{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
.settingscard,.settingsInfoCard{max-width:760px;margin:18px 0;padding:24px 26px!important;border:0!important;border-radius:16px!important;background:var(--glass)!important;box-shadow:none!important;backdrop-filter:blur(18px) saturate(135%);-webkit-backdrop-filter:blur(18px) saturate(135%)}
.settingscard h2,.settingsInfoCard h2{font:600 18px/1.25 var(--editorial-sans)!important;letter-spacing:-.02em!important;margin:0 0 17px!important}
.settingscard>p,.settingsInfoCard>p{font-size:13px;line-height:1.6;color:var(--muted)}
.settingsInfoRow{min-height:54px;display:grid;grid-template-columns:minmax(120px,.8fr) minmax(0,1.2fr);gap:16px;align-items:center;border-bottom:1px solid var(--line);font-size:13px}
.settingsInfoRow:first-of-type{border-top:1px solid var(--line)}.settingsInfoRow span{color:var(--muted)}.settingsInfoRow strong{text-align:right;font-weight:500;overflow-wrap:anywhere;color:var(--text)}
.settingsInfoCard>.secondary{margin-top:18px}
.settingsDetail .settingscard input,.settingsDetail .settingscard select{max-width:560px}
.settingsDetail .settingscard select[size="5"]{height:160px}
button{transition:background .18s ease,color .18s ease,border-color .18s ease,transform .18s ease}
button:active{transform:scale(.985)}
@media(max-width:720px){.settingsIndex,.settingsDetail{margin:28px auto 48px}.settingsIndex .pageheading,.settingsDetailHeading{margin-bottom:20px}.settingsSearch{margin:21px 0 16px}.settingsItem{grid-template-columns:32px minmax(0,1fr) 22px;padding:15px 8px;gap:10px}.settingsItem:hover{padding-left:12px}.settingscard,.settingsInfoCard{padding:19px 16px!important;margin:12px 0}.settingsInfoRow{grid-template-columns:minmax(94px,.7fr) minmax(0,1.3fr);gap:10px;font-size:12px}.settingsBack{margin-bottom:23px}}
@media(prefers-reduced-motion:reduce){.settingsEnter{animation:none!important}.settingsItem,.settingsBack,button{transition:none!important}}

.themeChoices{border:0;padding:0;margin:18px 0 22px}.themeChoices legend{font-size:11px;color:var(--muted);margin-bottom:9px}.themeChoices>label{display:inline-flex;position:relative;margin-right:10px;cursor:pointer}.themeChoices input{position:absolute;opacity:0;inset:0;width:100%;height:100%;cursor:pointer}.themeChoices span{display:inline-flex;min-width:98px;justify-content:center;padding:11px 16px;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--text);transition:background .18s,color .18s,transform .18s}.themeChoices input:checked+span{background:var(--text);color:var(--bg)}.themeChoices input:focus-visible+span{outline:2px solid var(--accent);outline-offset:3px}.themeChoices label:active span{transform:scale(.97)}.demobanner:not([hidden]){display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 0;border-bottom:1px solid var(--line);font-size:12px;color:var(--muted)}.demobanner button{border:0;background:transparent;color:var(--text);text-decoration:underline;text-underline-offset:4px;padding:8px 0}.settingsPageFamily .settingsInfoCard p{max-width:600px}.settingsPageFamily .footnote{padding:14px;border-left:2px solid var(--accent);background:var(--soft)}#signupProfileFields[hidden]{display:none}.settingscard fieldset label{color:var(--text);letter-spacing:0}@media(max-width:600px){.themeChoices>label{margin:0 7px 8px 0}.themeChoices span{min-width:82px;padding:10px}}

/* Compact account menu and profile editing */
.headeractions{position:relative}.profileMenu{position:absolute;z-index:120;right:2px;top:calc(100% + 10px);min-width:170px;padding:7px;border:1px solid var(--line);border-radius:15px;background:var(--glass-strong);box-shadow:var(--shadow);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);animation:profileMenuIn .16s ease-out}.profileMenu[hidden]{display:none}.profileMenu button{display:block;width:100%;padding:10px 12px;border:0;border-radius:9px;background:transparent;color:var(--text);text-align:left;font-size:12px;transition:background .15s,transform .15s}.profileMenu button:hover,.profileMenu button:focus-visible{background:var(--soft);transform:translateX(2px);outline:none}.profileMenu [data-profile-action=logout]{color:#d17b75}@keyframes profileMenuIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}#profileFormHost{max-width:680px;margin-top:26px}#profileFormHost #profileForm{display:grid;gap:16px;max-width:100%}#profileFormHost #profileForm>label{display:grid;gap:8px}#profileFormHost #profilePreview{width:88px;height:88px;min-width:88px;border-radius:50%!important;overflow:hidden;margin:5px 0 8px}#profileFormHost #profileColor{width:46px!important;height:46px!important;padding:4px!important;border:1px solid var(--line)!important;border-radius:50%!important;background:var(--glass)!important;cursor:pointer;overflow:hidden}#profileFormHost #profileColor::-webkit-color-swatch-wrapper{padding:0;border-radius:50%}#profileFormHost #profileColor::-webkit-color-swatch{border:0;border-radius:50%}#profileFormHost #profileColor::-moz-color-swatch{border:0;border-radius:50%}#profileFormHost .compactSave{justify-self:start;min-width:0;width:auto!important;height:38px;margin:5px 0 0!important;padding:0 22px!important;border-radius:999px!important;font-size:10px!important;letter-spacing:.08em}#profileFormHost .photoActions{margin:0 0 4px}#profileFormHost #profileEmail{margin-bottom:8px}.settingsPageProfile .settingsInfoCard{max-width:680px}#profileFormHost .fieldhint{color:var(--muted);font-size:10px}@media(prefers-reduced-motion:reduce){.profileMenu{animation:none}}

/* Signed-out entrance: keep the Dots visual identity, without exposing the workspace */
body.authRequired{background:#000!important;overflow:hidden}body.authRequired>aside,body.authRequired>main{display:none!important}#signedOutLanding{display:none}body.authRequired #signedOutLanding{position:fixed;inset:0;z-index:1000;display:flex;flex-direction:column;justify-content:space-between;padding:clamp(24px,5vw,62px);background:#000;color:#f5f5f7;overflow:auto}body.authRequired #signedOutLanding .signedOutBrand{display:inline-flex;align-items:center;gap:13px;width:max-content;color:#f5f5f7;text-decoration:none;font-size:30px;font-weight:620;letter-spacing:-.055em}body.authRequired #signedOutLanding .signedOutBrand svg{width:19px;height:40px;fill:#aaa1ff}body.authRequired #signedOutLanding .signedOutMessage{width:min(580px,100%);margin:auto;align-self:center;padding:78px 0 90px;animation:signedIn .4s ease-out}body.authRequired #signedOutLanding .eyebrow{color:#9c95ac;font-size:10px;letter-spacing:.18em}body.authRequired #signedOutLanding h1{margin:19px 0;font-size:clamp(44px,8vw,86px);line-height:.98;letter-spacing:-.075em;font-weight:620}body.authRequired #signedOutLanding h1 span{color:#9f96b9;font-weight:420}body.authRequired #signedOutLanding p{color:#93919d;font-size:14px;line-height:1.65;margin:22px 0 30px}body.authRequired #signedOutLanding .signedOutActions{display:flex;align-items:center;gap:22px}body.authRequired #signedOutLanding .signedOutActions .primary{border-radius:999px!important;min-width:120px;padding:13px 23px;font-size:11px}body.authRequired #signedOutLanding .signedOutCreate{border:0;background:none;color:#eeedf2;padding:11px 2px;font-size:11px;cursor:pointer}body.authRequired #signedOutLanding .signedOutCreate span{color:#aaa1ff;margin-left:8px}body.authRequired #signedOutLanding .signedOutFoot{color:#66636f;font-size:10px;letter-spacing:.06em}body.authRequired dialog[open]{z-index:1200}@keyframes signedIn{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}#profileButton,.avatar,#profilePreview{border-radius:50%!important;overflow:hidden;aspect-ratio:1}#profileButton img,#profilePreview img{width:100%;height:100%;display:block;object-fit:cover;border-radius:50%!important}.avatar.large,#profilePreview{border-radius:50%!important}@media(max-width:600px){body.authRequired #signedOutLanding{padding:25px 23px max(25px,env(safe-area-inset-bottom))}body.authRequired #signedOutLanding .signedOutMessage{padding:42px 0 55px}body.authRequired #signedOutLanding h1{font-size:clamp(44px,13vw,68px)}}@media(prefers-reduced-motion:reduce){body.authRequired #signedOutLanding .signedOutMessage{animation:none}}

.profileWizard{margin:18px 0 7px;min-width:0}.profileWizard[hidden]{display:none!important}.profileWizardMeta{display:flex;align-items:center;gap:12px;margin:4px 0 21px;color:var(--muted);font-size:9px;letter-spacing:.12em}.profileWizardTrack{height:2px;flex:1;background:var(--line);overflow:hidden}.profileWizardTrack i{display:block;height:100%;width:25%;background:var(--accent);transition:width .3s ease}.profileStepPrompt{font-size:23px!important;color:var(--text)!important;margin:0 0 18px!important;letter-spacing:-.03em}.profileWizard label:not(.togglelabel){display:grid;gap:8px}.profileWizardBack{margin-top:16px;padding:7px 0;background:transparent;border:0;color:var(--muted);font-size:11px;cursor:pointer}.familyStepTitle{font-size:13px;color:var(--text);margin:0 0 14px}.profileWizardStepIn{animation:profileStepIn .24s ease both}@keyframes profileStepIn{from{opacity:0;transform:translateX(8px)}to{opacity:1;transform:translateX(0)}}#authForm>.oauth[hidden],#authForm>.authswitch[hidden],#authForm>label[hidden]{display:none!important}#signupProfileFields[hidden]{display:none!important}@media(prefers-reduced-motion:reduce){.profileWizardStepIn{animation:none!important}.profileWizardTrack i{transition:none}}

/* Keep the habit editor readable above its page instead of letting the page show through. */
#habitDialog{background:var(--bg)!important;opacity:1!important;border:1px solid var(--line)!important;box-shadow:0 24px 80px rgba(0,0,0,.48)!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
dialog::backdrop{background:rgba(0,0,0,.72)!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
:root[data-theme=light] #habitDialog{background:#fff!important}
@media(max-width:720px){#habitDialog{background:var(--bg)!important} :root[data-theme=light] #habitDialog{background:#fff!important}}
