*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:var(--text)}
:root{--bg:#eef4f8;--panel:#fff;--primary:#246b8f;--primary2:#164c68;--accent:#dceef7;--text:#17212b;--muted:#637381;--success:#2e7d4f;--warning:#a66b00;--danger:#b83b3b;--shadow:0 5px 20px rgba(0,0,0,.09);--radius:18px}
html[data-theme="warm"]{--bg:#f7f2e8;--primary:#8a5b36;--primary2:#5e3d25;--accent:#efe0cf}
html[data-theme="dark"]{--bg:#111820;--panel:#1c2732;--primary:#4d9bc2;--primary2:#367b9e;--accent:#233b49;--text:#f5f7f9;--muted:#b6c1ca}
html[data-theme="high-contrast"]{--bg:#000;--panel:#111;--primary:#ffdf00;--primary2:#ffdf00;--accent:#222;--text:#fff;--muted:#fff}
button{font:inherit;cursor:pointer}.app-shell{min-height:100vh}.topbar{height:118px;padding:20px 34px;display:flex;align-items:center;justify-content:space-between;background:var(--panel);box-shadow:var(--shadow);position:relative;z-index:2}
.day-date{font-size:29px;font-weight:800;text-transform:uppercase;letter-spacing:.02em}.greeting{font-size:20px;color:var(--muted);margin-top:7px}.clock{font-size:52px;font-weight:800;white-space:nowrap}
.board-grid{display:grid;grid-template-columns:260px minmax(520px,1fr) 510px;gap:22px;padding:22px;min-height:calc(100vh - 118px)}
.side-nav{display:flex;flex-direction:column;gap:12px}.nav-btn{min-height:76px;border:0;border-radius:var(--radius);background:var(--panel);color:var(--text);box-shadow:var(--shadow);font-size:22px;font-weight:700;text-align:left;padding:0 22px;display:flex;align-items:center;gap:16px}.nav-btn span{font-size:27px;width:34px;text-align:center}.nav-btn.active{background:var(--primary);color:white;transform:translateX(5px)}.nav-btn.help{margin-top:auto}
.content,.calendar-panel{background:var(--panel);border-radius:var(--radius);box-shadow:var(--shadow);padding:26px;overflow:hidden}.module{display:none}.module.active{display:block;animation:panelIn .2s ease-out}.section-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}.section-heading h1{font-size:34px;margin:0}.section-heading p{color:var(--muted);font-size:18px;margin:7px 0 0}.summary-pill{background:var(--accent);padding:12px 17px;border-radius:999px}.task-list{display:flex;flex-direction:column;gap:14px}.task-card{border:2px solid transparent;border-left:8px solid var(--warning);border-radius:15px;padding:18px;display:grid;grid-template-columns:100px 1fr auto;gap:14px;align-items:center;background:var(--bg)}.task-card.status-completed{border-left-color:var(--success);opacity:.8}.task-card.status-missed{border-left-color:var(--danger)}.task-person{font-weight:800;text-transform:uppercase;color:var(--primary)}.task-main h2{font-size:22px;margin:0 0 5px}.task-main p{margin:0;color:var(--muted)}.task-card time{font-size:20px;font-weight:800}.task-actions{grid-column:2/4;display:flex;gap:10px}.task-actions button{border:1px solid #cbd5dc;background:var(--panel);color:var(--text);border-radius:10px;padding:10px 15px;font-weight:700}.task-actions .complete{background:var(--success);color:white;border-color:transparent}.empty-card{padding:35px;border-radius:15px;background:var(--bg);text-align:center}.placeholder{text-align:center;padding-top:100px}.placeholder.active{display:block}.big-icon{font-size:70px}.placeholder h1{font-size:40px;margin:15px}.placeholder p{font-size:21px;color:var(--muted)}.coming{display:inline-block;margin-top:20px;padding:12px 18px;background:var(--accent);border-radius:999px}
.calendar-head{display:flex;justify-content:space-between;align-items:center}.calendar-head h2{font-size:27px}.calendar-head button{border:0;background:var(--accent);color:var(--text);width:48px;height:48px;border-radius:50%;font-size:34px}.weekdays,.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:7px}.weekdays{font-weight:800;color:var(--muted);text-align:center;margin:16px 0 8px}.calendar-day{aspect-ratio:1;border:0;border-radius:12px;background:transparent;color:var(--text);font-size:19px;font-weight:700}.calendar-day:hover{background:var(--accent)}.calendar-day.today{background:var(--primary);color:white}.calendar-day.other{opacity:.25}.calendar-day.selected{outline:3px solid var(--primary)}.today-info{margin-top:26px;border-top:1px solid #d9e1e6;padding-top:20px}.today-info h3{font-size:23px;margin:0 0 16px}.today-info div{font-size:18px;padding:9px 0;display:flex;gap:10px}.today-info strong{margin-left:auto}
@keyframes panelIn{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:none}}html[data-motion="reduced"] *{animation:none!important;transition:none!important}
@media(max-width:1200px){.board-grid{grid-template-columns:210px 1fr}.calendar-panel{grid-column:2}.nav-btn{font-size:18px}.content{min-height:600px}}
@media(max-width:760px){.topbar{height:auto;padding:16px 18px}.day-date{font-size:18px}.greeting{font-size:14px}.clock{font-size:28px}.board-grid{display:block;padding:10px}.side-nav{display:grid;grid-template-columns:repeat(4,1fr);margin-bottom:10px}.nav-btn{min-height:68px;padding:8px;justify-content:center;text-align:center;font-size:12px;display:flex;flex-direction:column;gap:2px}.nav-btn span{font-size:20px}.nav-btn.active{transform:none}.content,.calendar-panel{padding:16px;margin-bottom:10px}.calendar-panel{display:block}.task-card{grid-template-columns:75px 1fr}.task-card time{grid-column:2}.task-actions{grid-column:1/3;flex-wrap:wrap}.section-heading{align-items:flex-start}.section-heading h1{font-size:28px}.summary-pill{font-size:12px}}

/* CareBoard brand treatment */
.topbar{display:grid;grid-template-columns:1fr auto 1fr}
.topbar>div:last-child{justify-self:end}
.brand-mark{justify-self:center;display:flex;align-items:center;gap:13px;user-select:none}
.care-heart{position:relative;width:56px;height:50px;filter:drop-shadow(0 3px 4px rgba(0,0,0,.10));animation:heartIntro .7s ease-out 1}
.care-heart:before,.care-heart:after{content:"";position:absolute;top:6px;width:31px;height:44px;border-radius:30px 30px 7px 7px;background:#e95067}
.care-heart:before{left:28px;transform:rotate(45deg);transform-origin:0 100%}
.care-heart:after{left:0;transform:rotate(-45deg);transform-origin:100% 100%}
.care-heart span{position:absolute;z-index:2;color:white;font-size:27px;font-weight:900;left:17px;top:12px}
.brand-name{font-size:39px;font-weight:800;letter-spacing:-1.5px;color:var(--primary2)}
.brand-name span{font-weight:500}
@keyframes heartIntro{0%{transform:scale(.82)}35%{transform:scale(1.08)}65%{transform:scale(.96)}100%{transform:scale(1)}}
html[data-motion="reduced"] .care-heart{animation:none}
@media(max-width:900px){.brand-mark{display:none}}

/* v0.2 visual direction */
:root{
 --bg:#f3f7fb;--panel:#fff;--primary:#126fd6;--primary2:#06336a;
 --accent:#e6f1ff;--text:#082454;--muted:#64748b;--success:#16845b;
 --mint:#effaf5;--lavender:#f2ebff;--sky:#eaf4ff;
 --shadow:0 5px 20px rgba(34,70,110,.08);--radius:20px
}
body{font-family:"Trebuchet MS","Segoe UI",Arial,sans-serif}
.topbar{min-height:132px;height:auto;padding:18px 30px;border-bottom:1px solid #e5edf5}
.day-date{color:var(--text);font-size:27px}.greeting{color:#72819a}
.brand-mark{gap:13px}
.heart-logo{width:68px;height:63px;animation:heartIntro .75s ease-out 1;filter:drop-shadow(0 3px 4px rgba(10,73,121,.12))}
.heart-logo svg{width:100%;height:100%;overflow:visible}
.heart-fill{fill:#ff4964}
.heart-swoosh{fill:none;stroke:#0878a9;stroke-width:8;stroke-linecap:round}
.brand-copy{text-align:center}
.brand-name{font-family:"Trebuchet MS","Segoe UI",sans-serif;font-size:41px;font-style:italic;font-weight:800;letter-spacing:-2px;color:#082454;line-height:1}
.brand-name span{color:#0878a9;font-weight:700}
.brand-tagline{font-family:"Segoe UI",Arial,sans-serif;font-size:10px;letter-spacing:2px;margin-top:8px;color:#17375f;font-weight:700}
.brand-tagline b{color:#ff4964;padding:0 3px}
.time-block{display:flex;align-items:center;justify-self:end;gap:13px}
.time-icon{font-size:42px;color:#0878a9;transform:scaleX(1.08)}
.clock{font-size:43px;color:#082454;line-height:1}
.time-caption{font-size:15px;font-style:italic;color:#65758d;margin-top:7px;text-align:right}
.time-caption span{color:#ff4964}
.board-grid{grid-template-columns:245px minmax(520px,1fr) 475px;background:#f5f8fb}
.side-nav{background:#f0f6fd;border-radius:20px;padding:13px}
.nav-btn{box-shadow:none;background:transparent;color:#66758d;border-radius:14px;min-height:70px}
.nav-btn.active{background:#dcecff;color:#126fd6;transform:none}
.nav-btn span{filter:none}
.content,.calendar-panel{border:1px solid #e7edf4;box-shadow:0 4px 15px rgba(38,73,110,.05)}
.section-heading h1,.calendar-head h2,.today-info h3{color:#082454}
.summary-pill{background:#e6f4fb;color:#0b4268}
.task-card{background:#fbfdfd;border:1px solid #e6edf1;border-left:7px solid #8d6ad9}
.task-card:nth-child(3n+1){border-left-color:#29a979}
.task-card:nth-child(3n+2){border-left-color:#3c82e0}
.task-person{color:#0878a9}
.task-actions button{border-color:#dbe6ef}
.task-actions .complete{background:#16845b}
.calendar-day.today{background:#126fd6}
.calendar-head button{background:#eaf4ff;color:#126fd6}
@media(max-width:900px){.brand-mark{display:none}.time-icon,.time-caption{display:none}}