/* Reach Overview refinement — Pass 2
   Scoped to #homeView so shared foundation and feature routes remain unchanged. */

#homeView{
  --overview-accent-required:var(--vf-primary);
  --overview-accent-important:#9A7422;
  --overview-accent-suggested:var(--vf-border-strong);
}

#homeView .topbar{
  margin-bottom:var(--vf-space-6);
}

#homeView .role-pill{
  flex:0 0 auto;
  min-height:36px;
  display:inline-flex;
  align-items:center;
  padding:7px 12px;
  border:1px solid var(--vf-border-selected);
  background:var(--vf-surface-selected);
  color:var(--vf-primary);
  font-size:var(--vf-type-meta);
  line-height:1;
}

/* Attention is the first actionable region and uses a calm, flat status surface. */
#homeView .emergent-section{
  margin:0 0 var(--vf-space-8);
  padding:var(--vf-space-6);
  border:1px solid var(--vf-border-selected);
  border-radius:var(--vf-radius-modal);
  background:var(--vf-surface-subtle);
  box-shadow:var(--vf-shadow-content);
}

#homeView .emergent-section.is-clear{
  border-color:var(--vf-border);
  background:var(--vf-success-soft);
}

#homeView .emergent-section .section-head{
  margin:0 0 var(--vf-space-4);
  align-items:flex-start;
}

#homeView .emergent-section .section-head h2{
  margin-top:var(--vf-space-1);
  font-family:var(--vf-font-interface);
  font-size:var(--vf-type-section-title);
  font-weight:720;
  letter-spacing:-.018em;
}

#homeView .emergent-section .section-head p{
  max-width:760px;
  color:var(--vf-text-secondary);
}

#homeView .emergent-grid,
#homeView .emergent-grid[data-card-count="1"],
#homeView .emergent-grid[data-card-count="2"]{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--vf-space-3);
  padding-top:86px;
}

#homeView .emergent-preview-stack{
  display:block;
}

#homeView .emergent-card{
  min-width:0;
}

#homeView .emergent-surface{
  position:relative;
  min-height:126px;
  display:flex;
  align-items:flex-end;
  gap:var(--vf-space-4);
  padding:var(--vf-space-4);
  border:1px solid var(--vf-border);
  border-left:3px solid var(--overview-accent-important);
  border-radius:var(--vf-radius-card);
  background:var(--vf-surface-actionable);
  box-shadow:var(--vf-shadow-actionable);
  color:var(--vf-text-primary);
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
  transform:none;
  transition:border-color 160ms ease,box-shadow 160ms ease,background-color 160ms ease;
}

#homeView [data-attention-priority="required"] .emergent-surface{
  border-left-color:var(--overview-accent-required);
}

#homeView [data-attention-priority="suggested"] .emergent-surface{
  border-left-color:var(--overview-accent-suggested);
}

#homeView button.emergent-surface:hover{
  border-color:var(--vf-border-strong);
  box-shadow:var(--vf-shadow-hover);
  transform:none;
}

#homeView button.emergent-surface:focus-visible,
#homeView .emergent-view-action:focus-visible,
#homeView .emergent-requirement-item:focus-visible{
  outline:3px solid var(--vf-focus-ring);
  outline-offset:2px;
}

#homeView .emergent-surface>span:first-child{
  display:grid;
  gap:var(--vf-space-1);
  min-width:0;
}

#homeView .emergent-card-meta{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px var(--vf-space-2);
  margin-bottom:2px;
}

#homeView .emergent-priority-label{
  display:inline-flex;
  align-items:center;
  min-height:22px;
  padding:3px 7px;
  border:1px solid var(--vf-border-selected);
  border-radius:999px;
  background:var(--vf-surface-selected);
  color:var(--vf-primary);
  font-size:10px;
  font-weight:800;
  line-height:1;
  letter-spacing:.045em;
  text-transform:uppercase;
}

#homeView [data-attention-priority="important"] .emergent-priority-label{
  border-color:#D8C58F;
  background:var(--vf-warning-soft);
  color:var(--vf-warning);
}

#homeView [data-attention-priority="suggested"] .emergent-priority-label{
  border-color:var(--vf-border);
  background:var(--vf-surface-subtle);
  color:var(--vf-text-secondary);
}

#homeView .emergent-overline{
  color:var(--vf-text-tertiary);
  font-size:10px;
  font-weight:780;
  line-height:1.25;
  letter-spacing:.075em;
}

#homeView .emergent-surface strong{
  color:var(--vf-text-primary);
  font-family:var(--vf-font-interface);
  font-size:var(--vf-type-card-title);
  font-weight:720;
  line-height:1.3;
  letter-spacing:-.012em;
}

#homeView .emergent-surface small{
  color:var(--vf-text-secondary);
  font-size:var(--vf-type-meta);
  line-height:1.4;
}

#homeView .emergent-action{
  flex:0 0 auto;
  width:auto;
  height:34px;
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:0 10px;
  border:1px solid var(--vf-border);
  border-radius:999px;
  background:var(--vf-secondary-bg);
  color:var(--vf-primary);
  font-size:11px;
  font-weight:750;
  line-height:1;
  letter-spacing:0;
  transform:none;
}

#homeView .emergent-action span:last-child{
  display:inline-block;
  transition:transform 160ms ease;
}

#homeView .emergent-card.is-expanded .emergent-action{
  transform:none;
}

#homeView .emergent-card.is-expanded .emergent-action span:last-child{
  transform:rotate(90deg);
}

#homeView .emergent-drawer{
  max-height:0;
  margin:-8px 0 0;
  border:1px solid transparent;
  border-radius:0 0 var(--vf-radius-card) var(--vf-radius-card);
  background:var(--vf-surface-content);
  box-shadow:none;
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
  transform:translateY(-4px);
}

#homeView .emergent-card.is-expanded .emergent-surface{
  border-bottom-color:var(--vf-border);
  border-radius:var(--vf-radius-card) var(--vf-radius-card) 8px 8px;
  box-shadow:none;
}

#homeView .emergent-card.is-expanded .emergent-drawer{
  max-height:310px;
  padding:var(--vf-space-4) var(--vf-space-3) var(--vf-space-3);
  border-color:var(--vf-border);
  opacity:1;
  transform:translateY(0);
}

#homeView .emergent-item{
  border-bottom-color:var(--vf-border);
}

#homeView .emergent-item strong,
#homeView .emergent-item small{
  white-space:normal;
}

#homeView .emergent-view-action{
  min-height:38px;
  margin-top:var(--vf-space-2);
  padding:8px var(--vf-space-2) 2px;
  color:var(--vf-primary);
  font-size:var(--vf-type-meta);
}

#homeView .emergent-empty-state{
  grid-column:1/-1;
  min-height:82px;
  display:flex;
  align-items:center;
  gap:var(--vf-space-3);
  padding:var(--vf-space-4);
  border:1px solid var(--vf-border);
  border-radius:var(--vf-radius-card);
  background:var(--vf-surface-content);
  color:var(--vf-text-primary);
}

#homeView .emergent-empty-icon{
  flex:0 0 auto;
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:var(--vf-success-soft);
  color:var(--vf-success);
  font-size:17px;
  font-weight:800;
}

#homeView .emergent-empty-state strong{
  display:block;
  margin-bottom:2px;
  font-size:var(--vf-type-card-title);
  line-height:1.3;
}

#homeView .emergent-empty-state p{
  margin:0;
  color:var(--vf-text-secondary);
  font-size:var(--vf-type-meta);
  line-height:1.45;
}

/* Growth position is deliberately compact so metrics support, rather than lead, the page. */
#homeView .overview-position{
  margin-bottom:var(--vf-space-8);
}

#homeView .overview-section-intro{
  display:flex;
  align-items:baseline;
  gap:var(--vf-space-3);
  margin-bottom:var(--vf-space-3);
}

#homeView .overview-section-intro .eyebrow{
  flex:0 0 auto;
}

#homeView .overview-section-intro h2{
  margin:0;
  color:var(--vf-text-primary);
  font-family:var(--vf-font-interface);
  font-size:18px;
  font-weight:720;
  line-height:1.3;
  letter-spacing:-.012em;
}

#homeView .stats{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:var(--vf-space-3);
  margin:0;
}

#homeView .stats .stat{
  position:relative;
  min-height:78px;
  display:flex;
  align-items:center;
  gap:var(--vf-space-3);
  padding:14px var(--vf-space-4);
  border:1px solid var(--vf-border);
  border-radius:var(--vf-radius-card);
  background:var(--vf-surface-metric);
  box-shadow:var(--vf-shadow-content);
}

#homeView .stats .stat::after{
  display:none;
}

#homeView .stats .stat strong{
  flex:0 0 auto;
  color:var(--vf-text-primary);
  font-family:var(--vf-font-interface);
  font-size:26px;
  font-weight:720;
  line-height:1;
  letter-spacing:-.035em;
}

#homeView .stats .stat span{
  color:var(--vf-text-secondary);
  font-size:var(--vf-type-meta);
  font-weight:650;
  line-height:1.3;
}

/* Goals and supporting information retain their existing components with quieter framing. */
#homeView .home-grid{
  gap:var(--vf-space-4);
}

#homeView .current-goals-section{
  min-height:330px;
  padding:168px var(--vf-space-5) var(--vf-space-5);
  border:1px solid var(--vf-border);
  border-radius:var(--vf-radius-modal);
  background:var(--vf-surface-subtle);
  box-shadow:var(--vf-shadow-content);
}

#homeView .goal-deck-surface{
  min-height:122px;
  padding:var(--vf-space-5);
  border:1px solid var(--vf-border);
  border-radius:var(--vf-radius-card);
  background:var(--vf-surface-content);
  box-shadow:var(--vf-shadow-actionable);
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
}

#homeView .goal-deck-surface h2{
  color:var(--vf-text-primary);
  font-family:var(--vf-font-interface);
  font-size:var(--vf-type-section-title);
  font-weight:720;
  line-height:1.25;
  letter-spacing:-.018em;
}

#homeView .goal-deck-surface p{
  color:var(--vf-text-secondary);
}

#homeView .goal-deck-pause{
  border-color:var(--vf-border);
  background:var(--vf-surface-content);
  color:var(--vf-text-secondary);
}

#homeView #homeGrid>.side-stack{
  gap:var(--vf-space-3);
}

#homeView .side-stack .overview-support-card,
html[data-theme="dark"] #homeView .side-stack .overview-support-card{
  min-height:116px;
  padding:var(--vf-space-4);
  border:1px solid var(--vf-border);
  border-top:1px solid var(--vf-border);
  border-radius:var(--vf-radius-card);
  background:var(--vf-surface-content);
  box-shadow:var(--vf-shadow-content);
}

#homeView .side-stack .overview-support-card h3{
  color:var(--vf-text-primary);
  font-size:15px;
}

#homeView .side-stack .next-action,
#homeView .side-stack .subtle,
#homeView .side-stack .activity-item{
  color:var(--vf-text-secondary);
  font-size:var(--vf-type-meta);
  line-height:1.5;
}

#homeView .side-stack .activity-item{
  border-bottom-color:var(--vf-border);
}

#homeView .side-stack .activity-item strong{
  color:var(--vf-text-primary);
}

html[data-theme="dark"] #homeView{
  --overview-accent-important:#CDAE5F;
  --overview-accent-suggested:var(--vf-border-strong);
}

html[data-theme="dark"] #homeView .emergent-section,
html[data-theme="dark"] #homeView .current-goals-section{
  border-color:var(--vf-border);
  background:var(--vf-surface-subtle);
  box-shadow:var(--vf-shadow-content);
}

html[data-theme="dark"] #homeView .emergent-section.is-clear{
  background:var(--vf-success-soft);
}

html[data-theme="dark"] #homeView .emergent-surface,
html[data-theme="dark"] #homeView .emergent-drawer,
html[data-theme="dark"] #homeView .emergent-empty-state,
html[data-theme="dark"] #homeView .goal-deck-surface{
  border-color:var(--vf-border);
  background:var(--vf-surface-content);
  color:var(--vf-text-primary);
  box-shadow:var(--vf-shadow-content);
}

html[data-theme="dark"] #homeView [data-attention-priority="important"] .emergent-priority-label{
  border-color:#6D5D36;
}

@media(max-width:1100px){
  #homeView .emergent-grid,
  #homeView .emergent-grid[data-card-count="1"],
  #homeView .emergent-grid[data-card-count="2"]{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media(max-width:900px){
  #homeView .topbar{
    margin-bottom:var(--vf-space-5);
  }

  #homeView #homeGrid>.side-stack{
    grid-template-columns:1fr;
  }
}

@media(max-width:700px){
  #homeView .topbar{
    gap:var(--vf-space-3);
  }

  #homeView .topbar p{
    font-size:14px;
    line-height:1.5;
  }

  #homeView .role-pill{
    margin-top:var(--vf-space-3);
  }

  #homeView .emergent-section{
    margin-inline:0;
    margin-bottom:var(--vf-space-6);
    padding:var(--vf-space-5);
    border-radius:var(--vf-radius-card);
  }

  #homeView .emergent-section .section-head{
    margin-bottom:var(--vf-space-3);
  }

  #homeView .emergent-grid,
  #homeView .emergent-grid[data-card-count="1"],
  #homeView .emergent-grid[data-card-count="2"]{
    grid-template-columns:1fr;
    gap:104px;
    padding-top:78px;
  }

  #homeView .emergent-surface{
    min-height:108px;
    padding:var(--vf-space-4);
    border-radius:var(--vf-radius-card);
  }

  #homeView .emergent-action{
    height:32px;
    padding-inline:9px;
  }

  #homeView .overview-position{
    margin-bottom:var(--vf-space-6);
  }

  #homeView .overview-section-intro{
    display:block;
  }

  #homeView .overview-section-intro h2{
    margin-top:var(--vf-space-1);
  }

  #homeView .stats{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:var(--vf-space-2);
  }

  #homeView .stats .stat{
    min-height:72px;
    display:grid;
    align-content:center;
    gap:3px;
    padding:var(--vf-space-3);
  }

  #homeView .stats .stat strong{
    font-size:23px;
  }

  #homeView .stats .stat span{
    font-size:12px;
  }

  #homeView .current-goals-section{
    min-height:302px;
    padding:150px var(--vf-space-4) var(--vf-space-4);
    border-radius:var(--vf-radius-card);
  }

  #homeView .goal-deck-surface{
    min-height:130px;
    padding:var(--vf-space-4);
    border-radius:var(--vf-radius-card);
  }

  #homeView .goal-deck-surface h2{
    font-size:22px;
  }
}

@media(max-width:430px){
  #homeView .emergent-surface{
    align-items:flex-end;
  }

  #homeView .emergent-card-meta{
    display:grid;
    justify-items:start;
    gap:5px;
  }

  #homeView .emergent-overline{
    letter-spacing:.06em;
  }

  #homeView .emergent-action span:first-child{
    position:absolute;
    width:1px;
    height:1px;
    padding:0;
    margin:-1px;
    overflow:hidden;
    clip:rect(0,0,0,0);
    white-space:nowrap;
    border:0;
  }
}

@media(prefers-reduced-motion:reduce){
  #homeView .emergent-surface,
  #homeView .emergent-action span:last-child{
    transition:none!important;
  }
}