/* The Launch Era — dashboard home v2
   Mobile-first dashboard navigation and clarity pass. */

.dashboard-quick-access{margin:0 0 20px}
.dashboard-section-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:0 2px 12px}
.dashboard-section-head h3{margin:0;color:#191919;font-size:20px;line-height:1.1;letter-spacing:-.03em}
.dashboard-section-link{border:0;background:transparent;color:#1479e6;padding:4px 0;font-size:12px;font-weight:900;white-space:nowrap}
.dashboard-quick-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.dashboard-quick-card{position:relative;min-width:0;min-height:132px;padding:16px;border:1px solid rgba(25,25,25,.06);border-radius:22px;background:#fff;color:#191919;text-align:left;display:grid;grid-template-rows:auto auto 1fr;align-content:start;gap:8px;box-shadow:0 8px 24px rgba(25,25,25,.035);transition:transform .18s ease,box-shadow .18s ease}
.dashboard-quick-card:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(25,25,25,.07)}
.dashboard-quick-card:active{transform:scale(.985)}
.dashboard-quick-card.quick-calendar{background:#EAF4FF}
.dashboard-quick-card.quick-booking{background:#EAF7F1}
.dashboard-quick-card.quick-customers{background:#FFF5D9}
.dashboard-quick-card.quick-money{background:#F2EEFF}
.dashboard-quick-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:rgba(255,255,255,.76);color:#191919}
.dashboard-quick-icon svg{width:21px;height:21px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.dashboard-quick-card strong{display:block;font-size:15px;line-height:1.1;letter-spacing:-.02em}
.dashboard-quick-card small{color:#66625C;font-size:11px;line-height:1.35}
.dashboard-quick-arrow{position:absolute;right:14px;bottom:14px;font-size:20px;font-weight:700;line-height:1;color:#4D4943}
.money-week-head{margin-top:2px}
.mobile-bottom-nav{display:none}

.attention-list.dashboard-attention-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.attention-list.dashboard-attention-grid .attention-summary-card{min-width:0;min-height:118px;padding:14px;border:1px solid #E7E2D9;border-radius:18px;background:#fff;color:#191919;display:grid;grid-template-columns:34px 1fr;grid-template-areas:"icon title" "icon count" "copy copy";align-content:start;gap:2px 10px;text-align:left}
.attention-list.dashboard-attention-grid .attention-summary-card:hover{border-color:#CBC5BA}
.attention-summary-icon{grid-area:icon;width:34px;height:34px;border-radius:11px;display:grid;place-items:center;font-weight:950}
.attention-bookings .attention-summary-icon{background:#EAF4FF;color:#1878D6}
.attention-quotes .attention-summary-icon{background:#F1EDFF;color:#7254D4}
.attention-invoices .attention-summary-icon{background:#E7F6EF;color:#159566}
.attention-summary-card strong{grid-area:title;min-width:0;font-size:12px;line-height:1.15}
.attention-summary-count{grid-area:count;font-size:28px;font-weight:950;line-height:1;letter-spacing:-.04em}
.attention-summary-card small{grid-area:copy;display:block;margin-top:8px;color:#757068;font-size:10px;line-height:1.35}

section.view[data-page="today"].active{display:flex;flex-direction:column}
section.view[data-page="today"] #firstWinCard{order:0}
section.view[data-page="today"] #todayHeroCard{order:1}
section.view[data-page="today"] .dashboard-quick-access{order:2}
section.view[data-page="today"] .attention-panel{order:3}
section.view[data-page="today"] .growth-grid{order:4}
section.view[data-page="today"] .money-week-head{order:5}
section.view[data-page="today"] #businessPulse{order:6}
section.view[data-page="today"] .next-move-panel{order:7}
section.view[data-page="today"] .growth-lower{order:8}
section.view[data-page="today"] .presence-panel{order:9}
.attention-panel{margin-bottom:20px}
.attention-panel .panel-head{margin-bottom:14px}
#businessPulse{margin-bottom:20px}

@media(max-width:860px){
  .main{padding:0 14px calc(104px + env(safe-area-inset-bottom))!important}
  .topbar{position:sticky;top:0;z-index:30;min-height:72px;margin:0 -14px 18px!important;padding:12px 14px!important;border-bottom:1px solid rgba(229,224,215,.9);background:rgba(250,248,243,.96)!important;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
  .topbar-title{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(42vw,220px);text-align:center;pointer-events:none}
  .topbar-title h1{margin:0!important;font-size:22px!important;line-height:1!important;font-weight:950;letter-spacing:-.04em}
  .global-search-shell,#languageBtn{display:none!important}
  .top-actions{margin-left:auto;gap:7px!important}
  .menu-toggle,.top-tool-btn{width:42px!important;min-width:42px!important;height:42px!important;min-height:42px!important;border:1px solid #E1DCD2!important;border-radius:50%!important;background:#fff!important;color:#191919!important;display:grid!important;place-items:center!important;padding:0!important;box-shadow:0 2px 8px rgba(25,25,25,.025)}
  .menu-toggle{font-size:0!important}
  .menu-toggle::before{content:"☰";font-size:22px;line-height:1}
  #quickAddBtn{width:46px!important;min-width:46px!important;height:46px!important;min-height:46px!important;padding:0!important;border:0!important;border-radius:50%!important;background:#191919!important;color:#fff!important;font-size:0!important}
  #quickAddBtn::before{content:"+";display:block;font-size:31px;line-height:42px;font-weight:500}
  #backBtn:not([hidden]){position:relative;z-index:2;width:42px!important;min-width:42px!important;height:42px!important;border-radius:50%!important;background:#fff!important}

  #todayHeroCard{margin-bottom:16px!important;padding:18px!important;border-radius:27px!important;box-shadow:0 10px 30px rgba(25,25,25,.055)}
  #todayHeroCard .hero-ecosystem{gap:10px!important}
  #todayHeroCard .hero-greeting-zone{padding:0!important}
  #todayHeroCard .hero-card-topline{min-height:58px;margin-bottom:8px}
  #todayHeroCard .today-clock{border-radius:16px!important}
  #todayHeroCard .today-clock-mark{display:none!important}
  #todayHeroCard .today-greeting-first h2,#todayHeroCard #todayGreeting{max-width:100%!important;margin:8px 0 10px!important;padding-right:0!important;font-size:clamp(34px,9.2vw,47px)!important;line-height:.96!important;letter-spacing:-.055em!important}
  #todayHeroCard #todayMomentCopy{max-width:100%!important;font-size:15px!important;line-height:1.42!important}
  #todayHeroCard #todayHeroAction{width:100%!important;min-height:58px!important;margin-top:16px!important;border-radius:18px!important;font-size:16px!important}
  #todayHeroCard .weather-brief{width:100%!important;margin-top:14px!important;padding:13px 14px!important;border-radius:18px!important}
  #todayHeroCard .weather-module-top{align-items:center!important}
  #todayHeroCard .weather-icon{width:42px!important;height:42px!important;flex-basis:42px!important;border-radius:13px!important}
  #todayHeroCard .weather-temp-row strong{font-size:28px!important}
  #todayHeroCard .weather-open-hint{width:36px!important;height:36px!important;flex-basis:36px!important}
  #todayHeroCard[data-celestial="night"]{background:linear-gradient(145deg,#173E58 0%,#164B67 62%,#15627B 100%)!important;border-color:rgba(255,255,255,.14)!important;color:#fff!important}
  #todayHeroCard[data-celestial="night"] #todayGreeting,#todayHeroCard[data-celestial="night"] #todayMomentCopy,#todayHeroCard[data-celestial="night"] #todayClockTime,#todayHeroCard[data-celestial="night"] #todayDatePill,#todayHeroCard[data-celestial="night"] #weatherTemp,#todayHeroCard[data-celestial="night"] #weatherCondition,#todayHeroCard[data-celestial="night"] #weatherHighLow,#todayHeroCard[data-celestial="night"] #weatherLocation{color:#fff!important}
  #todayHeroCard[data-celestial="night"] #todayMomentCopy,#todayHeroCard[data-celestial="night"] #weatherHighLow,#todayHeroCard[data-celestial="night"] #weatherLocation{opacity:.82}
  #todayHeroCard[data-celestial="night"] .weather-brief{background:rgba(7,28,43,.32)!important;border-color:rgba(255,255,255,.16)!important}
  #todayHeroCard[data-celestial="night"] .weather-open-hint,#todayHeroCard[data-celestial="night"] .weather-icon{background:rgba(255,255,255,.15)!important;border-color:rgba(255,255,255,.14)!important;color:#fff!important}
  #todayHeroCard[data-celestial="night"] .weather-business-note{background:rgba(226,244,255,.70)!important;border-color:rgba(255,255,255,.2)!important;color:#17384A!important}

  .dashboard-quick-access{margin:0 0 18px!important}
  .dashboard-section-head{margin:0 2px 10px!important}
  .dashboard-section-head h3{font-size:21px!important}
  .dashboard-quick-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:8px!important}
  .dashboard-quick-card{min-height:124px!important;padding:12px 10px!important;border-radius:19px!important;gap:7px!important}
  .dashboard-quick-icon{width:34px!important;height:34px!important;border-radius:11px!important}
  .dashboard-quick-card strong{font-size:13px!important}
  .dashboard-quick-card small{font-size:9px!important;line-height:1.25!important}
  .dashboard-quick-arrow{right:9px!important;bottom:10px!important;font-size:17px!important}

  .attention-panel{margin-bottom:18px!important;padding:16px!important;border-radius:22px!important;box-shadow:none!important}
  .attention-panel .panel-head{margin-bottom:12px!important}
  .attention-panel .panel-head h3{font-size:21px!important}
  .attention-list.dashboard-attention-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:7px!important}
  .attention-list.dashboard-attention-grid .attention-summary-card{min-height:126px!important;padding:11px!important;border-radius:16px!important;grid-template-columns:30px 1fr!important;gap:2px 7px!important}
  .attention-summary-icon{width:30px!important;height:30px!important;border-radius:10px!important;font-size:12px!important}
  .attention-summary-card strong{font-size:10px!important}
  .attention-summary-count{font-size:26px!important}
  .attention-summary-card small{margin-top:8px!important;font-size:9px!important;line-height:1.3!important}

  .growth-grid{margin-bottom:18px!important}
  .growth-grid .schedule-panel{padding:16px!important;border-radius:22px!important}
  .growth-grid .schedule-panel .panel-head{align-items:center!important;margin-bottom:12px!important}
  .growth-grid .schedule-panel .panel-head .eyebrow{display:none!important}
  .growth-grid .schedule-panel .panel-head h3{font-size:21px!important}
  .growth-grid .schedule-panel .text-btn{color:#1479e6!important;font-size:11px!important;white-space:nowrap}
  .growth-grid .capacity-card{display:none!important}
  .schedule-panel .timeline{gap:8px!important}
  .schedule-panel .timeline-item{grid-template-columns:68px minmax(0,1fr) auto!important;gap:10px!important;padding:12px!important;border-radius:15px!important;background:#fff!important}
  .schedule-panel .timeline-item time{font-size:12px!important}
  .schedule-panel .timeline-item>div:nth-child(2) strong{font-size:12px!important}
  .schedule-panel .timeline-item>div:nth-child(2) span{font-size:10px!important}
  .schedule-panel .today-job-actions{justify-items:end}
  .schedule-panel .today-job-actions .status{font-size:9px!important;padding:5px 7px!important}

  .money-week-head{margin:0 2px 10px!important}
  #businessPulse{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important;margin-bottom:18px!important}
  #businessPulse .pulse-card{min-width:0!important;min-height:122px!important;padding:15px!important;border:1px solid #DDE8F4!important;border-radius:18px!important;background:#EDF6FF!important;box-shadow:none!important}
  #businessPulse .pulse-card>span{font-size:10px!important;line-height:1.3!important}
  #businessPulse .pulse-card>strong{margin:7px 0 4px!important;font-size:27px!important;line-height:1!important}
  #businessPulse .pulse-card>small{font-size:9px!important;line-height:1.3!important}
  #businessPulse .pulse-jobs,#businessPulse .pulse-clients{display:none!important}

  section.view[data-page="today"] .next-move-panel,section.view[data-page="today"] .growth-lower{display:none!important}
  section.view[data-page="today"] .presence-panel{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:12px!important;
    margin:8px 0 18px!important;
    padding:14px!important;
    border-radius:20px!important;
    background:#fff!important;
    box-shadow:none!important;
  }
  section.view[data-page="today"] .presence-copy{max-width:none!important}
  section.view[data-page="today"] .presence-copy .eyebrow{display:none!important}
  section.view[data-page="today"] .presence-copy h3{margin:0 0 3px!important;font-size:16px!important}
  section.view[data-page="today"] .presence-copy>p:last-child{font-size:10px!important;line-height:1.35!important}
  section.view[data-page="today"] .presence-actions{grid-template-columns:repeat(2,minmax(0,1fr))!important;width:100%!important;gap:8px!important}
  section.view[data-page="today"] .presence-btn{min-height:54px!important;padding:9px 10px!important;border-radius:14px!important}
  section.view[data-page="today"] .presence-mark{width:30px!important;height:30px!important;min-width:30px!important;border-radius:10px!important;font-size:14px!important}
  section.view[data-page="today"] .presence-btn strong{font-size:11px!important}
  section.view[data-page="today"] .presence-btn small{font-size:9px!important}
  .app-legal-footer{
    display:block!important;
    margin-top:14px!important;
    padding:12px 0 8px!important;
    border-top:1px solid #E5E0D7!important;
  }

  .mobile-bottom-nav{position:fixed;left:0;right:0;bottom:0;z-index:35;display:grid!important;grid-template-columns:repeat(5,1fr);gap:2px;padding:8px 8px calc(8px + env(safe-area-inset-bottom));border-top:1px solid rgba(224,220,212,.95);background:rgba(255,255,255,.96);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 -8px 26px rgba(25,25,25,.05)}
  .mobile-bottom-item{min-width:0;min-height:56px;padding:6px 2px;border:0;border-radius:16px;background:transparent;color:#625E58;display:grid;place-items:center;align-content:center;gap:4px;font-size:10px;font-weight:800}
  .mobile-bottom-item svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
  .mobile-bottom-item.active{background:#EAF4FF;color:#0C5FAF}
  body.sidebar-is-open .mobile-bottom-nav{opacity:0;pointer-events:none}
}

@media(max-width:430px){
  .dashboard-quick-card{min-height:118px!important;padding:11px 8px!important}
  .dashboard-quick-card strong{font-size:12px!important}
  .dashboard-quick-card small{font-size:8.5px!important}
  .attention-list.dashboard-attention-grid .attention-summary-card{padding:10px 8px!important}
  .attention-summary-card strong{font-size:9px!important}
  .attention-summary-card small{font-size:8.5px!important}
}
@media(prefers-reduced-motion:reduce){.dashboard-quick-card{transition:none!important}}

/* Simpler primary navigation: only the four daily destinations stay visible. */
.simpler-primary-nav{display:grid;gap:5px}
.simpler-primary-nav>.nav-primary{
  min-height:46px;
  font-size:13px;
  font-weight:900;
}
.simpler-primary-nav>.nav-primary span{opacity:.72}
.simpler-primary-nav>.nav-more-group{
  margin-top:4px;
  border-top:1px solid rgba(25,25,25,.07);
  padding-top:5px;
}
.simpler-primary-nav>.nav-more-group>summary{font-weight:900}
@media(max-width:860px){
  .simpler-primary-nav>.nav-primary{min-height:48px}
  .simpler-primary-nav>.nav-more-group{margin-top:6px}
}


/* Tablet landscape — intentionally between mobile simplicity and desktop density. */
@media(min-width:861px) and (max-width:1100px){
  .app-shell{
    grid-template-columns:236px minmax(0,1fr)!important;
  }
  .sidebar{
    width:236px!important;
    padding:22px 14px!important;
  }
  .brand-row{margin-bottom:18px!important}
  .workspace-chip{
    margin-bottom:14px!important;
    padding:10px!important;
  }
  .simpler-primary-nav{gap:4px!important}
  .simpler-primary-nav>.nav-primary{
    min-height:44px!important;
    padding:10px 11px!important;
    font-size:12px!important;
  }
  .simpler-primary-nav>.nav-more-group>summary{
    min-height:42px!important;
    padding:10px 11px!important;
    font-size:12px!important;
  }
  .simpler-primary-nav .nav-group-items .nav-item{
    min-height:40px!important;
    padding:9px 10px!important;
    font-size:11px!important;
  }
  .trial-card{
    margin-top:14px!important;
    padding:13px!important;
  }
  .trial-card strong{font-size:12px!important}
  .trial-card p{font-size:10px!important}
  .sidebar-session-actions{
    margin-top:9px!important;
    padding-top:9px!important;
  }
  .sidebar-support-btn,
  .sidebar-logout-btn{
    min-height:40px!important;
    padding:9px 8px!important;
    font-size:11px!important;
  }

  .main{
    padding:0 24px 56px!important;
  }
  .topbar{
    padding:20px 0 15px!important;
    margin-bottom:20px!important;
  }
  .topbar h1{font-size:27px!important}
  .top-actions{gap:7px!important}
  .top-tool-btn{padding:8px 11px!important}
  #quickAddBtn{padding:10px 14px!important}

  #todayHeroCard{
    padding:27px!important;
    border-radius:27px!important;
  }
  #todayHeroCard .today-greeting-first h2,
  #todayHeroCard #todayGreeting{
    font-size:clamp(36px,4.2vw,46px)!important;
  }

  .dashboard-quick-grid{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:10px!important;
  }
  .dashboard-quick-card{
    min-height:126px!important;
    padding:14px!important;
    border-radius:20px!important;
  }
  .dashboard-quick-card strong{font-size:14px!important}
  .dashboard-quick-card small{font-size:10px!important}

  .attention-list.dashboard-attention-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:9px!important;
  }
  .attention-list.dashboard-attention-grid .attention-summary-card{
    min-height:112px!important;
    padding:12px!important;
  }

  .growth-grid{
    grid-template-columns:minmax(0,1.45fr) minmax(210px,.55fr)!important;
    gap:14px!important;
  }
  .growth-grid .panel{padding:19px!important}
  .dashboard-grid.lower{
    grid-template-columns:1fr!important;
  }
  .metric-grid{
    gap:10px!important;
  }
  .metric-card{
    padding:17px!important;
  }
  .metric-card strong{font-size:27px!important}

  .presence-panel{
    gap:14px!important;
    padding:19px!important;
  }
  .presence-actions{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    width:min(410px,100%)!important;
  }
  .presence-btn{
    min-width:0!important;
    padding:10px 11px!important;
  }
}


/* Mobile dashboard stability + navigation polish r12 */
#todayHeroCard.quarter-color-0,
#todayHeroCard.moment-morning{
  background:#F6EDBF!important;
}

/* Keep Today locked to the viewport width. This prevents the visual side-jump
   that can happen while weather/quick-access content finishes rendering. */
section.view[data-page="today"].active,
section.view[data-page="today"] #todayHeroCard,
section.view[data-page="today"] .dashboard-quick-access{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
  margin-left:0!important;
  margin-right:0!important;
}
section.view[data-page="today"].view-enter{
  animation:tleTodayFadeStable .16s ease-out both!important;
}
@keyframes tleTodayFadeStable{
  from{opacity:.55}
  to{opacity:1}
}

@media(max-width:860px){
  /* Leave the complete legal/footer area above the persistent mobile nav. */
  body.shell-app #appShell>.main{
    padding-bottom:calc(150px + env(safe-area-inset-bottom))!important;
  }
  body.shell-app .app-legal-footer{
    position:relative!important;
    z-index:1!important;
    margin-bottom:calc(32px + env(safe-area-inset-bottom))!important;
    padding-bottom:18px!important;
  }

  /* Nested sections use a real Back arrow; Home alone keeps the hamburger. */
  body.shell-app #backBtn:not([hidden]){
    display:grid!important;
    place-items:center!important;
    width:36px!important;
    min-width:36px!important;
    height:36px!important;
    min-height:36px!important;
    padding:0!important;
    border:1px solid rgba(25,25,25,.14)!important;
    border-radius:50%!important;
    background:#fff!important;
    color:#191919!important;
    font-size:0!important;
    box-shadow:none!important;
  }
  body.shell-app #backBtn:not([hidden])::before{
    content:"←"!important;
    font-size:20px!important;
    line-height:1!important;
    font-weight:800!important;
  }
  body.shell-app #menuToggle[hidden]{
    display:none!important;
  }

  /* Smaller, calmer mobile greeting. */
  section.view[data-page="today"] #todayHeroCard{
    padding:12px!important;
    margin-bottom:10px!important;
    border-radius:20px!important;
  }
  section.view[data-page="today"] #todayHeroCard .hero-ecosystem{
    gap:8px!important;
  }
  section.view[data-page="today"] #todayHeroCard .hero-card-topline{
    min-height:40px!important;
    margin-bottom:8px!important;
  }
  section.view[data-page="today"] #todayHeroCard .today-clock{
    padding:6px 8px!important;
    border-radius:12px!important;
  }
  section.view[data-page="today"] #todayHeroCard .today-clock-copy strong{
    font-size:12px!important;
  }
  section.view[data-page="today"] #todayHeroCard .today-clock-copy small{
    font-size:8px!important;
  }
  section.view[data-page="today"] #todayHeroCard .hero-sky-badge{
    width:46px!important;
    min-width:46px!important;
    height:38px!important;
  }
  section.view[data-page="today"] #todayHeroCard .today-greeting-first{
    margin-bottom:8px!important;
    gap:4px!important;
  }
  section.view[data-page="today"] #todayHeroCard #todayGreeting{
    max-width:100%!important;
    padding-right:0!important;
    margin:0!important;
    font-size:clamp(28px,8vw,34px)!important;
    line-height:.96!important;
    letter-spacing:-.05em!important;
  }
  section.view[data-page="today"] #todayHeroCard #todayMomentCopy{
    min-height:32px!important;
    margin:0!important;
    font-size:11px!important;
    line-height:1.35!important;
  }
  section.view[data-page="today"] #todayHeroCard #todayHeroAction{
    min-height:42px!important;
    margin:8px 0!important;
    border-radius:14px!important;
    font-size:12px!important;
  }
  section.view[data-page="today"] #todayHeroCard .hero-weather-compact,
  section.view[data-page="today"] #todayHeroCard .weather-brief{
    min-height:82px!important;
    box-sizing:border-box!important;
    padding:9px 10px!important;
    border-radius:14px!important;
    contain:layout paint;
  }
  section.view[data-page="today"] #todayHeroCard .hero-weather-compact .weather-temp-row>strong,
  section.view[data-page="today"] #todayHeroCard .hero-weather-compact.weather-no-icon .weather-temp-row>strong{
    font-size:27px!important;
  }
}

@media(max-width:430px){
  body.shell-app #backBtn:not([hidden]){
    width:34px!important;
    min-width:34px!important;
    height:34px!important;
    min-height:34px!important;
  }
  section.view[data-page="today"] #todayHeroCard #todayGreeting{
    font-size:clamp(27px,8vw,32px)!important;
  }
}


/* Navigation + dashboard logic polish r12 */
.dashboard-quick-grid{
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
}
.dashboard-quick-card.quick-weather{background:#E9F5FB}
.dashboard-quick-card.quick-services{background:#F7F1E5}
#weatherBrief.quick-focus{
  outline:3px solid rgba(82,174,236,.34)!important;
  outline-offset:3px!important;
  transition:outline-color .18s ease!important;
}

/* Softer morning yellow only when weather is clear/partly clear. */
#todayHeroCard.moment-morning[data-weather="clear"],
#todayHeroCard.moment-morning[data-weather="partly"],
#todayHeroCard.moment-morning[data-weather="none"],
#todayHeroCard.moment-morning:not([data-weather]){
  background:linear-gradient(145deg,#F7EFC8 0%,#F4E8B7 100%)!important;
}

/* Back is a real app control: nested pages always show it; Home shows menu. */
body.shell-app #backBtn:not([hidden]){
  display:grid!important;
  place-items:center!important;
  font-size:0!important;
  color:#191919!important;
}
body.shell-app #backBtn:not([hidden])::before{
  content:"←"!important;
  font-size:20px!important;
  line-height:1!important;
}
body.shell-app .topbar:has(#backBtn:not([hidden])) #menuToggle{
  display:none!important;
}

@media(max-width:860px){
  body.shell-app #appShell>.main,
  body.shell-app .main{
    padding-bottom:calc(142px + env(safe-area-inset-bottom))!important;
  }

  /* Quick access is a complete 2-column app launcher, not a clipped carousel. */
  .dashboard-quick-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:9px!important;
    overflow:visible!important;
  }
  .dashboard-quick-card{
    width:100%!important;
    min-height:104px!important;
    padding:11px 11px!important;
    border-radius:18px!important;
  }
  .dashboard-quick-card strong{font-size:13px!important}
  .dashboard-quick-card small{font-size:9.5px!important}
  .dashboard-quick-arrow{right:10px!important;bottom:9px!important}

  /* Greeting is compact and reserves weather space so loading cannot resize it abruptly. */
  #todayHeroCard{
    padding:14px!important;
    margin-bottom:12px!important;
    border-radius:24px!important;
  }
  #todayHeroCard .hero-card-topline{
    min-height:46px!important;
    margin-bottom:5px!important;
  }
  #todayHeroCard .today-greeting-first{
    margin-bottom:9px!important;
  }
  #todayHeroCard .today-greeting-first h2,
  #todayHeroCard #todayGreeting{
    margin:5px 0 7px!important;
    font-size:clamp(31px,8.3vw,39px)!important;
    line-height:.98!important;
  }
  #todayHeroCard #todayMomentCopy{
    font-size:12px!important;
    line-height:1.34!important;
  }
  #todayHeroCard #todayHeroAction{
    min-height:46px!important;
    margin-top:11px!important;
    margin-bottom:9px!important;
    border-radius:15px!important;
    font-size:13px!important;
  }
  #todayHeroCard .weather-brief{
    min-height:72px!important;
    margin-top:0!important;
    padding:10px 11px!important;
    border-radius:15px!important;
  }

  /* Footer must finish above the fixed tab bar, including iPhone safe area. */
  .app-legal-footer{
    margin:18px 0 22px!important;
    padding:16px 0 calc(26px + env(safe-area-inset-bottom))!important;
  }
}

@media(min-width:861px) and (max-width:1100px){
  .dashboard-quick-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}

@media(max-width:390px){
  .dashboard-quick-card{min-height:98px!important}
}


/* iPhone dashboard anti-jump r19
   iOS can briefly restore the visible app shell before the body shell class
   and fixed-header rules have repainted. Key the layout to the visible
   #appShell itself so the header/safe-area geometry never disappears for a frame. */
@media(max-width:860px){
  html body.shell-app #appShell:not([hidden]){
    height:100dvh!important;
    min-height:100dvh!important;
    overflow:hidden!important;
  }
  html body.shell-app #appShell:not([hidden])>.main{
    height:100dvh!important;
    min-height:0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior-y:none!important;
    -webkit-overflow-scrolling:touch!important;
    padding-top:calc(env(safe-area-inset-top) + 72px)!important;
    padding-bottom:calc(142px + env(safe-area-inset-bottom))!important;
    scroll-padding-top:calc(env(safe-area-inset-top) + 72px)!important;
  }
  html body.shell-app #appShell:not([hidden])>.main>.topbar{
    position:fixed!important;
    top:0!important;
    left:0!important;
    right:0!important;
    width:100%!important;
    z-index:50!important;
    box-sizing:border-box!important;
    margin:0!important;
    min-height:calc(env(safe-area-inset-top) + 62px)!important;
    padding-top:calc(env(safe-area-inset-top) + 8px)!important;
    padding-bottom:8px!important;
    padding-left:max(12px,env(safe-area-inset-left))!important;
    padding-right:max(12px,env(safe-area-inset-right))!important;
    background:rgba(250,248,243,.985)!important;
    border-bottom:1px solid rgba(25,25,25,.10)!important;
    transform:translateZ(0)!important;
  }
  section.view[data-page="today"].view-enter{
    animation:none!important;
  }
}
@media(max-width:680px){
  html body.shell-app #appShell:not([hidden])>.main>.topbar{
    display:grid!important;
    grid-template-columns:auto minmax(0,1fr) auto auto auto!important;
    align-items:center!important;
    gap:6px!important;
  }
  html body.shell-app #appShell:not([hidden]) .topbar-title{
    position:static!important;
    left:auto!important;
    top:auto!important;
    transform:none!important;
    grid-column:2!important;
    width:100%!important;
    min-width:0!important;
    text-align:left!important;
  }
  html body.shell-app #appShell:not([hidden]) .topbar-title h1{
    margin:0!important;
    font-size:18px!important;
    line-height:1.05!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  html body.shell-app #appShell:not([hidden]) .top-actions{
    display:contents!important;
  }
}

/* Mobile shell stabilization r26
   Use normal sticky flow instead of a fixed header. Fixed-position headers on
   iOS are tied to the visual viewport and can jump after Password AutoFill,
   Face ID, keyboard transitions, or Safari chrome changes. */
@media(max-width:860px){
  html body.shell-app #appShell:not([hidden]){
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    height:100dvh!important;
    min-height:100dvh!important;
    margin:0!important;
    overflow:hidden!important;
  }
  html body.shell-app #appShell:not([hidden])>.main{
    width:100%!important;
    max-width:100%!important;
    height:100dvh!important;
    min-height:0!important;
    margin:0!important;
    padding-top:0!important;
    padding-left:max(12px,env(safe-area-inset-left))!important;
    padding-right:max(12px,env(safe-area-inset-right))!important;
    padding-bottom:calc(142px + env(safe-area-inset-bottom))!important;
    scroll-padding-top:0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior-y:contain!important;
  }
  html body.shell-app #appShell:not([hidden])>.main>.topbar{
    position:sticky!important;
    top:0!important;
    left:auto!important;
    right:auto!important;
    width:100%!important;
    max-width:100%!important;
    min-height:62px!important;
    margin:0 0 12px!important;
    padding:max(8px,env(safe-area-inset-top)) 0 8px!important;
    box-sizing:border-box!important;
    background:rgba(250,248,243,.985)!important;
    border-bottom:1px solid rgba(25,25,25,.10)!important;
    transform:none!important;
    z-index:50!important;
  }
  section.view[data-page="today"].active,
  section.view[data-page="today"] #todayHeroCard,
  section.view[data-page="today"] .dashboard-quick-access{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin-left:0!important;
    margin-right:0!important;
    box-sizing:border-box!important;
    overflow-x:hidden!important;
  }
}
@media(max-width:680px){
  html body.shell-app #appShell:not([hidden])>.main>.topbar{
    display:grid!important;
    grid-template-columns:36px minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:7px!important;
  }
  html body.shell-app #appShell:not([hidden]) #menuToggle,
  html body.shell-app #appShell:not([hidden]) #backBtn{
    grid-column:1!important;
    position:relative!important;
    inset:auto!important;
    width:36px!important;
    min-width:36px!important;
    height:36px!important;
    min-height:36px!important;
    margin:0!important;
  }
  html body.shell-app #appShell:not([hidden]) .topbar-title{
    grid-column:2!important;
    position:static!important;
    inset:auto!important;
    transform:none!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    text-align:center!important;
  }
  html body.shell-app #appShell:not([hidden]) .topbar-title h1{
    margin:0!important;
    width:100%!important;
    font-size:18px!important;
    line-height:36px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  html body.shell-app #appShell:not([hidden]) .top-actions{
    grid-column:3!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:6px!important;
    min-width:0!important;
    margin:0!important;
  }
  html body.shell-app #appShell:not([hidden]) .global-search-shell,
  html body.shell-app #appShell:not([hidden]) #languageBtn{
    display:none!important;
  }
  html body.shell-app #appShell:not([hidden]) .notification-shell,
  html body.shell-app #appShell:not([hidden]) #notificationBellBtn,
  html body.shell-app #appShell:not([hidden]) #appRefreshBtn,
  html body.shell-app #appShell:not([hidden]) #quickAddBtn{
    position:relative!important;
    inset:auto!important;
    transform:none!important;
    flex:0 0 auto!important;
  }
}

/* Night sky takes priority over the quarter-hour palette at every viewport. */
#appShell #todayHeroCard[data-celestial="night"]{
  background:linear-gradient(145deg,#173E58 0%,#164B67 62%,#15627B 100%)!important;
  border-color:rgba(255,255,255,.14)!important;
  color:#F8FAFF!important;
}

/* Owner daytime palette is selected on opening; celestial night always wins. */
#appShell #todayHeroCard[data-owner-palette="true"][data-celestial="day"]{
  background:var(--greeting-day-color,#F6EDBF)!important;
  color:var(--greeting-day-ink,#191919)!important;
}
#appShell #todayHeroCard[data-owner-palette="true"][data-celestial="day"] :is(#todayGreeting,#todayMomentCopy,#todayClockTime,#todayDatePill,#weatherTemp,#weatherCondition,#weatherHighLow,#weatherLocation){
  color:var(--greeting-day-ink,#191919)!important;
}
#appShell #todayHeroCard[data-owner-palette="true"][data-celestial="day"] :is(.today-clock,.hero-weather-module,.weather-brief){
  background:transparent!important;
  color:var(--greeting-day-ink,#191919)!important;
  border-color:currentColor!important;
}
.greeting-color-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:16px 0}
.greeting-color-grid label,.greeting-night-swatch{display:grid;gap:8px;font-size:13px}
.greeting-color-grid input[type="color"]{width:100%;height:46px;padding:4px;border:1px solid #ddd;border-radius:10px;cursor:pointer}
.greeting-color-grid label>span{font-size:12px;color:var(--muted)}
.greeting-night-swatch i{display:block;height:46px;border-radius:10px;background:linear-gradient(145deg,#173E58,#164B67 62%,#15627B)}
.greeting-color-preview{padding:22px;border-radius:16px;font-size:20px;font-weight:700;margin-bottom:14px}
.greeting-color-actions{display:flex;flex-wrap:wrap;gap:8px}
#greetingColorsStatus{font-size:13px;min-height:18px}

/* Interactive draft preview: mood buttons never submit or change saved colors. */
.greeting-preview-toggle{margin:0 0 14px}
.greeting-preview-panel[hidden]{display:none!important}
.greeting-preview-moods{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.greeting-preview-moods button{min-height:40px;padding:8px 12px;border:1px solid #ddd;border-radius:12px;background:#fff;color:#191919;font-size:12px}
.greeting-preview-moods button[aria-pressed="true"]{background:#191919;color:#fff;border-color:#191919}
.greeting-color-preview h4{font-size:clamp(26px,5vw,36px);line-height:1.08;margin:18px 0 8px;color:inherit!important}
.greeting-color-preview p{font-size:14px;font-weight:400;margin:0 0 20px;color:inherit!important}
.greeting-preview-clock{display:inline-block;padding:7px 10px;border:1px solid currentColor;border-radius:10px;font-size:13px}
.greeting-preview-calendar{display:block;padding:12px;text-align:center;border-radius:12px;background:#F8FAFF;color:#10264A;font-size:14px}

/* Workspace cards stay in the owner's palette; clock/weather only affect greeting. */
html body.shell-app #appShell[data-owner-card-palette="true"] :is(.panel,.settings-section,.metric-card,.pulse-card,.dashboard-quick-card,.quick-card,.table-card,.client-card,.service-card,.supply-card,.share-access-card,.timer-card,.empty-card,.mobile-record-card,.review-settings-card,.support-contact-card,.worker-job-card,.trial-card,.inquiry-detail-card,.install-card,.onboarding-help-card,.attention-summary-card):not(#todayHeroCard){
  background:var(--owner-card-bg,#FFFFFF)!important;
  color:var(--owner-card-ink,#191919)!important;
  border-color:#D8DEE5!important;
}
html body.shell-app #appShell[data-owner-card-palette="true"] :is(.panel,.metric-card,.pulse-card,.dashboard-quick-card,.client-card,.service-card,.mobile-record-card,.trial-card,.attention-summary-card):not(#todayHeroCard) :is(h2,h3,h4,p,small,label,.eyebrow,.panel-note,.record-field,.dashboard-quick-arrow){color:var(--owner-card-ink,#191919)!important}
html body.shell-app #appShell[data-owner-card-palette="true"] :is(.metric-card,.pulse-card,.dashboard-quick-card,.attention-summary-card):not(#todayHeroCard)>:is(span,strong,small){color:var(--owner-card-ink,#191919)!important}
.owner-cards-choice{display:grid;gap:10px;padding-bottom:20px;margin-bottom:18px;border-bottom:1px solid #D8DEE5}
.owner-cards-choice label{display:grid;gap:8px;font-weight:700}
.owner-cards-choice input[type="color"]{width:100%;height:48px;padding:4px;border:1px solid #ddd;border-radius:10px}
.owner-cards-preview{padding:18px;border:1px solid #D8DEE5;border-radius:14px;font-weight:700}
.business-logo-summary{display:flex;flex-wrap:wrap;align-items:center;gap:14px;padding:14px 0}
.business-logo-summary img{width:76px;height:76px;object-fit:contain;background:#fff;border:1px solid #D8DEE5;border-radius:14px;padding:6px}
.workspace-business-logo{width:42px;height:42px;object-fit:contain;background:#fff;border-radius:10px;padding:3px}
.business-logo-summary [hidden],.workspace-chip [hidden]{display:none!important}
.wp-no-logo{font-size:11px;text-align:center;padding:8px;color:#68665f}

#appShell #greetingColorsSettings #greetingColorPreviewPanel .greeting-color-preview :is(h4,p){color:inherit!important}


/* 2026-10-07 premium dashboard depth + tablet/desktop r53 */
@media(min-width:681px){
 section.view[data-page="today"]{--dline:rgba(25,25,25,.055);--dshadow:0 16px 38px rgba(36,32,26,.065),0 2px 7px rgba(36,32,26,.03),inset 0 1px 0 rgba(255,255,255,.9);max-width:1480px!important;margin-inline:auto!important}
 #todayHeroCard{position:relative!important;overflow:hidden!important;min-height:0!important;padding:clamp(22px,2.4vw,34px)!important;border:1px solid var(--dline)!important;border-radius:30px!important;box-shadow:0 22px 54px rgba(58,49,24,.09),inset 0 1px 0 rgba(255,255,255,.52)!important}
 #todayHeroCard::after{content:""!important;position:absolute!important;width:340px!important;height:340px!important;right:-120px!important;top:-190px!important;border-radius:50%!important;background:rgba(255,255,255,.22)!important;pointer-events:none!important}
 #todayHeroCard .hero-ecosystem{display:grid!important;grid-template-columns:minmax(0,1.7fr) minmax(250px,.72fr)!important;column-gap:clamp(24px,3vw,46px)!important;row-gap:12px!important;align-items:stretch!important}
 #todayHeroCard .hero-greeting-zone{min-width:0!important}
 #todayHeroCard .hero-card-topline{margin-bottom:8px!important}
 #todayHeroCard .today-clock{border:0!important;background:rgba(255,255,255,.5)!important;box-shadow:inset 0 0 0 1px rgba(25,25,25,.07)!important;border-radius:14px!important}
 #todayHeroCard #todayGreeting{max-width:760px!important;margin:10px 0 7px!important;font-size:clamp(34px,3.35vw,54px)!important;line-height:.94!important;letter-spacing:-.058em!important;text-wrap:balance!important}
 #todayHeroCard #todayMomentCopy{max-width:680px!important;font-size:13px!important;line-height:1.45!important;opacity:.72!important}
 #todayHeroCard #todayHeroAction{width:min(100%,680px)!important;min-height:48px!important;margin-top:18px!important;border:0!important;border-radius:15px!important;box-shadow:0 8px 18px rgba(25,25,25,.12)!important}
 #todayHeroCard .hero-weather-module{position:relative!important;z-index:1!important;align-self:center!important;min-width:0!important;padding:0!important}
 #todayHeroCard .weather-brief{min-height:116px!important;padding:18px!important;border:0!important;border-radius:22px!important;background:rgba(255,255,255,.48)!important;box-shadow:inset 0 0 0 1px rgba(25,25,25,.075),0 10px 28px rgba(52,44,25,.045)!important;backdrop-filter:blur(12px)!important;-webkit-backdrop-filter:blur(12px)!important}
 #todayHeroCard .weather-business-note{margin-top:9px!important;border:0!important;border-radius:15px!important;box-shadow:inset 0 0 0 1px rgba(25,25,25,.035)!important}
 .dashboard-quick-access{margin-top:6px!important;margin-bottom:24px!important}
 .dashboard-quick-grid{gap:14px!important}
 .dashboard-quick-card{min-height:128px!important;padding:17px!important;border:1px solid var(--dline)!important;border-radius:24px!important;background:linear-gradient(145deg,#fff 0%,#fbfaf6 100%)!important;box-shadow:var(--dshadow)!important;transform:translateZ(0)!important}
 .dashboard-quick-card:hover{transform:translateY(-3px)!important;box-shadow:0 22px 42px rgba(36,32,26,.09),0 4px 10px rgba(36,32,26,.04),inset 0 1px 0 #fff!important}
 .dashboard-quick-icon{width:40px!important;height:40px!important;border:0!important;border-radius:13px!important;background:rgba(255,255,255,.84)!important;box-shadow:0 6px 16px rgba(25,25,25,.055),inset 0 0 0 1px rgba(25,25,25,.045)!important}
 .dashboard-quick-card strong{font-size:15px!important}.dashboard-quick-card small{font-size:10.5px!important;opacity:.7!important}
 .dashboard-quick-arrow{right:15px!important;bottom:14px!important;width:28px!important;height:28px!important;display:grid!important;place-items:center!important;border-radius:50%!important;background:rgba(25,25,25,.045)!important;font-size:17px!important}
 .attention-panel{padding:clamp(18px,2vw,26px)!important;border:0!important;border-radius:28px!important;background:rgba(255,255,255,.62)!important;box-shadow:0 18px 44px rgba(36,32,26,.055),inset 0 0 0 1px rgba(25,25,25,.045)!important}
 .attention-list.dashboard-attention-grid{gap:12px!important}
 .attention-list.dashboard-attention-grid .attention-summary-card{min-height:120px!important;padding:15px!important;border:0!important;border-radius:20px!important;background:#fff!important;box-shadow:0 10px 24px rgba(36,32,26,.05),inset 0 0 0 1px rgba(25,25,25,.045)!important}
 .growth-grid .schedule-panel,#businessPulse .pulse-card,section.view[data-page="today"] .presence-panel{border:0!important;border-radius:24px!important;box-shadow:var(--dshadow)!important}
}
@media(min-width:681px) and (max-width:1100px){
 body.shell-app #appShell>.main{padding-left:20px!important;padding-right:20px!important}
 #todayHeroCard{padding:22px!important;border-radius:26px!important}
 #todayHeroCard .hero-ecosystem{grid-template-columns:minmax(0,1.45fr) minmax(220px,.72fr)!important;column-gap:20px!important}
 #todayHeroCard #todayGreeting{font-size:clamp(34px,4.25vw,44px)!important;max-width:540px!important}
 #todayHeroCard #todayHeroAction{width:100%!important}
 #todayHeroCard .weather-brief{min-height:108px!important;padding:15px!important}
 .dashboard-quick-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:12px!important}
 .dashboard-quick-card{min-height:116px!important;padding:14px!important;border-radius:21px!important}
 .attention-panel{border-radius:24px!important}.attention-list.dashboard-attention-grid .attention-summary-card{min-height:108px!important}
}
@media(min-width:1101px){
 body.shell-app #appShell>.main{padding-left:clamp(28px,3vw,52px)!important;padding-right:clamp(28px,3vw,52px)!important}
 .dashboard-quick-grid{grid-template-columns:repeat(5,minmax(0,1fr))!important}
 .dashboard-quick-card{min-height:122px!important}
 #todayHeroCard{margin-bottom:22px!important}
}