/* Home visual layer. No layout order, navigation or interaction changes. */
#page-today{--home-lilac:#7560b4;--home-rose:#bd5b86;--home-coral:#bb5248;--home-mint:#258164;--home-edge:#e9e4ef;--home-tint:#f8f5fb;--home-shadow:0 8px 30px #493d6c07,0 1px 3px #493d6c04}
#mobileHome .m-welcome{padding:10px 2px 4px;align-items:center}
#mobileHome .m-welcome h1{letter-spacing:-.6px;line-height:1.65}
#mobileHome .m-welcome p{line-height:1.9}
#mobileHome .m-welcome time{padding:9px 12px;background:var(--m-surface);border:1px solid var(--home-edge);border-radius:14px;line-height:1.7;flex-shrink:0}
#mobileHome .m-card{border-color:var(--home-edge);border-radius:25px;box-shadow:var(--home-shadow);background:linear-gradient(165deg,color-mix(in srgb,var(--home-accent,var(--home-lilac)) 4%,var(--m-surface)),var(--m-surface) 35%);border-top:3px solid color-mix(in srgb,var(--home-accent,var(--home-lilac)) 55%,var(--m-surface))}
#mobileHome .m-home-plan{--home-accent:var(--home-lilac)}
#mobileHome .m-home-steps{--home-accent:var(--home-coral)}
#mobileHome .m-home-habits{--home-accent:var(--home-mint)}
#mobileHome .m-home-trend{--home-accent:var(--home-rose)}
#mobileHome .m-head{margin-bottom:17px;gap:10px}
#mobileHome .m-head h2{display:flex;align-items:center;gap:10px;line-height:1.7;min-width:0}
#mobileHome .m-heading-icon{display:grid;place-items:center;width:40px;height:40px;flex:0 0 40px;border-radius:14px;color:var(--home-accent);background:color-mix(in srgb,var(--home-accent) 12%,var(--m-surface));box-shadow:inset 0 1px 0 #ffffff70;font-size:23px}
#mobileHome .m-head>.m-link{color:var(--home-accent);white-space:nowrap;font-weight:600;padding-inline:8px}
#mobileHome .m-row{border-bottom:1px solid color-mix(in srgb,var(--home-accent) 9%,var(--m-surface));padding-block:16px}
#mobileHome .m-check{border-radius:14px;background:var(--m-surface);border-color:color-mix(in srgb,var(--home-accent) 26%,var(--m-surface));color:var(--home-accent);box-shadow:0 2px 5px #47396504}
#mobileHome .m-done .m-check{background:color-mix(in srgb,var(--home-mint) 12%,var(--m-surface));border-color:transparent;color:var(--home-mint)}
#mobileHome .m-time{font-variant-numeric:tabular-nums;font-size:13px;border-radius:10px;background:color-mix(in srgb,var(--home-accent) 7%,var(--m-surface));padding:5px 8px;color:var(--home-accent)}
#mobileHome .m-copy small{font-size:13px;margin-top:3px}
#mobileHome .m-icon{width:46px;height:46px;flex-basis:46px;border-radius:16px;background:color-mix(in srgb,var(--domain,var(--home-accent)) 12%,var(--m-surface));box-shadow:inset 0 1px 0 #ffffff60;font-size:26px}
#mobileHome .m-secondary{border-radius:13px;min-height:46px;border-color:color-mix(in srgb,var(--home-accent,var(--home-lilac)) 17%,var(--m-surface));background:color-mix(in srgb,var(--home-accent,var(--home-lilac)) 6%,var(--m-surface));color:var(--home-accent,var(--home-lilac));font-weight:600}
#mobileHome .m-step .m-secondary{background:color-mix(in srgb,var(--domain) 10%,var(--m-surface));border-color:color-mix(in srgb,var(--domain) 20%,var(--m-surface));color:var(--domain)}
#mobileHome .m-meter{height:6px;background:color-mix(in srgb,var(--domain) 10%,var(--m-surface));margin-top:10px}
#mobileHome .m-meter i{background:linear-gradient(90deg,color-mix(in srgb,var(--domain) 65%,#fff),var(--domain))}
#mobileHome .m-trend-tabs{display:flex;background:var(--home-tint);border:1px solid var(--home-edge);padding:4px;border-radius:14px;gap:4px}
#mobileHome .m-trend-tabs button{flex:1;min-height:44px;background:transparent;border-radius:10px;padding:6px 8px}
#mobileHome .m-trend-tabs button[aria-pressed=true]{background:var(--m-surface);box-shadow:0 2px 7px #493d6c0c;color:var(--domain);font-weight:700}
#mobileHome .m-week{padding-inline:8px;margin-top:12px;background:repeating-linear-gradient(to top,transparent 0,transparent 31px,color-mix(in srgb,var(--home-edge) 55%,transparent) 32px);border-bottom:1px solid var(--home-edge)}
#mobileHome .m-day i{max-width:26px;border-radius:8px 8px 3px 3px;background:linear-gradient(to top,var(--domain),color-mix(in srgb,var(--domain) 65%,#fff))}
#mobileHome .m-day b{font-weight:700}
#mobileHome .m-muted{font-size:13px}
#mobileHome .m-utilities{gap:10px}
#mobileHome .m-utilities button{background:var(--m-surface);border:1px solid var(--home-edge);color:var(--m-secondary);box-shadow:0 3px 12px #493d6c04;display:flex;align-items:center;justify-content:center;gap:8px}
#mobileHome .m-utilities i{font-size:22px;color:var(--home-lilac)}
#page-today .island-preview{box-shadow:var(--home-shadow);border-radius:25px}
#mobileHome button{transition:background-color 140ms ease,border-color 140ms ease,box-shadow 140ms ease}
#mobileHome button:disabled{opacity:.55}
@media(hover:hover){#mobileHome .m-secondary:hover,#mobileHome .m-check:hover{background:color-mix(in srgb,var(--home-accent,var(--home-lilac)) 13%,var(--m-surface));border-color:color-mix(in srgb,var(--home-accent,var(--home-lilac)) 40%,var(--m-surface))}#mobileHome .m-step .m-secondary:hover{background:color-mix(in srgb,var(--domain) 17%,var(--m-surface))}}
:root[data-theme=dark] #page-today{--home-lilac:#c1aff5;--home-rose:#e6a5c4;--home-coral:#f3a598;--home-mint:#88d7b9;--home-edge:#3a3b4d;--home-tint:#242535;--home-shadow:0 8px 28px #00000012}
:root[data-theme=dark] #mobileHome .m-heading-icon,:root[data-theme=dark] #mobileHome .m-icon{box-shadow:none}
@media(max-width:700px){#mobileHome .m-card{padding:18px;border-radius:22px}#mobileHome .m-welcome{gap:10px;align-items:flex-start}#mobileHome .m-welcome h1{font-size:23px}#mobileHome .m-welcome time{padding:7px 9px;font-size:11px;margin-top:5px}#mobileHome .m-heading-icon{width:36px;height:36px;flex-basis:36px;border-radius:12px;font-size:21px}#mobileHome .m-head h2{font-size:17px;gap:8px}#mobileHome .m-head>.m-link{font-size:12px;padding-inline:4px}#mobileHome .m-time{padding:5px;font-size:12px}}
@media(max-width:360px){#mobileHome .m-welcome{flex-wrap:wrap}#mobileHome .m-welcome time{margin:0}#mobileHome .m-head h2{font-size:16px}#mobileHome .m-card{padding:16px}}
@media(prefers-reduced-motion:reduce){#mobileHome button{transition:none}}