
/* PepSimple Ultra V11 visual foundation — approved reference styling.
   Presentation only: no entitlement, checkout, or protocol logic changes. */
:root { --navy:#071b33; --mint:#087af5; --line:#d8e6f4; --ink:#081b35; --muted:#657b92; }
#todayScreen,#protocolsScreen,#calendarScreen,#historyScreen,#moreScreen {
 background:linear-gradient(160deg,#f8fbff 0%,#eef7ff 100%);
 color:#0a1c35;
}
.today-brand.brand-lockup {display:flex;align-items:center;gap:10px}
.today-brand .brand-word {font-weight:900;letter-spacing:-.045em}
.today-brand .brand-word span {color:#0787ee}
.summary-card,.month-card,.history-card,.active-card,.more-list,.profile-card {
 background:#fff;border:1px solid #d6e5f4;
 box-shadow:0 6px 18px rgba(15,80,145,.075);
 border-radius:21px;
}
.dose-card,.cal-dose {
 background:linear-gradient(110deg,#f1f8ff,#e6f3ff);
 border:1px solid #d2e5f6;
 border-radius:20px;
}
.dose-card.completed {background:linear-gradient(110deg,#e7f5ff,#dcefff)}
.dose-check.done {background:#087af5;border-color:#087af5}
.dose-meridiem.am {background:#d8eeff;color:#0865ad}
.dose-meridiem.pm {background:#fff0ce;color:#9b640d}
.progress>div {background:linear-gradient(90deg,#0868ee,#13b7f4)}
.nav-item.active {color:#006fec}
.nav-item.active .nav-icon {color:#006fec}
.month-arrow {background:#e6f3ff;color:#006fea}
.day.selected span {background:#056ef1;border-radius:12px}
.more-row {min-height:66px}
.more-icon {background:#e8f4ff;color:#087af5}
@media (max-width:699px) {
 .bottom-nav {bottom:0;width:100%;max-width:480px;min-height:77px;
   padding:9px 5px max(9px,env(safe-area-inset-bottom));
   border-top:1px solid #d5e5f3;box-shadow:0 -4px 16px rgba(9,48,87,.045)}
 .nav-icon {font-size:25px}
 .nav-item {font-size:11px}
 .hello,.protocol-title,.calendar-title,.history-title,.more-title {font-size:29px}
}
