/* EverLeaf homepage app shell — fixed single-screen composition. */

body.route-home{
  height:100dvh;
  min-height:100dvh;
  overflow:hidden!important;
  display:flex;
  flex-direction:column;
}

.route-home .skipLink{z-index:9999}
.route-home .siteBanner{flex:0 0 auto}

.route-home .siteContent{
  flex:1 1 auto;
  min-height:0;
  overflow:hidden;
  display:grid;
  grid-template-rows:minmax(0,1fr) auto;
}

.route-home .terminalHero{
  min-height:0!important;
  height:100%;
  overflow:hidden;
}

.route-home .terminalHeroGrid{
  min-height:0!important;
  height:100%;
  padding-top:clamp(14px,3dvh,34px)!important;
  padding-bottom:clamp(44px,8dvh,82px)!important;
  align-items:center;
}

.route-home .terminalHeroIdentity h1{
  font-size:clamp(58px,min(10.2vw,15dvh),184px)!important;
}

.route-home .terminalHeroIdentity>.terminalLabel{margin-bottom:clamp(8px,2dvh,20px)}
.route-home .terminalHeroLead{margin-top:clamp(12px,3dvh,30px)!important;font-size:clamp(12px,1.15vw,15px)!important}
.route-home .terminalHeroActions{margin-top:clamp(12px,2.5dvh,24px)}

.route-home .everleafArtifact{
  min-height:0!important;
  height:100%;
  max-height:calc(100dvh - 92px);
}

.route-home .artifactCharacterBack{max-height:74dvh;width:min(31vw,450px)}
.route-home .artifactCharacterFront{max-height:78dvh;width:min(35vw,520px)}

.route-home .heroTelemetry{
  margin-bottom:clamp(8px,5dvh,45px);
}

.route-home .telemetryReadout>div{
  min-height:clamp(58px,9dvh,88px);
  padding-top:clamp(8px,1.5dvh,12px);
  padding-bottom:clamp(8px,1.5dvh,12px);
}

.route-home .telemetryReadout small{margin-bottom:clamp(5px,1.2dvh,12px)}

.route-home .heroEdgeRail{
  bottom:clamp(8px,2.2dvh,20px);
}

.route-home .signalStrip{
  flex:0 0 auto;
  min-height:0!important;
}

.route-home .signalStripGrid>a{
  min-height:clamp(62px,10dvh,92px)!important;
  padding-top:clamp(8px,1.4dvh,14px)!important;
  padding-bottom:clamp(8px,1.4dvh,14px)!important;
}

/* Short desktop/laptop screens: preserve the full app frame by compressing secondary copy. */
@media (min-width:901px) and (max-height:760px){
  .route-home .terminalHeroGrid{padding-top:12px!important;padding-bottom:48px!important}
  .route-home .terminalHeroIdentity h1{font-size:clamp(56px,11.5dvh,112px)!important}
  .route-home .terminalHeroLead{margin-top:10px!important;line-height:1.15!important}
  .route-home .terminalHeroActions{margin-top:10px}
  .route-home .terminalHeroIdentity>.terminalLabel{margin-bottom:8px}
  .route-home .artifactCharacterBack{max-height:64dvh}
  .route-home .artifactCharacterFront{max-height:69dvh}
  .route-home .heroTelemetry{margin-bottom:8px}
  .route-home .telemetryHeader{min-height:32px}
  .route-home .telemetryFooter{min-height:28px}
  .route-home .heroEdgeRail p{display:none}
}

/* Tablet/mobile becomes a compact game-launcher style dashboard rather than a document. */
@media (max-width:900px){
  body.route-home{height:100dvh;min-height:100dvh}
  .route-home .siteContent{grid-template-rows:minmax(0,1fr) auto}
  .route-home .terminalHeroGrid{
    grid-template-columns:minmax(0,1fr) minmax(150px,.8fr)!important;
    grid-template-rows:auto minmax(0,1fr) auto!important;
    gap:8px!important;
    padding:14px 0 10px!important;
  }
  .route-home .terminalHeroIdentity{
    grid-column:1/2!important;
    grid-row:1/3!important;
    align-self:center!important;
    padding-right:0!important;
  }
  .route-home .terminalHeroIdentity h1{font-size:clamp(52px,13vw,96px)!important;line-height:.68!important}
  .route-home .terminalHeroLead{font-size:12px!important;max-width:38ch!important;margin-top:12px!important}
  .route-home .terminalHeroActions{margin-top:12px}
  .route-home .everleafArtifact{
    grid-column:2!important;
    grid-row:1/3!important;
    min-height:0!important;
    height:100%!important;
  }
  .route-home .artifactCharacterBack{width:min(42vw,300px);max-height:52dvh}
  .route-home .artifactCharacterFront{width:min(46vw,330px);max-height:58dvh}
  .route-home .artifactHaloOne{width:min(44vw,320px)}
  .route-home .artifactHaloTwo{width:min(33vw,240px)}
  .route-home .artifactCrosshair{width:min(48vw,350px);height:min(48vw,350px)}
  .route-home .artifactTelemetry{display:none}
  .route-home .heroTelemetry{
    grid-column:1/3!important;
    grid-row:3!important;
    width:100%!important;
    margin:0!important;
    display:grid!important;
    grid-template-columns:auto 1fr auto;
    align-items:center;
    border-top:1px solid var(--terminal-line)!important;
  }
  .route-home .telemetryHeader{min-height:34px;border-bottom:0;padding-right:12px}
  .route-home .telemetryReadout{grid-template-columns:repeat(4,minmax(0,1fr));border-left:1px solid var(--terminal-line-soft)}
  .route-home .telemetryReadout>div{min-height:46px!important;padding:7px 9px!important;border-bottom:0!important;border-right:1px solid var(--terminal-line-soft)!important}
  .route-home .telemetryReadout small{margin-bottom:4px!important}
  .route-home .telemetryReadout strong{font-size:clamp(15px,3vw,23px)!important}
  .route-home .telemetryFooter{min-height:34px;padding-left:10px;border-top:0}
  .route-home .telemetryFooter>span{display:none}
  .route-home .heroEdgeRail{display:none!important}
  .route-home .signalStripGrid{grid-template-columns:repeat(5,minmax(0,1fr))!important}
  .route-home .signalStripGrid>a{min-height:64px!important;padding:8px!important}
  .route-home .signalStripGrid>a>span{font-size:8px}
  .route-home .signalStripGrid strong{font-size:clamp(10px,2.4vw,14px)!important}
  .route-home .signalStripGrid small{font-size:8px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}

@media (max-width:620px){
  .route-home .terminalHeroGrid{grid-template-columns:1fr!important;grid-template-rows:minmax(0,1fr) auto!important;padding:10px 0 8px!important}
  .route-home .terminalHeroIdentity{grid-column:1!important;grid-row:1!important;z-index:4;align-self:center!important;max-width:72%;}
  .route-home .terminalHeroIdentity>.terminalLabel{gap:7px;margin-bottom:7px}
  .route-home .terminalHeroIdentity>.terminalLabel span:nth-child(2){display:none}
  .route-home .terminalHeroIdentity h1{font-size:clamp(48px,18vw,86px)!important}
  .route-home .terminalHeroLead{max-width:34ch!important;font-size:11px!important;margin-top:9px!important}
  .route-home .terminalHeroActions{gap:5px;margin-top:9px}
  .route-home .terminalHeroActions .btn{min-height:36px!important;padding-inline:12px!important;font-size:9px!important}
  .route-home .everleafArtifact{position:absolute!important;inset:0 0 54px 32%;grid-column:auto!important;grid-row:auto!important;opacity:.72}
  .route-home .artifactCharacterBack{width:min(65vw,300px);max-height:55dvh}
  .route-home .artifactCharacterFront{width:min(72vw,340px);max-height:60dvh}
  .route-home .heroTelemetry{grid-column:1!important;grid-row:2!important;grid-template-columns:1fr!important;background:rgba(18,19,15,.9)}
  .route-home .telemetryHeader,.route-home .telemetryFooter{display:none!important}
  .route-home .telemetryReadout{grid-template-columns:repeat(4,minmax(0,1fr));border-left:0}
  .route-home .telemetryReadout>div{min-height:44px!important;padding:6px!important;text-align:center}
  .route-home .telemetryReadout small{font-size:7px!important}
  .route-home .telemetryReadout strong{font-size:14px!important}
  .route-home .signalStripGrid>a{min-height:58px!important;padding:6px 3px!important;text-align:center}
  .route-home .signalStripGrid small{display:none!important}
}

/* Extremely short landscape screens prioritize app controls over descriptive copy. */
@media (max-height:560px){
  .route-home .terminalHeroLead{display:none!important}
  .route-home .terminalHeroIdentity>.terminalLabel{margin-bottom:6px}
  .route-home .terminalHeroActions{margin-top:8px}
  .route-home .artifactTelemetry{display:none!important}
  .route-home .signalStripGrid>a{min-height:50px!important}
}
